订单列表对接

src/app.tsx

@@ -3,7 +3,7 @@ import ContextBlueTooth from "@/use/contextBlueTooth"
 import { Provider } from 'react-redux'
 import configStore from './store'
 import './app.scss'
-import Taro, { useDidShow, useRouter, useShareAppMessage } from '@tarojs/taro'
+import Taro, { useDidShow} from '@tarojs/taro'
 import { analysisShortCodeApi } from './common/shortCode'
 
 const store = configStore()

src/components/orderBtns/index.tsx

@@ -16,6 +16,8 @@ type Param = {
     }|null,
     onClick?: (val: number) => void //点击后触发的事件，返回订单状态
 }
+
+export const OrderBtnsemus = [{id:1, label:'取消订单'},{id:2, label:'去付款'},{id:3, label:'申请退款'},{id:4, label:'查看物流'}, {id:5, label:'申请退货'}, {id:6, label:'确认收货'}, {id:7, label:'再次购买'}]
 export default memo(({orderInfo, onClick}:Param) => {
     const {
             SaleOrderStatusBooking,

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

@@ -1,10 +1,11 @@
 import { goLink } from "@/common/common";
 import { formatHashTag, formatImgUrl, formatPriceDiv } from "@/common/fotmat";
-import OrderBtns from "@/components/orderBtns";
+import OrderBtns, {OrderBtnsemus} from "@/components/orderBtns";
+import Payment from "@/pages/order/components/payment";
 import { useSelector } from "@/reducers/hooks";
 import { Image, Text, View } from "@tarojs/components"
 import classnames from "classnames";
-import { memo, useCallback, useMemo, useRef } from "react";
+import { memo, useCallback, useMemo, useRef, useState } from "react";
 import styles  from './index.module.scss'
 
 type Param = {
@@ -23,6 +24,7 @@ type Param = {
         settle_mode: number, //支付方式
         actual_amount: number, //实付金额
         wait_pay_amount: number //待付金额
+        should_collect_order_id: number //应付单id
     },
     onClickBtn?: (val:number) => void
 }
@@ -98,6 +100,7 @@ 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

@@ -10,6 +10,7 @@ import InfiniteScroll from "@/components/infiniteScroll"
 import {GetOrderStatusListApi, GetOrderListApi} from '@/api/order'
 import { dataLoadingStatus, getFilterData } from "@/common/util"
 import OrderStatusList from "./components/orderStatusList"
+import Payment from "../order/components/payment"
 
 export default () => {
   const {checkLogin} = useLogin()
@@ -82,10 +83,7 @@ export default () => {
     setSearchField((val) => ({...val, name:e, size:10}))
   }, [])
 
-  const clickOrderBtn = useCallback((state) => {
-    getOrderList()
-  }, [orderData])
-
+  
   //列表下拉刷新
   const [refresherTriggeredStatus, setRefresherTriggeredStatus] = useState(false)
   const getRefresherRefresh = async () => {
@@ -93,6 +91,33 @@ export default () => {
     setRefresherTriggeredStatus(true)
     setSearchField((val) => ({...val, size:10}))
   }
+
+  //监听点击的按钮
+  const clickOrderBtn = useCallback((state) => {
+    if(state == 2) {
+      //去支付
+      toPay()
+    }
+  }, [orderData])
+
+  //去付款
+  const [shouldCollectOrderId, setShouldCollectOrderId] = useState(0)
+  const [payMentShow, setPayMentShow] = useState(false)
+  const toPay = () => {
+      setPayMentShow(true)
+  }
+  //关闭支付弹窗
+  const closePayShow = useCallback(() => {
+      setPayMentShow(() => false)
+  }, [])
+
+  //支付成功
+  const onPaySuccess = useCallback(() => {
+      closePayShow()
+  }, [])
+
+  
+
   
   return (
     <View className={styles.order_list_main}>
@@ -107,6 +132,7 @@ export default () => {
             })}
           </InfiniteScroll>
       </View>
+      <Payment onSubmitSuccess={onPaySuccess} show={payMentShow} onClose={closePayShow} orderId={shouldCollectOrderId}/>
     </View>
   )
 }