Merge branch 'dev' of ssh://git.online.zzfzyc.com:10022/mp/EShop into 样式对比

src/pages/addressAdd/index.tsx

@@ -55,9 +55,9 @@ export default ()=>{
   const rules = {
     name: [{
       message: "请输入正确收货人姓名",
-      validator: (value:any, rule:any)=>{ // 自定义验证，返回true表示匹配到了(错误)
-        return value.length>5;
-      }
+      // validator: (value:any, rule:any)=>{ // 自定义验证，返回true表示匹配到了(错误)
+      //   return value.length>5;
+      // }
     }],
     phone: [{
       message: "请输入正确的电话号码", regex: /^1[3|5|6|9|2|8|7]\d{9}$/

src/pages/applyAfterSales/components/kindList/index.module.scss

@@ -0,0 +1,64 @@
+.apply_after_sales_list{
+    padding: 0 20px;
+    .apply_after_sales_item{
+        margin-bottom: 50px;
+        .apply_after_sales_title{
+            display: flex;
+            align-items: center;
+            .tag{
+                font-size: $font_size_min;
+                background-color: #CDE5FF;
+                padding: 5px 10px;
+                border-radius: 6px;
+                color: $color_main;
+            }
+            .title{
+                font-weight: 700;
+                font-size: $font_size;
+                margin-left: 20px;
+                flex:1;
+            }
+        }
+        .color_list {
+            .color_item{
+                display: flex;
+                align-items: center;
+                margin: 30px 0;
+            }
+            .image{
+                width: 70px;
+                height: 70px;
+                image{
+                    width: 100%;
+                    height: 100%;
+                    border-radius: 50%;
+                }
+            }
+            .name_and_number{
+                padding-left: 30px;
+                flex:1;
+                text{
+                    &:nth-child(1) {
+                        font-weight: 700;
+                        font-size: $font_size;
+                    }
+                    &:nth-child(2) {
+                        color: $color_font_two;
+                        font-size: $font_size;
+                        margin-left: 20px;
+                    }
+                }
+            }
+            .btn_count{
+                width: 216px;
+                height: 64px;
+                background-color: #ECF5FF;
+                border-radius: 40px 0px 16px 0px;
+                padding: 0 20px;
+                display: flex;
+                align-items: center;
+            }
+        }
+    }
+    
+}

src/pages/applyAfterSales/components/kindList/index.tsx

@@ -0,0 +1,71 @@
+import { formatHashTag, formatImgUrl } from "@/common/fotmat";
+import Counter from "@/components/counter";
+import MCheckbox from "@/components/checkbox";
+import { Image, Text, View } from "@tarojs/components";
+import { FC, memo, useCallback } from "react";
+import styles  from './index.module.scss'
+
+type OrderParam = {
+    list?: any[], 
+    sale_mode?: number,
+    sale_mode_name?: string,
+    unit?: string,
+    total_colors?: number,
+    total_fabrics?: number,
+    total_number?: number,
+    status?: number, //订单状态
+}
+
+type Param = {
+    order: OrderParam,
+    onNumChange?: (val:any) => void
+    onSelectChange?: (val: {color_id:number, length: number, status: true|false}) => void
+}
+
+const kindeList:FC<Param> =  memo(({order, onNumChange, onSelectChange}) => {
+    //对应数量
+    const formatCount = useCallback((item) => {
+        return (order?.sale_mode == 0? item.roll : Number(item.length / 100)) + order?.unit
+    }, [order])
+
+    //计步器失返回值
+    const getCounterChange = useCallback((colorItem) => {
+        return (number) => {
+            onNumChange?.({number, color_id: colorItem.id})
+        }
+    }, [])
+
+    //checkbox选中回调
+    const selectCallBack = (colorItem) => {
+        console.log('colorItem::',colorItem)
+        onSelectChange?.({color_id:colorItem.id, length:colorItem.length, status: true})
+    }
+
+    //checkbox关闭回调
+    const colseCallBack = (colorItem) => {
+        onSelectChange?.({color_id:colorItem.id, length:colorItem.length, status: false})
+    }
+
+    return (
+        <View className={styles.apply_after_sales_list}>
+            {order?.list?.map(item => <View className={styles.apply_after_sales_item}>
+                <View className={styles.apply_after_sales_title}>
+                    <View className={styles.tag}>{order.sale_mode_name}</View>
+                    <View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
+                </View>
+                <View className={styles.color_list}>
+                    {item.product_colors.map(colorItem => <View className={styles.color_item}>
+                        <View className={styles.image}><Image src={formatImgUrl('')}/></View>
+                        <View className={styles.name_and_number}><Text>{colorItem.code + ' ' + colorItem.name}</Text><Text>x {formatCount(colorItem)}</Text></View>
+                        {(order.sale_mode == 0)&&<View className={styles.btn_count}>
+                            <Counter maxNum={colorItem.roll} onChange={getCounterChange(colorItem)}/>
+                        </View>||
+                        <MCheckbox  status={item.select} onSelect={() => selectCallBack(colorItem)} onClose={() => colseCallBack(colorItem)}/>}
+                    </View>)}
+                </View>
+            </View>)}
+        </View>
+    )
+})
+
+export default kindeList

src/pages/applyAfterSales/components/otherReason/index.module.scss

@@ -0,0 +1,36 @@
+.other_desc{
+    padding: 0 20px;
+    box-sizing: border-box;
+    .title{
+        font-size: $font_size;
+        font-weight: 700;
+    }
+    .textarea{
+        position: relative;
+        height: 165.4px;
+        .descDataNum{
+            position: absolute;
+            right: 10px;
+            bottom: 10px;
+            font-size: 22px;
+            color: #ABABAB;
+        }
+    }
+    .textarea_con, .textarea_con_pretend{
+        background-color: #f3f3f3;
+        border: 2px solid #e6e6e6;
+        border-radius: 10px;
+        width: 100%;
+        font-size: 25px;
+        height: 165.4px;
+        padding: 20px 20px 30px 20px;
+        box-sizing: border-box;
+        margin-top: 20px;
+    }
+    .textarea_con_pretend{
+        color: $color_font_two;
+    }
+    .textarea_con_pretend_ed{
+        color: #000;
+    }
+}

src/pages/applyAfterSales/components/otherReason/index.tsx

@@ -0,0 +1,41 @@
+import {Textarea, View } from "@tarojs/components";
+import { memo, useMemo, useState } from "react";
+import styles  from './index.module.scss'
+import classnames from "classnames";
+
+//其他说明
+type Param = {
+    onChange: (val: string) => void
+}
+export default memo(({onChange}:Param) => {
+    const [descData, setDescData] = useState({
+        number: 0,
+        value: '',
+        count: 200,
+        show: false
+    })
+    const getDesc = (e) => {
+        let value = e.detail.value
+        let res = value
+        if(value.length > descData.count) {
+            res = value.slice(0, descData.count)
+        }
+        setDescData({...descData, number:res.length, value: res})
+        onChange?.(res)
+    }
+
+    const toggleShowRealTextarea = (show) => {
+        setDescData({...descData, show:show})
+    }
+    return (
+        <View className={styles.other_desc}>
+            <View className={styles.title}>其他说明</View>
+            <View className={styles.textarea}>
+                {descData.show&&<Textarea autoFocus value={descData.value} onBlur={() => toggleShowRealTextarea(false)} className={styles.textarea_con} cursorSpacing={100} maxlength={descData.count} onInput={(e) => getDesc(e)}></Textarea>||
+                    <View className={classnames(styles.textarea_con_pretend, descData.value&&styles.textarea_con_pretend_ed)} onClick={() => toggleShowRealTextarea(true)}>{descData.value||'一般情况下选填，当退货说明=“其它问题”时，必填'}</View>
+                }
+                <View className={styles.descDataNum}>{descData.number +'/'+ descData.count}</View>
+            </View>
+        </View>
+    )
+})

src/pages/applyAfterSales/components/reasonPopup/index.module.scss

@@ -0,0 +1,27 @@
+.reason_return_con{
+    height: 50vh;
+    .reason_title{
+        padding: 10px 20px 0 20px;
+        height: 60px;
+        border-bottom: 1PX solid #F3F3F3;
+        box-sizing: border-box;
+        Text{
+            font-size: 26px;
+            border-bottom: 3px solid #000;
+            padding: 10px;
+            font-weight: 400;
+        }
+        
+    }
+    .reason_scroll{
+        height: calc(100% - 70px);
+        .reason_list{
+            font-size: 26px;
+            padding: 30px 20px 0 20px;
+            color: #707070;
+            .reason_item{
+                margin-bottom: 36px;
+            }
+        }
+    }
+}

src/pages/applyAfterSales/components/reasonPopup/index.tsx

@@ -0,0 +1,27 @@
+import Popup from "@/components/popup";
+import { ScrollView, Text, View } from "@tarojs/components";
+import { memo, useMemo } from "react";
+import styles  from './index.module.scss'
+
+//原因选择
+type ReasonInfoParam = {
+    show?: boolean,
+    onClose?: () => void,
+    title?: string,
+    list?: {id:number, name:string}[]
+}
+export default memo(({show = false, onClose, title = '', list= []}: ReasonInfoParam) => {
+
+    return (
+        <Popup showIconButton={false} show={show} title={title} onClose={onClose} >
+            <View className={styles.reason_return_con}>
+                <View className={styles.reason_title}><Text>{title}</Text></View>
+                <ScrollView scrollY className={styles.reason_scroll}>
+                    <View className={styles.reason_list}>
+                        {list.map(item => <View key={item.id} className={styles.reason_item}>{item.name}</View> )}
+                    </View>
+                </ScrollView>
+            </View>
+        </Popup>
+    )
+})

src/pages/applyAfterSales/index.config.ts

@@ -0,0 +1,4 @@
+export default {
+  navigationBarTitleText: '申请售后',
+  enableShareAppMessage: true,
+}

src/pages/applyAfterSales/index.module.scss

@@ -0,0 +1,107 @@
+
+.apply_after_sales_main{
+    .apply_after_sales_head{
+        font-size: 30px;
+        text-align: center;
+        padding: 20px 0;
+        font-weight: 700;
+    }
+    .kind_number{
+        width: 100%;
+        padding:  20px;
+        box-sizing: border-box;
+        border-bottom: 1PX solid #f3f3f3;
+        text{
+            background-color: #F6F6F6;
+            border-radius: 10px;
+            font-size: $font_size_medium;
+            padding: 5px 0;
+            text-align: center;
+            width: 100%;
+            display: block;
+            color: $color_font_three;
+        }
+    }
+    .apply_after_sales_con{
+        .scroll{
+            height: calc(100% - 170px);
+        }
+        .scroll_con{
+            padding: 20px 0 150px 0;
+        }
+        .returnSaleInput{
+            margin: 0 20px;
+            padding-top: 30px;
+            border-top: 1px solid #F6F6F6;
+            .returnSaleInput_item{
+                display: flex;
+                align-items: center;
+                padding-bottom: 30px;
+                flex-wrap: wrap;
+                .title{
+                    font-size: $font_size;
+                    font-weight: 700;
+                    width: 119px;
+                }
+                .select{
+                    flex:1;
+                    height: 60px;
+                    border: 2px solid #e6e6e6;
+                    border-radius: 10px;
+                    margin-left: 20px;
+                    display: flex;
+                    align-items: center;
+                    justify-content: space-between;
+                    padding: 0 20px;
+                    font-size: 26px;
+                    color: $color_font_two;
+                    .miconfont{
+                        font-size: 30px;
+                    }
+                }
+                .upload_image{
+                    flex:1;
+                }
+            }
+        }
+        
+    }
+
+
+    .btns_con{
+        width: 100%;
+        position: fixed;
+        bottom:0;
+        padding: 0 20px;
+        box-sizing: border-box;
+        padding-bottom: constant(safe-area-inset-bottom); 
+        padding-bottom: env(safe-area-inset-bottom);
+        .btns_two{
+            display: flex;
+            height: 82px;
+            // border: 1PX solid #007aff;
+            font-size: $font_size_big;
+            border-radius: 40px;
+            margin-bottom: 20px;
+            .rest_btn{
+                flex:1;
+                border: 1PX solid #007aff;
+                border-radius: 40px 0 0 40px;
+                text-align: center;
+                line-height: 82px;
+                color: $color_main;
+                background-color: #fff;
+                
+            }
+            .verify_btn{
+                flex:1;
+                border-radius: 0 40px 40px 0;
+                background: #007aff;
+                text-align: center;
+                line-height: 82px;
+                color: #fff;
+            }
+        }
+    }
+}
+

src/pages/applyAfterSales/index.tsx

@@ -0,0 +1,211 @@
+import { Image, ScrollView, Text, View } from "@tarojs/components";
+import { FC, memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import classnames from "classnames";
+import styles  from './index.module.scss'
+import ReasonPopup from "./components/reasonPopup";
+import OtherReason from "./components/otherReason";
+import { useDidShow, useRouter } from "@tarojs/taro";
+import { GetSaleOrderDetailApi } from "@/api/order";
+import KindList from "./components/kindList"
+import { ReturnApplyOrderApi, ReturnGoodsStatusApi } from "@/api/salesAfterOrder";
+import { alert, goLink } from "@/common/common";
+import UploadImage from "@/components/uploadImage"
+import TextareaEnhance from "@/components/textareaEnhance";
+
+type ReasonParam = 1|2|3 //1 退货原因 2 货物状况 3 退货说明
+export default () => {
+
+    useDidShow(() => {
+        getSaleOrderPreView()
+    })
+
+    const router = useRouter()
+    const orderId = useRef<number>(Number(router.params.id))
+
+    //需要提交的数据
+    const [submitData, setSubmitData] = useState<any>({
+        fabric_piece_accessory_url: [],
+        goods_status: 0,
+        reason_describe: '',
+        return_explain: 0,
+        return_reason: 1,
+        roll: 0,
+        roll_list: [],
+        sale_order_id: orderId.current
+    })
+
+    //获取订单数据
+    const [orderDetail, setOrderDetail] = useState<any>() //获取到的原始数据
+    const {fetchData: getOrderFetchData} = GetSaleOrderDetailApi()
+    const getSaleOrderPreView = async () => {
+        if(orderId.current) {
+            let res = await getOrderFetchData({id: orderId.current})
+            setOrderDetail(res.data)
+        }   
+    }
+
+    //监听获取到的数据
+    useEffect(() => {
+        if(orderDetail) {
+            formatData()
+        }
+    }, [orderDetail])
+
+    //格式化数据格式
+    const [formatDetailOrder, setFormatDetailOrder] = useState<any>() //格式化后的数据
+    const formatData = () => {  
+        setFormatDetailOrder({
+            sale_mode: orderDetail.sale_mode,
+            sale_mode_name: orderDetail.sale_mode_name, 
+            total_colors: orderDetail.total_colors, //总颜色数量
+            total_number: orderDetail.total_number, //总数量
+            total_fabrics: orderDetail.total_fabrics, //面料数量
+            unit: orderDetail.sale_mode == 0?'条':'m', //单位
+            list: orderDetail.product_list,
+            status: orderDetail.status, //订单状态
+            
+        })
+    }
+
+    //数据总量
+    const dataCount = useMemo(() => {
+        if(formatDetailOrder) {
+            return `${formatDetailOrder.total_fabrics}种面料，${formatDetailOrder.total_colors}种颜色，共${formatDetailOrder.total_number}条`
+        }
+    }, [formatDetailOrder])
+   
+    
+    //退货选择弹窗
+    const [showReason, setShowReason] = useState<{show:true|false, title: string}>({show:false, title: ''})
+    const closeReason = useCallback(() => setShowReason({...showReason, show:false}), [])
+    const onShowReason = (status) => {
+        setShowReason({...showReason, show:true})
+    }
+
+    //面料数据
+    let roll_list = useRef({})
+
+    //大货时获取计步器数据
+    const getNumChange = useCallback((val) => {
+        if(parseInt(val.number) > 0) {
+            roll_list.current[val.color_id] = {product_color_id: val.color_id, product_roll: val.number}
+        } else {
+            delete roll_list.current[val.color_id]
+        }
+
+        let count = 0 
+        Object.values(roll_list.current).map((item: any) => {
+            count += item.product_roll
+        })
+        setSubmitData((e) => ({...e, roll_list:Object.values(roll_list.current), roll: count}))
+    }, [])
+
+    //散剪和剪板
+    const getSelectChange = useCallback((val) => {
+        console.log('val::', val)
+        if(val.status) {
+            roll_list.current[val.color_id] = {product_color_id: val.color_id, product_roll: val.length}
+        } else {
+            delete roll_list.current[val.color_id]
+        }
+        let count = 0 
+        Object.values(roll_list.current).map((item: any) => {
+            count += item.product_roll
+        })
+        setSubmitData((e) => ({...e, roll_list:Object.values(roll_list.current), roll: count}))
+    }, [])  
+
+    //获取图片列表
+    const getImageList = useCallback((list) => {
+        setSubmitData((e) => ({...e, fabric_piece_accessory_url:list}))
+    }, [])
+
+    //其他说明
+    const getOtherReason = useCallback((val) => {
+        setSubmitData((e) => ({...e, reason_describe: val}))
+    }, [])
+
+    //提交数据
+    const {fetchData: fetchDataReturnApply} = ReturnApplyOrderApi()
+    const onSubmitData = async () => {
+        if(submitData.roll_list.length <= 0) return alert.error('请选择退货颜色')
+        let res = await fetchDataReturnApply(submitData)
+        if(res.success) {
+            alert.success('申请成功')
+            goLink('/pages/salesAfterList/index',{}, 'reLaunch')
+        } else {
+            alert.error('申请失败')
+        }
+        console.log('提交：：',submitData)
+    }
+
+    //底部按钮
+    const onSubmit = (val) => {
+        if(val == 2) {
+            onSubmitData()
+        }
+    }
+
+    const [returnGoodsInfo, setReturnGoodsInfo] = useState<{title:string, list: any[]}>({title:'', list:[]})
+    //售后货物状况
+    const {fetchData: fetchDataGoodsStatus} = ReturnGoodsStatusApi()
+    const getReturnGoodsStatus = async () => {
+        let res = await fetchDataGoodsStatus()
+        setReturnGoodsInfo((e) => ({...e, title: '售后货物状况', list:res.data?.list||[]}))
+    }
+    useEffect(() => {
+        getReturnGoodsStatus()
+    }, [])
+
+    return (
+        <View className={styles.apply_after_sales_main}>
+            <View className={styles.apply_after_sales_con}>
+                <View className={styles.kind_number}><Text>{dataCount}</Text></View>
+                <ScrollView scrollY className={styles.scroll}>
+                    <View className={styles.scroll_con}>
+                        <KindList order={formatDetailOrder} onNumChange={getNumChange} onSelectChange={getSelectChange}/>
+                        <View className={styles.returnSaleInput}>
+                            <View className={styles.returnSaleInput_item}>
+                                <View className={styles.title}>退货原因</View>
+                                <View className={styles.select} onClick={() => onShowReason(1)}>
+                                    <Text>请选择</Text>
+                                    <Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
+                                </View>
+                            </View>
+                            <View className={styles.returnSaleInput_item}>
+                                <View className={styles.title}>货物状况</View>
+                                <View className={styles.select} onClick={() => onShowReason(2)}>
+                                    <Text>请选择</Text>
+                                    <Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
+                                </View>
+                            </View>
+                            <View className={styles.returnSaleInput_item}>
+                                <View className={styles.title}>退货说明</View>
+                                <View className={styles.select} onClick={() => onShowReason(3)}>
+                                    <Text>请选择</Text>
+                                    <Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
+                                </View>
+                            </View>
+                            <View className={styles.returnSaleInput_item}>
+                                <View className={styles.title}>拍照上传</View>
+                                <View className={styles.upload_image}>
+                                    <UploadImage onChange={getImageList}/>
+                                </View>
+                            </View>
+                            <TextareaEnhance onChange={getOtherReason} title='其他说明'/>
+                        </View>
+                       
+                    </View>
+                </ScrollView>
+                <View className="common_safe_area_y"></View>
+            </View>
+            <View  className={styles.btns_con}>
+                <View  className={styles.btns_two}>
+                    <View  className={styles.rest_btn} onClick={() => onSubmit(1)}>取消</View>
+                    <View  className={styles.verify_btn } onClick={() => onSubmit(2)}>确认</View>
+                </View >
+            </View >
+            <ReasonPopup show={showReason.show} onClose={closeReason} title={returnGoodsInfo.title} list={returnGoodsInfo.list}/>   
+        </View>
+    )
+}

src/pages/certification/components/SelectEnterpriseType.scss

@@ -0,0 +1,22 @@
+.select-enterprise-type{
+  .select-enterprise-type-btn{
+    color: #ABABAB;
+    font-size: 28px;
+    padding: 20px;
+    display: flex;justify-content: space-between;
+    border-bottom: 1rpx solid #eaeaea;
+  }
+  .select-enterprise-type-content{
+    padding: 0 20px;
+    padding-bottom: 120px;
+  }
+  .select-enterprise-type-content view{
+    padding: 20px 0;
+    font-size: 28px;
+    display: flex;justify-content: space-between;
+  }
+  .select-enterprise-type-content view text:last-child{
+    color: #007AFF;
+    font-size: 35px;
+  }
+}

src/pages/certification/components/SelectEnterpriseType.tsx

@@ -0,0 +1,56 @@
+import { Text, View } from "@tarojs/components"
+import Popup from "@/components/popup";
+import "./SelectEnterpriseType.scss"
+import { forwardRef, useEffect, useImperativeHandle, useState } from "react";
+import {certificationTypeListApi} from "@/api/certification"
+
+interface Params{
+  confirm?: (selected:any)=>void, // 确定
+}
+
+export default forwardRef((props: Params, ref)=>{
+  const [modalShow, setModalShow] = useState(false)
+  // 获取认证信息
+  const {fetchData, state} = certificationTypeListApi();
+  useEffect(()=>{
+    fetchData();
+  }, [])
+  const [selected, setSelected] = useState({});
+  // 确定
+  const handleSelect = (item)=>{
+    setSelected(item);
+  }
+  // 设置弹窗是否显示
+  const setShow = (ev)=>{
+    setModalShow(ev);
+  }
+  useImperativeHandle(ref,()=>({
+    setShow
+  }))
+  // 确定
+  const handleConfirm = ()=>{
+    props.confirm&&props.confirm(selected);
+    setModalShow(false);
+  }
+  
+  return (
+    <View className="select-enterprise-type">
+      <Popup showTitle={false} show={modalShow} onClose={() => setModalShow(false)}>
+          <View className="select-enterprise-type-btn">
+            <View onClick={() => setModalShow(false)}>取消</View>
+            <View onClick={handleConfirm}>确定</View>
+          </View>
+          <View className="select-enterprise-type-content">
+            {
+              state.data?.list?.map((item,index)=>{
+                return <View onClick={()=>handleSelect(item)} key={index}>
+                  <Text>{item.name}</Text>
+                  {item.id==(selected as any).id?<Text className="iconfont icon-tick"/>:<Text/>}
+                </View>
+              })
+            }
+          </View>
+      </Popup>
+    </View>
+  )
+})

src/pages/certification/index.scss

@@ -16,6 +16,7 @@
     margin-left: 30px;
     padding-top: 40px;
     color: #000000;
+    padding-bottom: 20px;
     // border-top: 18px solid #F0F0F0;
   }
   .certification-upload{
@@ -38,6 +39,10 @@
   .certification-upload-no{
     display: flex;flex-direction: column;align-items: center;
   }
+  .certification-upload image{
+    position: absolute;width: 100%;height: 100%;
+    object-fit: cover;border-radius: 30px;
+  }
   .certification-upload-no-icon{
     width: 104px;
     height: 104px;
@@ -56,10 +61,11 @@
   }
   .certification-button{
     position: absolute;bottom: -10px;left: -10px;right: -10px;
-    background-color: #858A8F;
+    background-color: rgba(0,0,0,0.65);
     display: flex;
     height: 86px;
     border-radius: 0 0 30px 30px;
+    z-index: 1;
   }
   .certification-button view{
     flex: 1;
@@ -79,6 +85,7 @@
     position: fixed;bottom: 0;left: 0;right: 0;
     width: 100%;
     display: flex;align-items: center;justify-content: center;
+    z-index: 2;
   }
   .certification-footer-button{
     width: 696px;
@@ -90,12 +97,16 @@
     box-sizing: border-box;
     overflow: hidden;
   }
-  .certification-footer-button view{
+  .certification-footer-button view,.certification-footer-button navigator{
     flex: 1;
     display: flex;align-items: center;justify-content: center;
     font-size: 32px;
     font-weight: 400;
     color: #007aff;
+    border: 0;border-radius: none;
+  }
+  .certification-footer-button navigator::after{
+    border: 0;border-radius: none;
   }
   .certification-footer-button view:last-child{
     color: white;

src/pages/certification/index.tsx

@@ -1,133 +1,196 @@
 
 import FromListCertification from "@/components/FromListCertification"
-import { Button, Input, Text, Textarea, View } from "@tarojs/components"
+import { Button, Image, Input, NavigationBar, Navigator, Text, Textarea, View } from "@tarojs/components"
 import Taro, { setNavigationBarTitle, useRouter } from "@tarojs/taro"
-import {weightAddApi, weightDetailApi,weightEditApi} from "@/api/weightList"
-import { useEffect, useState } from "react"
+import { certificationSaveApi, certificationDetailApi } from "@/api/certification"
+import { useEffect, useRef, useState } from "react"
 import { alert, retrieval } from "@/common/common"
 import "./index.scss"
+import useUploadCDNImg from "@/use/useUploadImage";
 import Message from "@/components/Message"
+import { IMG_CND_Prefix } from "@/common/constant";
+import SelectEnterpriseType from "./components/SelectEnterpriseType"
+import { useSelector } from "@/reducers/hooks";
+import useLogin from "@/use/useLogin";
 
-export default ()=>{
-  const {type,id} = useRouter().params;
-  useEffect(()=>{
-    if(type=="add"){
-      setNavigationBarTitle({title:"添加码单信息"})
-    }else{
-      initalFormData();
-      setNavigationBarTitle({title:"修改码单信息"})
-    }
-  },[]);
-  // 获取编辑码单信息
-  const {fetchData: getFromData} = weightDetailApi()
-  const initalFormData = async ()=>{
-    const detail = await getFromData({id});
+export default () => {
+  const { getAdminUserInfo } = useLogin();
+  const { adminUserInfo } = useSelector(state => state.userInfo);
+  useEffect(() => {
+    initalFormData();
+  }, []);
+  // 获取认证信息
+  const { fetchData: getFromData } = certificationDetailApi()
+  const initalFormData = async () => {
+    const detail = await getFromData();
     setFormData({
-      title: detail.data.title,
-      purchaser_name: detail.data.purchaser_name,
-      phone: detail.data.phone,
-      is_default: detail.data.is_default,
-      id: detail.data.id,
-    })
+      ...detail.data ?? {},
+      legal_person_identity_url: detail?.data?.legal_person_identity_url ?? [],
+      // business_license_url: "https://test.cdn.zzfzyc.com/mall/827082e888860dd9da10f0fbb0ac3cf023081456.png"
+    } as any)
   }
   // 保存
   const [formData, setFormData] = useState({
-    title: "",
-    purchaser_name: "",
-    phone: "",
-    is_default: false,
-    id: 0
-  })
+    authentication_type: 0,
+    authentication_type_name: "",
+    business_license_url: "",
+    legal_person: "",
+    legal_person_identity: "",
+    businessLicense: '',
+    legal_person_identity_url: [],
+    name: ""
+  });
   const rules = {
-    title: [{
-      message: "请输入抬头"
+    authentication_type: [{
+      message: "请选择认证类型"
     }],
-    purchaser_name: [{
-      message: "请输入客户名称"
+    name: [{
+      message: "请输入企业名称"
+    }],
+    business_license_url: [{
+      message: "请上传营业执照"
+    }],
+    legal_person: [{
+      message: "请输入法人名称"
+    }],
+    legal_person_identity: [{
+      message: "请输入正确法人身份证",
+      regex: /^[1-9]\d{5}(18|19|20|(3\d))\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/
+    }],
+    legal_person_identity_url: [{
+      message: "请上传法人身份证",
+      validator: (value: any, rule: any) => {
+        if (!value[0] || !value[1]) {
+          return true;
+        }
+        return false;
+      }
     }],
-    phone: [{
-      message: "请输入正确的电话号码", regex: /^1[3|5|6|9|2|8|7]\d{9}$/
-    }]
   }
-  const {fetchData} = weightAddApi()
-  const {fetchData: editFetch} = weightEditApi()
-  const handleSave = ()=>{
-    retrieval(formData, rules).then(async ()=>{
-      const result = type=="add"?await fetchData({
-        title: formData.title,
-        purchaser_name: formData.purchaser_name,
-        phone: formData.phone,
-        is_default: formData.is_default,
-      }):await editFetch({
-        title: formData.title,
-        purchaser_name: formData.purchaser_name,
-        phone: formData.phone,
-        is_default: formData.is_default,
-        id: formData.id
-      });
-      if(result.success){
-        Taro.eventCenter.trigger("weightList:refresh");
+  const { fetchData } = certificationSaveApi()
+  const handleSave = () => {
+    retrieval(formData, rules).then(async () => {
+      const result = await fetchData({ ...formData, authentication_type: 2 })
+      if (result.success) {
+        // Taro.eventCenter.trigger("weightList:refresh");
+        getAdminUserInfo();
         Taro.navigateBack();
         alert.success("保存成功");
-      }else{
+      } else {
         alert.error(result.msg);
       }
-    }).catch((message)=>{
+    }).catch((message) => {
       alert.none(message)
     })
   }
   // 监听表单完善
   const [hozon, setHozon] = useState(false);
-  useEffect(()=>{
-    if(retrieval){
-      retrieval(formData).then(()=>setHozon(true)).catch(()=>setHozon(false))
+  useEffect(() => {
+    if (retrieval) {
+      retrieval(formData).then(() => setHozon(true)).catch(() => setHozon(false))
     }
-  },[formData])
+  }, [formData])
+  // 选择类型弹窗显示 
+  const selectTypeRef = useRef(null)
+  const handleSelectTypeModalShow = () => {
+    (selectTypeRef.current as any).setShow(true)
+  }
+  // 选择类型确定
+  const handleSelectTypeConfirm = (item) => {
+    setFormData({
+      ...formData,
+      authentication_type: item.id,
+      authentication_type_name: item.name
+    });
+  }
+  // 上传图片
+  const { getWxPhoto } = useUploadCDNImg();
+  const handleUploadImage = async (text: any) => {
+    let result = await getWxPhoto('mall');
+    if (text == "business_license_url") {
+      formData.business_license_url = IMG_CND_Prefix + (result as any).url;
+    } else {
+      formData.legal_person_identity_url[text] = IMG_CND_Prefix + (result as any).url as never;
+    }
+    setFormData({ ...formData });
+  }
+  // 查看图片
+  const handleViewImage = (event, url) => {
+    event.stopPropagation();
+    Taro.previewImage({
+      current: url,
+      urls: [url]
+    })
+  }
 
   return (
     <View className="certification">
-      <Message text="认证不通过，原因：xxx，请重新认证"/>
+      {(adminUserInfo as any)?.authentication_status == 3 && <Message text={`认证不通过，原因：${(formData as any).authentication_feedback}，请重新认证`} />}
       <View className="certification-content">
         <View className="certification-title">企业认证</View>
-        <FromListCertification type="select" onInput={(ev:any)=>setFormData({...formData,title:ev.detail.value})}
-        value={formData["title"]} label="认证类型" placeholder="企业认证"/>
-        <FromListCertification onInput={(ev:any)=>setFormData({...formData,title:ev.detail.value})} value={formData["title"]} label="企业名称" placeholder="请输入营业执照上的企业名称" required/>
-        <FromListCertification style={{border: "0"}} onInput={(ev:any)=>setFormData({...formData,title:ev.detail.value})} value={formData["title"]} label="企业营业" placeholder="注册号、统一社会信用代码、组织机构代码" required/>
-        <View className="certification-upload">
-          {/* <Text>营业执照正面</Text>
-          <View className="certification-button">
-            <View>查看证件</View>
-            <View>重新上传</View>
-          </View> */}
-          <View className="certification-upload-no">
-            <View className="certification-upload-no-icon">+</View>
-            <View className="certification-upload-no-tips">上传营业执照下面</View>
-          </View>
+        {/* <FromListCertification type="select" onClick={handleSelectTypeModalShow} value={(formData as any)?.authentication_type_name} label="认证类型" placeholder="企业认证"/> */}
+        <SelectEnterpriseType ref={selectTypeRef} confirm={handleSelectTypeConfirm} />
+        <FromListCertification onInput={(ev: any) => setFormData({ ...formData, name: ev.detail.value })} value={formData["name"]} label="企业名称" placeholder="请输入营业执照上的企业名称" required />
+        {/* <FromListCertification type="select" style={{border: "0"}}label="企业营业执照" placeholder="注册号、统一社会信用代码、组织机构代码" required showIcon={false}/> */}
+        <FromListCertification  onInput={(ev: any) => setFormData({ ...formData, businessLicense: ev.detail.value })} value={formData["businessLicense"]} style={{ border: "0" }} label="企业营业执照" placeholder="注册号、统一社会信用代码、组织机构代码" required  />
+        <View onClick={() => handleUploadImage("business_license_url")} className="certification-upload">
+          {(formData as any)?.business_license_url ?
+            <>
+              <Text>营业执照正面</Text>
+              <View className="certification-button">
+                <View onClick={(e) => handleViewImage(e, (formData as any)?.business_license_url)}>查看证件</View>
+                <View>重新上传</View>
+              </View>
+              <Image mode="aspectFit" src={(formData as any)?.business_license_url} />
+            </> :
+            <View className="certification-upload-no">
+              <View className="certification-upload-no-icon">+</View>
+              <View className="certification-upload-no-tips">上传营业执照正面</View>
+            </View>
+          }
         </View>
       </View>
       <View className="certification-content">
         <View className="certification-title">法人认证</View>
-        <FromListCertification onInput={(ev:any)=>setFormData({...formData,title:ev.detail.value})} value={formData["title"]} label="法人代表" placeholder="填写法人名称" required/>
-        <FromListCertification style={{border: "0"}} onInput={(ev:any)=>setFormData({...formData,title:ev.detail.value})} value={formData["title"]} label="法人身份" placeholder="填写法人代表身份证号" required/>
-        <View className="certification-upload">
-          <Text>身份证正面</Text>
-          <View className="certification-button">
-            <View>查看证件</View>
-            <View>重新上传</View>
-          </View>
+        <FromListCertification onInput={(ev: any) => setFormData({ ...formData, legal_person: ev.detail.value })} value={formData["legal_person"]} label="法人代表" placeholder="填写法人名称" required />
+        <FromListCertification style={{ border: "0" }} onInput={(ev: any) => setFormData({ ...formData, legal_person_identity: ev.detail.value })} value={formData["legal_person_identity"]} label="法人身份" placeholder="填写法人代表身份证号" required />
+        <View onClick={() => handleUploadImage(0)} className="certification-upload">
+          {(formData as any)?.legal_person_identity_url[0] ?
+            <>
+              <Text>营业执照正面</Text>
+              <View className="certification-button">
+                <View onClick={(e) => handleViewImage(e, (formData as any)?.legal_person_identity_url[0])}>查看证件</View>
+                <View>重新上传</View>
+              </View>
+              <Image mode="aspectFit" src={(formData as any)?.legal_person_identity_url[0]} />
+            </> :
+            <View className="certification-upload-no">
+              <View className="certification-upload-no-icon">+</View>
+              <View className="certification-upload-no-tips">上传身份证正面</View>
+            </View>
+          }
         </View>
-        <View className="certification-upload">
-          <Text>身份证反面</Text>
-          <View className="certification-button">
-            <View>查看证件</View>
-            <View>重新上传</View>
-          </View>
+        <View onClick={() => handleUploadImage(1)} className="certification-upload">
+          {(formData as any)?.legal_person_identity_url[1] ?
+            <>
+              <Text>营业执照正面</Text>
+              <View className="certification-button">
+                <View onClick={(e) => handleViewImage(e, (formData as any)?.legal_person_identity_url[1])}>查看证件</View>
+                <View>重新上传</View>
+              </View>
+              <Image mode="aspectFit" src={(formData as any)?.legal_person_identity_url[1]} />
+            </> :
+            <View className="certification-upload-no">
+              <View className="certification-upload-no-icon">+</View>
+              <View className="certification-upload-no-tips">上传身份证正面</View>
+            </View>
+          }
         </View>
       </View>
       <View className="certification-footer">
         <View className="certification-footer-button">
-          <View>取消</View>
-          <View>提交</View>
+          <Navigator openType="navigateBack">取消</Navigator>
+          <View onClick={handleSave}>{[3, 4].includes((adminUserInfo as any)?.authentication_status) ? "重新认证" : "提交"}</View>
         </View>
       </View>
     </View>

src/pages/collection/index.config.ts

@@ -0,0 +1,4 @@
+export default {
+  navigationBarTitleText: '我的收藏',
+  enableShareAppMessage: true,
+}

src/pages/collection/index.tsx

@@ -0,0 +1,12 @@
+import Search from "@/components/search"
+import { View } from "@tarojs/components"
+import styles  from './index.module.scss'
+export default () => {
+    return (
+      <View className={styles.main}>
+        <View className={styles.search}>
+          <Search  style={{width: '100%'}} debounceTime={300} changeOnSearch={(e) => console.log(e)} placeholder="请输入面料关键词" placeIcon="out" showBtn={true} />
+        </View>
+      </View>
+    )
+  }

src/pages/creditLine/index.scss

@@ -5,22 +5,6 @@
     width: 238px;
     height: 238px;
   }
-
-  .credit-line-tips{
-    width: 100%;
-    height: 66px;
-    background: #FFE6CE;
-    border: 2px solid #ffe6ce;
-    padding: 0 30px;
-    display: flex;align-items: center;
-    font-size: 24px;
-    font-weight: 400;
-    color: #EE7500;
-  }
-  .credit-line-tips text{
-    margin-right: 10px;
-    font-size: 30px;
-  }
   .credit-line-card{
     width: 702px;
     background: #ffffff;

src/pages/creditLine/index.tsx

@@ -7,6 +7,7 @@ import {creditInfoApi} from "@/api/creditLine"
 import "./index.scss"
 import { useSelector } from "@/reducers/hooks";
 import { formatDateTime, formatPriceDiv } from "@/common/fotmat"
+import Message from "@/components/Message"
 
 export default ()=>{
   
@@ -41,7 +42,8 @@ export default ()=>{
     const credit_quota_used_line = convertPrice(formatPriceDiv(result.data.credit_quota_used_line));
     const credit_quota_line = convertPrice(formatPriceDiv(result.data.credit_quota_line));
     const credit_quota_available_line = convertPrice(formatPriceDiv(result.data.credit_quota_available_line));
-    const progress = ((credit_quota_available_line[0]??0) / (credit_quota_line[0]??0) * 100).toFixed(0);
+    const progress = credit_quota_available_line[0]==0&&credit_quota_line[0]==0?100:((credit_quota_available_line[0]??0) / (credit_quota_line[0]??0) * 100).toFixed(0);
+    
     
     switch(Number(result.data.quota_status)){
       case 0://暂未开通
@@ -120,9 +122,7 @@ export default ()=>{
 
   return (
     <View className="credit-line">
-      <View className="credit-line-tips">
-        <Text className="iconfont icon-zhuyi"></Text> 暂不支持线上申请授权，请联系平台客服。
-      </View>
+      <Message text="暂不支持线上申请授权，请联系平台客服。"/>
       <View className="credit-line-card">
         <View className="credit-line-card-top">
           <View><Progress progress={data.progress} style={style} /></View>

src/pages/creditUsed/index.tsx

@@ -4,7 +4,7 @@ import Taro, { useReady } from "@tarojs/taro"
 import { useCallback, useEffect, useMemo, useRef, useState } from "react"
 import {creditListApi} from "@/api/creditLine"
 import "./index.scss"
-import { formatDateTime } from "@/common/fotmat"
+import { formatDateTime, formatPriceDiv, toDecimal2 } from "@/common/fotmat"
 import { dataLoadingStatus, getFilterData } from "@/common/util";
 
 export default ()=>{
@@ -30,7 +30,9 @@ export default ()=>{
               <View key={index} className="credit-used-list">
                 <View className="credit-used-list-top">
                   <View className="credit-used-list-type">下单</View>
-                  <View className={`credit-used-list-price ${item.amount>0?'green':item.amount<0?'red':''}`}>{item.amount.toLocaleString()}</View>
+                  <View className={`credit-used-list-price ${item.amount>0?'green':item.amount<0?'red':''}`}>
+                    {item.trans_type==2?"-":"+"}{toDecimal2(formatPriceDiv(item.amount)).toLocaleString()}
+                  </View>
                 </View>
                 <View className="credit-used-list-bottom">
                   <View className="credit-used-list-date">{formatDateTime(item.order_pay_time)}</View>

src/pages/depositBeforehand/index.scss

@@ -3,22 +3,6 @@
   background-color: #f3f3f3;
   display: flex;
   flex-direction: column;
-  .deposit-beforehand-tips{
-    width: 100%;
-    height: 66px;
-    background: #FFE6CE;
-    border: 2px solid #ffe6ce;
-    padding: 0 30px;
-    display: flex;align-items: center;
-    font-size: 24px;
-    font-weight: 400;
-    color: #EE7500;
-    margin: 0;
-  }
-  .deposit-beforehand-tips text{
-    margin-right: 10px;
-    font-size: 30px;
-  }
 
   .deposit-beforehand-card{
     width: 702px;

src/pages/depositBeforehand/index.tsx

@@ -6,6 +6,7 @@ import { depositInfoApi } from "@/api/deposit"
 import { useEffect } from "react";
 import { formatPriceDiv, toDecimal2 } from "@/common/fotmat";
 import { setClipboardData } from "@tarojs/taro";
+import Message from "@/components/Message";
 
 export default ()=>{
   const {fetchData, state} = depositInfoApi();
@@ -23,9 +24,7 @@ export default ()=>{
 
   return (
     <View className="deposit-beforehand">
-      <View className="deposit-beforehand-tips">
-        <Text className="iconfont icon-zhuyi"></Text> 汇款成功后，1-5分钟自动到账。
-      </View>
+      <Message text="汇款成功后，1-5分钟自动到账。"/>
       <View className="deposit-beforehand-card">
         <View className="deposit-beforehand-balance">
           <View className="deposit-beforehand-balance-title">余额 (元)</View>

src/pages/depositList/index.scss

@@ -18,11 +18,12 @@
   .credit-used-list-price{
     font-size: 28px;
     font-weight: 400;
-    margin-bottom: 20px;
   }
   .credit-used-list-right{
     display: flex;align-items: center;
-    text-align: right;
+  }
+  .credit-used-list-right-price view{
+    display: flex;align-items: center;
   }
   .credit-used-list-right text{
     font-size: 30px;
@@ -36,6 +37,7 @@
   .credit-used-list-orderno{
     font-size: 20px;
     font-weight: 400;
+    margin-top: 20px;
     color: #ababab;
   }
   .green{

src/pages/depositList/index.tsx

@@ -36,11 +36,11 @@ export default ()=>{
 
                 </View>
                 <View className="credit-used-list-right">
-                  <View>
-                    <View className={`credit-used-list-price ${(item as any).amount_received_this_time>0?'red':'green'}`}>
-                      {(item as any).amount_received_this_time>0&&"+"}{formatPriceDiv((item as any).amount_received_this_time)}
+                  <View className="credit-used-list-right-price">
+                    <View className={`credit-used-list-price ${[1,2,3].includes((item as any).type as never)?'red':'green'}`}>
+                      {[1,2,3].includes((item as any).type as never)?"+":"-"}{formatPriceDiv((item as any).amount_received_this_time)}
                     </View>
-                    <View className="credit-used-list-orderno">处理中</View>
+                    {/* <View className="credit-used-list-orderno">处理中</View> */}
                   </View>
                   <Text className="iconfont icon-a-moreback"></Text>
                 </View>

src/pages/details/components/counter/index.module.scss

@@ -4,19 +4,25 @@
     align-items: center;
     justify-content: space-between;
     width: 100%;
-    .reduce, .plus{
-        font-size: $font_size_big;
+    .plus{
         color: $color_main;
         width: 46px;
         height: 46px;
-        display: flex;
-        align-items: center;
-        justify-content:center;
+        text-align: center;
+        line-height: 43px;
         font-size: 50px;
         background-color: $color_main;
         color: #fff;
         border-radius: 8px;
     }
+    .reduce {
+        font-size: 50px;
+        width: 46px;
+        height: 46px;
+        text-align: center;
+        line-height: 43px;
+        color:#007AFF;
+    }
     .input{
         display: flex;
         align-items: flex-end;
@@ -25,10 +31,13 @@
         box-sizing: border-box;
         width: 106px;
         border-radius: 10px;
+        input{
+            font-size: $font_size_medium;
+            text-align: right;
+            padding-right: 10px;
+        }
     }
-    input{
-        font-size: $font_size_medium;
-    }
+    
     .unit{
         font-size: $font_size_min;
         color: $color_font_two;

src/pages/details/components/orderCount/index.module.scss

@@ -72,6 +72,9 @@
         padding-bottom:151px;
     }
     .color_con{
+        .virtual_list{
+            padding-bottom: 300px;
+        }
         .item {
             display: flex;
             justify-content: space-between;
@@ -81,12 +84,7 @@
                 width: 156.5px;
                 height: 156.5px;
                 border-radius: 20px;
-                background-color: red;
-                image{
-                    width: 100%;
-                    height: 100%;
-                    border-radius: 20px;
-                }
+                
             }
             .item_con{
                 flex:1;

src/pages/details/components/orderCount/index.tsx

@@ -15,6 +15,8 @@ import Taro, { useRouter } from "@tarojs/taro";
 import UseLogin from "@/use/useLogin"
 import { formatHashTag, formatPriceDiv } from "@/common/fotmat";
 import { debounce, getFilterData } from "@/common/util";
+import LabAndImg from "@/components/LabAndImg";
+import VirtualList from '@tarojs/components/virtual-list'
 
 
 
@@ -48,21 +50,14 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
     //获取面料颜色列表
     const {fetchData:colorFetchData, state: colorState} = GetColorList()
     const [list, setList] = useState<any[]>([])
-    const [loading, setLoading] = useState(false)
     const condition = useRef({physical_warehouse:adminUserInfo?.physical_warehouse, sale_mode:selectIndex, product_id:0, code_or_name:null})
     const getColorList = async () => {
-        setLoading(() => true)
-        console.log('数据:::',getFilterData(condition.current))
         let {data} = await colorFetchData(getFilterData(condition.current))
         let lists =  initList(data.list)
         setList(() => [...lists])
-        setLoading(() => false)
     }
     const [showPopup, setShowPopup] = useState(false)
 
-    useEffect(() => {
-        console.log('colorState::',colorState)
-    }, [colorState])
 
     //显示获取
     useEffect(() => {
@@ -123,11 +118,14 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
 
     //计数组件
     const getInputValue = (num, item) => {
-       item.count = parseFloat(num)
-       if(num == 0) item.show = false
-       setList([...list])
-       console.log(num)
+        item.count = parseFloat(num)
+        if(num == 0) item.show = false
+        setList([...list])
+        console.log(num)
+        
     }
+ 
+
     const onAdd = (item) => {
         item.show = true
         item.count = selectList[selectIndex].defaultNum
@@ -153,7 +151,6 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
             })
             return false
         }
-        
         if(selectCount.sumCount == 0) {
             Taro.showToast({
                 icon:'none',
@@ -161,6 +158,7 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
             })
             return false
         } 
+        
         const state =  await addFetchData({
             "sale_mode": selectIndex,
             color_list: selectCount.color_list
@@ -198,10 +196,44 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
         return <View className={styles.priceText}><Text>¥</Text>{price}<Text> /{selectList[selectIndex].eunit}</Text></View> 
     }, [selectIndex])
 
+    //虚拟滚动
+    const Rows = memo(({id, index, style, data}:any) => {
+        let item = data[index]
+        return (
+            <>
+                {item&&<View className={styles.item} key={item.id}>
+                    <View className={styles.item_color}>
+                        <LabAndImg value={{lab:item.lab,rgb:item.rgb,texture_url:item.texture_url}}/>
+                    </View>
+                    <View className={styles.item_con}>
+                        <View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
+                        <View className={styles.num}>
+                            {formatPrice(item)}
+                        </View>
+                    </View>
+                    <View className={styles.btn_con}>
+                        {!item.show&&<View className={styles.btn} onClick={() => onAdd(item)}>添加</View>
+                        ||<View className={styles.btn_count}>
+                            <Counter
+                                onBlue={(e) => getInputValue(e, item)} 
+                                defaultNum={item.count}   
+                                step={selectList[selectIndex].step} 
+                                digits={selectList[selectIndex].digits}
+                                onClickBtn={(e) => getInputValue(e, item)}
+                                unit={selectList[selectIndex].unit}
+                                minNum={selectList[selectIndex].minNum}
+                                maxNum={selectList[selectIndex].maxNum}
+                            />
+                        </View>}
+                    </View>
+                </View>||<View className={styles.item}></View>
+                }
+            </>
+        )
+    })
 
     return (
         <View className={styles.shop_cart_main}>
-            
             <Popup showTitle={false} show={showPopup} onClose={() => closePopup()} >
                 <View className={styles.popup_con}>
                     <View className={styles.header}>{title}</View>
@@ -227,39 +259,53 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
                     <View className={styles.product_color_con}>
                         {(list.length <= 0 && colorState.loading)&&<LoadingCard/>}
                         {(list.length > 0&& !colorState.loading)&&
-
-                            <InfiniteScroll moreStatus={false}>
-                                <View className={styles.color_con}>
-                                    {list.map(item => {
-                                        return <View className={styles.item} key={item.id}>
-                                            <View className={styles.item_color}>
-                                                <Image src={item.texture_url}/>
-                                            </View>
-                                            <View className={styles.item_con}>
-                                                <View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
-                                                <View className={styles.num}>
-                                                    {formatPrice(item)}
-                                                </View>
-                                            </View>
-                                            <View className={styles.btn_con}>
-                                                {!item.show&&<View className={styles.btn} onClick={() => onAdd(item)}>添加</View>
-                                                ||<View className={styles.btn_count}>
-                                                    <Counter
-                                                        onBlue={(e) => getInputValue(e, item)} 
-                                                        defaultNum={item.count}   
-                                                        step={selectList[selectIndex].step} 
-                                                        digits={selectList[selectIndex].digits}
-                                                        onClickBtn={(e) => getInputValue(e, item)}
-                                                        unit={selectList[selectIndex].unit}
-                                                        minNum={selectList[selectIndex].minNum}
-                                                        maxNum={selectList[selectIndex].maxNum}
-                                                    />
-                                                </View>}
-                                            </View>
-                                        </View>
-                                    })}
-                                </View>
-                        </InfiniteScroll>}
+                        //     <InfiniteScroll moreStatus={false}>
+                        //         <View className={styles.color_con}>
+                        //             {list.map(item => {
+                        //                 return <View className={styles.item} key={item.id}>
+                        //                     <View className={styles.item_color}>
+                        //                         <LabAndImg value={{lab:item.lab,rgb:item.rgb,texture_url:item.texture_url}}/>
+                        //                     </View>
+                        //                     <View className={styles.item_con}>
+                        //                         <View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
+                        //                         <View className={styles.num}>
+                        //                             {formatPrice(item)}
+                        //                         </View>
+                        //                     </View>
+                        //                     <View className={styles.btn_con}>
+                        //                         {!item.show&&<View className={styles.btn} onClick={() => onAdd(item)}>添加</View>
+                        //                         ||<View className={styles.btn_count}>
+                        //                             <Counter
+                        //                                 onBlue={(e) => getInputValue(e, item)} 
+                        //                                 defaultNum={item.count}   
+                        //                                 step={selectList[selectIndex].step} 
+                        //                                 digits={selectList[selectIndex].digits}
+                        //                                 onClickBtn={(e) => getInputValue(e, item)}
+                        //                                 unit={selectList[selectIndex].unit}
+                        //                                 minNum={selectList[selectIndex].minNum}
+                        //                                 maxNum={selectList[selectIndex].maxNum}
+                        //                             />
+                        //                         </View>}
+                        //                     </View>
+                        //                 </View>
+                        //             })}
+                        //         </View>
+                        // </InfiniteScroll>}
+                        <View className={styles.color_con}>
+                            <VirtualList
+                                className={styles.virtual_list}
+                                height={400} /* 列表的高度 */
+                                width='100%' /* 列表的宽度 */
+                                itemData={list} /* 渲染列表的数据 */
+                                itemCount={list.length + 1} /*  渲染列表的长度 */
+                                itemSize={100} /* 列表单项的高度  */
+                                overscanCount={1}
+                            >
+                                {Rows} 
+                            </VirtualList>
+                            <View className="common_safe_area_y"></View>
+                        </View>}
+                        
                         {(list.length <= 0 && !colorState.loading)&&<View className={styles.noData}>暂无此商品</View>}
                     </View>
                     <View className={styles.buy_btn}>
@@ -273,4 +319,5 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
             </Popup>
         </View>
     )
-})
+})
+

src/pages/details/index.tsx

@@ -14,6 +14,8 @@ import useLogin from '@/use/useLogin';
 import { AnalysisShortCodeApi, BindShortCodeApi, GetShortCodeApi } from '@/api/share';
 import { SHARE_SCENE } from '@/common/enum';
 import useUserInfo from '@/use/useUserInfo';
+import LabAndImg from '@/components/LabAndImg';
+import { alert } from '@/common/common';
 
 type item = {title:string, img:string, url:string, id:number}
 
@@ -78,9 +80,10 @@ export default (props:Params) => {
 
   const [showCart, setShowCart] = useState(false)
   const [showOrderCount, setShowOrderCount] = useState(false)
-  const html = `
-    <img style="width:100%" src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fpic24.nipic.com%2F20121021%2F10910884_100200815001_2.jpg&refer=http%3A%2F%2Fpic24.nipic.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1652257920&t=9353dda34f18ae2fe6803f3da35954bb">
-  `
+  // const html = `
+  //   <img style="width:100%" src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fpic24.nipic.com%2F20121021%2F10910884_100200815001_2.jpg&refer=http%3A%2F%2Fpic24.nipic.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1652257920&t=9353dda34f18ae2fe6803f3da35954bb">
+  // `
+  const html = ``
 
   //弹窗提示
   const [colorInfo, setColorInfo] = useState<colorItem>()
@@ -113,17 +116,21 @@ export default (props:Params) => {
     setSortCode({... userObj.sort_code, shareShortDetail: {title: productName as string, code: resDetail.md5_key, img:''}})
   }
 
-  //开始下单
-  const placeOrder = async (e:any) => {
-    try {
-      await getPhoneNumber(e.detail.code)
-    } catch(msg) {
-      Taro.showToast({
-        icon:"none",
-        title: msg
-      })
-      return false
-    }
+  //授权手机号和下单
+  const placeOrder = async (status = 'to_phone',e:any = {}) => {
+    if(!productInfo.id) return false
+    if(status == 'to_phone') {
+      if(!e.detail.code) return alert.error('请授权手机号')
+      try {
+        await getPhoneNumber(e.detail.code)
+      } catch(msg) {
+        Taro.showToast({
+          icon:"none",
+          title: msg
+        })
+        return false
+      }
+    } 
     setShowOrderCount(true)
   }
 
@@ -162,12 +169,12 @@ export default (props:Params) => {
         </View>
       </View>
       <View className={styles.product_color}>
-        <View className={styles.title}>色号 (10)</View>
+        <View className={styles.title}>色号 ({productInfo?.product_color_list?.length})</View>
           <View className={styles.list}>
               {productInfo?.product_color_list?.map(item => {
                 return <View className={styles.item} onClick={() => getColorItem(item)}>
                   <View className={styles.item_color}>
-                    <Image src={formatImgUrl(item.texture_url)}></Image>
+                    <LabAndImg value={{lab:item.lab,rgb:item.rgb,texture_url:item.texture_url}}/>
                   </View>
                   <View className={styles.item_name}>{item.code}</View>
                 </View>
@@ -183,11 +190,11 @@ export default (props:Params) => {
           <View className={styles.text}>购物车</View>
         </View>
         {
-            !userInfo.adminUserInfo?.is_authorize_phone&&<View className={styles.buy_btn} >
-              <Button className={styles.phoneBtn} open-type="getPhoneNumber" onGetPhoneNumber={(e) => placeOrder(e)}></Button>
+            (!userInfo.adminUserInfo?.is_authorize_phone)&&<View className={styles.buy_btn} >
+              <Button className={styles.phoneBtn} open-type="getPhoneNumber" onGetPhoneNumber={(e) => placeOrder('to_phone',e)}></Button>
               开始下单
             </View>
-            || <View className={styles.buy_btn} onClick={(e) => placeOrder(e)}>开始下单</View>
+            || <View className={styles.buy_btn} onClick={() => placeOrder('to_order')}>开始下单</View>
         }
       </View>
       <CustomWrapper>

src/pages/index/index.tsx

@@ -1,4 +1,4 @@
-import {View} from '@tarojs/components'
+import { View } from '@tarojs/components'
 import Banner from '@/components/banner'
 import Search from '@/components/search'
 import SideBar from '@/components/sideBar'
@@ -6,16 +6,17 @@ import Product from '@/components/product'
 import MoveBtn from '@/components/moveBtn'
 import ShopCart from '@/components/shopCart'
 import { goLink } from '@/common/common'
-import styles  from './index.module.scss'
+import styles from './index.module.scss'
 import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
-import Taro, { Events, useDidShow, usePullDownRefresh} from '@tarojs/taro'
-import {GetProductKindListApi, GetProductListApi} from '@/api/material'
+import { useSelector } from "@/reducers/hooks";
+import Taro, { Events, useDidShow, usePullDownRefresh } from '@tarojs/taro'
+import { GetProductKindListApi, GetProductListApi } from '@/api/material'
 import useLogin from '@/use/useLogin'
 import { dataLoadingStatus } from '@/common/util'
 
 export default () => {
 
-  const {checkLogin} = useLogin()
+  const { checkLogin } = useLogin()
   useDidShow(async () => {
     await checkLogin()
   })
@@ -25,32 +26,33 @@ export default () => {
   }, [])
 
   //获取面料种类
-  const [kindData, setKindData] = useState<any>({list:[], defaultId:0})
-  const {fetchData} = GetProductKindListApi()
+  const [kindData, setKindData] = useState<any>({ list: [], defaultId: 0 })
+  const { fetchData } = GetProductKindListApi()
   const categoryList = async () => {
     const res = await fetchData()
-    if(res.data?.list) {
-      setKindData({...kindData, list:res.data.list, defaultId: res.data.list[0].id})
-      setFiltrate({...filtrate, product_kind_id:res.data.list[0].id})
+    if (res.data?.list) {
+      setKindData({ ...kindData, list: res.data.list, defaultId: res.data.list[0].id })
+      setFiltrate({ ...filtrate, product_kind_id: res.data.list[0].id })
     }
-    
+
   }
 
   //获取面料列表
-  const [productData, setProductData] = useState({list:[], total:0})
+  const [productData, setProductData] = useState({ list: [], total: 0 })
   const [hasMore, setHasMore] = useState(true)
-  const [filtrate, setFiltrate] = useState({product_kind_id:0, size: 5,page: 1})
-  const pageNum = useRef({size:filtrate.size, page:filtrate.page})
-  const {fetchData: productFetchData, state: productState} = GetProductListApi()
+  const [filtrate, setFiltrate] = useState({ product_kind_id: 0, size: 5, page: 1 })
+  const pageNum = useRef({ size: filtrate.size, page: filtrate.page })
+  const { fetchData: productFetchData, state: productState } = GetProductListApi()
   //获取数据方法
   const getProductList = async () => {
-    const {data,total} = await productFetchData(filtrate)
-    setProductData({...productData,list:data.list,total})
+    const { data, total } = await productFetchData(filtrate)
+    setProductData({ ...productData, list: data.list, total })
     setRefresherTriggeredStatus(() => false)
   }
   //监听查询条件
   useEffect(() => {
-    if(filtrate.product_kind_id)
+
+    if (filtrate.product_kind_id)
       getProductList()
   }, [filtrate])
 
@@ -58,30 +60,30 @@ export default () => {
   //点击面料类型
   const getProductKindId = useCallback((e) => {
     pageNum.current.page = 1
-    setProductData({list:[], total:0})
-    setFiltrate((list) => ({...list, size:5, product_kind_id:e.id}))
+    setProductData({ list: [], total: 0 })
+    setFiltrate((list) => ({ ...list, size: 5, product_kind_id: e.id }))
     // setHasMore(true)
   }, [])
 
   //上拉加载数据
   const getScrolltolower = useCallback(() => {
-    if(productData.list.length >= productData.total) {
+    if (productData.list.length >= productData.total) {
       setHasMore(false)
     } else {
       pageNum.current.page++
       const newSize = pageNum.current.size * pageNum.current.page
-      setFiltrate((e) => ({...e, size:newSize}))
+      setFiltrate((e) => ({ ...e, size: newSize }))
     }
   }, [productData])
 
 
   const [showShopCart, setShowShopCart] = useState(false)
-  
+
   //列表下拉刷新
   const [refresherTriggeredStatus, setRefresherTriggeredStatus] = useState(false)
   const getRefresherRefresh = async () => {
     pageNum.current.page = 1
-    setFiltrate({...filtrate, size:5})
+    setFiltrate({ ...filtrate, size: 5 })
     setHasMore(true)
     setRefresherTriggeredStatus(true)
   }
@@ -95,26 +97,85 @@ export default () => {
 
   //数据加载状态
   const statusMore = useMemo(() => {
-    return dataLoadingStatus({list:productData.list, total: productData.total, status: productState.loading})
+    return dataLoadingStatus({ list: productData.list, total: productData.total, status: productState.loading })
   }, [productData, productState.loading])
-  
+
+  useEffect(() => {
+    getShow()
+  }, [])
+  // const [time, setShow] = useState(false)
+  //拿状态存储的东西判断
+  const { adminUserInfo } = useSelector(state => state.userInfo);
+  const getShow = () => {
+    if (adminUserInfo?.authentication_status === 0 || adminUserInfo?.authentication_status === 1 || adminUserInfo?.authentication_status === 2 || adminUserInfo?.authentication_status === 3) {
+      //倒计时弹出去认证
+      const countTime: any = 60
+      //获取倒计时的变量
+      var time = parseInt(countTime);
+      const countDown = setInterval(() => {
+        if (time == 0) {
+          Taro.showModal({
+            title: '提示',
+            content: '你还未认证,认证后解锁更多功能',
+            cancelText: '稍后认证',
+            confirmText: '去认证',
+            success: function (res) {
+              if (res.confirm) {
+                Taro.navigateTo({ url: '/pages/certification/index' })
+              } else if (res.cancel) {
+                console.log('用户点击取消')
+              }
+            }
+          })
+          //清除定时器
+          clearInterval(countDown);
+        } else {
+          time--;
+        }
+      }, 1000)
+    }
+  }
+
+  //检查认证是否认证
+  const checkShow = () => {
+    if (adminUserInfo.authentication_status === 0 || adminUserInfo.authentication_status === 1 || adminUserInfo.authentication_status === 2 || adminUserInfo.authentication_status === 3) {
+      Taro.showModal({
+        title: '提示',
+        content: '你还未认证,认证后解锁更多功能',
+        cancelText: '稍后认证',
+        confirmText: '去认证',
+        success: function (res) {
+          if (res.confirm) {
+            Taro.navigateTo({ url: '/pages/certification/index' })
+          } else if (res.cancel) {
+            console.log('用户点击取消')
+          }
+        }
+      })
+    } else {
+      setShowShopCart(!showShopCart)
+    }
+
+  }
+
+
   return (
-    <MoveBtn onClick={() => setShowShopCart(!showShopCart)}>
+    <MoveBtn onClick={() => checkShow()}>
       <View className={styles.main}>
-        <Banner/>
+        <Banner />
         <View className={styles.search}>
           <View className={styles.search_collect}>我的收藏</View>
           <View className={styles.search_input} onClick={() => goLink('/pages/searchList/search')}>
-            <Search disabled={true} style={{width: '263rpx'}} />
+            <Search disabled={true} style={{ width: '263rpx' }} />
           </View>
         </View>
         <View className={styles.products}>
-            <SideBar list={kindData.list} height="100%" defaultValue={kindData.defaultId} hasMore={hasMore} statusMore={statusMore} selfOnScrolltolower={getScrolltolower} sideBarOnClick={getProductKindId} heightItem={150} refresherTriggered={refresherTriggeredStatus} selfOnRefresherRefresh={() => getRefresherRefresh()}>
-                <Product productList={productData.list}/>
-            </SideBar>
+          <SideBar list={kindData.list} height="100%" defaultValue={kindData.defaultId} hasMore={hasMore} statusMore={statusMore} selfOnScrolltolower={getScrolltolower} sideBarOnClick={getProductKindId} heightItem={150} refresherTriggered={refresherTriggeredStatus} selfOnRefresherRefresh={() => getRefresherRefresh()}>
+            <Product productList={productData.list} />
+          </SideBar>
         </View>
         <View className='common_safe_area_y'></View>
-        <ShopCart show={showShopCart} onClose={() => setShowShopCart(false)}/>
+        <ShopCart show={showShopCart} onClose={() => setShowShopCart(false)} />
       </View>
     </MoveBtn>
   )

src/pages/order/comfirm.module.scss

@@ -80,6 +80,9 @@
         box-sizing: border-box;
         padding-bottom: constant(safe-area-inset-bottom);
         padding-bottom: env(safe-area-inset-bottom);
+        .submit_order_number{
+            padding: 20px 0;
+        }
         .order_btn {
             width: 250px;
             height: 90px;

src/pages/order/comfirm.tsx

@@ -1,15 +1,12 @@
 import { SaleOrderPreViewApi, SaleOrderApi } from "@/api/order";
 import { formatPriceDiv } from "@/common/fotmat";
 import Popup from "@/components/popup";
-import SearchInput from "@/components/searchInput";
-import { Text, Textarea, View } from "@tarojs/components"
-import Taro, { useDidShow, useRouter } from "@tarojs/taro";
+import { View } from "@tarojs/components"
+import Taro, { useDidShow, usePullDownRefresh} from "@tarojs/taro";
 import classnames from "classnames";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import AddressInfo,{AddressInfoParam} from "./components/addressInfo";
-import EstimatedAmount from "./components/estimatedAmount";
+import AddressInfo from "./components/addressInfo";
 import KindList from "./components/kindList";
-import OrderState from "./components/orderState";
 import Remark from "./components/remark";
 import styles  from './comfirm.module.scss'
 import { getParam } from "@/common/system";
@@ -17,9 +14,9 @@ import useLogin from "@/use/useLogin";
 import { alert, goLink } from "@/common/common";
 import ShipmentMode from "../editOrder/components/shipmentMode";
 import SubmitOrderBtn from "./components/submitOrderBtn";
+import AddressInfoDetail from "./components/addressInfoDetail";
  
  export default () => {
-    const {checkLogin} = useLogin()
     
     const [showDesc, setShowDesc] = useState(false)
     //下单信息
@@ -57,8 +54,7 @@ import SubmitOrderBtn from "./components/submitOrderBtn";
         if(preViewOrder) {
             formatData()
             getDataList()
-            //当有默认地址时设置默认地址id
-            preViewOrder.default_address&&setSubmitOrderData((val) => ({...val, address_id:preViewOrder.default_address.id}))
+            setSubmitOrderData((val) => ({...val, address_id:preViewOrder.default_address.id, shipment_mode:preViewOrder.shipment_mode||2}))
         }
     }, [preViewOrder])
 
@@ -73,7 +69,9 @@ import SubmitOrderBtn from "./components/submitOrderBtn";
             total_number: preViewOrder.total_number, //总数量
             total_fabrics: preViewOrder.total_fabrics, //面料数量
             unit: preViewOrder.sale_mode == 0?'条':'m', //单位
-            list: preViewOrder.product_list
+            list: preViewOrder.product_list,
+            total_should_collect_money: preViewOrder.total_should_collect_money, //应收金额
+            total_sale_price: preViewOrder.total_sale_price //合计金额
         })
     }
     const formatPreViewOrderMemo = useMemo(() => {
@@ -83,18 +81,16 @@ import SubmitOrderBtn from "./components/submitOrderBtn";
     //格式化初始地址
     const defaultAddress = useMemo(() => {
         const address = preViewOrder?.default_address
-        if(address) {
-            return  {
-                province_name: address.province_name,
-                city_name: address.city_name,
-                district_name: address.district_name,
-                address_detail: address.address_detail,
-                id: address.id,
-                name: address.name,
-                phone: address.phone
-            }
+        return  {
+            province_name: address?.province_name,
+            city_name: address?.city_name,
+            district_name: address?.district_name,
+            address_detail: address?.address_detail,
+            id: address?.id,
+            name: address?.name,
+            phone: address?.phone,
+            shipment_mode: address?.shipment_mode
         }
-        return null
     }, [preViewOrder])
 
     //获取提交格式数据列表
@@ -125,24 +121,29 @@ import SubmitOrderBtn from "./components/submitOrderBtn";
 
     //提交按钮是否可用
     const btnStatus = useMemo(() => {
-        if(  submitOrderData?.list?.length == 0 || !submitOrderData?.shipment_mode || (submitOrderData?.shipment_mode == 2 && !submitOrderData?.address_id)) {
-            return false
-        } else {
-            return true
-        }
+        return  submitOrderData?.shipment_mode == 1 || (submitOrderData?.shipment_mode == 2 && submitOrderData?.address_id)
     }, [submitOrderData])
 
+    //数量格式
+    const numText = useMemo(() => {
+        if(formatPreViewOrder) {
+            let total_number = formatPreViewOrder?.sale_mode == 0?formatPreViewOrder?.total_number:(formatPreViewOrder?.total_number/100)
+            return `${formatPreViewOrder?.total_fabrics}种面料，${formatPreViewOrder?.total_colors}种颜色，共${total_number}${formatPreViewOrder?.unit}`
+        }
+    }, [formatPreViewOrder])
+
     //提交订单
     const {fetchData: saleOrderFetchData} = SaleOrderApi()
     const submitOrderEven =  () => {
-        if(!submitOrderData?.address_id) {
-            alert.error('请选择地址')
-            return false
-        }
         if(!submitOrderData?.shipment_mode) {
             alert.error('请选择收货方式')
             return false
         }
+        if(!submitOrderData?.address_id&&submitOrderData?.shipment_mode == 2) {
+            alert.error('请选择地址')
+            return false
+        }
+        
         Taro.showModal({
             title: '确定提交？',
             success: async function (res) {
@@ -159,10 +160,14 @@ import SubmitOrderBtn from "./components/submitOrderBtn";
             }
         })
     }
+
+    //页面下拉刷新
+    usePullDownRefresh(() => {
+        getSaleOrderPreView()
+    })
     return (
         <View className={styles.order_main}>
-            <ShipmentMode onSelect={selectShipmentMode}/>
-            <AddressInfo onSelect={(e) => getAddress(e)} defaultValue={defaultAddress}/>
+            <AddressInfoDetail orderInfo={defaultAddress}  onSelect={getAddress} onChangeShipmentMode={selectShipmentMode}  status={1}/>
             <KindList order={formatPreViewOrderMemo} comfirm={true}/>
             <View className={styles.order_desc} onClick={() => setShowDesc(true)}>
                 <View className={styles.order_desc_con}>订单备注</View>
@@ -174,8 +179,8 @@ import SubmitOrderBtn from "./components/submitOrderBtn";
             </View>
             <View className={styles.submit_order}>
                 <View className={styles.submit_order_number}>
-                    <SubmitOrderBtn style={{color:'#007AFF'}} number={formatPriceDiv(formatPreViewOrder?.estimate_amount)}/>    
-                    <View className={styles.order_number_desc}>{`${formatPreViewOrder?.total_fabrics}种面料，${formatPreViewOrder?.total_colors}种颜色，共${formatPreViewOrder?.total_number + formatPreViewOrder?.unit}`}</View>
+                    <SubmitOrderBtn style={{color:'#007AFF'}} number={formatPriceDiv(preViewOrder?.sale_mode == 1?formatPreViewOrder?.total_should_collect_money:formatPreViewOrder?.estimate_amount)} priceTitle={preViewOrder?.sale_mode == 1?'合计金额':'预估金额'}/>    
+                    <View className={styles.order_number_desc}>{numText}</View>
                 </View>
                 <View className={classnames(styles.order_btn, btnStatus&&styles.ok_order_btn)} onClick={() => submitOrderEven()}>提交订单</View>    
             </View>        

src/pages/order/components/addressInfoDetail/index copy.tsx

@@ -0,0 +1,163 @@
+import { EditSaleOrderAddressApi, EditSaleOrderShipmentModeApi } from "@/api/order";
+import { alert } from "@/common/common";
+import { ORDER_STATUS } from "@/common/enum";
+import { debounce } from "@/common/util";
+import AddressList from "@/components/AddressList";
+import Popup from "@/components/popup";
+import { Text, View } from "@tarojs/components"
+import classnames from "classnames";
+import { forwardRef, memo, useEffect, useImperativeHandle, useMemo, useState } from "react";
+import styles  from './index.module.scss'
+
+export type AddressInfoParam = {
+    province_name: string,
+    city_name: string,
+    district_name: string,
+    address_detail: string,
+    id?: number,
+    name: string,
+    phone: string,
+}
+type Param =  {
+    onSelect?: (val:any) => void, //选择地址
+    defaultValue?: AddressInfoParam|null, //默认值
+    disabled?: false|true, //true禁用后只用于展示
+    onChangeShipmentMode?: (val: number) => void, //返回收货方式
+    status?: 1|2, //1确认订单时使用， 2订单流程
+    orderInfo?: {
+        orderId: number //订单id
+        shipment_mode: 1|2, //1自提 2物流
+        status: number //订单状态
+    }
+}
+
+export default memo(forwardRef(({onSelect, onChangeShipmentMode, defaultValue = null, orderInfo, status = 2}: Param, ref) => {
+    const [showAddressList, setShowAddressList] = useState(false)
+
+    useEffect(() => {
+        setUserInfo(() => defaultValue)
+    }, [defaultValue])
+
+    const [userInfo, setUserInfo] = useState<any>()
+
+    //地址格式
+    const formatAddress = useMemo(() => {
+        if(userInfo) 
+            return userInfo.province_name + userInfo.city_name + userInfo.district_name + userInfo.address_detail
+    }, [userInfo])
+
+    const changeShow = () => {
+        if(receivingStatus == 2 && !logisticsShow)
+            setShowAddressList(() => true)
+    }
+    
+    useEffect(() => {
+        if(orderInfo)
+            setReceivingStatus(() => orderInfo.shipment_mode||2)
+    }, [orderInfo])
+
+    //把内部方法提供给外部
+    useImperativeHandle(ref, () => ({
+        changeShow
+    }))
+
+    //收货方法,1:自提，2物流
+    const [receivingStatus, setReceivingStatus] = useState(2)
+    const {fetchData: shipmentModeFetchData} = EditSaleOrderShipmentModeApi()
+    const onReceivingStatus = (value, e) => {
+        e.stopPropagation()
+        changeReceivingStatus(value)
+    }
+    const changeReceivingStatus = debounce(async (value) => {
+        if(!orderInfo) return false
+        if(status == 1) {
+            onChangeShipmentMode?.(value)
+            setReceivingStatus(value)
+            return false
+        }
+        alert.loading('正在修改')
+        const res = await shipmentModeFetchData({id: orderInfo.orderId, shipment_mode:value})
+        if(res.success) {
+            alert.success('收货方式修改成功')
+            onChangeShipmentMode?.(value)
+            setReceivingStatus(value)
+        } else {
+            alert.none(res.msg)
+        }
+    }, 10)
+
+    //修改地址
+    const [addressId, setAddressId] = useState(0)
+    const {fetchData: addressFetchData} = EditSaleOrderAddressApi()
+    const getAddress = async (value) => {
+        if(!orderInfo) return false
+        if(status == 1) {
+            setShowAddressList(() => false)
+            setAddressId(value.id)
+            setUserInfo(() => value)
+            return false
+        }
+        alert.loading('正在修改')
+        const res = await addressFetchData({id: orderInfo.orderId, address_id: value.id})
+        if(res.success) {
+            alert.success('地址修改成功')
+            onSelect?.(value)
+            setShowAddressList(() => false)
+            setAddressId(value.id)
+            setUserInfo(() => value)
+        } else {
+            alert.none(res.msg)
+        }
+    }
+
+    //订单状态 
+    const {
+        SaleOrderStatusWaitingReceipt,
+        SaleOrderStatusAlreadyReceipt,
+        SaleOrderStatusComplete,
+        SaleOrderStatusRefund,
+        SaleOrderStatusCancel
+    } = ORDER_STATUS
+
+    //根据订单状态判断是否显示物流
+    const logisticsShowList = [SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value]
+    const logisticsShow = useMemo(() => {
+        return logisticsShowList.includes(orderInfo?.status as number) 
+    }, [orderInfo])
+
+    return (
+        <View>
+            <View className={styles.order_address} onClick={() => changeShow()}>
+                <View className={classnames(styles.order_address_icon, 'iconfont', receivingStatus == 2?'icon-daohang':'icon-fahuo')}></View>
+                <View className={styles.order_address_text_con}>
+                    <View className={styles.order_address_text_title}>
+                        <Text className={styles.address_text}>{formatAddress}</Text>
+                        {(receivingStatus == 2 && !logisticsShow)&&<Text className={classnames(styles.moreIconfont,'iconfont icon-a-moreback')}></Text>}
+                    </View>
+                    <View className={styles.order_address_text_name}>
+                        <Text>{userInfo?.name}</Text>
+                        <Text>{userInfo?.phone}</Text>
+                    </View>
+                </View>
+                {!logisticsShow&&<View className={styles.updateBtn}>
+                    <View className={styles.updateBtn_list}>
+                        <View className={classnames(styles.updateBtn_item, receivingStatus==1&&styles.updateBtn_item_select)} onClick={(e) => onReceivingStatus(1,e)}>自提</View>
+                        <View className={classnames(styles.updateBtn_item, receivingStatus==2&&styles.updateBtn_item_select)} onClick={(e) => onReceivingStatus(2,e)}>物流</View>
+                    </View>
+                    <View style={{transform: receivingStatus==1?'translateX(0)':'translateX(100%)'}} className={classnames(styles.updateBtn_select)}></View>
+                </View>||
+                <View className={styles.logisticsBtn}>
+                    查看物流
+                </View>}
+            </View>
+            <Popup show={showAddressList} showTitle={false} onClose={() => setShowAddressList(false)}>
+                <View className={styles.order_address_list}>
+                    <View className={styles.order_address_title}>请选择收货地址</View>
+                    <View className={styles.addressList_con}>
+                        <AddressList onSelect={getAddress} id={addressId}/>
+                    </View>
+                </View>
+            </Popup>
+        </View>
+    )
+}))

src/pages/order/components/addressInfoDetail/index.module.scss

@@ -1,5 +1,4 @@
 .order_address{
-    height: 178px;
     background: #ffffff;
     border-radius: 20px;
     display: flex;
@@ -26,16 +25,23 @@
         .order_address_text_title{
             font-size: $font_size_medium;
             margin-top: 10px;
-            @include common_ellipsis;
             display: flex;
-            align-items: center;
             justify-content: space-between;
             .moreIconfont{
                 font-size: 20px;
+                padding-top: 10px;
+            }
+            .address_text{
+                word-break:break-all;
+                
+            }
+            .address_text_no{
+                font-weight: 700;
+                padding-left: 20px;
             }
         }
         .order_address_text_name{
-
+            margin-top: 30px;
             align-items: center;
             text{
                 &:nth-child(1) {
@@ -88,6 +94,21 @@
         }
         
     }
+    .logisticsBtn{
+        width: 152px;
+        height: 72px;
+        background: #ffffff;
+        border: 2px solid #dddddd;
+        border-radius: 38px;
+        position: absolute;
+        bottom: 10px; 
+        right: 10px;
+        z-index: 999;
+        font-size: 28px;
+        color: #707070;
+        text-align: center;
+        line-height: 72px;
+    }
     .order_address_text_no{
         flex: 1;
         font-size: $font_size;
@@ -101,12 +122,17 @@
    
 }
 .order_address_list {
-    height: 900px;
+    height:80vh;
     .order_address_title{
         font-size: $font_size;
         font-weight: 700;
         width: 100%;
         text-align: center;
         padding: 20px 0 30px 0;
+        height: 100px;
+    }
+    .addressList_con{
+        padding-bottom: 20px;
+        height: calc(100% - 160px);
     }
 }

src/pages/order/components/addressInfoDetail/index.tsx

@@ -1,11 +1,12 @@
 import { EditSaleOrderAddressApi, EditSaleOrderShipmentModeApi } from "@/api/order";
 import { alert } from "@/common/common";
+import { ORDER_STATUS } from "@/common/enum";
 import { debounce } from "@/common/util";
 import AddressList from "@/components/AddressList";
 import Popup from "@/components/popup";
 import { Text, View } from "@tarojs/components"
 import classnames from "classnames";
-import { forwardRef, memo, useCallback, useEffect, useImperativeHandle, useMemo, useState } from "react";
+import { forwardRef, memo, useEffect, useImperativeHandle, useMemo, useState } from "react";
 import styles  from './index.module.scss'
 
 export type AddressInfoParam = {
@@ -18,37 +19,48 @@ export type AddressInfoParam = {
     phone: string,
 }
 type Param =  {
-    onSelect?: (val:any) => void, //选择
-    defaultValue?: AddressInfoParam|null, //默认值
+    onSelect?: (val:any) => void, //选择地址
     disabled?: false|true, //true禁用后只用于展示
-    shipment_mode?: 1|2, //1自提 2物流
     onChangeShipmentMode?: (val: number) => void, //返回收货方式
-    orderId?: number //订单id
+    onLogistics?: () => void, //查看物流
+    status?: 1|2, //1确认订单时使用， 2订单流程
+    orderInfo?: {
+        id?: number //订单id
+        shipment_mode?: 1|2, //1自提 2物流
+        status?: number //订单状态
+        province_name: string,
+        city_name: string,
+        district_name: string,
+        address_detail: string
+    }
 }
 
-export default memo(forwardRef(({onSelect, onChangeShipmentMode, defaultValue = null, orderId = 0, shipment_mode = 1}: Param, ref) => {
-    const [showAddressList, setShowAddressList] = useState(false)
-
+export default memo(forwardRef(({onSelect, onChangeShipmentMode, orderInfo, status = 2, disabled = false, onLogistics}: Param, ref) => {
+    
+    const [addressInfo, setAddressInfo] = useState<any>()
     useEffect(() => {
-        setUserInfo(() => defaultValue)
-    }, [defaultValue])
+        if(orderInfo) {
+            setReceivingStatus(() => orderInfo.shipment_mode||2)
+            setAddressInfo(() => orderInfo)
+        }
+    }, [orderInfo])
 
-    const [userInfo, setUserInfo] = useState<any>()
 
     //地址格式
     const formatAddress = useMemo(() => {
-        if(userInfo) 
-            return userInfo.province_name + userInfo.city_name + userInfo.district_name + userInfo.address_detail
-    }, [userInfo])
+        if(addressInfo?.province_name)  {
+            return addressInfo.province_name + addressInfo.city_name + addressInfo.district_name + addressInfo.address_detail
+        } else {
+            return ''
+        }
+    }, [addressInfo])
 
+    //打开地址列表
+    const [showAddressList, setShowAddressList] = useState(false)
     const changeShow = () => {
-        if(receivingStatus == 2)
+        if(receivingStatus == 2 && !logisticsShow)
             setShowAddressList(() => true)
     }
-    
-    useEffect(() => {
-        setReceivingStatus(() => shipment_mode)
-    }, [shipment_mode])
 
     //把内部方法提供给外部
     useImperativeHandle(ref, () => ({
@@ -56,15 +68,21 @@ export default memo(forwardRef(({onSelect, onChangeShipmentMode, defaultValue =
     }))
 
     //收货方法,1:自提，2物流
-    const [receivingStatus, setReceivingStatus] = useState(1)
+    const [receivingStatus, setReceivingStatus] = useState(2)
     const {fetchData: shipmentModeFetchData} = EditSaleOrderShipmentModeApi()
     const onReceivingStatus = (value, e) => {
         e.stopPropagation()
         changeReceivingStatus(value)
     }
     const changeReceivingStatus = debounce(async (value) => {
+        if(!orderInfo) return false
+        if(status == 1) {
+            onChangeShipmentMode?.(value)
+            setReceivingStatus(value)
+            return false
+        }
         alert.loading('正在修改')
-        const res = await shipmentModeFetchData({id: orderId, shipment_mode:value})
+        const res = await shipmentModeFetchData({id: orderInfo.id, shipment_mode:value})
         if(res.success) {
             alert.success('收货方式修改成功')
             onChangeShipmentMode?.(value)
@@ -75,48 +93,79 @@ export default memo(forwardRef(({onSelect, onChangeShipmentMode, defaultValue =
     }, 10)
 
     //修改地址
+    const [addressId, setAddressId] = useState(0)
     const {fetchData: addressFetchData} = EditSaleOrderAddressApi()
     const getAddress = async (value) => {
+        if(!orderInfo) return false
+        if(status == 1) {
+            setShowAddressList(() => false)
+            setAddressId(value.id)
+            setAddressInfo(() => value)
+            onSelect?.(value)
+            return false
+        }
         alert.loading('正在修改')
-        const res = await addressFetchData({id: orderId, address_id: value.id})
+        const res = await addressFetchData({id: orderInfo.id, address_id: value.id})
         if(res.success) {
             alert.success('地址修改成功')
             onSelect?.(value)
             setShowAddressList(() => false)
-            setUserInfo(() => value)
+            setAddressId(value.id)
+            setAddressInfo(() => value)
         } else {
             alert.none(res.msg)
         }
     }
 
+    //订单状态 
+    const {
+        SaleOrderStatusWaitingReceipt,
+        SaleOrderStatusAlreadyReceipt,
+        SaleOrderStatusComplete,
+        SaleOrderStatusRefund,
+        SaleOrderStatusCancel,
+    } = ORDER_STATUS
+
+
+    //根据订单状态判断是否显示物流
+    const logisticsShowList = [SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value]
+    const logisticsShow = useMemo(() => {
+        console.log('aa:',orderInfo?.status)
+        return logisticsShowList.includes(orderInfo?.status as number) 
+    }, [orderInfo])
+
     return (
         <View>
             <View className={styles.order_address} onClick={() => changeShow()}>
                 <View className={classnames(styles.order_address_icon, 'iconfont', receivingStatus == 2?'icon-daohang':'icon-fahuo')}></View>
                 <View className={styles.order_address_text_con}>
                     <View className={styles.order_address_text_title}>
-                        <Text>{formatAddress}</Text>
-                        {(receivingStatus == 2)&&<Text className={classnames(styles.moreIconfont,'iconfont icon-a-moreback')}></Text>}
+                        <Text className={classnames(styles.address_text, styles.address_text_no)}>{formatAddress||'请选择收货地址及信息'}</Text>
+                        {(receivingStatus == 2 && !logisticsShow)&&<Text className={classnames(styles.moreIconfont,'iconfont icon-a-moreback')}></Text>}
                     </View>
                     <View className={styles.order_address_text_name}>
-                        <Text>{userInfo?.name}</Text>
-                        <Text>{userInfo?.phone}</Text>
+                        <Text>{addressInfo?.name}</Text>
+                        <Text>{addressInfo?.phone}</Text>
                     </View>
                 </View>
-                <View className={styles.updateBtn}>
+                {!logisticsShow&&<View className={styles.updateBtn}>
                     <View className={styles.updateBtn_list}>
                         <View className={classnames(styles.updateBtn_item, receivingStatus==1&&styles.updateBtn_item_select)} onClick={(e) => onReceivingStatus(1,e)}>自提</View>
                         <View className={classnames(styles.updateBtn_item, receivingStatus==2&&styles.updateBtn_item_select)} onClick={(e) => onReceivingStatus(2,e)}>物流</View>
                     </View>
                     <View style={{transform: receivingStatus==1?'translateX(0)':'translateX(100%)'}} className={classnames(styles.updateBtn_select)}></View>
-                </View>
+                </View>||
+                <View className={styles.logisticsBtn} onClick={onLogistics}>
+                    查看物流
+                </View>}
             </View>
             <Popup show={showAddressList} showTitle={false} onClose={() => setShowAddressList(false)}>
                 <View className={styles.order_address_list}>
                     <View className={styles.order_address_title}>请选择收货地址</View>
-                    <AddressList onSelect={getAddress}/>
+                    <View className={styles.addressList_con}>
+                        <AddressList onSelect={getAddress} id={addressId}/>
+                    </View>
                 </View>
-                <View className="common_safe_area_y"></View>
             </Popup>
         </View>
     )

src/pages/order/components/applyAfterSales/index.module.scss

@@ -1,176 +0,0 @@
-
-.apply_after_sales_main{
-    .apply_after_sales_head{
-        font-size: 30px;
-        text-align: center;
-        padding: 20px 0;
-        font-weight: 700;
-    }
-    .kind_number{
-        width: 100%;
-        padding:  20px;
-        box-sizing: border-box;
-        text{
-            background-color: #F6F6F6;
-            border-radius: 10px;
-            font-size: $font_size_medium;
-            padding: 5px 0;
-            text-align: center;
-            width: 100%;
-            display: block;
-            color: $color_font_three;
-        }
-    }
-    .apply_after_sales_con{
-        height: 80vh;
-        .scroll{
-            height: calc(100% - 80px);
-        }
-        .returnSaleInput{
-            margin: 0 20px;
-            padding-top: 30px;
-            border-top: 1px solid #F6F6F6;
-            .returnSaleInput_item{
-                display: flex;
-                align-items: center;
-                padding-bottom: 20px;
-                .title{
-                    font-size: $font_size;
-                    font-weight: 700;
-                }
-                .select{
-                    flex:1;
-                    height: 60px;
-                    border: 2px solid #e6e6e6;
-                    border-radius: 10px;
-                    margin-left: 20px;
-                    display: flex;
-                    align-items: center;
-                    justify-content: space-between;
-                    padding: 0 20px;
-                    font-size: 26px;
-                    color: $color_font_two;
-                    .miconfont{
-                        font-size: 30px;
-                    }
-                }
-                
-                .uploadImg{
-                    width: 202px;
-                    height: 150px;
-                    background: #f0f0f0;
-                    border: 2px dashed #cccccc;
-                    margin-left: 20px;
-                    border-radius: 10px;
-                    display: flex;
-                    flex-direction: column;
-                    justify-content: center;
-                    align-items: center;
-                    position: relative;
-                    .miconfont{
-                        font-size: 50px;
-                    }
-                    .uploadText{
-                        font-size: 26px;
-                        color: $color_font_three;
-                    }
-
-                }
-            }
-        }
-        .other_desc{
-            padding: 0 20px;
-            box-sizing: border-box;
-            .title{
-                font-size: $font_size;
-                font-weight: 700;
-            }
-            .uploadImg{
-                position: relative;
-                .descDataNum{
-                    position: absolute;
-                    right: 10px;
-                    bottom: 10px;
-                    font-size: 22px;
-                    color: #ABABAB;
-                }
-            }
-            Textarea{
-                background-color: #f3f3f3;
-                border: 2px solid #e6e6e6;
-                border-radius: 10px;
-                width: 100%;
-                font-size: 25px;
-                height: 165.4px;
-                padding: 20px 20px 30px 20px;
-                box-sizing: border-box;
-                margin-top: 20px;
-            }
-        }
-    }
-    .apply_after_sales_list{
-        padding: 0 20px;
-        .apply_after_sales_item{
-            margin-bottom: 30px;
-            .apply_after_sales_title{
-                display: flex;
-                align-items: center;
-                .tag{
-                    font-size: $font_size_min;
-                    background-color: #CDE5FF;
-                    padding: 5px 10px;
-                    border-radius: 6px;
-                    color: $color_main;
-                }
-                .title{
-                    font-weight: 700;
-                    font-size: $font_size;
-                    margin-left: 20px;
-                    flex:1;
-                }
-            }
-            .color_list {
-                .color_item{
-                    display: flex;
-                    align-items: center;
-                    margin: 20px 0;
-                }
-                .image{
-                    width: 70px;
-                    height: 70px;
-                    image{
-                        width: 100%;
-                        height: 100%;
-                        border-radius: 50%;
-                    }
-                }
-                .name_and_number{
-                    padding-left: 30px;
-                    flex:1;
-                    text{
-                        &:nth-child(1) {
-                            font-weight: 700;
-                            font-size: $font_size;
-                        }
-                        &:nth-child(2) {
-                            color: $color_font_two;
-                            font-size: $font_size;
-                            margin-left: 20px;
-                        }
-                    }
-                }
-                .btn_count{
-                    width: 235px;
-                    height: 64px;
-                    background-color: #ECF5FF;
-                    border-radius: 40px 0px 16px 0px;
-                    padding: 0 20px;
-                    display: flex;
-                    align-items: center;
-                }
-            }
-        }
-        
-    }
-}
-

src/pages/order/components/applyAfterSales/index.tsx

@@ -1,108 +0,0 @@
-import { Image, ScrollView, Text, Textarea, View } from "@tarojs/components";
-import { memo, useState } from "react";
-import classnames from "classnames";
-import styles  from './index.module.scss'
-import Popup from "@/components/popup";
-import { formatImgUrl } from "@/common/fotmat";
-import Counter from "@/components/counter";
-
-export default memo(() => {
-    const [showDesc, setShowDesc] = useState(true)
-    return (
-        <View className={styles.apply_after_sales_main}>
-            <Popup showIconButton={true} show={showDesc} showTitle={false} onClose={() => setShowDesc(false)} >
-                <View className={styles.apply_after_sales_con}>
-                    <View className={styles.apply_after_sales_head}>申请退货</View>
-                    <View className={styles.kind_number}><Text>2种面料，3种颜色，共6条</Text></View>
-                    <ScrollView scrollY className={styles.scroll}>
-                        <View className={styles.apply_after_sales_list}>
-                            <View className={styles.apply_after_sales_item}>
-                                <View className={styles.apply_after_sales_title}>
-                                    <View className={styles.tag}>大货</View>
-                                    <View className={styles.title}>0770# 21S单面平纹(食毛)</View>
-                                </View>
-                                <View className={styles.color_list}>
-                                    <View className={styles.color_item}>
-                                        <View className={styles.image}><Image src={formatImgUrl('')}/></View>
-                                        <View className={styles.name_and_number}><Text>1# 薄荷绿</Text><Text>x1</Text></View>
-                                        <View className={styles.btn_count}>
-                                            <Counter/>
-                                        </View>
-                                    </View>
-                                    <View className={styles.color_item}>
-                                        <View className={styles.image}><Image src={formatImgUrl('')}/></View>
-                                        <View className={styles.name_and_number}><Text>1# 薄荷绿</Text><Text>x1</Text></View>
-                                        <View className={styles.btn_count}>
-                                            <Counter/>
-                                        </View>
-                                    </View>
-                                </View>
-                            </View>
-                            <View className={styles.apply_after_sales_item}>
-                                <View className={styles.apply_after_sales_title}>
-                                    <View className={styles.tag}>大货</View>
-                                    <View className={styles.title}>0770# 21S单面平纹(食毛)</View>
-                                </View>
-                                <View className={styles.color_list}>
-                                    <View className={styles.color_item}>
-                                        <View className={styles.image}><Image src={formatImgUrl('')}/></View>
-                                        <View className={styles.name_and_number}><Text>1# 薄荷绿</Text><Text>x1</Text></View>
-                                        <View className={styles.btn_count}>
-                                            <Counter/>
-                                        </View>
-                                    </View>
-                                    <View className={styles.color_item}>
-                                        <View className={styles.image}><Image src={formatImgUrl('')}/></View>
-                                        <View className={styles.name_and_number}><Text>1# 薄荷绿</Text><Text>x1</Text></View>
-                                        <View className={styles.btn_count}>
-                                            <Counter/>
-                                        </View>
-                                    </View>
-                                </View>
-                            </View>
-                        </View>
-                        <View className={styles.returnSaleInput}>
-                            <View className={styles.returnSaleInput_item}>
-                                <View className={styles.title}>退货原因</View>
-                                <View className={styles.select}>
-                                    <Text>请选择</Text>
-                                    <Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
-                                </View>
-                            </View>
-                            <View className={styles.returnSaleInput_item}>
-                                <View className={styles.title}>货物状况</View>
-                                <View className={styles.select}>
-                                    <Text>请选择</Text>
-                                    <Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
-                                </View>
-                            </View>
-                            <View className={styles.returnSaleInput_item}>
-                                <View className={styles.title}>退货说明</View>
-                                <View className={styles.select}>
-                                    <Text>请选择</Text>
-                                    <Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
-                                </View>
-                            </View>
-                            <View className={styles.returnSaleInput_item}>
-                                <View className={styles.title}>拍照上传</View>
-                                <View className={styles.uploadImg}>
-                                    <Text className={classnames(styles.miconfont, 'iconfont icon-saomazhifu')}></Text>
-                                    <Text className={styles.uploadText}>上传照片</Text>
-                                </View>
-                            </View>
-                            
-                        </View>
-                        <View className={styles.other_desc}>
-                            <View className={styles.title}>其他说明</View>
-                            <View className={styles.uploadImg}>
-                                <Textarea placeholder="一般情况下选填，当退货说明=“其它问题”时，必填" cursorSpacing={100}></Textarea>
-                                <View className={styles.descDataNum}>0/100</View>
-                            </View>
-                        </View>
-                        <View className="common_safe_area_y"></View>
-                    </ScrollView>
-                </View>
-            </Popup>
-        </View>
-    )
-})

src/pages/order/components/applyRefund/index.module.scss

@@ -0,0 +1,66 @@
+
+.apply_after_sales_con{
+    padding: 20px;
+    .returnSaleInput_item{
+        display: flex;
+        align-items: center;
+        padding-bottom: 50px;
+        flex-wrap: wrap;
+        .title{
+            font-size: $font_size;
+            font-weight: 700;
+            width: 119px;
+        }
+        .select{
+            flex:1;
+            height: 60px;
+            border: 2px solid #e6e6e6;
+            border-radius: 10px;
+            margin-left: 20px;
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            padding: 0 20px;
+            font-size: 26px;
+            color: $color_font_two;
+            .miconfont{
+                font-size: 30px;
+            }
+        }
+        .upload_image{
+            flex:1;
+        }
+    }
+    .btns_con{
+        width: 100%;
+        bottom:0;
+        box-sizing: border-box;
+        margin-top: 50px;
+        .btns_two{
+            display: flex;
+            height: 82px;
+            // border: 1PX solid #007aff;
+            font-size: $font_size_big;
+            border-radius: 40px;
+            margin-bottom: 20px;
+            .rest_btn{
+                flex:1;
+                border: 1PX solid #007aff;
+                border-radius: 40px 0 0 40px;
+                text-align: center;
+                line-height: 82px;
+                color: $color_main;
+                background-color: #fff;
+                
+            }
+            .verify_btn{
+                flex:1;
+                border-radius: 0 40px 40px 0;
+                background: #007aff;
+                text-align: center;
+                line-height: 82px;
+                color: #fff;
+            }
+        }
+    }
+}

src/pages/order/components/applyRefund/index.tsx

@@ -0,0 +1,57 @@
+import Popup from "@/components/popup";
+import TextareaEnhance from "@/components/textareaEnhance";
+import { ScrollView, Text, View } from "@tarojs/components";
+import { memo, useCallback, useState } from "react";
+import ReasonPopup from "../reasonPopup";
+import styles  from './index.module.scss'
+import classnames from "classnames";
+
+type Param = {
+    show?: true|false,
+    onClose?: () => void
+}
+export default memo(({show, onClose}:Param) => {
+
+    
+    const getOtherReason = useCallback(() => {
+
+    }, [])
+
+    const onSubmit = (val) => {
+
+    }
+
+    //显示说明
+    const [showReason, setShowReason] = useState(false)
+    const closeReason = useCallback(() => {
+        setShowReason(false)
+    }, [])
+
+    const onShowReason = () => {
+        setShowReason(true)
+    }
+
+    return (
+        <>
+            <Popup show={show} title="申请退款" onClose={onClose} >
+                <View className={styles.apply_after_sales_con}>
+                    <View className={styles.returnSaleInput_item}>
+                        <View className={styles.title}>退款说明</View>
+                        <View className={styles.select} onClick={() => onShowReason()}>
+                            <Text>请选择</Text>
+                            <Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
+                        </View>
+                    </View>
+                    <TextareaEnhance onChange={getOtherReason} title='备注' placeholder="请输入退款备注"/>
+                    <View  className={styles.btns_con}>
+                        <View  className={styles.btns_two}>
+                            <View  className={styles.rest_btn} onClick={() => onSubmit(1)}>取消</View>
+                            <View  className={styles.verify_btn } onClick={() => onSubmit(2)}>确认</View>
+                        </View >
+                    </View>
+                </View>
+            </Popup>
+            <ReasonPopup show={showReason} onClose={closeReason} /> 
+        </>
+    )
+})

src/pages/order/components/kindList/index copy.tsx

@@ -0,0 +1,190 @@
+import { ORDER_STATUS } from "@/common/enum"
+import { formatHashTag, formatPriceDiv } from "@/common/fotmat"
+import LabAndImg from "@/components/LabAndImg"
+import { View } from "@tarojs/components"
+import { memo, useCallback, useMemo } from "react"
+import EstimatedAmount from "../estimatedAmount"
+import styles  from './index.module.scss'
+
+type OrderParam = {
+    estimate_amount: number, //预估金额
+    list: any[], 
+    sale_mode: number,
+    sale_mode_name: string,
+    unit: string,
+    total_colors: number,
+    total_fabrics: number,
+    total_number: number,
+    status: number, //订单状态
+    total_sale_price: number, //销售金额
+    total_should_collect_money: number, //应收金额
+    total_weight_error_discount: number, //空差优惠
+    the_previous_status: number, //取消订单时的订单状态
+    actual_amount: number //实付金额
+}
+
+type Param = {
+    order: OrderParam, 
+    comfirm?: boolean //是否是确认订单页面使用
+}
+
+export default memo(({order, comfirm = false}:Param) => {
+    //对应数量
+    const formatCount = useCallback((item) => {
+        return order?.sale_mode == 0? item.roll : Number(item.length / 100)
+    }, [order])
+    //对应单价
+    const standardPrice = useCallback(price => {
+        return formatPriceDiv(price).toLocaleString() + '/' + (order?.sale_mode == 1?'m':'kg')
+    }, [order])
+
+    //数量格式
+    const numText = useMemo(() => {
+        if(order) {
+            let total_number = order?.sale_mode == 0?order?.total_number:(order?.total_number/100)
+            return `${order?.total_fabrics}种面料，${order?.total_colors}种颜色，共${total_number}${order?.unit}`
+        }
+    }, [order])
+
+    const {
+        SaleOrderStatusBooking, // 待接单
+        SaleOrderStatusArranging, // 配布中
+        SaleOrderStatusArranged, // 已配布
+        SaleOrderStatusWaitingPayment, // 待付款
+        SaleOrderStatusWaitingDelivery, // 待发货
+        SaleOrderStatusWaitingReceipt, // 待收货
+        SaleOrderStatusAlreadyReceipt, // 已收货
+        SaleOrderStatusComplete, // 已完成
+        SaleOrderStatusRefund, // 已退款
+        SaleOrderStatusCancel, // 已取消
+        SaleorderstatusWaitingPrePayment // 预付款
+    } = ORDER_STATUS
+
+    //金额列表枚举
+    const priceList = [
+        {
+            id:1,
+            value:[SaleorderstatusWaitingPrePayment.value, SaleOrderStatusBooking.value, SaleOrderStatusArranging.value, ],
+            label:'预估金额',
+            field: 'estimate_amount'
+        },
+        {
+            id:2,
+            value:[SaleorderstatusWaitingPrePayment.value, SaleOrderStatusArranged.value, SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value],
+            label:'合计金额',
+            field: 'total_sale_price'
+        },
+        {
+            id:3,
+            value:[SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value],
+            label:'空差优惠',
+            field: 'total_weight_error_discount'
+        },
+        {
+            id:4,
+            value:[ SaleOrderStatusWaitingPayment.value],
+            label:'应付金额',
+            field: 'total_should_collect_money'
+        },
+        {
+            id:5,
+            value:[SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value],
+            label:'实付金额',
+            field: 'actual_amount'
+        }
+    ]   
+
+    //是否显示价格
+    const showPrice = useCallback((priceInfo, status) => {
+        return priceInfo.value.includes(status)
+    }, [order])
+
+    //金额展示大货
+    const priceConDom = useMemo(() => {
+        if(!order) return
+        if(comfirm == true) {
+            //确认订单时
+            return  <EstimatedAmount  number={formatPriceDiv(order.estimate_amount)} title="预估金额" />
+        }
+
+        if(order?.status == SaleOrderStatusCancel.value) {
+            //订单状态为取消订单时
+            return (
+                <>
+                    {
+                        priceList.map(item => {
+                          return <>{showPrice(item, order?.the_previous_status)&&<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field])} title={item.label} />}</>
+                        })
+                    }
+                </>
+            )
+        } else {
+            //其他订单状态
+            return (
+                <>
+                    {
+                        priceList.map(item => {
+                          return <>{showPrice(item, order?.status)&&<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field])} title={item.label} />}</>
+                        })
+                    }
+                </>
+            )
+        }   
+    }, [order])
+
+    //金额展示剪板
+    const cutPriceConDom = useMemo(() => {
+        if(!order) return
+        return <EstimatedAmount  number={formatPriceDiv(order.total_should_collect_money)} title="合计金额" />
+    }, [order])
+
+    const showPriceAll = useMemo(() => {
+        if(order?.sale_mode == 1) {
+            return  cutPriceConDom //剪板
+        } else {
+            return  priceConDom //大货
+        }
+    }, [order])
+
+    
+    return (
+        <>
+            <View className={styles.orders_list_title}>{numText}</View>
+            <View className={styles.orders_list_con}>
+                {
+                    order?.list?.map(item => {
+                        return <View key={item.product_code} className={styles.order_list}>
+                            <View className={styles.order_list_title}>
+                                <View className={styles.tag}>{order.sale_mode_name}</View>
+                                <View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
+                                <View className={styles.num}>共{item?.product_colors.length}种</View>
+                            </View>
+                            <View className={styles.order_list_scroll}>
+                                {item?.product_colors?.map(colorItem => {
+                                    return <View key={colorItem.id} className={styles.order_list_item}>
+                                        <View className={styles.order_list_item_img}>
+                                            <LabAndImg value={{lab:item.lab,rgb:item.rgb,texture_url:item.texture_url}}/>
+                                        </View>
+                                        <View className={styles.order_list_item_con}>
+                                            <View className={styles.order_list_item_des}>
+                                                <View className={styles.order_list_item_title}>{colorItem.code + ' ' + colorItem.name}</View>
+                                                <View className={styles.order_list_item_price}>¥{standardPrice(colorItem.sale_price)}</View>
+                                            </View>
+                                            <View className={styles.order_list_item_count}>
+                                                <View className={styles.count_num}>×{formatCount(colorItem)}<text>{order.unit}</text></View>
+                                                <View className={styles.count_price}><text>¥</text>{formatPriceDiv(colorItem.estimate_amount).toLocaleString()}</View>
+                                            </View>
+                                        </View>
+                                    </View>
+                                })}
+                            </View>
+                        </View>
+                    })
+                }
+                <View className={styles.order_estimated_amount}>
+                    {showPriceAll}     
+                </View>
+            </View>
+        </>
+    )
+})

src/pages/order/components/kindList/index.module.scss

@@ -40,14 +40,13 @@
         
         .order_list_item {
             display: flex;
-            &:nth-child(2) {
+            &:nth-child(n + 2) {
                 margin-top: 30px;
             }
             .order_list_item_img{
                 width: 126px;
                 height: 126px;
                 border-radius: 20px;
-                background-color: red;
             }
             .order_list_item_con{
                 display: flex;
@@ -67,9 +66,14 @@
                     font-size: $font_size;
                     margin-bottom: 15px;
                 }
-                .order_list_item_price{
+                .order_list_item_price, .order_list_item_price_dg{
                     font-size: 26px;
                     color: $color_font_three;
+                    display: flex;
+                    align-items: center;
+                    Text{
+                        padding-left: 13px;
+                    }
                 }
             }
             .order_list_item_count{

src/pages/order/components/kindList/index.tsx

@@ -1,6 +1,7 @@
 import { ORDER_STATUS } from "@/common/enum"
-import { formatHashTag, formatPriceDiv } from "@/common/fotmat"
-import { View } from "@tarojs/components"
+import { formatHashTag, formatPriceDiv, formatWeightDiv } from "@/common/fotmat"
+import LabAndImg from "@/components/LabAndImg"
+import { Text, View } from "@tarojs/components"
 import { memo, useCallback, useMemo } from "react"
 import EstimatedAmount from "../estimatedAmount"
 import styles  from './index.module.scss'
@@ -15,7 +16,7 @@ type OrderParam = {
     total_fabrics: number,
     total_number: number,
     status: number, //订单状态
-    total_sale_price: number, //销售金额
+    total_sale_price: number, //合计金额
     total_should_collect_money: number, //应收金额
     total_weight_error_discount: number, //空差优惠
     the_previous_status: number, //取消订单时的订单状态
@@ -23,7 +24,7 @@ type OrderParam = {
 }
 
 type Param = {
-    order: OrderParam,
+    order: OrderParam, 
     comfirm?: boolean //是否是确认订单页面使用
 }
 
@@ -39,8 +40,10 @@ export default memo(({order, comfirm = false}:Param) => {
 
     //数量格式
     const numText = useMemo(() => {
-        if(order)
-            return `${order?.total_fabrics}种面料，${order?.total_colors}种颜色，共${order?.total_number}${order?.unit}`
+        if(order) {
+            let total_number = order?.sale_mode == 0?order?.total_number:(order?.total_number/100)
+            return `${order?.total_fabrics}种面料，${order?.total_colors}种颜色，共${total_number}${order?.unit}`
+        }
     }, [order])
 
     const {
@@ -54,19 +57,21 @@ export default memo(({order, comfirm = false}:Param) => {
         SaleOrderStatusComplete, // 已完成
         SaleOrderStatusRefund, // 已退款
         SaleOrderStatusCancel, // 已取消
+        SaleorderstatusWaitingPrePayment, // 预付款
+        SaleOrderStatusTaking //提货
     } = ORDER_STATUS
 
     //金额列表枚举
     const priceList = [
         {
             id:1,
-            value:[SaleOrderStatusBooking.value, SaleOrderStatusArranging.value],
+            value:[SaleorderstatusWaitingPrePayment.value, SaleOrderStatusBooking.value, SaleOrderStatusArranging.value],
             label:'预估金额',
             field: 'estimate_amount'
         },
         {
             id:2,
-            value:[SaleOrderStatusArranged.value, SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value],
+            value:[SaleOrderStatusTaking.value, SaleOrderStatusArranged.value, SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value],
             label:'合计金额',
             field: 'total_sale_price'
         },
@@ -84,45 +89,60 @@ export default memo(({order, comfirm = false}:Param) => {
         },
         {
             id:5,
-            value:[SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value],
+            value:[SaleOrderStatusTaking.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value],
             label:'实付金额',
             field: 'actual_amount'
         }
     ]   
 
-    //是否显示价格
-    const showPrice = useCallback((priceInfo, status) => {
-        return priceInfo.value.includes(status)
-    }, [order])
+    //订单流程是否显示价格
+    const showPrice = (item) => {
+        if (item.id == 2) {
+            //合计金额 (剪板特殊请情况)
+            return (item.value.includes(order.status)|| order.sale_mode == 1)
+        } else if (item.id == 3) {
+            //空差优惠只有大货才有
+            return (item.value.includes(order.status) && order.sale_mode == 1 )
+        } else {
+            return (item.value.includes(order.status) && order.sale_mode != 1 )
+        }
+       
+    }
 
+    //订单流程金额展示
     const priceConDom = useMemo(() => {
         if(!order) return
-        //确认订单
-        if(comfirm == true) {
-            return <EstimatedAmount  number={formatPriceDiv(order.estimate_amount)} title="预估金额" />
-        } 
-        //订单为取消订单状态
-        if(order?.status == SaleOrderStatusCancel.value) {
-            return (
-                <>
-                    {
-                        priceList.map(item => {
-                          return <>{showPrice(item, order?.the_previous_status)&&<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field])} title={item.label} />}</>
-                        })
-                    }
-                </>
-            )
-        } else {
-            return (
-                <>
-                    {
-                        priceList.map(item => {
-                          return <>{showPrice(item, order?.status)&&<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field])} title={item.label} />}</>
-                        })
-                    }
-                </>
-            )
-        }   
+        return (
+            <>
+                {
+                    priceList.map(item => {
+                      return <>{showPrice(item)&&<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field])} title={item.label} />}</>
+                    })
+                }
+            </>
+        ) 
+    }, [order])
+
+    //确认订单金额展示
+    const comfirmPriceConDom = useMemo(() => {
+        if(!order) return
+        let item =  order.sale_mode == 1?priceList[1]:priceList[0]
+        return<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field])} title={item.label} />
+    }, [order])
+
+    //金额展示
+    const showPriceConDom = useMemo(() => {
+        return comfirm?comfirmPriceConDom:priceConDom
+    }, [order])
+
+
+    //散剪大约重量
+    const aboutWeight = useCallback((weight) => {
+        if(order.sale_mode == 2 ) {
+            let showWeight = [SaleorderstatusWaitingPrePayment.value, SaleOrderStatusBooking.value, SaleOrderStatusArranging.value].includes(order.status)
+            return  showWeight?<View className={styles.order_list_item_price_dg}>; <Text>≈{formatWeightDiv(weight)}kg</Text></View>:<></>
+        }
+        return <></>
     }, [order])
     
     return (
@@ -140,11 +160,17 @@ export default memo(({order, comfirm = false}:Param) => {
                             <View className={styles.order_list_scroll}>
                                 {item?.product_colors?.map(colorItem => {
                                     return <View key={colorItem.id} className={styles.order_list_item}>
-                                        <View className={styles.order_list_item_img}></View>
+                                        <View className={styles.order_list_item_img}>
+                                            <LabAndImg value={{lab:item.lab,rgb:item.rgb,texture_url:item.texture_url}}/>
+                                        </View>
                                         <View className={styles.order_list_item_con}>
                                             <View className={styles.order_list_item_des}>
                                                 <View className={styles.order_list_item_title}>{colorItem.code + ' ' + colorItem.name}</View>
-                                                <View className={styles.order_list_item_price}>¥{standardPrice(colorItem.sale_price)}</View>
+                                                <View className={styles.order_list_item_price}>
+                                                    ¥{standardPrice(colorItem.sale_price)}
+                                                    {aboutWeight(colorItem.estimate_weight)}
+                                                </View>
+                                                
                                             </View>
                                             <View className={styles.order_list_item_count}>
                                                 <View className={styles.count_num}>×{formatCount(colorItem)}<text>{order.unit}</text></View>
@@ -158,7 +184,7 @@ export default memo(({order, comfirm = false}:Param) => {
                     })
                 }
                 <View className={styles.order_estimated_amount}>
-                    {priceConDom}     
+                    {showPriceConDom}     
                 </View>
             </View>
         </>

src/pages/order/components/orderState/index.module.scss

@@ -15,7 +15,6 @@
     }
     .order_status_item{
         position: relative;
-        padding-left: 50px;
         &:nth-last-child(n+2) {
             padding-bottom: 30px;
         }
@@ -44,6 +43,7 @@
         .order_status_content{
             display: flex;
             align-items: center;
+            padding: 0 30px;
             .order_status_title{
                 color: $color_font_two;
                 font-size: $font_size;
@@ -75,6 +75,24 @@
         .order_status_des_select{
             color: $color_font_one;
         }
+        .pay_time{
+            height: 56px;
+            background: #f6f6f6;
+            border-radius: 20px;
+            color: #3C3C3C;
+            font-size: 24px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-weight: 700;
+            margin-top: 20px;
+            text{
+                font-size: 28px;
+                color: $color_main;
+                padding: 0 10px;
+                
+            }
+        }
     }
     .more{
         width: 100%;
@@ -102,4 +120,20 @@
         top: -10px;
         right: -10px;
     }
+    .refresh{
+        position: absolute;
+        top: 23px;
+        right: 20px;
+        display: flex;
+        color: #707070;
+        display: flex;
+        align-items: center;
+        
+        .mconfont{
+            font-size: 30px;
+        }
+        .refresh_text{
+            font-size: 23px;
+        }
+    }
 }

src/pages/order/components/orderState/index.tsx

@@ -1,42 +1,59 @@
 import { Image, Text, View } from "@tarojs/components"
-import { memo, useMemo, useState } from "react"
+import { memo, useEffect, useMemo, useRef, useState } from "react"
 import styles  from './index.module.scss'
 import classnames from "classnames";
 import { formatDateTime, formatImgUrl } from "@/common/fotmat";
-import { PAYMENT_METHOD, PAYMENT_METHOD_PARAM } from "@/common/enum";
+import { ORDER_STATUS, PAYMENT_METHOD, PAYMENT_METHOD_PARAM } from "@/common/enum";
+import * as dayjs from 'dayjs'
 
-
-
-type Param = {
-    list: {
-        status: string,
-        time: string,
-        tag: string,
-        desc: string
-    }[],
-    payment_method: 0|PAYMENT_METHOD_PARAM,
-    
+type List = {
+    status: string,
+    time: string,
+    tag: string,
+    desc: string,
+    expire_time: string
 }
 
-//支付方式枚举
-const {
-    PaymentMethodAccountPeriod,
-    PaymentMethodCashOnDelivery,
-} = PAYMENT_METHOD
+type Param = {
+    onRefresh?: () => void,
+    orderInfo?: {
+        logistics_details:List[], //订单状态列表
+        payment_method: 0|PAYMENT_METHOD_PARAM, //支付方式
+        status: number, //订单状态
+    }
+}
 
-export default memo(({list = [], payment_method = 0}:Param) => {
+
+
+export default memo(({orderInfo = {logistics_details: [],payment_method: 0, status: 0}, onRefresh}:Param) => {
     
     const [showMore, setShowMore] = useState(false)
     const changeMore = () => {
         setShowMore(() => !showMore)
     }
     const dataList = useMemo(() => {
-        return list.reverse()
-    }, [list])
+        return orderInfo.logistics_details?orderInfo?.logistics_details.reverse():[]
+    }, [orderInfo.logistics_details])
 
+    //订单状态枚举
+    const {SaleorderstatusWaitingPrePayment} = ORDER_STATUS
+
+    //支付方式枚举
+    const {
+        PaymentMethodAccountPeriod,
+        PaymentMethodCashOnDelivery,
+    } = PAYMENT_METHOD
+
+    //获取预付款最后时间
+    const endTime = useMemo(() => {
+        if(orderInfo.status == SaleorderstatusWaitingPrePayment.value && orderInfo.logistics_details.length > 0) {
+            return orderInfo.logistics_details[0].expire_time
+        } 
+        return ''
+    }, [orderInfo])
     return (
         <>
-            {(dataList.length > 0)&&<View className={styles.order_flow_state}>
+            {(dataList?.length > 0)&&<View className={styles.order_flow_state}>
                 <View className={classnames(styles.order_status_list, showMore&&styles.order_status_list_show)}>
                     {dataList.map((item, index) => <View className={styles.order_status_item}>
                         {(dataList.length > 1)&&<View className={classnames(styles.order_status_tail, (index == 0)&&styles.order_status_tail_end)}></View>}
@@ -44,9 +61,9 @@ export default memo(({list = [], payment_method = 0}:Param) => {
                         <View className={styles.order_status_content}>
                             <View className={classnames(styles.order_status_title, (index == 0)&&styles.order_status_select)}>{item.status}</View>
                             <View className={classnames(styles.order_status_time, (index == 0)&&styles.order_status_select)}>{formatDateTime(item.time)}</View>
-                            {/* <View className={classnames(styles.order_status_tag, (index == 0)&&styles.order_status_tag_select)}>{item.tag}</View> */}
                         </View>
                         <Text className={classnames(styles.order_status_des, (index == 0)&&styles.order_status_des_select)}>{item.desc}</Text>
+                        {(orderInfo.status == SaleorderstatusWaitingPrePayment.value)&&<CountDown onFinish={onRefresh} endTime={endTime}/>}
                     </View>)}
                 </View>
                 {(dataList.length > 2) && <View className={styles.more} onClick={() => changeMore()}>
@@ -54,10 +71,62 @@ export default memo(({list = [], payment_method = 0}:Param) => {
                     <Text className={classnames('iconfont icon-a-moreback', styles.miconfonts, showMore&&styles.open_miconfonts)}></Text>
                 </View>}
                 <View className={styles.image_tag}>
-                    {(payment_method == PaymentMethodCashOnDelivery.value)&&<Image mode="aspectFit" src={formatImgUrl('/mall/order_pay_status.png')} className={styles.image}/>}
-                    {(payment_method == PaymentMethodAccountPeriod.value)&&<Image mode="aspectFit" src={formatImgUrl('/mall/order_pay_status_7day.png')} className={styles.image}/>}
+                    {(orderInfo.payment_method == PaymentMethodCashOnDelivery.value)&&<Image mode="aspectFit" src={formatImgUrl('/mall/order_pay_status.png')} className={styles.image}/>}
+                    {(orderInfo.payment_method == PaymentMethodAccountPeriod.value)&&<Image mode="aspectFit" src={formatImgUrl('/mall/order_pay_status_7day.png')} className={styles.image}/>}
                 </View>
+                {(orderInfo.status == SaleorderstatusWaitingPrePayment.value)&&<View className={styles.refresh} onClick={onRefresh}>
+                    <Text className={classnames(styles.mconfont, 'iconfont icon-xianxiahuikuan')}></Text>
+                    <Text className={classnames(styles.refresh_text)}>刷新</Text>
+                </View>}
             </View>}
         </>
     )
-})
+})
+
+//倒计时
+const CountDown = ({endTime = '', onFinish}:{endTime:string, onFinish?:() => void}) => {
+    const [showTime, setShowTime] = useState('')
+    const timeObj:any = useRef()
+    useEffect(() => {
+        if(endTime) {
+            clearInterval(timeObj.current)
+            timeObj.current = setInterval(() => {
+                count_down()
+            }, 1000)
+        }
+        return () => {
+            clearInterval(timeObj.current)
+        }
+    }, [endTime])
+    const count_down = () => {
+        var startData = dayjs();
+        var endDate = dayjs(endTime);
+        if(startData >= endDate)  {
+            clearInterval(timeObj.current)
+            onFinish?.()
+            setShowTime(() => '00:00:00')
+            return false
+        }
+        var _dd = endDate.diff(startData,'day');
+        var _hh = endDate.diff(startData,'hour');
+        var _mm = endDate.diff(startData,'minute');
+        var _ss = endDate.diff(startData,'second');
+        // 转换
+        var hh = _hh - (_dd*24);
+        var mm = _mm - (_hh*60);
+        var ss = _ss - (_mm*60);
+        // 格式化
+        var DD =  ('00'+_dd).slice(-2);
+        var HH =  ('00'+hh).slice(-2);
+        var MM =  ('00'+mm).slice(-2);
+        var SS =  ('00'+ss).slice(-2);
+        setShowTime(() => ` ${HH}:${MM}:${SS}`)
+    }
+    return (
+        <>
+            <View className={styles.pay_time}>
+                剩<Text>{showTime||'--:--:--'}</Text>支付关闭，订单自动取消
+            </View>
+        </>
+    )
+}

src/pages/order/components/payment/index.module.scss

@@ -35,9 +35,9 @@ $top:190px;
         border-radius: 10px;
         padding-bottom: 100px;
         position: relative;
-        background: radial-gradient(circle 20px at left $top, transparent 20px, #fff 20px + 3px) left 0px/60% no-repeat ,
-                    radial-gradient(circle 20px at right $top, transparent 20px, #fff 20px + 3px) right 0px/60% no-repeat;
-        filter: drop-shadow(2px 2px 6px rgba(0, 0, 0, .16));
+        // background: radial-gradient(circle 20px at left $top, transparent 20px, #fff 20px + 3px) left 0px/60% no-repeat ,
+        //             radial-gradient(circle 20px at right $top, transparent 20px, #fff 20px + 3px) right 0px/60% no-repeat;
+        // filter: drop-shadow(2px 2px 6px rgba(0, 0, 0, .16));
         position: relative;
         &::before{
             content: '';

src/pages/order/components/payment/index.tsx

@@ -8,26 +8,34 @@ import MCheckbox from "@/components/checkbox";
 import Popup from "@/components/popup";
 import OfflinePay from "../offlinePay";
 import ScanPay from "../scanPay";
-import { GetOrderPayApi, SubmitOrderPayApi } from "@/api/orderPay";
+import { GetOrderPayApi, SubmitOrderPayApi, GetPrepayOrderPayApi, SubmitPrepayOrderPayApi } from "@/api/orderPay";
 import { formatPriceDiv } from "@/common/fotmat";
 import {alert} from "@/common/common"
-import { PAYMENT_METHOD, PAYMENT_METHOD_PARAM } from "@/common/enum";
+import { ORDER_STATUS, PAYMENT_METHOD, PAYMENT_METHOD_PARAM } from "@/common/enum";
 
 type Param = {
     show?: true|false,
     onClose?: () => void,
     onSubmitSuccess?: () => void, //支付成功
-    orderInfo?: OrderInfo
+    orderInfo?: OrderInfo,
 }
 
 type OrderInfo = {
-    orderId: number, //应付单id
-    payment_method: 0|PAYMENT_METHOD_PARAM //支付方式
+    should_collect_order_id?: number, //应付单id
+    pre_collect_order_id?: number, //预付单id
+    status?: number, //订单状态
+    payment_method?: 0|PAYMENT_METHOD_PARAM //支付方式
+    sale_mode?: number //订单类型 0：大货 1剪板 2散剪
 }
 
 type PayStatus = 1|2|3|4|5|null //1:预存款， 2:账期，3：线下汇款， 4：扫码支付, 5:货到付款
 export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param) => {
 
+    //支付方式枚举
+    const {PaymentMethodPreDeposit, PaymentMethodAccountPeriod, PaymentMethodCashOnDelivery} = PAYMENT_METHOD
+    //订单状态枚举
+    const {SaleorderstatusWaitingPrePayment} = ORDER_STATUS
+
     //提交参数
     const [submitData, setSubmitData] = useState<{id:number, payment_method: PayStatus}>({
         id:0,
@@ -38,7 +46,7 @@ export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param)
     const [offlinePayShow, setofflinePayShow] = useState(false)
     const onShowOfflinePay = () => {
         setofflinePayShow(true)
-        onClose?.()
+        // onClose?.()
     }
 
     //扫码支付
@@ -51,13 +59,22 @@ export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param)
     //获取支付方式数据
     const [payInfo, setPayInfo] = useState<any>()
     const {fetchData: orderFetchData} = GetOrderPayApi()
+    const {fetchData: prepayOrderFetchData} = GetPrepayOrderPayApi()
     const getOrderPay = async () => {
-        let {data} = await orderFetchData({id: orderInfo?.orderId})
-        setPayInfo(() => data)
+        if(orderInfo&&orderInfo.should_collect_order_id) {
+            //有应收单id时用应收单获取数据
+            let {data} = await orderFetchData({id: orderInfo?.should_collect_order_id})
+            setPayInfo(() => data)
+        } else {
+            //用预付单id获取支付信息
+            let {data} = await prepayOrderFetchData({id: orderInfo?.pre_collect_order_id})
+            setPayInfo(() => data)
+        }
     }
     useEffect(() => {
-        if(show&&orderInfo?.orderId) {
-            setSubmitData((val) => ({...val, id:orderInfo.orderId}))
+        if(show&&orderInfo&&(orderInfo?.should_collect_order_id||orderInfo?.pre_collect_order_id)) {
+            let id = orderInfo.should_collect_order_id||orderInfo.pre_collect_order_id
+            setSubmitData((val) => ({...val, id:id as number}))
             getOrderPay()
         }
     }, [show, orderInfo]) 
@@ -73,14 +90,20 @@ export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param)
     }
 
     //提交支付
-    const {fetchData: submitFetchData} = SubmitOrderPayApi()
+    const {fetchData: submitFetchData} = SubmitOrderPayApi() //应收单提交
+    const {fetchData: submitPrepayOrderFetchData} = SubmitPrepayOrderPayApi() //预付单提交
     const submitPay = async () => {
         if(submitData.payment_method === null) {
             alert.error('请选择支付方式')
             return false
         }
         alert.loading('正在支付')
-        let res = await submitFetchData(submitData)
+        let res:any = null
+        if(orderInfo?.should_collect_order_id) {
+            res = await submitFetchData(submitData)
+        } else {
+            res = await submitPrepayOrderFetchData(submitData)
+        }
         if(res.success) {
             alert.success('支付成功')
             onSubmitSuccess?.()
@@ -97,6 +120,20 @@ export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param)
         )
     }, [payInfo])
 
+     //是否显示七天账期
+     const show_account_payment = useMemo(() => {
+         console.log('orderInfo?.status::',orderInfo)
+        //剪板合散剪不显示
+        if(orderInfo?.sale_mode != 0) return false
+        //支付方式是账期支付,不显示
+        if(orderInfo?.payment_method == PaymentMethodAccountPeriod.value) return false
+        //支付方式是货到付款,不显示
+        if(orderInfo?.payment_method == PaymentMethodCashOnDelivery.value) return false
+        //订单状态是预付款,不显示
+        if(orderInfo?.status == SaleorderstatusWaitingPrePayment.value) return false
+        return true
+     }, [orderInfo])
+
     //账期
     const account_peyment = useMemo(() => {
         const price = payInfo?.should_collect_money - payInfo?.amount_paid
@@ -105,8 +142,9 @@ export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param)
         )
     }, [payInfo])
 
-    //支付方式枚举
-    const {PaymentMethodPreDeposit, PaymentMethodAccountPeriod} = PAYMENT_METHOD
+    //选择改变
+    const changeSelect = () => {
+    }
 
     return (
         <View className={styles.payment_main}>
@@ -133,7 +171,7 @@ export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param)
                             </View>
                         </View>
                         <View className={styles.payment_list_con}>
-                            <View className={styles.payment_list_item}>
+                            <View className={styles.payment_list_item} onClick={changeSelect}>
                                 <View className={styles.payment_list_item_left}>
                                     <View className={styles.payment_list_item_left_name}>
                                         <View className={classnames('iconfont icon-a-tuikuanshouhou', styles.miconfont)}></View>
@@ -143,13 +181,12 @@ export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param)
                                 </View>
                                 <MCheckbox status={submitData.payment_method == PaymentMethodPreDeposit.value} onSelect={() => advanceSelectData(PaymentMethodPreDeposit.value)} onClose={() => advanceSelectData(null)}/>
                             </View>
-                            {(orderInfo?.payment_method != PaymentMethodAccountPeriod.value)&&<View className={styles.payment_list_item}>
+                            {show_account_payment&&<View className={styles.payment_list_item}>
                                 <View className={styles.payment_list_item_left}>
                                     <View className={styles.payment_list_item_left_name}>
                                         <View className={classnames('iconfont icon-a-tuikuanshouhou', styles.miconfont)}></View>
                                         <View className={styles.payment_list_item_left_text}>{payInfo?.account_period}天账期</View>
                                     </View>
-                                    {/* <View className={styles.payment_list_item_left_price}>可用额度 ¥{formatPriceDiv(payInfo?.account_period_credit_available_line)}</View> */}
                                     {account_peyment}
                                 </View>
                                 <MCheckbox  status={submitData.payment_method == PaymentMethodAccountPeriod.value} onSelect={() => periodSelectData(PaymentMethodAccountPeriod.value)} onClose={() => periodSelectData(null)}/>

src/pages/order/components/reasonPopup/index.module.scss

@@ -0,0 +1,27 @@
+.reason_return_con{
+    height: 50vh;
+    .reason_title{
+        padding: 10px 20px 0 20px;
+        height: 60px;
+        border-bottom: 1PX solid #F3F3F3;
+        box-sizing: border-box;
+        Text{
+            font-size: 26px;
+            border-bottom: 3px solid #000;
+            padding: 10px;
+            font-weight: 400;
+        }
+        
+    }
+    .reason_scroll{
+        height: calc(100% - 70px);
+        .reason_list{
+            font-size: 26px;
+            padding: 30px 20px 0 20px;
+            color: #707070;
+            .reason_item{
+                margin-bottom: 36px;
+            }
+        }
+    }
+}

src/pages/order/components/reasonPopup/index.tsx

@@ -0,0 +1,37 @@
+import Popup from "@/components/popup";
+import { ScrollView, Text, View } from "@tarojs/components";
+import { memo, useMemo } from "react";
+import styles  from './index.module.scss'
+
+//原因选择
+type ReasonInfoParam = {
+    show?: boolean,
+    onClose?: () => void,
+}
+export default memo(({show = false, onClose}: ReasonInfoParam) => {
+    return (
+        <Popup showIconButton={false} show={show} title="退款说明" onClose={onClose} >
+            <View className={styles.reason_return_con}>
+                <View className={styles.reason_title}><Text>退款说明</Text></View>
+                <ScrollView scrollY className={styles.reason_scroll}>
+                    <View className={styles.reason_list}>
+                        <View className={styles.reason_item}>完好无损带原标签</View>
+                        <View className={styles.reason_item}>完好无损带原标签</View>
+                        <View className={styles.reason_item}>完好无损带原标签</View>
+                        <View className={styles.reason_item}>完好无损带原标签</View>
+                        <View className={styles.reason_item}>完好无损带原标签</View>
+                        <View className={styles.reason_item}>完好无损带原标签</View>
+                        <View className={styles.reason_item}>完好无损带原标签</View>
+                        <View className={styles.reason_item}>完好无损带原标签</View>
+                        <View className={styles.reason_item}>完好无损带原标签</View>
+                        <View className={styles.reason_item}>完好无损带原标签</View>
+                        <View className={styles.reason_item}>完好无损带原标签</View>
+                        <View className={styles.reason_item}>完好无损带原标签</View>
+                        <View className={styles.reason_item}>完好无损带原标签</View>
+                        <View className={styles.reason_item}>完好无损带原标签</View>
+                    </View>
+                </ScrollView>
+            </View>
+        </Popup>
+    )
+})

src/pages/order/components/remark/index.tsx

@@ -1,20 +1,25 @@
 import Popup from "@/components/popup"
 import { Textarea, View } from "@tarojs/components"
-import { useCallback, useState } from "react"
+import { useCallback, useEffect, useState } from "react"
 import styles  from './index.module.scss'
 
 type Param = {
     onBlur?: (val:any) => void
     onSave?: (val: string) => void
+    defaultValue?: string
 }
-export default ({onBlur, onSave}:Param) => {
+export default ({onBlur, onSave, defaultValue = ''}:Param) => {
     const [descData, setDescData] = useState({
         number: 0,
         value: '',
         count: 200
     })
-    const getDesc = useCallback((e) => {
-        let value = e.detail.value
+
+    useEffect(() => {
+        getDesc(defaultValue)
+    }, [defaultValue])
+
+    const getDesc = useCallback((value) => {
         let res = value
         if(value.length > descData.count) {
             res = value.slice(0, descData.count)
@@ -29,7 +34,7 @@ export default ({onBlur, onSave}:Param) => {
         <View className={styles.order_popup}>
             <View className={styles.order_popup_title}>编辑备注</View>
             <View className={styles.order_popup_input}>
-                <Textarea placeholder="请添加备注" maxlength={descData.count} cursorSpacing={100} onInput={(e) => getDesc(e)} onBlur={(e) => onBlur?.(e)}></Textarea>
+                <Textarea placeholder="请添加备注" maxlength={descData.count} cursorSpacing={100} onInput={(e) => getDesc(e.detail.value)} onBlur={(e) => onBlur?.(e)}></Textarea>
                 <View className={styles.descDataNum}>{descData.number}/{descData.count}</View>
             </View>
             <View className={styles.order_save_address} onClick={() => setSave()}>保存</View>

src/pages/order/components/submitOrderBtn/index.module.scss

@@ -1,11 +1,9 @@
 .order_price{
     display: flex;
     align-items: center;
-    justify-content: space-between;
+    // justify-content: space-between;
     width: 100%;
-    &:nth-last-child(n+2) {
-        margin-bottom: 30px;
-    }
+
     .order_price_text{  
         font-size: $font_size_medium;
         // margin-right: 10px;
@@ -41,7 +39,7 @@
         }
     }
     .emphasis{
-        font-weight: 700;
+        // font-weight: 700;
     }
     .order_price_num{
         color: $color_main;
@@ -51,7 +49,7 @@
                 font-size: $font_size_min;
             }
             &:nth-child(2) {
-                font-size: 26px;
+                font-size: 44px;
             }
             &:nth-child(3) {
                 font-size: $font_size_medium;
@@ -61,7 +59,7 @@
     .emphasis_num{
         text{
             &:nth-child(2) {
-                font-size: $font_size_big;
+                font-size: 44px;
             }
         }
     }

src/pages/order/components/submitOrderBtn/index.tsx

@@ -4,10 +4,12 @@ import {formatKbPrice} from '@/common/common'
 import classnames from "classnames";
 import styles  from './index.module.scss'
 type Param = {
-    style?: Object,
-    number?: number
+    style?: Object, 
+    number?: number, //数量
+    priceTitle: string //描述
+
 }
-export default memo(({style, number = 0}:Param) => {
+export default memo(({style, number = 0, priceTitle = ''}:Param) => {
     const priceDom = useCallback(() => {
         let res = number.toFixed(2).split('.')
         let int_num  = parseInt(res[0]) + ''
@@ -24,11 +26,7 @@ export default memo(({style, number = 0}:Param) => {
         <>
             <View className={styles.order_price}>
                 <View className={classnames(styles.order_price_text, styles.emphasis)}>
-                    <Text>应付金额</Text>
-                    <View className={styles.iconfont_msg}>
-                        <Text className={classnames(styles.miconfont, 'iconfont icon-a-tuikuanshouhou')}></Text>
-                        {/* <View className={classnames(styles.message)}>123123123121212312312312312</View> */}
-                    </View>
+                    <Text>{priceTitle}：</Text>
                 </View>
                 <View className={classnames(styles.order_price_num, styles.emphasis_num)} style={style}>
                     {priceDom()}

src/pages/order/cutOrder/index.config.ts

@@ -0,0 +1,6 @@
+export default {
+  navigationBarTitleText: '订单详情',
+  enablePullDownRefresh: true,
+  backgroundTextStyle: 'dark',
+  enableShareAppMessage: true,
+}

src/pages/order/cutOrder/index.module.scss

@@ -0,0 +1,133 @@
+.order_main{
+    min-height: 100%;
+    background-color:$color_bg_one;
+    padding: 20px;
+    padding-bottom: 190px;
+    box-sizing: border-box;
+
+    .order_title{
+        display: flex;
+        align-items: center;
+        padding: 20px 30px;
+        box-sizing: border-box;
+        background-color: #fff;
+        height: 116px;
+        border-radius: 20px;
+        margin-top: 20px;
+        text{
+            flex:1;
+            font-size: $font_size;
+            font-weight: 700;
+        }
+        .order_status{
+            background-color: #F0F0F0;
+            width: 148px;
+            height: 55px;
+            color: $color_font_three;
+            text-align: center;
+            line-height: 55px;
+            font-size: $font_size_medium;
+            border-radius: 30px;
+            &:nth-last-child(1) {
+                margin-left: 20px;
+            }
+        }
+    }
+    .order_desc{
+        display: flex;
+        align-items: center;
+        background-color: #fff;
+        padding: 20px;
+        min-height: 116px;
+        border-radius: 20px;
+        margin-top: 20px;
+        box-sizing: border-box;
+        .order_desc_con{
+            width: 150px;
+            font-size: $font_size;
+            font-weight: 700;
+        }
+        .order_desc_text, .order_desc_text_hint{
+            font-size: $font_size_medium;
+            color: $color_font_two;
+            margin-right: 10px;
+            flex:1;
+            word-break:break-all;
+        }
+        .order_desc_text_hint{
+            text-align: right;
+        }
+        .miconfont{
+            font-size: 20px;
+            color: $color_font_two;
+        }
+    }
+    .submit_order{
+        display: flex;
+        position: fixed;
+        bottom: 0;
+        left: 0;
+        justify-content: flex-end;
+        width: 100%;
+        align-items: center;
+        background-color: #fff;
+        box-shadow: 6px 0px 12px 0px rgba(0,0,0,0.16);
+        padding: 20px 20px;
+        box-sizing: border-box;
+        padding-bottom: constant(safe-area-inset-bottom);
+        padding-bottom: env(safe-area-inset-bottom);
+        .order_btn {
+            width: 152px;
+            height: 72px;
+            border: 2px solid #dddddd;
+            border-radius: 46px;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            color: $color_font_three;
+            &:nth-child(n+2) {
+                margin-left: 34px;
+            }
+        }
+        .order_btn_select{
+            color: $color_main;
+            border: 2px solid $color_main;
+        }
+        .order_number_desc{
+            font-size: $font_size_medium;
+            color: $color_font_two;
+        }
+    }
+    .order_info{
+        background-color: #fff;
+        margin-top: 20px;
+        border-radius: 20px;
+        padding: 20px;
+        .order_info_title{
+            font-size: $font_size;
+            font-weight: 700;
+            margin-bottom: 20px;
+            
+        }
+        .order_num{
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            .order_num_btn{
+                font-size: $font_size_medium;
+                padding: 5px 10px;
+                border: 2px solid #007cf7;
+                border-radius: 10px;
+                color: $color_main;
+            }
+        }
+        text{
+            font-size: $font_size;
+        }
+
+    }
+    .weight_memo_con{
+        margin-bottom: 20px;
+    }
+
+}

src/pages/order/cutOrder/index.tsx

@@ -0,0 +1,228 @@
+import { 
+    GetSaleOrderDetailApi, 
+    EditSaleOrderRemarkApi, 
+    CancelOrderApi
+} from "@/api/order";
+import { GetOrderPayApi } from "@/api/orderPay";
+import { alert, goLink } from "@/common/common";
+import { ORDER_STATUS } from "@/common/enum";
+import { formatDateTime, formatPriceDiv } from "@/common/fotmat";
+import OrderBtns from "@/components/orderBtns";
+import Popup from "@/components/popup";
+import SearchInput from "@/components/searchInput";
+import { Text, Textarea, View } from "@tarojs/components"
+import Taro, { useDidShow, usePullDownRefresh, useRouter } from "@tarojs/taro";
+import classnames from "classnames";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import AddressInfoDetail from "../components/addressInfoDetail";
+import KindList from "../components/kindList";
+import OrderState from "../components/orderState";
+import Payment from "../components/payment";
+import Remark from "../components/remark";
+import styles  from '../index.module.scss'
+ 
+ export default () => {
+    const [showDesc, setShowDesc] = useState(false)
+    const router = useRouter()
+    const orderId = useRef<number>(Number(router.params.id))
+    useDidShow(() => {
+        getSaleOrderPreView()
+    })
+
+    //获取订单详情
+    const [orderDetail, setOrderDetail] = useState<any>() //获取到的原始数据
+    const {fetchData: getOrderFetchData} = GetSaleOrderDetailApi()
+    const getSaleOrderPreView = async () => {
+        if(orderId.current) {
+            let res = await getOrderFetchData({id: orderId.current})
+            setOrderDetail(res.data)
+            setOrderRemark(res.data.remark)
+        }
+        Taro.stopPullDownRefresh()       
+    }
+
+    //监听获取到的数据
+    useEffect(() => {
+        if(orderDetail)
+            formatData()
+    }, [orderDetail])
+
+    //格式化数据格式
+    const [formatDetailOrder, setFormatDetailOrder] = useState<any>() //格式化后的数据
+    const formatData = () => {  
+        setFormatDetailOrder({
+            estimate_amount: orderDetail.estimate_amount, //预估金额
+            sale_mode: orderDetail.sale_mode,
+            sale_mode_name: orderDetail.sale_mode_name, 
+            total_colors: orderDetail.total_colors, //总颜色数量
+            total_number: orderDetail.total_number, //总数量
+            total_fabrics: orderDetail.total_fabrics, //面料数量
+            unit: orderDetail.sale_mode == 0?'条':'m', //单位
+            list: orderDetail.product_list,
+            status: orderDetail.status, //订单状态
+            total_sale_price: orderDetail.total_sale_price, //销售金额
+            total_should_collect_money: orderDetail.total_should_collect_money, //应收金额
+            total_weight_error_discount: orderDetail.total_weight_error_discount, //空差优惠
+            actual_amount: orderDetail.actual_amount, //实付金额
+            the_previous_status: orderDetail.the_previous_status, //取消订单时的订单状态
+
+        })
+    }
+    const formatPreViewOrderMemo = useMemo(() => {
+        return formatDetailOrder
+    }, [formatDetailOrder])
+
+    //复制功能
+    const clipboardData = () => {
+        Taro.setClipboardData({
+            data: orderDetail?.order_no||'',
+            success: function (res) {
+                Taro.showToast({
+                    icon: 'none',
+                    title: '复制成功'
+                })
+            }
+        })
+    }
+
+    //格式化初始地址
+    const defaultAddress = useMemo(() => {
+        return  {
+            province_name: orderDetail?.province_name,
+            city_name: orderDetail?.city_name,
+            district_name: orderDetail?.district_name,
+            address_detail: orderDetail?.address_detail,
+            // id: address.id,
+            name: orderDetail?.target_user_name,
+            phone: orderDetail?.target_user_phone
+        }
+       
+    }, [orderDetail])
+
+    //订单备注
+    const {fetchData: remarkFetchData} = EditSaleOrderRemarkApi()
+    const [orderRemark, setOrderRemark] = useState('')
+    const getRemark = useCallback(async (e) => {
+        setOrderRemark(() => e)
+        let res = await remarkFetchData({remark:e, id: orderId.current})
+        if(res.success) {
+            getSaleOrderPreView()
+            alert.success('提交成功')
+        } else {
+            alert.error(res.msg)
+        }
+        setShowDesc(() => false)
+    }, [])
+
+    //支付所需数据
+    const payOrderInfo = useMemo(() => {
+        if(orderDetail)
+            return {orderId: orderDetail.should_collect_order_id,  payment_method:orderDetail.payment_method }
+    }, [orderDetail])
+
+    //去付款
+    const [payMentShow, setPayMentShow] = useState(false)
+    const toPay = () => {
+        setPayMentShow(true)
+    }
+
+    //打开地址修改
+    const addressRef = useRef<any>(null)
+
+    //修改收货方式
+    const getShipmentMode = useCallback(() => {
+        getSaleOrderPreView()
+    }, [orderDetail])
+
+    //修改地址
+    const getAddress = useCallback(() => {
+        getSaleOrderPreView()
+    }, [orderDetail])
+
+    //获取底部按钮点击, 获取按钮状态
+    const orderStateClick = useCallback((val) => {
+        if(val == 1 || val == 6) {
+            //取消订单
+            getSaleOrderPreView()
+        }else if(val == 2) {
+            //待付款
+            toPay()
+        }
+    }, [orderDetail])
+
+    //页面下拉刷新
+    usePullDownRefresh(() => {
+        getSaleOrderPreView()
+    })
+
+    //支付成功
+    const onPaySuccess = useCallback(() => {
+        getSaleOrderPreView()
+        closePayShow()
+    }, [orderDetail])
+
+    //关闭支付弹窗
+    const closePayShow = useCallback(() => {
+        setPayMentShow(() => false)
+    }, [orderDetail])
+
+    //按钮所需数据
+    const orderInfo = useMemo(() => {
+        return {
+            status: orderDetail?.status, //订单状态
+            orderId: orderDetail?.id,
+            settle_mode: orderDetail?.settle_mode,
+            actual_amount: orderDetail?.actual_amount, //实付金额
+            wait_pay_amount: orderDetail?.wait_pay_amount, //待付金额
+        }
+    }, [orderDetail])
+
+    //订单状态枚举
+    const {SaleOrderStatusCancel} = ORDER_STATUS
+
+    
+
+    return (
+        <View className={styles.order_main}>
+            {/* <View className={styles.weight_memo_con}>
+                <WeightMemo/>
+            </View> */}
+            <OrderState list={orderDetail?.logistics_details} payment_method={orderDetail?.payment_method}/>
+            <View >
+                <AddressInfoDetail orderId={orderDetail?.id} onSelect={getAddress} onChangeShipmentMode={getShipmentMode} ref={addressRef} defaultValue={defaultAddress} shipment_mode={orderDetail?.shipment_mode}/>
+            </View>
+            <KindList order={formatPreViewOrderMemo} />
+            <View className={styles.order_info} >
+                <View className={styles.order_info_title}>订单信息</View>
+                <SearchInput showBorder={false} title='单号' height={50}>
+                    <View className={styles.order_num}>
+                        <Text>{orderDetail?.order_no}</Text>
+                        <View className={styles.order_num_btn} onClick={() => clipboardData()}>复制</View>
+                    </View>
+                </SearchInput>
+                <SearchInput showBorder={false} title='下单时间' height={50}>
+                    <Text>{formatDateTime(orderDetail?.create_time)}</Text>
+                </SearchInput>
+                <SearchInput showBorder={false} title='付款时间' height={50}>
+                    <Text>{formatDateTime(orderDetail?.create_time)}</Text>
+                </SearchInput>
+            </View>
+            <View className={styles.order_desc} onClick={() => setShowDesc(true)}>
+                <View className={styles.order_desc_con}>订单备注</View>
+                {
+                    orderRemark&&<View className={styles.order_desc_text}>{orderDetail?.remark}</View>||
+                    <View className={styles.order_desc_text_hint}>填写备注</View>
+                }
+                <View className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></View>
+            </View>
+            {(orderDetail?.status != SaleOrderStatusCancel.value)&&<View className={styles.submit_order}>
+                <OrderBtns orderInfo={orderInfo} onClick={orderStateClick}/>
+            </View> }       
+            <Popup show={showDesc} showTitle={false} onClose={() => setShowDesc(false)} >
+                <Remark onSave={(e) => getRemark(e)}/>
+            </Popup>
+            <Payment onSubmitSuccess={onPaySuccess} show={payMentShow} onClose={closePayShow} orderInfo={payOrderInfo} />
+            <View className="common_safe_area_y"></View>
+        </View>
+    )
+ }

src/pages/order/index.module.scss

@@ -62,21 +62,15 @@
             color: $color_font_two;
         }
     }
-    .submit_order{
-        display: flex;
+    .submit_order_con{
         position: fixed;
         bottom: 0;
         left: 0;
-        justify-content: flex-end;
         width: 100%;
-        height: 175px;
-        align-items: center;
         background-color: #fff;
         box-shadow: 6px 0px 12px 0px rgba(0,0,0,0.16);
         padding: 20px 20px;
         box-sizing: border-box;
-        padding-bottom: constant(safe-area-inset-bottom);
-        padding-bottom: env(safe-area-inset-bottom);
         .order_btn {
             width: 152px;
             height: 72px;

src/pages/order/index.tsx

@@ -4,19 +4,20 @@ import {
     CancelOrderApi
 } from "@/api/order";
 import { GetOrderPayApi } from "@/api/orderPay";
+import { AddShoppingCartApi } from "@/api/shopCart";
 import { alert, goLink } from "@/common/common";
 import { ORDER_STATUS } from "@/common/enum";
-import { formatDateTime, formatPriceDiv } from "@/common/fotmat";
+import { formatDateTime, formatImgUrl, formatPriceDiv } from "@/common/fotmat";
 import OrderBtns from "@/components/orderBtns";
 import Popup from "@/components/popup";
 import SearchInput from "@/components/searchInput";
+import ShopCart from "@/components/shopCart";
 import { Text, Textarea, View } from "@tarojs/components"
 import Taro, { useDidShow, usePullDownRefresh, useRouter } from "@tarojs/taro";
 import classnames from "classnames";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import order from "../orderList/components/order";
 import AddressInfoDetail from "./components/addressInfoDetail";
-import ApplyAfterSales from "./components/applyAfterSales";
+import ApplyRefund from "./components/applyRefund";
 import KindList from "./components/kindList";
 import OrderState from "./components/orderState";
 import Payment from "./components/payment";
@@ -40,7 +41,8 @@ import styles  from './index.module.scss'
             setOrderDetail(res.data)
             setOrderRemark(res.data.remark)
         }
-        Taro.stopPullDownRefresh()       
+        Taro.stopPullDownRefresh()
+        Taro.hideToast()       
     }
 
     //监听获取到的数据
@@ -87,16 +89,19 @@ import styles  from './index.module.scss'
         })
     }
 
-    //格式化初始地址
+    //初始地址数据
     const defaultAddress = useMemo(() => {
         return  {
             province_name: orderDetail?.province_name,
             city_name: orderDetail?.city_name,
             district_name: orderDetail?.district_name,
             address_detail: orderDetail?.address_detail,
-            // id: address.id,
             name: orderDetail?.target_user_name,
-            phone: orderDetail?.target_user_phone
+            phone: orderDetail?.target_user_phone,
+            shipment_mode: orderDetail?.shipment_mode,
+            id: orderDetail?.id,
+            sale_mode: orderDetail?.sale_mode,
+            status: orderDetail?.status
         }
        
     }, [orderDetail])
@@ -116,18 +121,17 @@ import styles  from './index.module.scss'
         setShowDesc(() => false)
     }, [])
 
-    //支付所需数据
-    const payOrderInfo = useMemo(() => {
-        if(orderDetail)
-            return {orderId: orderDetail.should_collect_order_id,  payment_method:orderDetail.payment_method }
-    }, [orderDetail])
-
     //去付款
     const [payMentShow, setPayMentShow] = useState(false)
     const toPay = () => {
         setPayMentShow(true)
     }
 
+    //地址组件所需数据
+    const addressInfoDetailData = useMemo(() => {
+        return {orderId:orderDetail?.id, shipment_mode:orderDetail?.shipment_mode, status: orderDetail?.status}
+    }, [orderDetail])
+
     //打开地址修改
     const addressRef = useRef<any>(null)
 
@@ -143,15 +147,20 @@ import styles  from './index.module.scss'
 
     //获取底部按钮点击, 获取按钮状态
     const orderStateClick = useCallback((val) => {
-        console.log('val::', val)
-        if(val == 1) {
+        console.log('123456789',val)
+        if(val == 1 || val == 6) {
             //取消订单
             getSaleOrderPreView()
-        }
-        if(val == 2) {
+        }else if(val == 2) {
             //待付款
             toPay()
+        } else if(val == 3) {
+            setRefundShow(true)
+        } else if(val == 7) {
+            //再购
+            addShopCart()
         }
+        
     }, [orderDetail])
 
     //页面下拉刷新
@@ -178,22 +187,73 @@ import styles  from './index.module.scss'
             settle_mode: orderDetail?.settle_mode,
             actual_amount: orderDetail?.actual_amount, //实付金额
             wait_pay_amount: orderDetail?.wait_pay_amount, //待付金额
+            sale_mode: orderDetail?.sale_mode, //订单类型
         }
     }, [orderDetail])
 
     //订单状态枚举
     const {SaleOrderStatusCancel} = ORDER_STATUS
 
+    //刷新页面
+    const refresh = useCallback(() => {
+        alert.loading('刷新中')
+        getSaleOrderPreView()
+    }, [orderDetail])
+
+    //退款申请
+    const [refundShow, setRefundShow] = useState(false)
+    const applyRefundClose = useCallback(() => {
+        setRefundShow(false)
+    }, [])
+
+    //查看物流
+    const getLogistics = useCallback(() => {
+        const list = orderDetail?.delivery_appendix_url.map(item => {
+            return formatImgUrl(item)
+        })
+        Taro.previewImage({
+            current: list[0], // 当前显示
+            urls: list // 需要预览的图片http链接列表
+        })
+    }, [orderDetail])
     
+    //添加购物车
+    const [showCart, setShowCart] = useState(false)
+    const {fetchData:addFetchData} = AddShoppingCartApi()
+    const addShopCart =  async () => {
+        let color_list:{product_color_id: number, roll?: number, length?: number}[] = []
+        orderDetail?.product_list.map(pitem => {
+            pitem?.product_colors.map(citem => {
+                if(orderDetail?.sale_mode == 0) {
+                    return color_list.push({product_color_id: citem.id, roll: citem.roll})
+                } else {
+                    return color_list.push({product_color_id: citem.id, length: citem.length})
+                }
+            })
+        })
+        const state =  await addFetchData({
+            sale_mode: orderDetail?.sale_mode,
+            color_list
+        })
+        if(state.success) {
+            Taro.showToast({
+                title:'已加入购物车'
+            })
+            setShowCart(true)
+        } else {
+            Taro.showToast({
+                icon:'none',
+                title: state.msg
+            })
+        }
+        
+    }
 
     return (
         <View className={styles.order_main}>
-            {/* <View className={styles.weight_memo_con}>
-                <WeightMemo/>
-            </View> */}
-            <OrderState list={orderDetail?.logistics_details} payment_method={orderDetail?.payment_method}/>
-            <View >
-                <AddressInfoDetail orderId={orderDetail?.id} onSelect={getAddress} onChangeShipmentMode={getShipmentMode} ref={addressRef} defaultValue={defaultAddress} shipment_mode={orderDetail?.shipment_mode}/>
+            <OrderState orderInfo={orderDetail} onRefresh={refresh}/>
+            <View>
+                <AddressInfoDetail orderInfo={defaultAddress} onLogistics={getLogistics} onSelect={getAddress} onChangeShipmentMode={getShipmentMode} ref={addressRef} />
             </View>
             <KindList order={formatPreViewOrderMemo}/>
             <View className={styles.order_info} >
@@ -219,14 +279,16 @@ import styles  from './index.module.scss'
                 }
                 <View className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></View>
             </View>
-            {(orderDetail?.status != SaleOrderStatusCancel.value)&&<View className={styles.submit_order}>
+            {(orderDetail?.status != SaleOrderStatusCancel.value)&&<View className={styles.submit_order_con}>
                 <OrderBtns orderInfo={orderInfo} onClick={orderStateClick}/>
+                <View className="common_safe_area_y"></View>
             </View> }       
-            <Popup show={showDesc} showTitle={false} onClose={() => setShowDesc(false)} >
-                <Remark onSave={(e) => getRemark(e)}/>
+            <Popup show={showDesc} showTitle={false} onClose={() => setShowDesc(false)}>
+                <Remark onSave={(e) => getRemark(e)} defaultValue={orderDetail?.remark}/>
             </Popup>
-            <Payment onSubmitSuccess={onPaySuccess} show={payMentShow} onClose={closePayShow} orderInfo={payOrderInfo} />
-            {/* <ApplyAfterSales/> */}
+            <Payment onSubmitSuccess={onPaySuccess} show={payMentShow} onClose={closePayShow} orderInfo={orderDetail} />
+            <ApplyRefund show={refundShow} onClose={applyRefundClose}/>
+            <ShopCart show={showCart}  onClose={() => setShowCart(false)}/>
             <View className="common_safe_area_y"></View>
         </View>
     )

src/pages/orderList/components/order/index.module.scss

@@ -42,6 +42,9 @@
             border-radius: 0px 20px 0px 20px;
         }
     }
+    .product_con{
+        margin-bottom: 20px;
+    }
     .product_title{
         display: flex;
         align-items: center;

src/pages/orderList/components/order/index.tsx

@@ -1,5 +1,6 @@
 import { goLink } from "@/common/common";
 import { formatHashTag, formatImgUrl, formatPriceDiv } from "@/common/fotmat";
+import LabAndImg from "@/components/LabAndImg";
 import OrderBtns from "@/components/orderBtns";
 import Payment from "@/pages/order/components/payment";
 import { useSelector } from "@/reducers/hooks";
@@ -21,6 +22,9 @@ type Param = {
         total_number: number,
         status: 0,
         id: number,
+        lab: any,
+        rgb: any,
+        texture_url: string,
         payment_method: number, //支付方式
         actual_amount: number, //实付金额
         wait_pay_amount: number //待付金额
@@ -51,6 +55,7 @@ export default memo(({value, onClickBtn}: Param) => {
             orderId: value?.id,
             actual_amount: value?.actual_amount, //实付金额
             wait_pay_amount: value?.wait_pay_amount, //待付金额
+            sale_mode: value?.sale_mode, //订单类型
         }
     }, [value])
 
@@ -75,7 +80,7 @@ export default memo(({value, onClickBtn}: Param) => {
                 </View>
                 <View className={styles.product_list}>
                     <View className={styles.image}>
-                    <Image src={formatImgUrl(value?.product_list[0].product_colors[0].texture_url)}/>
+                    <LabAndImg value={{lab:value.lab,rgb:value.rgb,texture_url:value.texture_url}}/>
                     <View className={styles.color_num}>{value?.product_list[0].product_colors[0].code}</View>
                     </View>
                     <View className={styles.color_list}>
@@ -99,7 +104,6 @@ export default memo(({value, onClickBtn}: Param) => {
                 <View className={styles.color_count_num}>{`${value?.total_fabrics}种面料，${value?.total_colors}种颜色，共${value?.total_number}条`}</View>
             </View>
             <OrderBtns orderInfo={orderInfo} onClick={orderBtnsClick}/>
-            
         </View>
     )
 })

src/pages/orderList/index.tsx

@@ -12,6 +12,8 @@ import { dataLoadingStatus, getFilterData } from "@/common/util"
 import OrderStatusList from "./components/orderStatusList"
 import Payment from "../order/components/payment"
 import { ORDER_STATUS } from "@/common/enum"
+import { AddShoppingCartApi } from "@/api/shopCart"
+import ShopCart from "@/components/shopCart"
 
 export default () => {
   const {checkLogin} = useLogin()
@@ -96,10 +98,21 @@ export default () => {
 
   //监听点击的按钮
   const clickOrderBtn = useCallback(({status, orderInfo}) => {
-    if(status == 2) {
+    if(status == 1 || status == 6) {
+      getOrderList()
+    } else if(status == 2) {
       //去支付
-      setPayOrderInfo({orderId:orderInfo.should_collect_order_id, payment_method:orderInfo.payment_method})
+      console.log('orderInfo::',orderInfo)
+      setPayOrderInfo({
+        should_collect_order_id: orderInfo.should_collect_order_id,//应付单id
+        pre_collect_order_id: orderInfo.pre_collect_order_id, //预付单id
+        status: orderInfo.status, //订单状态
+        payment_method: orderInfo.payment_method //支付方式
+      })
       toPay()
+    } else if (status == 7) {
+      //购买
+      addShopCart(orderInfo)
     }
   }, [orderData])
 
@@ -120,6 +133,38 @@ export default () => {
       closePayShow()
   }, [])
 
+  //添加购物车
+  const [showCart, setShowCart] = useState(false)
+  const {fetchData:addFetchData} = AddShoppingCartApi()
+  const addShopCart =  async (item) => {
+      let color_list:{product_color_id: number, roll?: number, length?: number}[] = []
+      item?.product_list.map(pitem => {
+          pitem?.product_colors.map(citem => {
+              if(item?.sale_mode == 0) {
+                  return color_list.push({product_color_id: citem.id, roll: citem.roll})
+              } else {
+                  return color_list.push({product_color_id: citem.id, length: citem.length})
+              }
+          })
+      })
+      const state =  await addFetchData({
+          sale_mode: item?.sale_mode,
+          color_list
+      })
+      if(state.success) {
+          Taro.showToast({
+              title:'已加入购物车'
+          })
+          setShowCart(true)
+      } else {
+          Taro.showToast({
+              icon:'none',
+              title: state.msg
+          })
+      }
+      
+  }
+
   
   return (
     <View className={styles.order_list_main}>
@@ -128,12 +173,13 @@ export default () => {
         <OrderStatusList list={statusList} onSelect={changeStatus} defaultId={1}/>
       </View>
       <View className={styles.order_list}>
-          <InfiniteScroll statusMore={statusMore} selfonScrollToLower={getScrolltolower} refresherEnabled={true} refresherTriggered={refresherTriggeredStatus} selfOnRefresherRefresh={getRefresherRefresh}>
+          <InfiniteScroll statusMore={statusMore} selfonScrollToLower={getScrolltolower} refresherEnabled={false} refresherTriggered={refresherTriggeredStatus} selfOnRefresherRefresh={getRefresherRefresh}>
             {orderData?.list.map(item => {
               return <View key={item.id} className={styles.order_item_con}> <Order value={item} onClickBtn={clickOrderBtn}/></View>
             })}
           </InfiniteScroll>
       </View>
+      <ShopCart show={showCart}  onClose={() => setShowCart(false)}/>
       <Payment onSubmitSuccess={onPaySuccess} show={payMentShow} onClose={closePayShow} orderInfo={payOrderInfo}/>
     </View>
   )

src/pages/salesAfter/components/addressInfoDetail/index.module.scss

@@ -1,12 +1,31 @@
+.address_main{
+    margin-top: 20px;
+}
+
+.address_title_tag{
+    font-size: 24px;
+    color: #EE7500;
+    background: rgba(255,230,206,0.36);
+    border-radius: 20px 20px 0px 0px;
+    height: 56px;
+    display: flex;
+    align-items: center;
+    position: relative;
+    z-index: 999;
+    .miconfont {
+        font-size: 30px;
+        padding: 0 20px;
+    }
+}
+
 .order_address{
     height: 178px;
     background: #ffffff;
-    border-radius: 20px;
+    border-radius: 0 0 20px 20px;
     display: flex;
     align-items: center;
     padding: 30px;
     box-sizing: border-box;
-    margin-top: 20px;
     position: relative;
     .order_address_icon{
         font-size: 50px;
@@ -26,87 +45,46 @@
         .order_address_text_title{
             font-size: $font_size_medium;
             margin-top: 10px;
-            @include common_ellipsis;
             display: flex;
             align-items: center;
             justify-content: space-between;
             .moreIconfont{
                 font-size: 20px;
             }
+            .address_text{
+                word-break:break-all;
+                font-size: 28px;
+                font-weight: 700;
+            }
         }
         .order_address_text_name{
-
+            color: #707070;
             align-items: center;
+            display: flex;
+            margin-top: 20px;
             text{
                 &:nth-child(1) {
-                    color: #000;
-                    font-weight: 700;
-                    font-size: $color_font_one;
+                    font-size:  $font_size_medium;
                     margin-right: 40px;
                 }
                 &:nth-child(2) {
-                    color: $color_font_one;
+                    flex:1;
                     font-size: $font_size_medium;
                 }
             }
         }
     }
     .updateBtn{
-        width:200px;
-        font-size: $font_size_min;
-        background-color: #F0F0F0;
-        height: 64px;
-        border-radius: 24px;
+        width:152px;
+        font-size: 28px;
+        height: 60px;
         color: $color_font_two;
-        position: absolute;
-        bottom: 10px; 
-        right: 10px;
         z-index: 999;
-        .updateBtn_list{
-            position: absolute;
-            display: flex;
-            z-index: 5;
-            width: 100%;
-            .updateBtn_item_select{
-                color: #fff;
-            }
-        }
-        .updateBtn_item{
-            flex:1;
-            text-align: center;
-            line-height: 64px;
-        }
-        .updateBtn_select{
-            color: #fff;
-            background-color: $color_main;
-            border-radius: 24px;
-            position: absolute;
-            width: 100px;
-            height: 61px;
-            z-index: 1;
-            transition: all 0.3s ease-in-out;
-        }
+        border: 2px solid #dddddd;
+        border-radius: 36px;
+        text-align: center;
+        line-height: 60px;
         
     }
-    .order_address_text_no{
-        flex: 1;
-        font-size: $font_size;
-        font-weight: 700;
-        margin-left: 30px;
-    }
-    .order_address_more_icon{
-        color: $color_font_three;
-        font-size: $font_size;
-    }
    
-}
-.order_address_list {
-    height: 900px;
-    .order_address_title{
-        font-size: $font_size;
-        font-weight: 700;
-        width: 100%;
-        text-align: center;
-        padding: 20px 0 30px 0;
-    }
 }

src/pages/salesAfter/components/addressInfoDetail/index.tsx

@@ -1,122 +1,69 @@
-import { EditSaleOrderAddressApi, EditSaleOrderShipmentModeApi } from "@/api/order";
-import { alert } from "@/common/common";
-import { debounce } from "@/common/util";
-import AddressList from "@/components/AddressList";
-import Popup from "@/components/popup";
+import { AFTER_ORDER_STATUS } from "@/common/enum";
 import { Text, View } from "@tarojs/components"
 import classnames from "classnames";
-import { forwardRef, memo, useCallback, useEffect, useImperativeHandle, useMemo, useState } from "react";
+import {memo, useMemo} from "react";
 import styles  from './index.module.scss'
 
-export type AddressInfoParam = {
-    province_name: string,
-    city_name: string,
-    district_name: string,
-    address_detail: string,
-    id?: number,
-    name: string,
-    phone: string,
-}
-type Param =  {
-    onSelect?: (val:any) => void, //选择
-    defaultValue?: AddressInfoParam|null, //默认值
-    disabled?: false|true, //true禁用后只用于展示
-    shipment_mode?: 1|2, //1自提 2物流
-    onChangeShipmentMode?: (val: number) => void, //返回收货方式
-    orderId?: number //订单id
+type Param = {
+    return_address?:string, 
+    return_phone?: string, 
+    onLogistics?: (val: number) => void,
+    stage?: number
 }
+export default memo(({return_address = '', return_phone = '', onLogistics, stage}:Param) => {
+    const {
+        ReturnStageApplying,                 
+        ReturnStageWaitCheck,                
+        ReturnStageChecked,                 
+        ReturnStageReturned,                  
+        ReturnStageCancel,                    
+        ReturnStageQualityCheckPendingRefund, 
+        ReturnStageServiceOrderPendingRefund, 
+        ReturnStageRejected                  
+    } = AFTER_ORDER_STATUS
 
-export default memo(forwardRef(({onSelect, onChangeShipmentMode, defaultValue = null, orderId = 0, shipment_mode = 1}: Param, ref) => {
-    const [showAddressList, setShowAddressList] = useState(false)
+    //是否显示地址
+    const showAddress = useMemo(() => {
+        return stage != ReturnStageApplying.value 
+    }, [stage])
 
-    useEffect(() => {
-        setUserInfo(() => defaultValue)
-    }, [defaultValue])
+    //上传物流
+    const upLogistics = useMemo(() => {
+        return stage == ReturnStageWaitCheck.value
+    }, [stage])
 
-    const [userInfo, setUserInfo] = useState<any>()
+    //查看物流
+    const showLogistics = useMemo(() => {
+        return (stage == ReturnStageChecked.value || stage == ReturnStageQualityCheckPendingRefund.value)
+    }, [stage])
 
-    //地址格式
-    const formatAddress = useMemo(() => {
-        if(userInfo) 
-            return userInfo.province_name + userInfo.city_name + userInfo.district_name + userInfo.address_detail
-    }, [userInfo])
-
-    const changeShow = () => {
-        if(receivingStatus == 2)
-            setShowAddressList(() => true)
-    }
-    
-    useEffect(() => {
-        setReceivingStatus(() => shipment_mode)
-    }, [shipment_mode])
-
-    //把内部方法提供给外部
-    useImperativeHandle(ref, () => ({
-        changeShow
-    }))
-
-    //收货方法,1:自提，2物流
-    const [receivingStatus, setReceivingStatus] = useState(1)
-    const {fetchData: shipmentModeFetchData} = EditSaleOrderShipmentModeApi()
-    const onReceivingStatus = (value, e) => {
-        e.stopPropagation()
-        changeReceivingStatus(value)
-    }
-    const changeReceivingStatus = debounce(async (value) => {
-        alert.loading('正在修改')
-        const res = await shipmentModeFetchData({id: orderId, shipment_mode:value})
-        if(res.success) {
-            alert.success('收货方式修改成功')
-            onChangeShipmentMode?.(value)
-            setReceivingStatus(value)
-        } else {
-            alert.none(res.msg)
-        }
-    }, 10)
-
-    //修改地址
-    const {fetchData: addressFetchData} = EditSaleOrderAddressApi()
-    const getAddress = async (value) => {
-        alert.loading('正在修改')
-        const res = await addressFetchData({id: orderId, address_id: value.id})
-        if(res.success) {
-            alert.success('地址修改成功')
-            onSelect?.(value)
-            setShowAddressList(() => false)
-            setUserInfo(() => value)
-        } else {
-            alert.none(res.msg)
-        }
-    }
 
     return (
-        <View>
-            <View className={styles.order_address} onClick={() => changeShow()}>
-                <View className={classnames(styles.order_address_icon, 'iconfont', receivingStatus == 2?'icon-daohang':'icon-fahuo')}></View>
-                <View className={styles.order_address_text_con}>
-                    <View className={styles.order_address_text_title}>
-                        <Text>{formatAddress}</Text>
-                        {(receivingStatus == 2)&&<Text className={classnames(styles.moreIconfont,'iconfont icon-a-moreback')}></Text>}
-                    </View>
-                    <View className={styles.order_address_text_name}>
-                        <Text>{userInfo?.name}</Text>
-                        <Text>{userInfo?.phone}</Text>
+        <>
+            {showAddress&&<View className={styles.address_main}>
+                <View className={styles.address_title_tag}>
+                    <Text className={classnames(styles.miconfont, 'iconfont icon-zhuyi')}></Text>
+                    请按以下退货地址寄回货物并提供退货物流信息
+                </View>
+                <View className={styles.order_address} >
+                    <View className={classnames(styles.order_address_icon, 'iconfont','icon-fahuo')}></View>
+                    <View className={styles.order_address_text_con}>
+                        <View className={styles.order_address_text_title}>
+                            <Text  className={classnames(styles.address_text, styles.address_text_no)}>{return_address}</Text>
+                        </View>
+                        <View className={styles.order_address_text_name}>
+                            <Text>管理员</Text>
+                            <Text>{return_phone}</Text>
+                            {upLogistics&&<View className={styles.updateBtn} onClick={() => onLogistics?.(1)}>
+                                上传物流
+                            </View>}
+                            {showLogistics&&<View className={styles.updateBtn} onClick={() => onLogistics?.(2)}>
+                                查看物流
+                            </View>}
+                        </View>
                     </View>
                 </View>
-                <View className={styles.updateBtn}>
-                    <View className={styles.updateBtn_list}>
-                        <View className={classnames(styles.updateBtn_item, receivingStatus==1&&styles.updateBtn_item_select)} onClick={(e) => onReceivingStatus(1,e)}>自提</View>
-                        <View className={classnames(styles.updateBtn_item, receivingStatus==2&&styles.updateBtn_item_select)} onClick={(e) => onReceivingStatus(2,e)}>物流</View>
-                    </View>
-                    <View style={{transform: receivingStatus==1?'translateX(0)':'translateX(100%)'}} className={classnames(styles.updateBtn_select)}></View>
-                </View>
-            </View>
-            <Popup show={showAddressList} showTitle={false} onClose={() => setShowAddressList(false)}>
-                <View className={styles.order_address_list}>
-                    <View className={styles.order_address_title}>请选择收货地址</View>
-                    <AddressList onSelect={getAddress}/>
-                </View>
-            </Popup>
-        </View>
+            </View>}
+        </>
     )
-}))
+})

src/pages/salesAfter/components/applyRecord/index.module.scss

@@ -0,0 +1,146 @@
+.apply_record_scroll{
+    height: 70vh;
+}
+.apply_record_main{
+    margin-top: 20px;
+    padding: 0 30px;
+    .kind_number{
+        width: 100%;
+        padding:  20px;
+        box-sizing: border-box;
+        text{
+            background-color: #F6F6F6;
+            border-radius: 10px;
+            font-size: $font_size_medium;
+            padding: 5px 0;
+            text-align: center;
+            width: 100%;
+            display: block;
+            color: $color_font_three;
+        }
+    }
+    .orders_list_con{
+    
+        background-color: #fff;
+        border-radius: 20px;
+        padding: 20px;
+        .orders_return_title{
+            font-size: 28px;
+            font-weight: 700;
+            padding-bottom: 20px;
+        }
+        .order_list{
+            &:nth-child(n+2) {
+                margin-top: 45px;
+            }
+            .order_list_title{
+                display: flex;
+                align-items: center;
+                .tag{
+                    font-size: $font_size_min;
+                    background-color: #CDE5FF;
+                    padding: 5px 10px;
+                    border-radius: 6px;
+                    color: $color_main;
+                }
+                .title{
+                    font-weight: 700;
+                    font-size: $font_size;
+                    margin-left: 20px;
+                    flex:1;
+                }
+                .num{
+                    color: $color_font_two;
+                    font-size: $font_size_min;
+                }
+            }
+        }
+        .order_list_scroll{
+            margin-top: 30px;
+            
+            .order_list_item {
+                display: flex;
+                &:nth-child(2) {
+                    margin-top: 30px;
+                }
+                .order_list_item_img{
+                    width: 126px;
+                    height: 126px;
+                    border-radius: 20px;
+                }
+                .order_list_item_con{
+                    display: flex;
+                    width: 100%;
+                    flex:1;
+                    border-bottom: 1px solid #f0f0f0;
+                    height: 150px;
+                    padding-top: 20px;
+                    box-sizing: border-box;
+                }
+                .order_list_item_des{
+                    flex:1;
+                    box-sizing: border-box;
+                    padding-left: 30px;
+                    .order_list_item_title{
+                        font-weight: 700;
+                        font-size: $font_size;
+                        margin-bottom: 15px;
+                    }
+                    .order_list_item_price{
+                        font-size: 26px;
+                        color: $color_font_three;
+                    }
+                }
+                .order_list_item_count{
+                    display: flex;
+                    flex-direction: column;
+                    justify-content: center;
+                    align-items: flex-end;
+                    .count_num{
+                        color: $color_main;
+                        font-size: $font_size;
+                        margin-bottom: 15px;
+                        font-weight: 400;
+                        text{
+                            font-size: $font_size_min;
+                        }
+                    }
+                    .count_price {
+                        font-size: $font_size;
+                        font-weight: 700;
+                        text{
+                            font-size: $font_size_min;
+                        }
+                    }
+                }
+            }
+        }
+        .order_total{
+            padding-top: 30px;
+            display: flex;
+            justify-content: space-between;
+            text{
+                &:nth-child(1) {
+                    font-size: 28px;
+                    font-weight: 700;
+                }
+                &:nth-child(2) {
+                    font-size: 32px;
+                    font-weight: 700;
+                    color: #007AFF;
+                }
+            }
+        }
+        .order_estimated_amount{
+            display: flex;
+            align-items: flex-end;
+            flex-direction: column;
+            padding: 30px 0;
+            .order_price_des{
+                font-size: $font_size_medium;
+                color: $color_font_two;
+            }
+        }
+    }
+}
+

src/pages/salesAfter/components/applyRecord/index.tsx

@@ -0,0 +1,124 @@
+import { SaleOrderOrderDetailApi } from "@/api/salesAfterOrder";
+import { formatHashTag, formatPriceDiv } from "@/common/fotmat";
+import LabAndImg from "@/components/LabAndImg";
+import Popup from "@/components/popup";
+import { ScrollView, Text, View } from "@tarojs/components";
+import { memo, useCallback, useEffect, useMemo, useState } from "react";
+import styles  from './index.module.scss'
+
+type Param = {
+    show?: true|false,
+    onClose?: () => void,
+    onSubmit?: () => void,
+    id?: number
+}
+export default memo(({show, onClose, onSubmit, id}:Param) => {
+    useEffect(() => {
+        if(show && id) getSaleOrderPreView()
+    }, [show, id])
+
+    //获取订单详情
+    const [orderDetail, setOrderDetail] = useState<any>() //获取到的原始数据
+    const {fetchData: saleOrderOrderDetailData} = SaleOrderOrderDetailApi()
+    const getSaleOrderPreView = async () => {
+        if(id) {
+            let res = await saleOrderOrderDetailData({id: id})
+            setOrderDetail(res.data)
+        }
+        Taro.stopPullDownRefresh()       
+    }
+    //格式化数据格式
+    const [formatDetailOrder, setFormatDetailOrder] = useState<any>() //格式化后的数据
+    const formatData = () => {  
+        setFormatDetailOrder({
+            estimate_amount: orderDetail.estimate_amount, //预估金额
+            sale_mode: orderDetail.sale_mode,
+            sale_mode_name: orderDetail.sale_mode_name, 
+            total_colors: orderDetail.total_colors, //总颜色数量
+            total_number: orderDetail.total_number, //总数量
+            total_fabrics: orderDetail.total_fabrics, //面料数量
+            unit: orderDetail.sale_mode == 0?'条':'m', //单位
+            list: orderDetail.product_list,
+            stage: orderDetail.stage, //订单状态
+            type: orderDetail.type, //退货or退款
+            total_sale_price: orderDetail.total_sale_price, //销售金额
+            total_should_collect_money: orderDetail.total_should_collect_money, //应收金额
+            total_weight_error_discount: orderDetail.total_weight_error_discount, //空差优惠
+            actual_amount: orderDetail.actual_amount, //实付金额
+            the_previous_status: orderDetail.the_previous_status, //取消订单时的订单状态
+        })
+    }
+
+    //监听获取到的数据
+    useEffect(() => {
+        if(orderDetail)
+            formatData()
+    }, [orderDetail])
+
+    //对应数量
+    const formatCount = useCallback((item) => {
+        return formatDetailOrder?.sale_mode == 0? item.roll : Number(item.length / 100)
+    }, [formatDetailOrder])
+    //对应单价
+    const standardPrice = useCallback(price => {
+        return formatPriceDiv(price).toLocaleString() + '/' + (formatDetailOrder?.sale_mode == 1?'m':'kg')
+    }, [formatDetailOrder])
+    //数量格式
+    const numText = useMemo(() => {
+        if(formatDetailOrder)
+            return `${formatDetailOrder?.total_fabrics}种面料，${formatDetailOrder?.total_colors}种颜色，共${formatDetailOrder?.total_number}${formatDetailOrder?.unit}`
+    }, [formatDetailOrder])
+
+    //整理颜色
+    const labAndRgbAndUrl = useCallback((item) => {
+        return {lab:{...item?.lab}, rgb:{...item?.rgb}, texturl_url: item?.texturl_url}
+    }, [])
+
+    return (
+        <>
+            <Popup show={show} title="申请记录" onClose={onClose}>
+                {formatDetailOrder&&<View className={styles.apply_record_main}>
+                    <View className={styles.kind_number}><Text>{numText}</Text></View>
+                    <ScrollView scrollY className={styles.apply_record_scroll}>
+                        <View className={styles.orders_list_con}>
+                            {
+                                formatDetailOrder?.list?.map(item => {
+                                    return <View key={item.product_code} className={styles.order_list}>
+                                        <View className={styles.order_list_title}>
+                                            <View className={styles.tag}>{formatDetailOrder.sale_mode_name}</View>
+                                            <View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
+                                            <View className={styles.num}>共{item?.product_colors.length}种</View>
+                                        </View>
+                                        <View className={styles.order_list_scroll}>
+                                            {item?.product_colors?.map(colorItem => {
+                                                return <View key={colorItem.id} className={styles.order_list_item}>
+                                                    <View className={styles.order_list_item_img}>
+                                                        <LabAndImg value={labAndRgbAndUrl(colorItem)}/>
+                                                    </View>
+                                                    <View className={styles.order_list_item_con}>
+                                                        <View className={styles.order_list_item_des}>
+                                                            <View className={styles.order_list_item_title}>{colorItem.code + ' ' + colorItem.name}</View>
+                                                            <View className={styles.order_list_item_price}>¥{standardPrice(colorItem.sale_price)}</View>
+                                                        </View>
+                                                        <View className={styles.order_list_item_count}>
+                                                            <View className={styles.count_num}>×{formatCount(colorItem)}<text>{formatDetailOrder.unit}</text></View>
+                                                            <View className={styles.count_price}><text>¥</text>{formatPriceDiv(colorItem.estimate_amount).toLocaleString()}</View>
+                                                        </View>
+                                                    </View>
+                                                </View>
+                                            })}
+                                        </View>
+                                    </View>
+                                })
+                            }
+                            <View className={styles.order_total}>
+                                <Text>申请条数</Text>
+                                <Text>×{orderDetail?.total_number}</Text>
+                            </View>
+                        </View>
+                    </ScrollView>
+                </View>}
+            </Popup>  
+        </>
+    )
+})

src/pages/salesAfter/components/kindList/index.module.scss

@@ -1,14 +1,17 @@
 
-.orders_list_title{
-    padding: 20px 20px 10px 20px;
-    color: $color_font_two;
-    font-size: $font_size_medium;
+.kindsList_main{
+    margin-top: 20px;
 }
 .orders_list_con{
     
     background-color: #fff;
     border-radius: 20px;
     padding: 20px;
+    .orders_return_title{
+        font-size: 28px;
+        font-weight: 700;
+        padding-bottom: 20px;
+    }
     .order_list{
         &:nth-child(n+2) {
             margin-top: 30px;
@@ -47,7 +50,6 @@
                 width: 126px;
                 height: 126px;
                 border-radius: 20px;
-                background-color: red;
             }
             .order_list_item_con{
                 display: flex;
@@ -96,6 +98,21 @@
             }
         }
     }
+    .order_total{
+        padding-top: 20px;
+        display: flex;
+        justify-content: space-between;
+        text{
+            &:nth-child(1) {
+                font-size: 28px;
+                font-weight: 700;
+            }
+            &:nth-child(2) {
+                font-size: 24px;
+                font-weight: 700;
+            }
+        }
+    }
     .order_estimated_amount{
         display: flex;
         align-items: flex-end;

src/pages/salesAfter/components/kindList/index.tsx

@@ -1,6 +1,7 @@
 import { ORDER_STATUS } from "@/common/enum"
 import { formatHashTag, formatPriceDiv } from "@/common/fotmat"
-import { View } from "@tarojs/components"
+import LabAndImg from "@/components/LabAndImg"
+import { Text, View } from "@tarojs/components"
 import { memo, useCallback, useMemo } from "react"
 import EstimatedAmount from "../estimatedAmount"
 import styles  from './index.module.scss'
@@ -14,7 +15,8 @@ type OrderParam = {
     total_colors: number,
     total_fabrics: number,
     total_number: number,
-    status: number, //订单状态
+    stage: number, //订单状态
+    type: 1|2, //1退货， 2退款
     total_sale_price: number, //销售金额
     total_should_collect_money: number, //应收金额
     total_weight_error_discount: number, //空差优惠
@@ -43,48 +45,60 @@ export default memo(({order, comfirm = false}:Param) => {
             return `${order?.total_fabrics}种面料，${order?.total_colors}种颜色，共${order?.total_number}${order?.unit}`
     }, [order])
 
-    const {
-        SaleOrderStatusBooking, // 待接单
-        SaleOrderStatusArranging, // 配布中
-        SaleOrderStatusArranged, // 已配布
-        SaleOrderStatusWaitingPayment, // 待付款
-        SaleOrderStatusWaitingDelivery, // 待发货
-        SaleOrderStatusWaitingReceipt, // 待收货
-        SaleOrderStatusAlreadyReceipt, // 已收货
-        SaleOrderStatusComplete, // 已完成
-        SaleOrderStatusRefund, // 已退款
-        SaleOrderStatusCancel, // 已取消
-    } = ORDER_STATUS
+    // const {
+    //     SaleOrderStatusBooking, // 待接单
+    //     SaleOrderStatusArranging, // 配布中
+    //     SaleOrderStatusArranged, // 已配布
+    //     SaleOrderStatusWaitingPayment, // 待付款
+    //     SaleOrderStatusWaitingDelivery, // 待发货
+    //     SaleOrderStatusWaitingReceipt, // 待收货
+    //     SaleOrderStatusAlreadyReceipt, // 已收货
+    //     SaleOrderStatusComplete, // 已完成
+    //     SaleOrderStatusRefund, // 已退款
+    //     SaleOrderStatusCancel, // 已取消
+    // } = ORDER_STATUS
 
     //金额列表枚举
     const priceList = [
         {
             id:1,
-            value:[SaleOrderStatusBooking.value, SaleOrderStatusArranging.value],
-            label:'预估金额',
+            value:[],
+            label:'退货条数',
             field: 'estimate_amount'
         },
         {
             id:2,
-            value:[SaleOrderStatusArranged.value, SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value],
-            label:'合计金额',
+            value:[],
+            label:'扣款金额',
             field: 'total_sale_price'
         },
         {
             id:3,
-            value:[SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value],
-            label:'空差优惠',
+            value:[],
+            label:'其他扣款',
             field: 'total_weight_error_discount'
         },
         {
             id:4,
-            value:[ SaleOrderStatusWaitingPayment.value],
-            label:'应付金额',
+            value:[],
+            label:'应退金额',
             field: 'total_should_collect_money'
         },
         {
             id:5,
-            value:[SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value],
+            value:[],
+            label:'退款金额',
+            field: 'total_should_collect_money'
+        },
+        {
+            id:6,
+            value:[],
+            label:'退款去向',
+            field: 'actual_amount'
+        },
+        {
+            id:7,
+            value:[],
             label:'实付金额',
             field: 'actual_amount'
         }
@@ -97,38 +111,26 @@ export default memo(({order, comfirm = false}:Param) => {
 
     const priceConDom = useMemo(() => {
         if(!order) return
-        //确认订单
-        if(comfirm == true) {
-            return <EstimatedAmount  number={formatPriceDiv(order.estimate_amount)} title="预估金额" />
-        } 
-        //订单为取消订单状态
-        if(order?.status == SaleOrderStatusCancel.value) {
-            return (
-                <>
-                    {
-                        priceList.map(item => {
-                          return <>{showPrice(item, order?.the_previous_status)&&<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field])} title={item.label} />}</>
-                        })
-                    }
-                </>
-            )
-        } else {
-            return (
-                <>
-                    {
-                        priceList.map(item => {
-                          return <>{showPrice(item, order?.status)&&<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field])} title={item.label} />}</>
-                        })
-                    }
-                </>
-            )
-        }   
+        return (
+            <>
+                {
+                    priceList.map(item => {
+                      return <>{showPrice(item, order?.stage)&&<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field])} title={item.label} />}</>
+                    })
+                }
+            </>
+        )  
     }, [order])
+
+    //整理颜色
+    const labAndRgbAndUrl = useCallback((item) => {
+        return {lab:{...item?.lab}, rgb:{...item?.rgb}, texturl_url: item?.texturl_url}
+    }, [])
     
     return (
-        <>
-            <View className={styles.orders_list_title}>{numText}</View>
+        <View className={styles.kindsList_main}>
             <View className={styles.orders_list_con}>
+                <View className={styles.orders_return_title}>{order?.type == 1?'退货信息':'退款信息'}</View>
                 {
                     order?.list?.map(item => {
                         return <View key={item.product_code} className={styles.order_list}>
@@ -140,7 +142,9 @@ export default memo(({order, comfirm = false}:Param) => {
                             <View className={styles.order_list_scroll}>
                                 {item?.product_colors?.map(colorItem => {
                                     return <View key={colorItem.id} className={styles.order_list_item}>
-                                        <View className={styles.order_list_item_img}></View>
+                                        <View className={styles.order_list_item_img}>
+                                            <LabAndImg value={labAndRgbAndUrl(colorItem)}/>
+                                        </View>
                                         <View className={styles.order_list_item_con}>
                                             <View className={styles.order_list_item_des}>
                                                 <View className={styles.order_list_item_title}>{colorItem.code + ' ' + colorItem.name}</View>
@@ -157,10 +161,11 @@ export default memo(({order, comfirm = false}:Param) => {
                         </View>
                     })
                 }
+                <View className={styles.order_total}><Text>合计</Text><Text>{numText}</Text></View>
                 <View className={styles.order_estimated_amount}>
                     {priceConDom}     
                 </View>
             </View>
-        </>
+        </View>
     )
 })

src/pages/salesAfter/components/orderState copy/index.module.scss

@@ -1,18 +0,0 @@
-.order_flow_state{
-    display: flex;
-    align-items: center;
-    padding: 0 30px;
-    height: 116px;
-    background-color: #fff;
-    border-radius: 20px;
-    .order_flow_state_text{
-        color: $color_main;
-        font-size:$font_size;
-        font-weight: 700;
-    }
-    .order_flow_state_desc{
-        color: $color_font_three;
-        font-size: $font_size_medium;
-        margin-left: 50px;
-    }
-}

src/pages/salesAfter/components/orderState copy/index.tsx

@@ -1,14 +0,0 @@
-import { View } from "@tarojs/components"
-import styles  from './index.module.scss'
-
-export default ({
-    state = '',
-    desc = ''
-}) => {
-    return (
-        <View className={styles.order_flow_state}>
-            <View className={styles.order_flow_state_text}>{state}</View>
-            <View className={styles.order_flow_state_desc}>{desc}</View>
-        </View>
-    )
-}

src/pages/salesAfter/components/orderState/index.module.scss

@@ -15,7 +15,6 @@
     }
     .order_status_item{
         position: relative;
-        padding-left: 50px;
         &:nth-last-child(n+2) {
             padding-bottom: 30px;
         }
@@ -44,6 +43,7 @@
         .order_status_content{
             display: flex;
             align-items: center;
+            padding: 0 30px;
             .order_status_title{
                 color: $color_font_two;
                 font-size: $font_size;
@@ -75,6 +75,24 @@
         .order_status_des_select{
             color: $color_font_one;
         }
+        .pay_time{
+            height: 56px;
+            background: #f6f6f6;
+            border-radius: 20px;
+            color: #3C3C3C;
+            font-size: 24px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-weight: 700;
+            margin-top: 20px;
+            text{
+                font-size: 28px;
+                color: $color_main;
+                padding: 0 10px;
+                
+            }
+        }
     }
     .more{
         width: 100%;
@@ -102,4 +120,20 @@
         top: -10px;
         right: -10px;
     }
+    .refresh{
+        position: absolute;
+        top: 23px;
+        right: 20px;
+        display: flex;
+        color: #707070;
+        display: flex;
+        align-items: center;
+        
+        .mconfont{
+            font-size: 30px;
+        }
+        .refresh_text{
+            font-size: 23px;
+        }
+    }
 }

src/pages/salesAfter/components/orderState/index.tsx

@@ -1,42 +1,59 @@
 import { Image, Text, View } from "@tarojs/components"
-import { memo, useMemo, useState } from "react"
+import { memo, useEffect, useMemo, useRef, useState } from "react"
 import styles  from './index.module.scss'
 import classnames from "classnames";
 import { formatDateTime, formatImgUrl } from "@/common/fotmat";
-import { PAYMENT_METHOD, PAYMENT_METHOD_PARAM } from "@/common/enum";
+import { ORDER_STATUS, PAYMENT_METHOD, PAYMENT_METHOD_PARAM } from "@/common/enum";
+import * as dayjs from 'dayjs'
 
-
-
-type Param = {
-    list: {
-        status: string,
-        time: string,
-        tag: string,
-        desc: string
-    }[],
-    payment_method: 0|PAYMENT_METHOD_PARAM,
-    
+type List = {
+    status: string,
+    time: string,
+    tag: string,
+    desc: string,
+    expire_time: string
 }
 
-//支付方式枚举
-const {
-    PaymentMethodAccountPeriod,
-    PaymentMethodCashOnDelivery,
-} = PAYMENT_METHOD
+type Param = {
+    onRefresh?: () => void,
+    orderInfo?: {
+        logistics_details:List[], //订单状态列表
+        payment_method: 0|PAYMENT_METHOD_PARAM, //支付方式
+        status: number, //订单状态
+    }
+}
 
-export default memo(({list = [], payment_method = 0}:Param) => {
+
+
+export default memo(({orderInfo = {logistics_details: [],payment_method: 0, status: 0}, onRefresh}:Param) => {
     
     const [showMore, setShowMore] = useState(false)
     const changeMore = () => {
         setShowMore(() => !showMore)
     }
     const dataList = useMemo(() => {
-        return list.reverse()
-    }, [list])
+        return orderInfo.logistics_details?orderInfo?.logistics_details.reverse():[]
+    }, [orderInfo.logistics_details])
 
+    //订单状态枚举
+    const {SaleorderstatusWaitingPrePayment} = ORDER_STATUS
+
+    //支付方式枚举
+    const {
+        PaymentMethodAccountPeriod,
+        PaymentMethodCashOnDelivery,
+    } = PAYMENT_METHOD
+
+    //获取预付款最后时间
+    const endTime = useMemo(() => {
+        if(orderInfo.status == SaleorderstatusWaitingPrePayment.value && orderInfo.logistics_details.length > 0) {
+            return orderInfo.logistics_details[0].expire_time
+        } 
+        return ''
+    }, [orderInfo])
     return (
         <>
-            {(dataList.length > 0)&&<View className={styles.order_flow_state}>
+            {(dataList?.length > 0)&&<View className={styles.order_flow_state}>
                 <View className={classnames(styles.order_status_list, showMore&&styles.order_status_list_show)}>
                     {dataList.map((item, index) => <View className={styles.order_status_item}>
                         {(dataList.length > 1)&&<View className={classnames(styles.order_status_tail, (index == 0)&&styles.order_status_tail_end)}></View>}
@@ -44,9 +61,9 @@ export default memo(({list = [], payment_method = 0}:Param) => {
                         <View className={styles.order_status_content}>
                             <View className={classnames(styles.order_status_title, (index == 0)&&styles.order_status_select)}>{item.status}</View>
                             <View className={classnames(styles.order_status_time, (index == 0)&&styles.order_status_select)}>{formatDateTime(item.time)}</View>
-                            {/* <View className={classnames(styles.order_status_tag, (index == 0)&&styles.order_status_tag_select)}>{item.tag}</View> */}
                         </View>
                         <Text className={classnames(styles.order_status_des, (index == 0)&&styles.order_status_des_select)}>{item.desc}</Text>
+                        {(orderInfo.status == SaleorderstatusWaitingPrePayment.value)&&<CountDown onFinish={onRefresh} endTime={endTime}/>}
                     </View>)}
                 </View>
                 {(dataList.length > 2) && <View className={styles.more} onClick={() => changeMore()}>
@@ -54,10 +71,62 @@ export default memo(({list = [], payment_method = 0}:Param) => {
                     <Text className={classnames('iconfont icon-a-moreback', styles.miconfonts, showMore&&styles.open_miconfonts)}></Text>
                 </View>}
                 <View className={styles.image_tag}>
-                    {(payment_method == PaymentMethodAccountPeriod.value)&&<Image mode="aspectFit" src={formatImgUrl('/mall/order_pay_status.png')} className={styles.image}/>}
-                    {(payment_method == PaymentMethodCashOnDelivery.value)&&<Image mode="aspectFit" src={formatImgUrl('/mall/order_pay_status_7day.png')} className={styles.image}/>}
+                    {(orderInfo.payment_method == PaymentMethodCashOnDelivery.value)&&<Image mode="aspectFit" src={formatImgUrl('/mall/order_pay_status.png')} className={styles.image}/>}
+                    {(orderInfo.payment_method == PaymentMethodAccountPeriod.value)&&<Image mode="aspectFit" src={formatImgUrl('/mall/order_pay_status_7day.png')} className={styles.image}/>}
                 </View>
+                {(orderInfo.status == SaleorderstatusWaitingPrePayment.value)&&<View className={styles.refresh} onClick={onRefresh}>
+                    <Text className={classnames(styles.mconfont, 'iconfont icon-xianxiahuikuan')}></Text>
+                    <Text className={classnames(styles.refresh_text)}>刷新</Text>
+                </View>}
             </View>}
         </>
     )
-})
+})
+
+//倒计时
+const CountDown = ({endTime = '', onFinish}:{endTime:string, onFinish?:() => void}) => {
+    const [showTime, setShowTime] = useState('')
+    const timeObj:any = useRef()
+    useEffect(() => {
+        if(endTime) {
+            clearInterval(timeObj.current)
+            timeObj.current = setInterval(() => {
+                count_down()
+            }, 1000)
+        }
+        return () => {
+            clearInterval(timeObj.current)
+        }
+    }, [endTime])
+    const count_down = () => {
+        var startData = dayjs();
+        var endDate = dayjs(endTime);
+        if(startData >= endDate)  {
+            clearInterval(timeObj.current)
+            onFinish?.()
+            setShowTime(() => '00:00:00')
+            return false
+        }
+        var _dd = endDate.diff(startData,'day');
+        var _hh = endDate.diff(startData,'hour');
+        var _mm = endDate.diff(startData,'minute');
+        var _ss = endDate.diff(startData,'second');
+        // 转换
+        var hh = _hh - (_dd*24);
+        var mm = _mm - (_hh*60);
+        var ss = _ss - (_mm*60);
+        // 格式化
+        var DD =  ('00'+_dd).slice(-2);
+        var HH =  ('00'+hh).slice(-2);
+        var MM =  ('00'+mm).slice(-2);
+        var SS =  ('00'+ss).slice(-2);
+        setShowTime(() => ` ${HH}:${MM}:${SS}`)
+    }
+    return (
+        <>
+            <View className={styles.pay_time}>
+                剩<Text>{showTime||'--:--:--'}</Text>支付关闭，订单自动取消
+            </View>
+        </>
+    )
+}

src/pages/salesAfter/components/returnLogistics/index.module.scss

@@ -0,0 +1,35 @@
+
+.logistics_main{
+    padding: 20px 30px;
+    box-sizing: border-box;
+    .logistics_image{
+        display: flex;
+        .title_desc{
+            font-size: 28px;
+            font-weight: 700;
+            padding-top: 50px;
+            box-sizing: border-box;
+        }
+        .upload_image{
+            flex:1;
+        }
+    }
+    .logistics_desc{
+        margin-top: 50px;
+    }
+    .btns_two{
+        display: flex;
+        height: 82px;
+        font-size: $font_size_big;
+        border-radius: 40px;
+        margin-top: 50px;
+        .verify_btn{
+            flex:1;
+            border-radius: 40px;
+            background: #007aff;
+            text-align: center;
+            line-height: 82px;
+            color: #fff;
+        }
+    }
+}

src/pages/salesAfter/components/returnLogistics/index.tsx

@@ -0,0 +1,70 @@
+import Popup from "@/components/popup";
+import { Text, View } from "@tarojs/components";
+import { memo, useCallback, useEffect, useRef, useState } from "react";
+import UploadImage from "@/components/uploadImage"
+import styles  from './index.module.scss'
+import TextareaEnhance from "@/components/textareaEnhance";
+import { ReturnApplyLogisticsApi } from "@/api/salesAfterOrder";
+import { alert } from "@/common/common";
+
+type Param = {
+    show?: true|false,
+    onClose?: () => void,
+    onSubmit?: () => void,
+    id?: number //订单id
+}
+export default memo(({show = false, onClose, onSubmit, id = 0}: Param) => {
+    //需要提交的数据
+    const submitData = useRef({
+        accessory_url: [],
+        remark: '',
+        id: 0
+    })
+    useEffect(() => {
+        if(id) submitData.current.id = id
+    }, [id])
+
+    //获取图片列表
+    const getImageList = useCallback((list) => {
+        submitData.current.accessory_url = list
+    }, [])
+
+    //备注
+    const getOtherReason = useCallback((val) => {
+        submitData.current.remark = val
+    }, [])
+
+    //确定
+    const {fetchData} = ReturnApplyLogisticsApi()
+    const onSubmitEven = async () => {
+        if(!id) return alert.error('参数有误')
+        if(submitData.current.accessory_url.length <= 0) return alert.error('请上传附件')
+        let res = await fetchData(submitData.current)
+        if(res.success) {
+            alert.success('上传成功')
+        } else {
+            alert.error('上传失败')
+        }
+    }
+
+    return (
+        <>
+            <Popup show={show} title="上传物流" onClose={onClose}>
+                <View className={styles.logistics_main}>
+                    <View className={styles.logistics_image}>
+                        <Text className={styles.title_desc}>上传附件：</Text>
+                        <View className={styles.upload_image}>
+                            <UploadImage onChange={getImageList}/>
+                        </View>
+                    </View>
+                    <View className={styles.logistics_desc}>
+                        <TextareaEnhance onChange={getOtherReason} title="备注：" placeholder="请输入备注信息"/>
+                    </View>
+                    <View  className={styles.btns_two}>
+                        <View  className={styles.verify_btn } onClick={() => onSubmitEven()}>保存</View>
+                    </View >
+                </View>
+            </Popup>                       
+        </>
+    )   
+})

src/pages/salesAfter/index.tsx

@@ -3,18 +3,23 @@ import {
     EditSaleOrderRemarkApi, 
 } from "@/api/order";
 import { GetOrderPayApi } from "@/api/orderPay";
+import { SaleOrderOrderDetailApi } from "@/api/salesAfterOrder";
 import { alert, goLink } from "@/common/common";
 import { ORDER_STATUS } from "@/common/enum";
 import { formatDateTime, formatImgUrl, formatPriceDiv } from "@/common/fotmat";
+import AfterOrderBtns from "@/components/afterOrderBtns";
 import OrderBtns from "@/components/orderBtns";
 import SearchInput from "@/components/searchInput";
 import { Image, Text, Textarea, View } from "@tarojs/components"
 import Taro, {useDidShow, usePullDownRefresh, useRouter } from "@tarojs/taro";
 import classnames from "classnames";
 import { useCallback, useEffect, useMemo, useRef, useState, memo } from "react";
+import AddressInfoDetail from "./components/addressInfoDetail";
+import ApplyRecord from "./components/applyRecord";
 import ContentBox from "./components/contentBox";
 import KindList from "./components/kindList";
 import OrderState from "./components/orderState";
+import ReturnLogistics from "./components/returnLogistics";
 import styles  from './index.module.scss'
  
  export default () => {
@@ -27,10 +32,10 @@ import styles  from './index.module.scss'
 
     //获取订单详情
     const [orderDetail, setOrderDetail] = useState<any>() //获取到的原始数据
-    const {fetchData: getOrderFetchData} = GetSaleOrderDetailApi()
+    const {fetchData: saleOrderOrderDetailData} = SaleOrderOrderDetailApi()
     const getSaleOrderPreView = async () => {
         if(orderId.current) {
-            let res = await getOrderFetchData({id: orderId.current})
+            let res = await saleOrderOrderDetailData({id: orderId.current})
             setOrderDetail(res.data)
         }
         Taro.stopPullDownRefresh()       
@@ -54,7 +59,8 @@ import styles  from './index.module.scss'
             total_fabrics: orderDetail.total_fabrics, //面料数量
             unit: orderDetail.sale_mode == 0?'条':'m', //单位
             list: orderDetail.product_list,
-            status: orderDetail.status, //订单状态
+            stage: orderDetail.stage, //订单状态
+            type: orderDetail.type, //退货or退款
             total_sale_price: orderDetail.total_sale_price, //销售金额
             total_should_collect_money: orderDetail.total_should_collect_money, //应收金额
             total_weight_error_discount: orderDetail.total_weight_error_discount, //空差优惠
@@ -69,13 +75,7 @@ import styles  from './index.module.scss'
 
     //获取底部按钮点击, 获取按钮状态
     const orderStateClick = useCallback((val) => {
-        if(val == 1) {
-            //取消订单
-            getSaleOrderPreView()
-        }
-        if(val == 2) {
-
-        }
+        
     }, [orderDetail])
 
     //页面下拉刷新
@@ -87,34 +87,61 @@ import styles  from './index.module.scss'
     //按钮所需数据
     const orderInfo = useMemo(() => {
         return {
-            status: orderDetail?.status, //订单状态
+            stage: orderDetail?.stage, //售后订单状态
             orderId: orderDetail?.id,
             settle_mode: orderDetail?.settle_mode,
-            actual_amount: orderDetail?.actual_amount, //实付金额
-            wait_pay_amount: orderDetail?.wait_pay_amount, //待付金额
+            type: orderDetail?.type, //退货or退款
+            sale_mode: orderDetail?.sale_model, //订单类型
         }
     }, [orderDetail])
 
     //订单状态枚举
     const {SaleOrderStatusCancel} = ORDER_STATUS
 
+    //物流显示
+    const [logisticsShow, setLogisticsShow] = useState(false)
+    const onShowLogistics = useCallback((val) => {
+        if(val == 1) {
+            setLogisticsShow(true)
+        } else {
+            const list = orderDetail?.fabric_piece_accessory_url.map(item => {
+                return formatImgUrl(item)
+            })
+            Taro.previewImage({
+                current: list[0], // 当前显示
+                urls: list // 需要预览的图片http链接列表
+            })
+        }
+    }, [orderDetail])
+    const onCloseLogistics = useCallback(() => setLogisticsShow(false), [])
+    //物流成功上传
+    const logisticsSuccess = useCallback(() => {
+        getSaleOrderPreView()
+    }, [])
+
+    //显示生气记录
+    const [applyRecord, setApplyRecord] = useState(false)
+
     return (
         <View className={styles.order_main}>
-            <OrderState list={orderDetail?.logistics_details} payment_method={orderDetail?.payment_method}/>
+            <OrderState orderInfo={orderDetail}/>
+            <AddressInfoDetail return_address={orderDetail?.return_address} return_phone={orderDetail?.return_phone} stage={orderDetail?.stage} onLogistics={onShowLogistics}/>
             <KindList order={formatPreViewOrderMemo}/>
-            <OrderDes/>
+            <OrderDes orderInfo={orderDetail}/>
             {(orderDetail?.status != SaleOrderStatusCancel.value)&&<View className={styles.submit_order}>
-                <OrderBtns orderInfo={orderInfo} onClick={orderStateClick}/>
+                <AfterOrderBtns orderInfo={orderInfo} onClick={orderStateClick}/>
             </View>}       
-            <AfterSalePricture/>
+            <AfterSalePricture urls={orderDetail?.fabric_piece_accessory_url}/>
+            <ReturnLogistics show={logisticsShow} id={orderDetail?.return_apply_order_id} onClose={onCloseLogistics} onSubmit={logisticsSuccess}/>
+            <ApplyRecord show={applyRecord} id={orderDetail?.id} onClose={() => setApplyRecord(false)}/>
             <View className="common_safe_area_y"></View>
         </View>
     )
  }
 
- const OrderDes = memo(({val = ''}:{val?:string}) => {
+ const OrderDes = memo(({orderInfo}:{orderInfo?:any}) => {
     //复制功能
-    const clipboardData = () => {
+    const clipboardData = (val) => {
         Taro.setClipboardData({
             data: val,
             success: function (res) {
@@ -130,58 +157,57 @@ import styles  from './index.module.scss'
             <View className={styles.order_info_title}>订单信息</View>
             <SearchInput showBorder={false} title='售后单号' height={50}>
                 <View className={styles.order_num}>
-                    <Text>RA-LY-2204240002</Text>
-                    <View className={styles.order_num_btn} onClick={() => clipboardData()}>复制</View>
+                    <Text>{orderInfo?.return_order_no}</Text>
+                    <View className={styles.order_num_btn} onClick={() => clipboardData(orderInfo?.return_order_no)}>复制</View>
                 </View>
             </SearchInput>
             <SearchInput showBorder={false} title='订单号' height={50}>
                 <View className={styles.order_num}>
-                    <Text>XS-LY-2204210002</Text>
-                    <View className={styles.order_num_btn} onClick={() => clipboardData()}>复制</View>
+                    <Text>{orderInfo?.order_no}</Text>
+                    <View className={styles.order_num_btn} onClick={() => clipboardData(orderInfo?.order_no)}>复制</View>
                 </View>
             </SearchInput>
-            <SearchInput showBorder={false} title='退款说明' height={50}>
-                <Text>其他问题</Text>
+            <SearchInput showBorder={false} title='退货原因' height={50}>
+                <Text>{orderInfo?.return_reason_name}</Text>
+            </SearchInput>
+            <SearchInput showBorder={false} title='退货说明' height={50}>
+                <Text>{orderInfo?.return_explain_name}</Text>
             </SearchInput>
             <SearchInput showBorder={false} title='其它说明' height={50}>
-                <Text>板布疵点太多</Text>
+                <Text>{orderInfo?.return_remark}</Text>
+            </SearchInput>
+            <SearchInput showBorder={false} title='货物状况' height={50}>
+                <Text>{orderInfo?.goods_status_name}</Text>
             </SearchInput>
             <SearchInput showBorder={false} title='申请时间' height={50}>
-                <Text>2022-04-24 08:32:39</Text>
+                <Text>{formatDateTime(orderInfo?.apply_time)}</Text>
             </SearchInput>
         </View>
     )
  })
 
- const AfterSalePricture = memo(() => {
+ const AfterSalePricture = memo(({urls = []}:{urls: string[]}) => {
+
+    const showList = useMemo(() => {
+        let res = urls.map(item => {
+            return formatImgUrl(item)
+        })
+        return res
+    }, [urls])
+
      //预览图片
     const showImage = () => {
         Taro.previewImage({
-            current: formatImgUrl(''), // 当前显示
-            urls: [formatImgUrl('')] // 需要预览的图片http链接列表
+            current: showList[0], // 当前显示
+            urls: showList // 需要预览的图片http链接列表
         })
     }
     return (
         <ContentBox title="售后图片">
             <View className={styles.after_sale_picture_list}>
-                <View className={styles.after_sale_picture_item} onClick={showImage}>
-                    <Image src={formatImgUrl('')} />
-                </View>
-                <View className={styles.after_sale_picture_item} onClick={showImage}>
-                    <Image src={formatImgUrl('')}/>
-                </View>
-                <View className={styles.after_sale_picture_item}>
-                    <Image src={formatImgUrl('')}/>
-                </View>
-                <View className={styles.after_sale_picture_item}>
-                    <Image src={formatImgUrl('')}/>
-                </View>
-                <View className={styles.after_sale_picture_item}>
-                    <Image src={formatImgUrl('')}/>
-                </View>
-                <View className={styles.after_sale_picture_item}>
-                    <Image src={formatImgUrl('')}/>
-                </View>
+                {urls?.map(item=> <View className={styles.after_sale_picture_item} onClick={showImage}>
+                    <Image src={formatImgUrl(item)} />
+                </View>)}
             </View>
         </ContentBox>
     )

src/pages/salesAfterList/components/order/index.module.scss

@@ -14,6 +14,8 @@
                 font-weight: 700;
                 margin-left: 15px;
                 font-size: $font_size;
+                width: 100px;
+                @include common_ellipsis();
             }
             image{
                 width: 70px;
@@ -26,7 +28,7 @@
             font-size: $font_size_medium;
             color: $color_font_one; 
             text-align: right;
-            padding-right: 30px;
+            padding-right: 10px;
             display: flex;
             justify-content: flex-end;
             align-items: center;
@@ -69,23 +71,22 @@
         .image{
             width: 126px;
             height: 126px;
-            background: #e5ad3a;
-            border-radius: 20px 20px 0px 0px;
+            border-radius: 20px ;
             position: relative;
             image{
                 width: 100%;
                 height: 100%;
-                border-radius: 20px 20px 0px 0px;
+                border-radius: 20px ;
             }
             .color_num {
                 background: rgba(0,0,0, 0.5);
-                border-radius: 50px 0px 0px 0px;
+                border-radius: 36px 0px 20px 0px;
                 font-size: $font_size_min;
                 color: #fff;
                 position: absolute;
                 right:0;
                 bottom:0;
-                padding: 5px 10px;
+                padding: 5px 10px 5px 15px;
                 box-sizing: border-box;
             }
         }
@@ -123,7 +124,7 @@
         display: flex;
         background-color: #F6F6F6;
         padding: 20px;
-        margin-top: 20px;
+        margin: 20px 0;
         align-items: center;
         font-size: $font_size_medium;
         border-radius: 10px;

src/pages/salesAfterList/components/order/index.tsx

@@ -1,6 +1,7 @@
 import { goLink } from "@/common/common";
 import { formatHashTag, formatImgUrl, formatPriceDiv } from "@/common/fotmat";
-import OrderBtns from "@/components/orderBtns";
+import AfterOrderBtns from "@/components/afterOrderBtns";
+import LabAndImg from "@/components/LabAndImg";
 import { useSelector } from "@/reducers/hooks";
 import { Image, Text, View } from "@tarojs/components"
 import classnames from "classnames";
@@ -11,20 +12,21 @@ import styles  from './index.module.scss'
 type Param = {
     value: {
         order_no: string,
+        return_order_no: string,
         sale_mode: number,
         sale_mode_name: string,
-        status_name: string,
+        stage_name: string,
         shipment_mode_name: string,
         product_list: any[],
         total_fabrics: number,
         total_colors: number,
         total_number: number,
-        status: 0,
+        stage: 0,
         id: number,
-        payment_method: number, //支付方式
-        actual_amount: number, //实付金额
-        wait_pay_amount: number //待付金额
-        should_collect_order_id: number //应付单id
+        lab: {l:number, a:number, b:number},
+        rgb: {r:number, g:number, b:number},
+        texturl_url: string,
+        type: number //1 退货 2退款
     },
     onClickBtn?: (val:{status:number, orderInfo:Param['value']}) => void
 }
@@ -47,13 +49,18 @@ export default memo(({value, onClickBtn}: Param) => {
     //按钮所需数据
     const orderInfo = useMemo(() => {
         return {
-            status: value?.status, //订单状态
+            stage: value?.stage, //订单状态
             orderId: value?.id,
-            actual_amount: value?.actual_amount, //实付金额
-            wait_pay_amount: value?.wait_pay_amount, //待付金额
+            sale_mode: value?.sale_mode, //订单类型
+            type: value?.type //退货or退款
         }
     }, [value])
 
+    //整理颜色
+    const labAndRgbAndUrl = useMemo(() => {
+        return {lab:{...value?.lab}, rgb:{...value?.rgb}, texturl_url: value?.texturl_url}
+    }, [value])
+
     return (
         <View className={styles.order_item}>
             <View className={styles.header} onClick={() => goLink('/pages/salesAfter/index', {id: value?.id})}>
@@ -62,21 +69,21 @@ export default memo(({value, onClickBtn}: Param) => {
                 <Text className={styles.name}>{userInfo?.adminUserInfo?.user_name}</Text>
                 </View>
                 <View className={styles.order_num}>
-                <Text>订单号：{value?.order_no}</Text>
+                <Text>售后单号：{value?.return_order_no}</Text>
                 <Text className={classnames(styles.miconfont, 'iconfont, icon-a-moreback')}></Text>
                 </View>
-                <OrderStatusTag status={1}/>
+                <OrderStatusTag status={value?.type}/>
             </View>
             <View className={styles.product_con} onClick={() => goLink('/pages/salesAfter/index', {id: value?.id})}>
                 <View className={styles.product_title}>
                     <View className={styles.product_tag}>{value?.sale_mode_name}</View>
                     <View className={styles.product_name}>{formatHashTag(value?.product_list[0].code, value?.product_list[0].name)}</View>
-                    <View className={styles.product_status}>{value?.status_name}</View>
+                    <View className={styles.product_status}>{value?.stage_name}</View>
                 </View>
                 <View className={styles.product_list}>
                     <View className={styles.image}>
-                    <Image src={formatImgUrl(value?.product_list[0].product_colors[0].texture_url)}/>
-                    <View className={styles.color_num}>{value?.product_list[0].product_colors[0].code}</View>
+                        <LabAndImg value={labAndRgbAndUrl}/>
+                        <View className={styles.color_num}>{value?.product_list[0].product_colors[0].code}</View>
                     </View>
                     <View className={styles.color_list}>
                         {value?.product_list[0].product_colors.map((itemColor, index) => {
@@ -98,11 +105,11 @@ export default memo(({value, onClickBtn}: Param) => {
                 </View>
                 <View className={styles.color_count_num}>{`${value?.total_fabrics}种面料，${value?.total_colors}种颜色，共${value?.total_number}条`}</View>
                 <View className={styles.order_number}>
-                    <Text>已申请退款</Text>
-                    <Text>订单号：LY2278204399678</Text>
+                    <Text>{value?.type == 1?'已申请退货':'已申请退款'}</Text>
+                    <Text>订单号：{value?.order_no}</Text>
                 </View>
             </View>
-            <OrderBtns orderInfo={orderInfo} onClick={orderBtnsClick}/>
+            <AfterOrderBtns orderInfo={orderInfo} onClick={orderBtnsClick}/>
         </View>
     )
 })

src/pages/salesAfterList/components/orderStatusTag/index.tsx

@@ -5,14 +5,14 @@ import styles  from './index.module.scss'
 
 
 type Param = {
-    status?: 0|1|2 //0默认不处理, 1退款，2退货
+    status?: 0|1|2 //0默认不处理, 1退货，2退款
 }
 export default memo(({status = 0}:Param) => {
     return (
         <>
-            {(status !== 0)&&<View className={classnames(styles.tag, status == 1?styles.refund_tag :styles.saleReturn_tag)}>
+            {(status !== 0)&&<View className={classnames(styles.tag, status == 2?styles.refund_tag :styles.saleReturn_tag)}>
                 <View className={classnames(styles.miconfont,  'iconfont icon-yucunkuan')}></View>
-                <Text>{ status == 1?'退款':'退货'}</Text>
+                <Text>{ status == 1?'退货':'退款'}</Text>
             </View>}
         </>
     )

src/pages/salesAfterList/components/returnLogistics/index.module.scss

@@ -0,0 +1,35 @@
+
+.logistics_main{
+    padding: 20px 30px;
+    box-sizing: border-box;
+    .logistics_image{
+        display: flex;
+        .title_desc{
+            font-size: 28px;
+            font-weight: 700;
+            padding-top: 50px;
+            box-sizing: border-box;
+        }
+        .upload_image{
+            flex:1;
+        }
+    }
+    .logistics_desc{
+        margin-top: 50px;
+    }
+    .btns_two{
+        display: flex;
+        height: 82px;
+        font-size: $font_size_big;
+        border-radius: 40px;
+        margin-top: 50px;
+        .verify_btn{
+            flex:1;
+            border-radius: 40px;
+            background: #007aff;
+            text-align: center;
+            line-height: 82px;
+            color: #fff;
+        }
+    }
+}

src/pages/salesAfterList/components/returnLogistics/index.tsx

@@ -0,0 +1,70 @@
+import Popup from "@/components/popup";
+import { Text, View } from "@tarojs/components";
+import { memo, useCallback, useEffect, useRef, useState } from "react";
+import UploadImage from "@/components/uploadImage"
+import styles  from './index.module.scss'
+import TextareaEnhance from "@/components/textareaEnhance";
+import { ReturnApplyLogisticsApi } from "@/api/salesAfterOrder";
+import { alert } from "@/common/common";
+
+type Param = {
+    show?: true|false,
+    onClose?: () => void,
+    onSubmit?: () => void,
+    id?: number //订单id
+}
+export default memo(({show = false, onClose, onSubmit, id = 0}: Param) => {
+    //需要提交的数据
+    const submitData = useRef({
+        accessory_url: [],
+        remark: '',
+        id: 0
+    })
+    useEffect(() => {
+        if(id) submitData.current.id = id
+    }, [id])
+
+    //获取图片列表
+    const getImageList = useCallback((list) => {
+        submitData.current.accessory_url = list
+    }, [])
+
+    //备注
+    const getOtherReason = useCallback((val) => {
+        submitData.current.remark = val
+    }, [])
+
+    //确定
+    const {fetchData} = ReturnApplyLogisticsApi()
+    const onSubmitEven = async () => {
+        if(!id) return alert.error('参数有误')
+        if(submitData.current.accessory_url.length <= 0) return alert.error('请上传附件')
+        let res = await fetchData(submitData.current)
+        if(res.success) {
+            alert.success('上传成功')
+        } else {
+            alert.error('上传失败')
+        }
+    }
+
+    return (
+        <>
+            <Popup show={show} title="上传物流" onClose={onClose}>
+                <View className={styles.logistics_main}>
+                    <View className={styles.logistics_image}>
+                        <Text className={styles.title_desc}>上传附件：</Text>
+                        <View className={styles.upload_image}>
+                            <UploadImage onChange={getImageList}/>
+                        </View>
+                    </View>
+                    <View className={styles.logistics_desc}>
+                        <TextareaEnhance onChange={getOtherReason} title="备注：" placeholder="请输入备注信息"/>
+                    </View>
+                    <View  className={styles.btns_two}>
+                        <View  className={styles.verify_btn } onClick={() => onSubmitEven()}>保存</View>
+                    </View >
+                </View>
+            </Popup>                       
+        </>
+    )   
+})

src/pages/salesAfterList/index.tsx

@@ -12,6 +12,8 @@ import { dataLoadingStatus, getFilterData } from "@/common/util"
 import OrderStatusList from "./components/orderStatusList"
 import Payment from "../order/components/payment"
 import { AFTER_ORDER_STATUS } from "@/common/enum"
+import { GetSaleOrderListApi } from "@/api/salesAfterOrder"
+import ReturnLogistics from "./components/returnLogistics"
 
 export default () => {
   const {checkLogin} = useLogin()
@@ -40,7 +42,7 @@ export default () => {
   }, [])
 
   //获取订单列表
-  const {fetchData: listFetchData, state:orderState} = GetOrderListApi()
+  const {fetchData: listFetchData, state:orderState} = GetSaleOrderListApi()
   const [orderData, setOrderData] = useState<{list:any[], total:number}>({list:[], total:0})
   const getOrderList = async () => {
     let res = await listFetchData(getFilterData(searchField))
@@ -96,28 +98,14 @@ export default () => {
   //监听点击的按钮
   const clickOrderBtn = useCallback(({status, orderInfo}) => {
     if(status == 2) {
-      //去支付
-      setPayOrderInfo({orderId:orderInfo.should_collect_order_id, payment_method:orderInfo.payment_method})
-      toPay()
+      //退货物流
+
     }
   }, [orderData])
 
-
-  //去付款
-  const [payOrderInfo, setPayOrderInfo] = useState<any>()
-  const [payMentShow, setPayMentShow] = useState(false)
-  const toPay = () => {
-      setPayMentShow(true)
-  }
-  //关闭支付弹窗
-  const closePayShow = useCallback(() => {
-      setPayMentShow(() => false)
-  }, [])
-  //支付成功
-  const onPaySuccess = useCallback(() => {
-      getOrderList()
-      closePayShow()
-  }, [])
+  //物流显示
+  const [logisticsShow, setLogisticsShow] = useState(false)
+  const onCloseLogistics = useCallback(() => setLogisticsShow(false), [])
 
   
   return (
@@ -132,8 +120,8 @@ export default () => {
               return <View key={item.id} className={styles.order_item_con}> <Order value={item} onClickBtn={clickOrderBtn}/></View>
             })}
           </InfiniteScroll>
+          <ReturnLogistics show={logisticsShow} onClose={onCloseLogistics}/>
       </View>
-      <Payment onSubmitSuccess={onPaySuccess} show={payMentShow} onClose={closePayShow} orderInfo={payOrderInfo}/>
     </View>
   )
 }

src/pages/searchList/hightSearchList.module.scss

@@ -165,7 +165,6 @@
                 .product_img{
                     width: 100%;
                     height: 224px;
-                    background: #e5ad3a;
                     border-radius: 20px 20px 0px 0px;
                     position: relative;
                     image{

src/pages/searchList/hightSearchList.tsx

@@ -17,6 +17,7 @@ import LoadingCard from "@/components/loadingCard";
 import useLogin from "@/use/useLogin";
 import { goLink } from "@/common/common";
 import SelectData, {ListProps} from "./components/selectData";
+import LabAndImg from "@/components/LabAndImg";
 
 export default () => {
     const {checkLogin} = useLogin()
@@ -95,7 +96,6 @@ export default () => {
     const [blueToothColor, setBlueToothColor] = useState('')
     useEffect(() => {
         if(colorState.deviceLab) {
-            console.log('颜色：',colorState.deviceLab)
             const rgb = toRgb([colorState.deviceLab.L, colorState.deviceLab.a, colorState.deviceLab.b])
             setBlueToothColor(`rgb(${rgb[0]}, ${rgb[1]}, ${rgb[2]})`)
             setSearchField({...searchField, l:rgb[0], a:rgb[1], b:rgb[2], size:10})
@@ -103,11 +103,12 @@ export default () => {
     }, [colorState.deviceLab])
 
     const goLinkPage = (item) => {
-        goLink('/pages/details/index',{id:item.id})
+        goLink('/pages/details/index',{id:item.product_id})
     }
 
     //获取筛选条件
     const getFiltr = (e) => {
+        setMaterialList(() => ({list:[], total:0}))
         const {data} = e
         setSearchField({
             ...searchField,  
@@ -123,7 +124,6 @@ export default () => {
     //筛选条件格式化
     const [selectList , setSelectList] = useState<ListProps[]>()
     const formatSelectList = (val = {data:{}, field:{}}) => {
-        console.log('data123::',val.data)
         let data:ListProps[] = []
         for(let key in val.data) {
             if(key !== 'seriesId'&& val.data[key] != '') {
@@ -186,7 +186,7 @@ export default () => {
                             {materialList.list.map(item => {
                                 return <View key={item.id} className={styles.product_item} onClick={() => goLinkPage(item)}>
                                     <View className={styles.product_img}>
-                                        <Image mode="aspectFill" src={formatImgUrl(item.texture_url)}></Image>
+                                        <LabAndImg value={{lab:item.lab,rgb:item.rgb,texture_url:item.texture_url}}/>
                                         <View className={styles.color_num}>{(item.product_color_code)}#</View>
                                     </View>
                                     <View className={styles.product_info}>

src/pages/searchList/search.module.scss

@@ -1,11 +1,17 @@
 .main{
+    position: relative;
     .search{
         display: flex;
         justify-content: space-between;
         padding: 20px;
         padding-bottom: 50px;
     }
-    
+    .up_search{
+        color: $color_main;
+        font-size: $font_size;
+        position: absolute;
+        right: 20px;
+    }
     .hot {
         padding: 0 20px;
         .hot_header {
@@ -18,10 +24,9 @@
                 color: $color_font_one;
                 font-weight: 700;
             }
-            .hot_header_up{
-                color: $color_main;
-            }
+           
         }
+        
         .list{
             display: flex;
             font-size:  $font_size_medium;

src/pages/searchList/search.tsx

@@ -69,18 +69,18 @@ export default () => {
       <View className={styles.search}>
         <Search style={{width: '100%'}} placeholder="请输入面料关键词" placeIcon="out" showBtn={true} clickOnSearch={(e) => searchEvent(e)}/>
       </View>
-      <View className={styles.hot}>
+      <View className={styles.up_search} onClick={() => goLink('/pages/searchList/hightSearchList')}>高级搜索</View>
+      {searchData?.hotField.length > 0 && <View className={styles.hot}>
         <View className={styles.hot_header}>
           <View className={styles.hot_header_title}>热门面料</View>
-          <View className={styles.hot_header_up} onClick={() => goLink('/pages/searchList/searchList')}>高级搜索</View>
         </View>
         <View className={styles.list}>
-          {searchData?.hotField?.map((item, index) => {
+          {searchData.hotField.map((item, index) => {
             return <View key={index} className={styles.item} onClick={() => searchEvent(item.search_key, false)}>{item.search_key}</View>
           })}
         </View>
-      </View>
-      <View className={styles.history}>
+      </View>}
+      {searchData?.historyField.length > 0 && <View className={styles.history}>
         <View className={styles.history_header}>
           <View className={styles.history_header_title}>历史搜索</View>
           <View className={classnames('iconfont icon-lajixiang', styles.miconfont)}></View>
@@ -88,7 +88,7 @@ export default () => {
         <View className={styles.list}>
           {searchData?.historyField?.map((item, index) => <View key={index} className={styles.item} onClick={() => searchEvent(item.search_key, false)}>{item.search_key}</View>)}
         </View>
-      </View>
+      </View>}
     </View>
   )
 }

src/pages/searchList/searchList.module.scss

@@ -148,7 +148,6 @@
                 .product_img{
                     width: 100%;
                     height: 224px;
-                    background: #e5ad3a;
                     border-radius: 20px 20px 0px 0px;
                     position: relative;
                     image{

src/pages/searchList/searchList.tsx

@@ -8,13 +8,12 @@ import SelectData, {ListProps} from "./components/selectData";
 import { goLink } from "@/common/common";
 import styles  from './searchList.module.scss'
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import useManualPullDownRefresh from "@/use/useManualPullDownRefresh";
 import {GetProductListApi} from "@/api/material"
 import Taro, { useDidShow, usePullDownRefresh, useRouter } from "@tarojs/taro";
 import { formatHashTag, formatImgUrl } from "@/common/fotmat";
 import { dataLoadingStatus, getFilterData } from "@/common/util";
-import LoadingCard from "@/components/loadingCard";
 import useLogin from "@/use/useLogin";
+import LabAndImg from "@/components/LabAndImg";
 
 export default () => {
     const {checkLogin} = useLogin()
@@ -95,6 +94,7 @@ export default () => {
     //获取筛选条件
     const getFiltr = (e) => {
         pageNum.current.page = 1
+        setMaterialList(() => ({list:[], total:0}))
         const {data} = e
         setSearchField({
             ...searchField,  
@@ -110,14 +110,12 @@ export default () => {
     //筛选条件格式化
     const [selectList , setSelectList] = useState<ListProps[]>()
     const formatSelectList = (val = {data:{}, field:{}}) => {
-        console.log('data123::',val.data)
         let data:ListProps[] = []
         for(let key in val.data) {
             if(key !== 'seriesId'&& val.data[key] != '') {
                 data.push({title:val.field[key], value:val.data[key]})
             }
         }
-        console.log('data::',data)
         setSelectList([...data])
     }
 
@@ -156,15 +154,15 @@ export default () => {
                 <View className={classnames(styles.list_num, scrollStatus&&styles.list_num_shadow)}>搜索结果 ({materialList.total}条记录)</View>
                 <View className={styles.scroll}>
                     <InfiniteScroll 
-                        selfonScrollToLower={() => getScrolltolower()} 
-                        selfOnScroll={(e) => onscroll(e)}
+                        selfonScrollToLower={getScrolltolower} 
+                        selfOnScroll={onscroll}
                         statusMore={statusMore}
                     >
                         <View className={styles.product_list}>
                             {materialList.list.map(item => {
                                 return <View key={item.id} className={styles.product_item} onClick={() => goLinkPage(item)}>
                                     <View className={styles.product_img}>
-                                        <Image mode="aspectFill" src={formatImgUrl(item.texture_url)}></Image>
+                                        <LabAndImg value={{lab:item.lab,rgb:item.rgb,texture_url:item.texture_url}}/>
                                         <View className={styles.color_num}>{(item.product_color_count)}色</View>
                                     </View>
                                     <View className={styles.product_info}>

src/pages/user/index.module.scss

@@ -1,68 +1,94 @@
-.main{
+.main {
   background-color: #F8F8F8;
   min-height: 100vh;
   display: flex;
   flex-direction: column;
-  .header{
+  position: relative;
+
+  .header {
     background: #68b4ff;
     background-size: cover;
     height: 560px;
     position: relative;
-    .card-main{
+
+    .card-main {
       margin-top: 10px;
     }
   }
-  .header-card{
-    position: absolute;left: 50%;bottom: -18%;
+
+  .auth-suspension {
+    position: absolute;
+    z-index: 1;
+    inset: 0;
+  }
+
+  .header-card {
+    position: absolute;
+    left: 50%;
+    bottom: -18%;
     transform: translateX(-50%);
   }
-  .crad{
-      width: 702px;
-      background: rgba(255,255,255,0.95);
-      border-radius: 20px;
-      padding: 30px;
-      box-sizing: border-box;
-      box-shadow: 0px 6px 12px 0px rgba(0,0,0,0.05); 
+
+  .crad {
+    width: 702px;
+    background: rgba(255, 255, 255, 0.95);
+    border-radius: 20px;
+    padding: 30px;
+    box-sizing: border-box;
+    box-shadow: 0px 6px 12px 0px rgba(0, 0, 0, 0.05);
   }
-  .card-info{
-      display: flex;justify-content: space-between;
-      position: absolute;top: -15%;left: 0;right: 0;
-      width: 702px;
-      padding: 0 30px;
-      box-sizing: border-box;
+
+  .card-info {
+    display: flex;
+    justify-content: space-between;
+    position: absolute;
+    top: -15%;
+    left: 0;
+    right: 0;
+    width: 702px;
+    padding: 0 30px;
+    box-sizing: border-box;
   }
-  .arcd-info-left{
-    display: flex;align-items: flex-end;
+
+  .arcd-info-left {
+    display: flex;
+    align-items: flex-end;
   }
-  .arcd-info-left-portrait{
-      width: 170px;
-      height: 170px;
-      background: rgba(0,0,0,0.00);
-      border: 4px solid #ffffff;
-      border-radius: 50%;
-      overflow: hidden;
+
+  .arcd-info-left-portrait {
+    width: 170px;
+    height: 170px;
+    background: rgba(0, 0, 0, 0.00);
+    border: 4px solid #ffffff;
+    border-radius: 50%;
+    overflow: hidden;
   }
-  .arcd-info-left-portrait image{
-      width: 100%;
-      height: 100%;
-      object-fit: cover;
+
+  .arcd-info-left-portrait image {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
   }
-  .arcd-info-left-desc{
-      margin-left: 24px;
+
+  .arcd-info-left-desc {
+    margin-left: 24px;
   }
-  .arcd-info-left-nickname{
-      font-size: 44px;
-      font-weight: 700;
-      color: #000000;
-      display: flex;
-      align-items: center;
+
+  .arcd-info-left-nickname {
+    font-size: 44px;
+    font-weight: 700;
+    color: #000000;
+    display: flex;
+    align-items: center;
   }
-  .arcd-info-left-phone{
+
+  .arcd-info-left-phone {
     font-size: 24px;
     font-weight: 400;
     color: #707070;
   }
-  .arcd-info-left-phone button{
+
+  .arcd-info-left-phone button {
     padding: 0 10px;
     height: 42px;
     background: #ffffff;
@@ -71,39 +97,50 @@
     font-size: 22px;
     font-weight: 400;
     color: #007aff;
-    display: flex;align-items: center;justify-content: center;
+    display: flex;
+    align-items: center;
+    justify-content: center;
   }
-  .card-info-right{
-      font-size: 26px;
-      display: flex;align-items: flex-end;
+
+  .card-info-right {
+    font-size: 26px;
+    display: flex;
+    align-items: flex-end;
   }
-  .setup-icon{
+
+  .setup-icon {
     position: relative;
     padding-bottom: 10px;
   }
-  .icon-wrapper{
+
+  .icon-wrapper {
     font-size: 60px;
   }
-  .icon-point{
+
+  .icon-point {
     width: 8px;
     height: 8px;
     border-radius: 50%;
     background: #ff0000;
     position: absolute;
-    right: 0;top: 0;
+    right: 0;
+    top: 0;
   }
 
-  .card-main{
+  .card-main {
     margin: 20px auto 0;
   }
-  .card-main-title{
-      display: flex;justify-content: space-between;
-      align-items: center;
-      border-bottom: 2px solid #dddddd;
-      padding: 0 5px 15px;
-      box-sizing: border-box;
+
+  .card-main-title {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border-bottom: 2px solid #dddddd;
+    padding: 0 5px 15px;
+    box-sizing: border-box;
   }
-  .card-main-title text{
+
+  .card-main-title text {
     font-size: 22px;
     font-weight: 400;
     color: #ababab;
@@ -111,23 +148,27 @@
     text-align: right;
     width: 150px;
   }
-  .card-main-title-content{
-      display: grid;
-      grid-template-columns: repeat(5,1fr);
+
+  .card-main-title-content {
+    display: grid;
+    grid-template-columns: repeat(5, 1fr);
   }
-  .card-main-title-content-item{
-      font-size: 24px;
-      font-weight: 400;
-      color: #3c3c3c;
-      text-align: center;
-      margin-top: 30px;
-      position: relative;
+
+  .card-main-title-content-item {
+    font-size: 24px;
+    font-weight: 400;
+    color: #3c3c3c;
+    text-align: center;
+    margin-top: 30px;
+    position: relative;
   }
-  .card-main-title-content-item Text{
+
+  .card-main-title-content-item Text {
     font-size: 56px;
     color: #3C3C3C;
   }
-  .card-main-title-content-item-badge{
+
+  .card-main-title-content-item-badge {
     padding: 0 10px;
     height: 32px;
     background: #007aff;
@@ -138,96 +179,140 @@
     font-size: 18px;
     font-weight: 700;
     color: #ffffff;
-    display: flex;align-items: center;justify-content: center;
-    position: absolute;top: -10px;right: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    position: absolute;
+    top: -10px;
+    right: 0;
   }
 
-  .assets-title{
+  .assets-title {
     font-size: 28px;
     font-weight: 700;
     color: #3c3c3c;
     margin-bottom: 20px;
   }
-  .assets-content{
+
+  .assets-content {
     display: grid;
-    grid-template-columns: repeat(3,1fr);
+    grid-template-columns: repeat(3, 1fr);
   }
-  .assets-content>view,.assets-content>navigator{
+
+  .assets-content>view,
+  .assets-content>navigator {
     text-align: center;
   }
-  .assets-content-item-top{
+
+  .assets-content-item-top {
     color: #007aff;
     font-weight: 400;
   }
-  .assets-content-item-top-before{
+
+  .assets-content-item-top-before {
     font-size: 20px;
   }
-  .assets-content-item-top-content{
+
+  .assets-content-item-top-content {
     font-size: 36px;
   }
-  .assets-content-item-top-after{
+
+  .assets-content-item-top-after {
     font-size: 20px;
   }
-  .assets-content-item-tips{
+
+  .assets-content-item-tips {
     font-size: 24px;
     font-weight: 400;
     color: #707070;
   }
 
-  .main-card{
+  .main-card {
     margin: 131px auto 0;
   }
-  .card-feature{
+
+  .card-feature {
     margin-bottom: 50px;
   }
-  .card-main-list-content-item{
-    display: flex;align-items: center;
+
+  .card-main-list-content-item {
+    display: flex;
+    align-items: center;
     justify-content: space-between;
     height: 90px;
   }
-  .card-main-list-content-item-left{
+
+  .card-main-list-content-item-left {
     font-size: 26px;
     font-weight: 400;
     text-align: left;
     color: #707070;
-    display: flex;align-items: center;
+    display: flex;
+    align-items: center;
   }
-  .card-main-list-content-item-left text{
+
+  .card-main-list-content-item-left text {
     margin-right: 35px;
     font-size: 56px;
     color: #707070;
   }
-  .card-main-list-content-item-right text{
+
+  .card-main-list-content-item-right text {
     font-size: 30px;
   }
 
-  .auth{
+  .auth {
     margin-top: 115px;
   }
-  .auth-top{
-    display: flex;align-items: center;justify-content: space-between;
+
+  .auth-top {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
   }
-  .auth-status{
+
+  .auth-status {
     padding: 0 10px;
     height: 30px;
     background: #dddddd;
     border-radius: 10px 4px 0px 0px;
-    display: flex;align-items: center;justify-content: center;
+    display: flex;
+    align-items: center;
+    justify-content: center;
     font-size: 18px;
     font-weight: 400;
     color: #707070;
   }
-  .auth-tips{
+
+  .auth-status,
+  .auth-status-ongoing {
+    color: #EE7500;
+    background-color: #FFE6CE;
+  }
+
+  .auth-status,
+  .auth-status-adopt {
+    color: #007AFF;
+    background-color: #CDE5FF;
+  }
+
+  .auth-tips {
     font-size: 18px;
     font-weight: 400;
     color: #007aff;
-    width: 150px;
     text-align: right;
   }
-  .auth-tips text{
+
+  .auth-tips,
+  .auth-tips-adopt {
+    color: #ABABAB;
+  }
+
+  .auth-tips text {
     font-size: 17px;
   }
-  .auth-company{
+
+  .auth-company {
     height: 70px;
     width: 100%;
     background: #f6f6f6;
@@ -236,30 +321,46 @@
     font-size: 26px;
     font-weight: 700;
     color: #707070;
-    display: flex;align-items: center;justify-content: center;
+    display: flex;
+    align-items: center;
+    justify-content: center;
   }
 
-  .modal{
-    background: rgba(0,0,0,0.6);
-    position: fixed;inset: 0;
-    display: flex;justify-content: center;align-items: center;
+  .auth-company,
+  .auth-company-adopt {
+    background: #ecf5ff;
+    border: 2px solid #cde5ff;
   }
-  .modal-content{
+
+  .tips-modal {
+    background: rgba(0, 0, 0, 0.6);
+    position: fixed;
+    inset: 0;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    z-index: 2;
+  }
+
+  .tips-modal-content {
     width: 598px;
     background: #ffffff;
     border-radius: 10px;
     animation: enlargeK 0.2s linear;
     overflow: hidden;
   }
+
   @keyframes enlargeK {
-    0%{
+    0% {
       transform: scale(0);
     }
-    100%{
+
+    100% {
       transform: scale(1);
     }
   }
-  .modal-title{
+
+  .tips-modal-title {
     font-size: 32px;
     font-weight: 700;
     text-align: center;
@@ -267,53 +368,166 @@
     margin-bottom: 58px;
     padding-top: 48px;
   }
-  .modal-letter{
+
+  .tips-modal-letter {
     font-size: 26px;
     font-weight: 400;
     color: #707070;
     padding: 0 30px;
     line-height: 50px;
   }
-  .modal-letter-text{
+
+  .tips-modal-letter-text {
     text-indent: 60px;
   }
-  .modal-letter-beginn{
+
+  .tips-modal-letter-beginn {
     font-size: 28px;
     font-weight: 400;
     color: #000000;
     margin-bottom: 25px;
   }
-  .modal-letter-end{
+
+  .tips-modal-letter-end {
     font-size: 26px;
     font-weight: 400;
     text-align: right;
     margin-top: 61px;
   }
-  .modal-button{
+
+  .tips-modal-button {
     display: flex;
     border-top: 1px solid #DDDDDD;
     margin-top: 45px;
   }
-  .modal-button button, .modal-button view{
-    display: flex;align-items: center;justify-content: center;
+
+  .tips-modal-button button,
+  .tips-modal-button view {
+    display: flex;
+    align-items: center;
+    justify-content: center;
     width: 50%;
     height: 90px;
     background-color: white;
   }
-  .modal-button button{
+
+  .tips-modal-button button {
     font-size: 26px;
     font-weight: 400;
     color: #707070;
     border-radius: 0;
     border-right: 1px solid #DDDDDD;
   }
-  .modal-button button::after{
+
+  .tips-modal-button button::after {
     border: 0;
     border-radius: 0;
   }
-  .modal-button view{
+
+  .tips-modal-button view {
     font-size: 26px;
     font-weight: 400;
     color: #007aff;
   }
+
+  .auth-box {
+    width: 614px;
+    height: 70px;
+    background: #f6f6f6;
+    border-radius: 10px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding-left: 18px;
+    padding-right: 16px;
+
+    .auth-left-box {
+      display: flex;
+      align-items: center;
+
+      .auth-tag {
+        width: 86px;
+        height: 34px;
+        background: #dddddd;
+        border-radius: 10px;
+        font-size: 22px;
+        font-family: Microsoft YaHei, Microsoft YaHei-Regular;
+        font-weight: 400;
+        text-align: center;
+        color: #707070;
+        text-align: center;
+        line-height: 34px;
+        margin-right: 28px;
+      }
+
+      .auth-tagone {
+        width: 86px;
+        height: 34px;
+        background: #ffe6ce;
+        border-radius: 10px;
+        font-size: 22px;
+        font-family: Microsoft YaHei, Microsoft YaHei-Regular;
+        font-weight: 400;
+        text-align: center;
+        color: #707070;
+        text-align: center;
+        line-height: 34px;
+        margin-right: 28px;
+      }
+
+      .auth-tagtwo {
+        display: flex;
+        align-items: center;
+        overflow: hidden;
+        padding-left: 10px;
+        width: 100px;
+        height: 32px;
+        background: #cde5ff;
+        border-radius: 10px;
+
+        .iconFont-color {
+          display: flex;
+          align-items: center;
+          font-size: 30px;
+          margin-right: 3px;
+          color: #007aff;
+        }
+
+        .auth-font {
+          font-size: 20px;
+          font-family: Microsoft YaHei, Microsoft YaHei-Regular;
+          font-weight: 400;
+          color: #007aff;
+        }
+      }
+
+      .tagthree {
+        display: flex;
+        align-items: center;
+        overflow: hidden;
+        padding-left: 10px;
+        width: 100px;
+        height: 32px;
+        background: rgba(255, 0, 0, 0.10);
+        border-radius: 10px;
+        color: #ff0000;
+      }
+
+      .auth-cont {
+        margin-left: 16px;
+        font-size: 26px;
+        font-family: Microsoft YaHei, Microsoft YaHei-Bold;
+        font-weight: 700;
+        color: #ababab;
+      }
+
+      .auth-contone {
+        margin-left: 16px;
+        font-size: 26px;
+        font-family: Microsoft YaHei, Microsoft YaHei-Bold;
+        font-weight: 700;
+        color: #3c3c3c;
+      }
+    }
+  }
 }

src/pages/user/index.tsx

@@ -3,79 +3,89 @@ import { memo, useEffect, useState } from "react"
 import styles from './index.module.scss'
 import classnames from "classnames";
 import { useSelector } from "@/reducers/hooks";
-import { GetAdminUserInfoApi } from "@/api/user";
 import { alert, goLink } from "@/common/common";
-
-
+import useLogin from '@/use/useLogin'
+import { BASE_URL } from '@/common/constant'
+import Taro from "@tarojs/taro";
+import { userassets } from "@/api/mine"
+import { formatPriceDiv } from "@/common/fotmat"
 export default () => {
 	// 用户信息
-	const { fetchData, state } = GetAdminUserInfoApi();
-	const {adminUserInfo, userInfo} = useSelector(state => state.userInfo);
-	const [mUserInfo, setMUserInfo] = useState({
-		phone: ""
-	});
-	const getData = ()=>{
-		fetchData();
+	const { getSelfUserInfo } = useLogin();
+	const { adminUserInfo } = useSelector(state => state.userInfo);
+	useEffect(() => {
+		getSelfUserInfo().then().catch(() => {
+			alert.none("授权失败，请授权后再使用");
+		});
+	}, []);
+	const handleAuth = async () => {
+		getSelfUserInfo().then().catch(() => {
+			alert.none("授权失败，请授权后再使用");
+		});
 	}
-	useEffect(()=>{
-		setMUserInfo({
-			...mUserInfo,
-			// phone: userInfo?.phone?.replace(userInfo?.phone?.substring(3,7), "****") as string
-		})
-		getData();
-	},[]);
-
+	const { fetchData, state } = userassets()
+	useEffect(() => {
+		fetchData();
+	}, [])
 	return (
 		<View className={styles.main}>
-			<Header data={adminUserInfo} userInfo={userInfo} />
-			<Assets />
+			<Header data={adminUserInfo} />
+			<Assets data={state} />
 			<Main />
-			<Modal data={adminUserInfo}/>
+			{/* {(adminUserInfo as any)?.authentication_status==1&&<Modal data={adminUserInfo}/>} */}
+			{/* 测试暂时添加 */}
+			<View style={{ fontSize: '26rpx', textAlign: 'center' }}>{BASE_URL}</View>
+			{!adminUserInfo.is_authorize_name && <View onClick={handleAuth} className={styles["auth-suspension"]}></View>}
 		</View>
 	)
 }
-const Modal = memo((props:any)=>{
-	const {data} = props;
-	const handleouter = ()=>{
-		console.log(222);
-		
+// 提示弹窗
+const Modal = memo((props: any) => {
+	const { data } = props;
+	const [modalShow, setModalShow] = useState(true);
+	const handleouter = () => {
 	}
-	return(
+	return (
 		<>
-		{!data?.is_authorize_phone&&
-		<View onClick={handleouter} catchMove className={styles['modal']}>
-			<View className={styles['modal-content']} onClick={e=>e.stopPropagation()}>
-				<View className={styles['modal-title']}>首次登录提醒</View>
-				<View className={styles['modal-letter']}>
-					<View className={styles['modal-letter-beginn']}>To: 万丰园纺织科技</View>
-					<View className={styles['modal-letter-text']}>尊敬的老朋友，欢迎你使用小程序商城；由于您是我们长期合作的伙伴，你的组织已自动为你生成，关联后可查看历史订单哟。</View>
-					<View className={styles['modal-letter-end']}>信息错误请联系客服</View>
+			{modalShow &&
+				<View onClick={handleouter} catchMove className={styles['tips-modal']}>
+					<View className={styles['tips-modal-content']} onClick={e => e.stopPropagation()}>
+						<View className={styles['tips-modal-title']}>首次登录提醒</View>
+						<View className={styles['tips-modal-letter']}>
+							<View className={styles['tips-modal-letter-beginn']}>To: 万丰园纺织科技</View>
+							<View className={styles['tips-modal-letter-text']}>尊敬的老朋友，欢迎你使用小程序商城；由于您是我们长期合作的伙伴，你的组织已自动为你生成，关联后可查看历史订单哟。</View>
+							<View className={styles['tips-modal-letter-end']}>信息错误请联系客服</View>
+						</View>
+						<View className={styles['tips-modal-button']}>
+							<Button hoverClass="none" openType="contact">联系客服</Button>
+							<View onClick={() => setModalShow(false)}>我知道</View>
+						</View>
+					</View>
 				</View>
-				<View className={styles['modal-button']}>
-					<Button hoverClass="none" openType="concat">联系客服</Button>
-					<View>我知道</View>
-				</View>
-			</View>
-		</View>
-		}
+			}
 		</>
 	)
 })
 
 // 头部 | 订单
-const Header = memo((props:any) => {
-	const {data, userInfo} = props;
-	let menu = [{ text: "待配布", icon: "icon-daipeibu" }, { text: "待付款", icon: "icon-daifukuan" },
-	 { text: "待发货", icon: "icon-daifahuo" }, { text: "已发货", icon: "icon-yifahuo" },
-	  { text: "退款/售后", icon: "icon-a-tuikuanshouhou" }];
-	const getPhoneNumber = (ev)=>{
-		console.log(ev);
-		if(ev.detail?.code){
-		}else{
-			alert.none("取消了授权");
+const Header = memo((props: any) => {
+	const { data } = props;
+	let menu = [{ text: "待配布", icon: "icon-daipeibu", url: "/pages/orderList/index" }, { text: "待付款", icon: "icon-daifukuan", url: "/pages/orderList/index" },
+	{ text: "待发货", icon: "icon-daifahuo", url: "/pages/orderList/index" }, { text: "已发货", icon: "icon-yifahuo", url: "/pages/orderList/index" },
+	{ text: "退款/售后", icon: "icon-a-tuikuanshouhou", url: "/pages/orderList/index" }];
+	const { getPhoneNumber } = useLogin();
+	const mGetPhoneNumber = (ev) => {
+		if (ev.detail?.code) {
+			getPhoneNumber(ev.detail.code);
+		} else {
+			alert.none("绑定失败!");
 		}
 	}
-
+	const navTo = () => {
+		Taro.navigateTo({
+			url: '/pages/certification/index'
+		})
+	}
 	return (
 		<View className={styles.header}>
 			<View className={`${styles.crad} ${styles['header-card']}`}>
@@ -90,7 +100,7 @@ const Header = memo((props:any) => {
 								{data?.user_name}
 							</View>
 							<View className={styles['arcd-info-left-phone']}>
-								{userInfo?.phone||<Button openType="getPhoneNumber" onGetPhoneNumber={getPhoneNumber}>绑定手机号码</Button>}
+								{data?.phone ? data?.phone?.replace(data?.phone?.substring(3, 7), "****") : <Button openType="getPhoneNumber" onGetPhoneNumber={mGetPhoneNumber}>绑定手机号码</Button>}
 							</View>
 						</View>
 					</View>
@@ -106,16 +116,80 @@ const Header = memo((props:any) => {
 					</View>
 				</View>
 				<View className={styles['auth']}>
-					<View className={styles['auth-top']}>
-						<View className={styles['auth-status']}>
-							<Text>1</Text>
-							认证不通过
+					{(data?.authentication_status == 0 || data?.authentication_status == 1) &&
+						<View className={styles['auth-box']} onClick={() => navTo()}>
+							<View className={styles['auth-left-box']}>
+								<View className={styles['auth-tag']}>
+									未认证
+								</View>
+								<View className={styles['auth-cont']}>
+									暂未加入或注册组织
+								</View>
+							</View>
+							<Text className="iconfont icon-a-moreback"></Text>
 						</View>
-						<Navigator hoverClass="none" url="/pages/certification/index" className={styles['auth-tips']}>重新认证 <Text className="iconfont icon-a-moreback"/></Navigator>
-					</View>
-					<View className={styles['auth-company']}>
-						佛山市带生纺织品有限公司
-					</View>
+					}
+					{(data?.authentication_status == 3) &&
+						<View className={styles['auth-box']} onClick={() => navTo()}>
+							<View className={styles['auth-left-box']}>
+								<View className={styles['auth-tagthree']}>
+									认证失败
+								</View>
+								<View className={styles['auth-cont']}>
+									暂未加入或注册组织
+								</View>
+							</View>
+							<Text className="iconfont icon-a-moreback"></Text>
+						</View>
+					}
+					{data?.authentication_status == 2 &&
+						<View className={styles['auth-box']} onClick={() => navTo()}>
+							<View className={styles['auth-left-box']}>
+								<View className={styles['auth-tagone']}>
+									认证中
+								</View>
+								<View className={styles['auth-contone']}>
+									{data?.company_name || '暂未加入或注册组织'}
+								</View>
+							</View>
+							<Text className="iconfont icon-a-moreback"></Text>
+						</View>
+					}
+					{data?.authentication_status == 4 &&
+						<View className={styles['auth-box']} onClick={() => navTo()}>
+							<View className={styles['auth-left-box']}>
+								<View className={styles['auth-tagtwo']}>
+									<View className={styles['iconFont-color']}>
+										<Text className="iconfont icon-xtianzhangqi"></Text>
+									</View>
+									<View className={styles['auth-font']}>已认证</View>
+								</View>
+								<View className={styles['auth-contone']}>
+									{data?.company_name}
+								</View>
+							</View>
+							<Text className="iconfont icon-a-moreback"></Text>
+						</View>
+					}
+					{/* <View className={`${styles['auth-top']} ${data?.authentication_status==4&&"auth-tips-adopt"}`}>
+						<View className={`${styles['auth-status']} ${data?.authentication_status==2&&styles['auth-status-ongoing']} ${data?.authentication_status==4&&styles['auth-status-adopt']}`}>
+							<Text>1</Text>
+							{data?.authentication_status==1&&"未认证"}
+							{data?.authentication_status==2&&"认证中"}
+							{data?.authentication_status==3&&"认证不通过"}
+							{data?.authentication_status==4&&"已认证"}
+						</View>
+						{data?.authentication_status==1&&<Navigator hoverClass="none" url="/pages/certification/index" className={styles['auth-tips']}>认证通过后，解锁更多权限 <Text className="iconfont icon-a-moreback"/></Navigator>}
+						{data?.authentication_status==2&&<Navigator hoverClass="none" url="/pages/certification/index" className={styles['auth-tips']}>1-3个工作日，审核完成 <Text className="iconfont icon-a-moreback"/></Navigator>}
+						{data?.authentication_status==3&&<Navigator hoverClass="none" url="/pages/certification/index" className={styles['auth-tips']}>重新认证 <Text className="iconfont icon-a-moreback"/></Navigator>}
+						{data?.authentication_status==4&&<View className={styles['auth-tips']}>认证通过，可以下单啦 <Text className="iconfont icon-a-moreback"/></View>}
+					</View> */}
+					{/* <View className={`${styles['auth-company']} ${data?.authentication_status==4&&"auth-tips-adopt"}`}>
+						{data?.authentication_status==1&&"暂未加入或注册组织"}
+						{data?.authentication_status==2&&data?.company_name}
+						{data?.authentication_status==3&&data?.company_name}
+						{data?.authentication_status==4&&data?.company_name}
+					</View> */}
 				</View>
 				<View className={styles['card-main']}>
 					<View className={styles['card-main-title']}>
@@ -126,24 +200,23 @@ const Header = memo((props:any) => {
 						{
 							menu.map((item, index) => {
 								return (
-									<View className={styles['card-main-title-content-item']}>
+									<Navigator hoverClass="none" url={item.url} className={styles['card-main-title-content-item']}>
 										<Text className={`iconfont ${item.icon}`}></Text>
 										<View>{item.text}</View>
-										<View className={styles['card-main-title-content-item-badge']}>{index==2?"99+":10}</View>
-									</View>
+										<View className={styles['card-main-title-content-item-badge']}>{index == 2 ? "99+" : 10}</View>
+									</Navigator>
 								)
 							})
 						}
-
 					</View>
 				</View>
 			</View>
 		</View>
 	)
 })
-
 // 我的资产
-const Assets = () => {
+const Assets = (props: any) => {
+	console.log(props, 'propsprops')
 	return (
 		<View className={`${styles.assets} ${styles.crad} ${styles['main-card']}`}>
 			<View className={`${styles['assets-title']}`}>我的资产</View>
@@ -151,14 +224,14 @@ const Assets = () => {
 				<Navigator hoverClass="none" url="/pages/depositBeforehand/index">
 					<View className={`${styles['assets-content-item-top']}`}>
 						<Text className={`${styles['assets-content-item-top-before']}`}>¥</Text>
-						<Text className={`${styles['assets-content-item-top-content']}`}>0</Text>
-						<Text className={`${styles['assets-content-item-top-after']}`}>.20</Text>
+						<Text className={`${styles['assets-content-item-top-content']}`}>{formatPriceDiv(props.data.data.wallet_money || 0)}</Text>
+						{/* <Text className={`${styles['assets-content-item-top-after']}`}>{props.wallet_money || 0}</Text> */}
 					</View>
 					<Text className={`${styles['assets-content-item-tips']}`}>预存款</Text>
 				</Navigator>
 				<View>
 					<View className={`${styles['assets-content-item-top']}`}>
-						<Text className={`${styles['assets-content-item-top-content']}`}>4</Text>
+						<Text className={`${styles['assets-content-item-top-content']}`}>{props.data.data.coupon_count || 0}</Text>
 						<Text className={`${styles['assets-content-item-top-after']}`}>张</Text>
 					</View>
 					<Text className={`${styles['assets-content-item-tips']}`}>优惠券</Text>
@@ -166,8 +239,8 @@ const Assets = () => {
 				<Navigator hoverClass="none" url="/pages/creditLine/index">
 					<View className={`${styles['assets-content-item-top']}`}>
 						<Text className={`${styles['assets-content-item-top-before']}`}>¥</Text>
-						<Text className={`${styles['assets-content-item-top-content']}`}>99999</Text>
-						<Text className={`${styles['assets-content-item-top-after']}`}>.-00</Text>
+						<Text className={`${styles['assets-content-item-top-content']}`}>{formatPriceDiv(props.data.data.credit_line || 0)}</Text>
+						{/* <Text className={`${styles['assets-content-item-top-after']}`}>.-00</Text> */}
 					</View>
 					<Text className={`${styles['assets-content-item-tips']}`}>授信额度</Text>
 				</Navigator>

src/pages/userEdit/components/ModifyModal.scss

@@ -0,0 +1,76 @@
+  .modify-ickname-content {
+    margin: 0 auto;
+    width: 658px;
+    padding-bottom: 50px;
+
+    .modify-ickname-input {
+      width: 658px;
+      height: 182px;
+      background: #f3f3f3;
+      border: 2px solid #e6e6e6;
+      border-radius: 10px;
+      padding: 15px;
+      box-sizing: border-box;
+      font-size: 22px;
+      font-weight: 400;
+      color: #ababab;
+      display: flex;
+      flex-direction: column;
+      align-items: flex-end;
+    }
+
+    .modify-ickname-input textarea {
+      width: 100%;
+      height: 80%;
+      font-size: 26px;
+      font-weight: 400;
+      color: #3c3c3c;
+    }
+
+    .modify-ickname-tips {
+      font-size: 22px;
+      font-weight: 400;
+      color: #ababab;
+      margin-top: 30px;
+    }
+
+    .modify-ickname-operation {
+      width: 658px;
+      height: 82px;
+      background: #ffffff;
+      border: 2px solid #cde5ff;
+      border-radius: 40px;
+      display: flex;
+      overflow: hidden;
+      margin-top: 105px;
+      display: flex;
+    }
+
+    .modify-ickname-operation button {
+      height: 100%;
+      width: 50%;
+      font-size: 32px;
+      font-weight: 400;
+      color: #007aff;
+      background-color: white;
+      border: none;
+      outline: none;
+      padding: 0;
+      border-radius: 0;
+    }
+
+    .modify-ickname-operation button::after,
+    .user-edit-logout::after {
+      border-radius: 0;
+      border: none;
+    }
+
+    .modify-ickname-operation .modify-ickname-operation-save {
+      background: #007aff;
+      color: #ffffff;
+    }
+
+    .modify-ickname-operation button::after {
+      border-radius: 0;
+    }
+  }

src/pages/userEdit/components/ModifyModal.tsx

@@ -0,0 +1,49 @@
+
+import { forwardRef, memo, useCallback, useEffect, useImperativeHandle, useState } from "react"
+import Popup from "@/components/popup";
+import { Button, Image, Text, Textarea, View } from "@tarojs/components"
+import "./ModifyModal.scss"
+
+interface Params{
+  title?: string,
+  save: (value: any)=>void, // 确定保存
+}
+export default memo(forwardRef((props:any,ref)=>{
+  const {title="修改昵称"} = props;
+  const [value, setValue] = useState("");
+  useEffect(()=>{
+    setValue(props.value);
+  },[props.value])
+  // popup输入长度
+  const handleTextareaInput = (ev:any)=>{
+    setValue(ev.detail.value.slice(0,20));
+  }
+  // 重置
+  const handleTextareaReset = ()=>{
+    setValue("");
+  }
+  const [textareaBottom, setTextareaBottom] = useState(0);
+  const handleBlur = ()=>{
+    setTextareaBottom(0);
+  }
+  const handleFocus = (ev)=>{
+    setTextareaBottom(ev.detail.height);
+  }
+  const [modalShow,setModalShow] = useState(false);
+  useImperativeHandle(ref, ()=>({setModalShow}))
+  return (
+    <Popup onClose={()=>setModalShow(false)} title={title} show={modalShow}>
+      <View style={{marginBottom: `${textareaBottom}px`}} className="modify-ickname-content">
+        <View className="modify-ickname-input">
+          <Textarea showConfirmBar={false} auto-focus adjustPosition={false} value={value} onBlur={handleBlur} onFocus={handleFocus} onInput={handleTextareaInput} maxlength={20}/>
+          <Text>{value?.length}/20</Text>
+        </View>
+        <Text className="modify-ickname-tips">请设置2-20个字符，可由中文、英文、数字组成</Text>
+        <View className="modify-ickname-operation">
+          <Button onClick={handleTextareaReset} hoverClass="none" className="modify-ickname-operation-reset">重置</Button>
+          <Button onClick={()=>props.save(value)} hoverClass="none" className="modify-ickname-operation-save">保存</Button>
+        </View>
+      </View>
+    </Popup>
+  )
+}))

src/pages/userEdit/index.scss

@@ -33,6 +33,49 @@
   .user-edit-content-title text{
     margin-right: 10px;
   }
+  .user-edit-content-phone{
+    font-size: 26px;
+    font-weight: 400;
+    color: #000000;
+    display: flex;justify-content: space-between;
+  }
+  .user-edit-content-phone text{
+    font-size: 24px;
+    font-weight: 400;
+    color: #ababab;
+  }
+  .user-edit-content-bindphone{
+    padding: 0;width: auto;height: auto;
+    margin: 0;background: none;border: 0;
+    text-align: left;
+    font-size: 26px;
+    font-weight: 400;
+    color: #ababab;
+  }
+  .user-edit-content-bindphone::after{
+    border: 0;
+  }
+  .user-edit-content-company{
+    width: 118px;
+    height: 40px;
+    background: #dddddd;
+    border-radius: 6px;
+    display: flex;align-items: center;justify-content: center;
+    font-size: 24px;
+    font-weight: 400;
+    color: #707070;
+  }
+  .user-edit-content-company,.user-edit-content-company-adopt{
+    background: #CDF3DF;
+    color: #07C160;
+  }
+  .user-edit-content-company text{
+    margin-left: 5px;
+  }
+  .user-edit-content-company.user-edit-content-company-auth{
+    background-color: #CDF3DF;
+    color: #07C160;
+  }
   .user-edit-list{
     height: 90px;
     display: flex;align-items: center;
@@ -50,12 +93,15 @@
     color: #000000;
   }
   .user-edit-list-right{
-    display: flex;justify-content: space-between;
+    display: flex;justify-content: space-between;align-items: center;
     flex: auto;
     font-size: 26px;
     font-weight: 400;
     color: #000000;
   }
+  .user-edit-list-right>view{
+    flex: 1;
+  }
   .user-edit-list-right-placeholder{
     color: #cccccc;
   }
@@ -77,69 +123,4 @@
     text-align: center;
     color: #007aff;
   }
-
-  .user-edit-popup-content{
-    margin: 0 auto;
-    width: 658px;
-    padding-bottom: 50px;
-  }
-  .user-edit-popup-input{
-    width: 658px;
-    height: 182px;
-    background: #f3f3f3;
-    border: 2px solid #e6e6e6;
-    border-radius: 10px;
-    padding: 15px;
-    box-sizing: border-box;
-    font-size: 22px;
-    font-weight: 400;
-    color: #ababab;
-    display: flex;flex-direction: column;
-    align-items: flex-end;
-  }
-  .user-edit-popup-input textarea{
-    width: 100%;
-    height: 80%;
-    font-size: 26px;
-    font-weight: 400;
-    color: #3c3c3c;
-  }
-  .user-edit-popup-tips{
-    font-size: 22px;
-    font-weight: 400;
-    color: #ababab;
-    margin-top: 30px;
-  }
-  .user-edit-popup-operation{
-    width: 658px;
-    height: 82px;
-    background: #ffffff;
-    border: 2px solid #cde5ff;
-    border-radius: 40px;
-    display: flex;
-    overflow: hidden;
-    margin-top: 105px;
-    display: flex;
-  }
-  .user-edit-popup-operation button{
-    height: 100%;
-    width: 50%;
-    font-size: 32px;
-    font-weight: 400;
-    color: #007aff;
-    background-color: white;
-    border: none;
-    outline: none;
-    padding: 0;
-    border-radius: 0;
-  }
-  .user-edit-popup-operation button::after,.user-edit-logout::after{
-    border-radius: 0;
-    border: none;
-  }
-  .user-edit-popup-operation .user-edit-popup-operation-save{
-    background: #007aff;
-    color: #ffffff;
-  }
-  .user-edit-popup-operation button::after{ border-radius: 0; }
 }

src/pages/userEdit/index.tsx

@@ -1,101 +1,189 @@
 
 import { alert, goLink, isEmptyObject, retrieval } from "@/common/common";
 import Popup from "@/components/popup";
-import { Button, Image, Text, Textarea, View } from "@tarojs/components"
+import { Button, Image, Picker, Text, Textarea, View } from "@tarojs/components"
 import Taro, { chooseMedia } from "@tarojs/taro";
-import { GetAdminUserInfoApi, realNameUpdateApi } from "@/api/user";
-import { memo, useCallback, useEffect, useState } from "react"
+import { realNameUpdateApi, companyTypeApi, portraitUpdateApi } from "@/api/user";
+import { companyDetailApi, companyUpdateApi } from "@/api/company"
+import { memo, useCallback, useEffect, useRef, useState } from "react"
 import "./index.scss"
+import ModifyModal from "./components/ModifyModal";
+import useLogin from "@/use/useLogin";
+import { useSelector } from "@/reducers/hooks";
+import useUploadCDNImg from "@/use/useUploadImage";
+import { IMG_CND_Prefix } from "@/common/constant";
 
-export default ()=>{
-	// 用户信息
-	const { fetchData, state } = GetAdminUserInfoApi();
-	const getData = async ()=>{
-		const result = await fetchData();
+export default () => {
+  const { getPhoneNumber, getAdminUserInfo } = useLogin();
+  const { adminUserInfo } = useSelector(state => state.userInfo);
+  // 用户信息
+  useEffect(() => {
     setFormData({
       ...formData,
-      real_name: result.data.user_name
-    })
-	}
-  useEffect(()=>{
-    getData();
-  },[])
+      ...adminUserInfo as any,
+    });
+  }, [adminUserInfo]);
+  useEffect(() => {
+    setFormData({
+      ...adminUserInfo as any,
+      company_type_index: 0
+    });
+    getCompanyTypeData();
+  }, [])
   // 表单数据
   const [formData, setFormData] = useState({
-    real_name: "麦兜"
+    user_name: "麦兜"
   });
-  // 显示popup
-  const [popupShow,setPopupShow] = useState(false);
-  const triggerList = useCallback((key:string)=>{
-    setPopupShow(true);
-  },[])
-  // popup保存
-	const { fetchData: realNameUpdateFetch } = realNameUpdateApi();
+  // 昵称修改保存
+  const { fetchData: realNameUpdateFetch } = realNameUpdateApi();
   const rules = {
-    real_name: [{
-      message: "请输入昵称"
+    text: [{
+      message: "请输入"
     }]
   }
-  const handleTextareaSave = async (real_name)=>{
-    retrieval({real_name},rules).then(async ()=>{
-      const result = await realNameUpdateFetch({real_name});
-      if(result.success){
-        getData();
-        setPopupShow(false);
+  const { fetchData: saveFetch } = companyUpdateApi();
+  const { fetchData: getCompanyFetch } = companyDetailApi();
+  const handleTextareaSave = async (text, type) => {
+    retrieval({ text }, rules).then(async () => {
+      let result;
+      if (type == "Ickname") {
+        result = await realNameUpdateFetch({ real_name: text });
+      } else {
+        const params = await getCompanyFetch();
+        result = await saveFetch({
+          ...params.data,
+          company_name: text
+        });
+      }
+      if (result.success) {
+        getAdminUserInfo();
+        (ModifyIcknameEl.current as any).setModalShow(false);
+        (ModifyCompanyNameEl.current as any).setModalShow(false)
         alert.success("保存成功");
-      }else{
+      } else {
         alert.none(result.msg);
       }
-    }).catch(message=>{
+    }).catch(message => {
       alert.none(message);
     })
   }
   // Taro.eventCenter.on('message:detail', (message) => console.log(message))
   // 面面跳转
-  const onNavigate = (url:string)=>{
+  const onNavigate = (url: string) => {
     goLink(url);
   }
   // 肖像编辑
-  const handleSelectRortrait = ()=>{
-    chooseMedia({
-      count: 1,
-      mediaType: ["image"],
-      success(ev){
-        console.log(ev);
-        
+  const { fetchData: portraitUpdateFetch } = portraitUpdateApi();
+  const { getWxPhoto } = useUploadCDNImg();
+  const handleSelectRortrait = () => {
+    Taro.showModal({
+      title: "提示",
+      content: "是否确定更改头像？",
+      showCancel: true,
+      async success(ev) {
+        if (ev.confirm) {
+          let result = await getWxPhoto('mall');
+          const portraitUpdateResult = await portraitUpdateFetch({
+            avatar_url: IMG_CND_Prefix + (result as any).url
+          });
+          if (portraitUpdateResult.success) {
+            getAdminUserInfo();
+            alert.success("保存成功");
+          } else {
+            alert.none(portraitUpdateResult.msg);
+          }
+        }
       }
     })
   }
+  const mGetPhoneNumber = (ev) => {
+    if (ev.detail?.code) {
+      getPhoneNumber(ev.detail.code);
+    } else {
+      alert.none("绑定失败!");
+    }
+  }
+  const ModifyIcknameEl = useRef(null);
+  const ModifyCompanyNameEl = useRef(null);
+  // 获取企业类型
+  const { fetchData: companyTypeFetch, state: companyTypeData } = companyTypeApi();
+  const getCompanyTypeData = async () => {
+    const reuslt = await companyTypeFetch();
+    if (reuslt.success) {
+      reuslt.data?.list?.every((item, index) => {
+        if (item.id == (adminUserInfo as any).purchaser_type) {
+          setFormData({
+            ...adminUserInfo as any,
+            company_type_index: index
+          });
+          return false;
+        }
+        return true;
+      })
+    }
+  }
+  // 修改企业类型
+  const handleCompanyType = async (ev) => {
+    const { value } = ev.detail;
+    const item = companyTypeData.data.list && companyTypeData.data.list[value];
+    if (item) {
+      const params = await getCompanyFetch();
+      const result = await saveFetch({
+        ...params.data,
+        purchaser_type: item.id
+      });
+      if (result.success) {
+        getAdminUserInfo();
+        alert.success("保存成功")
+      } else {
+        alert.none(result.msg);
+      }
+    }
+  }
 
   return (
     <View className="user-edit">
       <View onClick={handleSelectRortrait} className="user-edit-portrait">
-        <Image src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.jj20.com%2Fup%2Fallimg%2F1113%2F052420110515%2F200524110515-2-1200.jpg&refer=http%3A%2F%2Fimg.jj20.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1652840455&t=6d2fd53931578ef6e213a929a77d059c"/>
+        <Image src={(formData as any)?.avatar_url} />
         <View>点击编辑头像</View>
       </View>
       <View className="user-edit-content">
-        <View className="user-edit-content-title"><Text/> 个人资料</View>
-        <UserEditList onClick={()=>triggerList('real_name')} data={state.data.user_name} label="昵称" placeholder="请输入" icon=""/>
-        <UserEditList onClick={()=>onNavigate("/pages/company/index")} label="手机号" placeholder="去绑定" icon=""/>
+        <View className="user-edit-content-title"><Text /> 个人资料</View>
+        <UserEditList onClick={() => (ModifyIcknameEl.current as any).setModalShow(true)} data={(formData as any)?.user_name} label="昵称" placeholder="请输入" icon="" />
+        <UserEditList label="手机号" placeholder="去绑定" icon="">
+          {((formData as any)?.phone) ? <View className="user-edit-content-phone">
+            <View>{(formData as any)?.phone}</View>
+            <Text>已绑定</Text>
+          </View> :
+            <Button className="user-edit-content-bindphone" openType="getPhoneNumber" onGetPhoneNumber={mGetPhoneNumber}>去绑定</Button>
+          }
+        </UserEditList>
       </View>
       <View className="user-edit-content">
-        <View className="user-edit-content-title"><Text/> 组织资料</View>
-        <UserEditList onClick={()=>triggerList('real_name')} data={state.data.user_name} label="名称" placeholder="待绑定" icon=""/>
-        <UserEditList onClick={()=>onNavigate("/pages/company/index")} label="类型" placeholder="完善公司/组织信息" icon=""/>
-        <UserEditList onClick={()=>onNavigate("/pages/certification/index")} label="我的认证" placeholder="待绑定" icon="">
-          已认证
+        <View className="user-edit-content-title"><Text /> 组织资料</View>
+        <UserEditList onClick={() => (ModifyCompanyNameEl.current as any).setModalShow(true)} data={(formData as any)?.company_name} label="名称" placeholder="待绑定" icon="" />
+        <UserEditList label="类型" placeholder="完善公司/组织信息" icon="">
+          <Picker mode="selector" range={(companyTypeData.data as any).list as any} rangeKey="name" value={(formData as any)?.company_type_index} onChange={handleCompanyType}>
+            {(companyTypeData.data as any).list && (companyTypeData.data as any).list[(formData as any)?.company_type_index].name}
+          </Picker>
         </UserEditList>
-        <UserEditList onClick={()=>onNavigate("/pages/weightList/index")} label="创建人" placeholder="完善公司/组织信息" icon=""/>
+        <UserEditList onClick={() => onNavigate("/pages/certification/index")} label="我的认证" placeholder="待绑定" icon="">
+          <View className={`user-edit-content-company ${(formData as any)?.authentication_status == 4 && "user-edit-content-company-adopt"}`}>
+            <Text className="iconfont " /> {(formData as any)?.authentication_status == 4 ? "已认证" : "未认证"}
+          </View>
+        </UserEditList>
+        <UserEditList label="创建人" data={(formData as any)?.founder_user_name} placeholder="完善公司/组织信息" icon="" useIcon="true" />
       </View>
-      <Button hoverClass="none" className="user-edit-logout">退出当前账号</Button>
+      {/* <Button hoverClass="none" className="user-edit-logout">退出当前账号</Button> */}
 
-      <PopupContent value={formData.real_name} show={popupShow} setPopupShow={setPopupShow} save={handleTextareaSave}/>
+      <ModifyModal title="修改昵称" ref={ModifyIcknameEl} value={(formData as any)?.user_name} save={(value) => handleTextareaSave(value, "Ickname")} />
+      <ModifyModal title="修改名称" ref={ModifyCompanyNameEl} value={(formData as any)?.company_name} save={(value) => handleTextareaSave(value, "companyName")} />
     </View>
   )
 }
 
 // 列表
-const UserEditList = memo((props:any)=>{
+const UserEditList = memo((props: any) => {
   return (
     <View onClick={props.onClick} className="user-edit-list">
       <View className="user-edit-list-left">
@@ -104,44 +192,16 @@ const UserEditList = memo((props:any)=>{
       <View className="user-edit-list-right">
         <View>
           {
-            props.children?props.children:
-            props.data?props.data:
-            <View className="user-edit-list-right-placeholder">{props.placeholder}</View>
+            props.children ? props.children :
+              props.data ? props.data :
+                <View className="user-edit-list-right-placeholder">{props.placeholder}</View>
           }
         </View>
-        <Text className="iconfont icon-a-moreback"></Text>
+        {
+          !props.useIcon &&
+          <Text className="iconfont icon-a-moreback"></Text>
+        }
       </View>
     </View>
   )
 })
-
-// popup内容
-const PopupContent = memo((props:any)=>{
-  const [value, setValue] = useState("");
-  useEffect(()=>{
-    setValue(props.value);
-  },[props.value])
-  // popup输入长度
-  const handleTextareaInput = (ev:any)=>{
-    setValue(ev.detail.value.slice(0,20));
-  }
-  // 重置
-  const handleTextareaReset = ()=>{
-    setValue("");
-  }
-  return (
-    <Popup onClose={()=>props.setPopupShow(false)} title="修改昵称" show={props.show}>
-        <View className="user-edit-popup-content">
-          <View className="user-edit-popup-input">
-            <Textarea value={value} onInput={handleTextareaInput} maxlength={20}/>
-            <Text>{value.length}/20</Text>
-          </View>
-          <Text className="user-edit-popup-tips">请设置2-20个字符，由中文、英文、数字、-和_组成</Text>
-          <View className="user-edit-popup-operation">
-            <Button onClick={handleTextareaReset} hoverClass="none" className="user-edit-popup-operation-reset">重置</Button>
-            <Button onClick={()=>props.save(value)} hoverClass="none" className="user-edit-popup-operation-save">保存</Button>
-          </View>
-        </View>
-      </Popup>
-  )
-})