订单售后v3

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

@@ -13,6 +13,7 @@ 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()
@@ -97,30 +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()
-    } else {
-      getOrderList()
+      //退货物流
+
     }
   }, [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 (
@@ -135,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>
   )
 }