订单列表对接

src/components/orderBtns/index.tsx

@@ -1,5 +1,6 @@
 import { CancelOrderApi } from "@/api/order"
 import { alert } from "@/common/common"
+import { ORDER_STATUS } from "@/common/enum"
 import { View } from "@tarojs/components"
 import Taro from "@tarojs/taro"
 import { useCallback, useRef, memo } from "react"
@@ -7,63 +8,83 @@ import styles  from './index.module.scss'
 
 type Param = {
     orderInfo: {
-        status?: number, //订单状态
+        status: number, //订单状态
         orderId: number, //订单id
-        payModel: number, //支付方式
-        realPayPrice: number, //实付金额
-        pendingPayPrice: number, //待付金额
-    },
+        settle_mode: number, //支付方式
+        actual_amount: number, //实付金额
+        wait_pay_amount: number, //待付金额
+    }|null,
     onClick?: (val: number) => void //点击后触发的事件，返回订单状态
 }
 export default memo(({orderInfo, onClick}:Param) => {
+    const {
+            SaleOrderStatusBooking,
+            SaleOrderStatusArranging,
+            SaleOrderStatusArranged,
+            SaleOrderStatusWaitingDelivery,
+            SaleOrderStatusComplete,
+            SaleOrderStatusCancel,
+            SaleOrderStatusRefund,
+            SaleOrderStatusWaitingPayment,
+            SaleOrderStatusWaitingReceipt,
+            SaleOrderStatusAlreadyReceipt
+        } = ORDER_STATUS
     //订单按钮按订单状态归类
     const orderBtnsList = useRef([
         {
             id: 1,
-            value: [0, 1, 2, 3, 4], //取消订单按钮对应： 待接单，待配布，已配布, 待付款， 待发货
+            value: [SaleOrderStatusBooking.value, SaleOrderStatusArranging.value, SaleOrderStatusArranged.value, SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value], //取消订单按钮对应： 待接单，配布中，已配布, 待付款， 待发货
             label: '取消订单'
         },
         {
             id: 2,
-            value: [3, 4], //去付款按钮对应：待付款， 待发货
+            value: [SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value], //去付款按钮对应：待付款， 待发货, 待收货, 已收货, 已完成
             label: '去付款'
         },
         {
             id: 3,
-            value: [4], //取消订单按钮对应： 待发货
+            value: [SaleOrderStatusWaitingDelivery.value], //取消订单按钮对应： 待发货
             label: '申请退款'
         },
         {
             id: 4,
-            value: [5, 6, 7, 8], //取消订单按钮对应： 待收货, 已收货, 已完成, 已退款
+            value: [SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value], //取消订单按钮对应： 待收货, 已收货, 已完成, 已退款
             label: '查看物流'
         },
         {
             id: 5,
-            value: [5, 6, 8], //取消订单按钮对应： 待收货, 已收货, 已退款
+            value: [SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusRefund.value], //取消订单按钮对应： 待收货, 已收货, 已退款
             label: '申请退货'
         },
         {
             id: 6,
-            value: [5], //取消订单按钮对应： 待收货
+            value: [SaleOrderStatusWaitingReceipt.value], //取消订单按钮对应： 待收货
             label: '确认收货'
         },
         {
             id: 7,
-            value: [5,6,7,8], //取消订单按钮对应： 待收货，已收货，已完成, 已退款
+            value: [SaleOrderStatusWaitingReceipt.value,SaleOrderStatusAlreadyReceipt.value,SaleOrderStatusComplete.value,SaleOrderStatusRefund.value], //取消订单按钮对应： 待收货，已收货，已完成, 已退款
             label: '再次购买'
         }
     ])
     //判断是否显示该按钮
-    const orderBtnsShow = useCallback((item, status) => {
-        if(item.id == 1) {
-           return( orderInfo.realPayPrice == 0 && status <= 4) //在代发货之前没有付过款
-        } 
-        if(item.id == 2) {
-            return( orderInfo.pendingPayPrice != 0 && status <= 4) //在代发货之前没有付完款
+    const orderBtnsShow = useCallback((item) => {
+        if(orderInfo) {
+            // console.log('orderInfo::',item.value.includes(orderInfo.status))
+            if(item.id == 1) {
+                //取消订单按钮
+                return( orderInfo.actual_amount == 0 && item.value.includes(orderInfo.status)) //在代发货之前没有付过款
+            } else if (item.id == 2) {
+                //去付款按钮
+                return( orderInfo.wait_pay_amount != 0 && item.value.includes(orderInfo.status)) //只要没有付完款就显示
+            } else if(item.id == 3) {
+                //申请退款
+                return (orderInfo.actual_amount != 0 && item.value.includes(orderInfo.status)) //在代发货之前付过款
+            } else {
+                return item.value.includes(orderInfo.status)
+            }
         }
-        return item.value.includes(status)
-    },[])
+    },[orderInfo])
 
     //点击按钮操作
     const submitBtns = (val) => {
@@ -73,12 +94,12 @@ export default memo(({orderInfo, onClick}:Param) => {
 
     //取消订单
     const {fetchData: cancelFetchData} = CancelOrderApi()
-    const cancelOrder = () => {
+    const cancelOrder = () => { 
         Taro.showModal({
             title: '要取消该订单吗？',
             success: async function (res) {
               if (res.confirm) {
-                let res = await cancelFetchData({id: orderInfo.orderId})
+                let res = await cancelFetchData({id: orderInfo?.orderId})
                 if(res.success) {
                     alert.success('取消成功')
                     onClick?.(1)
@@ -94,8 +115,8 @@ export default memo(({orderInfo, onClick}:Param) => {
 
     return (
         <View className={styles.btns_list}>
-            {orderBtnsList.current.map((item, index) => 
-                orderBtnsShow(item, status)&&<View className={styles.btns_item} onClick={() => submitBtns(item.id)}>{item.label}</View>
+            {orderBtnsList.current.map((item) => 
+                orderBtnsShow(item)&&<View key={item.id} className={styles.btns_item} onClick={() => submitBtns(item.id)}>{item.label}</View>
             )}
         </View>
     )