订单售后v3

src/api/material.ts

@@ -55,3 +55,14 @@ export const GetLabProductApi = () => {
         method: "get",
     })
 }
+
+/**
+ *  收藏面料
+ * @returns 
+*/
+// export const GetProductDetailApi = () => {
+//     return useRequest({
+//         url: `/v1/mall/product`,
+//         method: "get",
+//     })
+// }

src/api/salesAfterOrder.ts

@@ -3,20 +3,20 @@ import { useRequest } from "@/use/useHttp"
 /**
  * 售后订单列表
  */
-export const GetHotSearchApi = () => {
+export const GetSaleOrderListApi = () => {
     return useRequest({
-        url: `/v1/mall/hotSearch/list`,
+        url: `/v1/mall/returnApplyOrder/list`,
         method: "get",
     })
 }
 
 /**
- * 申请售后订单列表
+ * 申请售后订单
  */
  export const ReturnApplyOrderApi = () => {
     return useRequest({
         url: `/v1/mall/returnApplyOrder`,
-        method: "get",
+        method: "post",
     })
 }
 

src/common/constant.js

@@ -10,7 +10,7 @@
 // export const BASE_URL = `https://dev.zzfzyc.com/lymarket`  // 开发环境
 // export const BASE_URL = `https://www.zzfzyc.com/lymarket`  // 正式环境
 // export const BASE_URL = `http://192.168.1.5:40001/lymarket` // 王霞
-// export const BASE_URL = `http://192.168.1.224:50001/lymarket` // 添
+// export const BASE_URL = `http://192.168.1.224:50002/lymarket` // 添
 export const BASE_URL = `http://192.168.1.15:50001/lymarket` // 杰
 
 // CDN
@@ -21,8 +21,6 @@ export const UPLOAD_CDN_URL = `https://v0.api.upyun.com/`
 // cdn
 export const IMG_CND_Prefix = CURRENT_ENV.includes('development')? "https://test.cdn.zzfzyc.com":"https://cdn.zzfzyc.com"
 
-
-
 // 上传图片视频
 export const CDN_UPLOAD_IMG = `${UPLOAD_CDN_URL || ''}`;
 

src/components/counter/index.tsx

@@ -13,7 +13,7 @@ type params = {
     onClickBtn?:(val:number) => void, 
     unit?: string
 }
-export default ({minNum = 0, maxNum = 100, step=1, digits = 0, defaultNum = 0, onChange, onBlue, onClickBtn, unit = ''}: params) => {
+export default ({minNum = 0, maxNum = 10000, step=1, digits = 0, defaultNum = 0, onChange, onBlue, onClickBtn, unit = ''}: params) => {
     const [value, setValue] = useState<any>({count:defaultNum})
 
     const onPlus = () => {

src/components/orderBtns/index.tsx

@@ -30,7 +30,8 @@ export default memo(({orderInfo, onClick}:Param) => {
         SaleOrderStatusWaitingPayment,
         SaleOrderStatusWaitingReceipt,
         SaleOrderStatusAlreadyReceipt,
-        SaleorderstatusWaitingPrePayment
+        SaleorderstatusWaitingPrePayment,
+        SaleOrderStatusTaking
     } = ORDER_STATUS
 
     //订单类型
@@ -42,6 +43,7 @@ export default memo(({orderInfo, onClick}:Param) => {
     
     //订单按钮按订单状态归类, value是该订单状态，可能该按钮会出现
     const orderBtnsList = useRef([
+        
         {
             id: 1,
             value: [SaleOrderStatusBooking.value, 
@@ -51,11 +53,6 @@ export default memo(({orderInfo, onClick}:Param) => {
                 SaleOrderStatusWaitingDelivery.value], //取消订单按钮对应： 待接单，配布中，已配布, 待付款， 待发货
             label: '取消订单'
         },
-        {
-            id: 2,
-            value: [SaleorderstatusWaitingPrePayment.value, SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value], //去付款按钮对应：待付款， 待发货, 待收货, 已收货, 已完成
-            label: '去付款'
-        },
         {
             id: 3,
             value: [SaleOrderStatusWaitingDelivery.value], //申请退款按钮对应： 待发货
@@ -86,6 +83,11 @@ export default memo(({orderInfo, onClick}:Param) => {
             value: [SaleOrderStatusBooking.value], //按钮对应： 待接单
             label: '退款'
         },
+        {
+            id: 2,
+            value: [SaleOrderStatusTaking.value, SaleorderstatusWaitingPrePayment.value, SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value], //去付款按钮对应：待付款， 待发货, 待收货, 已收货, 已完成
+            label: '去付款'
+        },
     ])
     
     
@@ -124,8 +126,6 @@ export default memo(({orderInfo, onClick}:Param) => {
 
     //点击按钮操作
     const submitBtns = (val, index) => {
-        (val == 1)&&cancelOrder(); //取消订单按钮
-        (val == 6)&&receiveOrder(); //确认收货
         if (val == 1) {
             cancelOrder()
         } else if (val == 6) {

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

@@ -23,7 +23,7 @@
             .color_item{
                 display: flex;
                 align-items: center;
-                margin: 20px 0;
+                margin: 30px 0;
             }
             .image{
                 width: 70px;

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

@@ -1,7 +1,8 @@
 import { formatHashTag, formatImgUrl } from "@/common/fotmat";
 import Counter from "@/components/counter";
+import MCheckbox from "@/components/checkbox";
 import { Image, Text, View } from "@tarojs/components";
-import { memo, useCallback } from "react";
+import { FC, memo, useCallback } from "react";
 import styles  from './index.module.scss'
 
 type OrderParam = {
@@ -15,12 +16,36 @@ type OrderParam = {
     status?: number, //订单状态
 }
 
-export default memo(({order}:{order:OrderParam}) => {
+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}>
@@ -32,12 +57,15 @@ export default memo(({order}:{order:OrderParam}) => {
                     {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>
-                        <View className={styles.btn_count}>
+                        {(order.sale_mode == 0)&&<View className={styles.btn_count}>
-                            <Counter/>
+                            <Counter maxNum={colorItem.roll} onChange={getCounterChange(colorItem)}/>
-                        </View>
+                        </View>||
+                        <MCheckbox  status={item.select} onSelect={() => selectCallBack(colorItem)} onClose={() => colseCallBack(colorItem)}/>}
                     </View>)}
                 </View>
             </View>)}
         </View>
     )
 })
+
+export default kindeList

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

@@ -4,7 +4,10 @@ import styles  from './index.module.scss'
 import classnames from "classnames";
 
 //其他说明
-export default memo(() => {
+type Param = {
+    onChange: (val: string) => void
+}
+export default memo(({onChange}:Param) => {
     const [descData, setDescData] = useState({
         number: 0,
         value: '',
@@ -18,6 +21,7 @@ export default memo(() => {
             res = value.slice(0, descData.count)
         }
         setDescData({...descData, number:res.length, value: res})
+        onChange?.(res)
     }
 
     const toggleShowRealTextarea = (show) => {

src/pages/applyAfterSales/index.module.scss

@@ -36,7 +36,7 @@
             .returnSaleInput_item{
                 display: flex;
                 align-items: center;
-                padding-bottom: 20px;
+                padding-bottom: 30px;
                 flex-wrap: wrap;
                 .title{
                     font-size: $font_size;
@@ -101,16 +101,17 @@
                         border-radius: 10px;
                     }
                     .miconfont_close{
-                        width: 30px;
+                        width: 43px;
-                        height: 30px;
+                        height: 43px;
                         background-color: #ccc;
                         border-radius: 50%;
                         position: absolute;
                         right: -10px;
                         top: -10px;
                         text-align: center;
-                        line-height: 30px;
+                        line-height: 43px;
                         color: #fff;
+                        font-size: 30px;
                     }
                 }
             }

src/pages/applyAfterSales/index.tsx

@@ -1,5 +1,5 @@
 import { Image, ScrollView, Text, Textarea, View } from "@tarojs/components";
-import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { FC, memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
 import classnames from "classnames";
 import styles  from './index.module.scss'
 import { formatHashTag, formatImgUrl } from "@/common/fotmat";
@@ -10,17 +10,33 @@ import Taro, { useDidShow, useRouter } from "@tarojs/taro";
 import useUploadCDNImg from "@/use/useUploadImage";
 import { GetSaleOrderDetailApi } from "@/api/order";
 import KindList from "./components/kindList"
+import { ReturnApplyOrderApi } from "@/api/salesAfterOrder";
+import { alert } from "@/common/common";
 
 type ReasonParam = 1|2|3 //1 退货原因 2 货物状况 3 退货说明
 export default () => {
 
-    const router = useRouter()
+   
-    const orderId = useRef<number>(Number(router.params.id))
 
     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()
@@ -33,8 +49,9 @@ export default () => {
 
     //监听获取到的数据
     useEffect(() => {
-        if(orderDetail)
+        if(orderDetail) {
             formatData()
+        }
     }, [orderDetail])
 
     //格式化数据格式
@@ -60,21 +77,73 @@ export default () => {
         }
     }, [formatDetailOrder])
    
-     //对应数量
-     const formatCount = useCallback((item) => {
-        return (formatDetailOrder?.sale_mode == 0? item.roll : Number(item.length / 100)) + formatDetailOrder?.unit
-    }, [formatDetailOrder])
-   
-
     
     //退货选择弹窗
     const [showReason, setShowReason] = useState<{show:true|false, status:ReasonParam}>({show:false, status:1})
     const closeReason = useCallback(() => setShowReason({...showReason, show:false}), [])
     const onShowReason = (status) => setShowReason({...showReason, status, 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('申请成功')
+        } else {
+            alert.error('申请失败')
+        }
+        console.log('提交：：',submitData)
+    }
+
     //底部按钮
     const onSubmit = (val) => {
-
+        if(val == 2) {
+            onSubmitData()
+        }
     }
     
     return (
@@ -83,7 +152,7 @@ export default () => {
                 <View className={styles.kind_number}><Text>{dataCount}</Text></View>
                 <ScrollView scrollY className={styles.scroll}>
                     <View className={styles.scroll_con}>
-                        <KindList order={formatDetailOrder}/>
+                        <KindList order={formatDetailOrder} onNumChange={getNumChange} onSelectChange={getSelectChange}/>
                         <View className={styles.returnSaleInput}>
                             <View className={styles.returnSaleInput_item}>
                                 <View className={styles.title}>退货原因</View>
@@ -108,11 +177,11 @@ export default () => {
                             </View>
                             <View className={styles.returnSaleInput_item}>
                                 <View className={styles.title}>拍照上传</View>
-                                <PictureItem/>
+                                <PictureItem onChange={getImageList}/>
                                 
                             </View>
                         </View>
-                        <OtherReason/>
+                        <OtherReason onChange={getOtherReason}/>
                     </View>
                 </ScrollView>
                 <View className="common_safe_area_y"></View>
@@ -129,10 +198,13 @@ export default () => {
 }
 
 //图片列表
-const PictureItem = memo(() => {
+type ImageParam = {
+    onChange?:(val: string[]) => void
+}
+const PictureItem:FC<ImageParam> = memo(({onChange}) => {
     const {getWxPhoto} = useUploadCDNImg()
     const [imageList, setImageLise] = useState<string[]>([])
-
+    //上传图片
     const uploadImage = async () => {
         let res:any = await getWxPhoto('after-sale')
         if(res.code == 200) {
@@ -142,8 +214,15 @@ const PictureItem = memo(() => {
 
     //删除图片
     const delImage = (index) => {
-        
+        imageList.splice(index,1)
+        setImageLise(() => [...imageList])
     }
+
+    //监听上传的图片变化
+    useEffect(() => {
+        onChange?.(imageList||[])
+    }, [imageList])
+
     return (
         <>
             {imageList.map((item, index) => 

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

@@ -100,7 +100,10 @@ export default memo(({order, comfirm = false}:Param) => {
         if (item.id == 2) {
             //合计金额 (剪板特殊请情况)
             return (item.value.includes(order.status)|| order.sale_mode == 1)
-        } else  {
+        } 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 )
         }
        

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

@@ -25,6 +25,7 @@ type OrderInfo = {
     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:货到付款
@@ -122,6 +123,8 @@ export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param)
      //是否显示七天账期
      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
         //支付方式是货到付款,不显示

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;
@@ -123,7 +125,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

@@ -11,6 +11,7 @@ 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,
@@ -23,8 +24,9 @@ type Param = {
         id: number,
         payment_method: number, //支付方式
         actual_amount: number, //实付金额
-        wait_pay_amount: number //待付金额
+        wait_pay_amount: number, //待付金额
-        should_collect_order_id: number //应付单id
+        should_collect_order_id: number, //应付单id
+        type: number //1 退货 2退款
     },
     onClickBtn?: (val:{status:number, orderInfo:Param['value']}) => void
 }
@@ -51,6 +53,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])
 
@@ -62,10 +65,10 @@ 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}>
@@ -99,7 +102,7 @@ export default memo(({value, onClickBtn}: Param) => {
                 <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?.order_no}</Text>
                 </View>
             </View>
             <OrderBtns orderInfo={orderInfo} onClick={orderBtnsClick}/>

src/pages/salesAfterList/index.tsx

@@ -12,6 +12,7 @@ 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"
 
 export default () => {
   const {checkLogin} = useLogin()
@@ -40,7 +41,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))

src/pages/user/index.tsx

@@ -67,7 +67,7 @@ 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" }];
+	  { text: "退款/售后", icon: "icon-a-tuikuanshouhou", url: "/pages/salesAfterList/index" }];
 	const { getPhoneNumber } = useLogin();
 	const mGetPhoneNumber = (ev)=>{
 		if(ev.detail?.code){