✨ feat:增加退款码单

src/api/order.ts

@@ -109,6 +109,16 @@ export const GetPayCode = () => {
         method: 'post',
     })
 }
+/**
+ * 获取退款码单
+ */
+export const GetReturnPayCode = () => {
+    return useRequest({
+        url: `/xima-caphtml/caphtml-return`,
+        base_url: CAP_HTML_TO_IMAGE_BASE_URL,
+        method: 'post',
+    })
+}
 //编辑备注信息
 export const mpsaleOrderput = () => {
     return useRequest({

src/components/RefundCodelist/index.module.scss

@@ -0,0 +1,21 @@
+.popupBox {
+    .scroStyle {
+        height: 900px;
+    }
+
+    .sure {
+        // margin-top: 35px;
+        margin-left: 40px;
+        margin-right: 40px;
+        // width: 670px;
+        height: 80px;
+        background: #337FFF;
+        border-radius: 44px;
+        font-size: 28px;
+        font-family: PingFangSC-Medium, PingFang SC;
+        font-weight: 500;
+        color: #FFFFFF;
+        text-align: center;
+        line-height: 80px;
+    }
+}

src/components/RefundCodelist/index.tsx

@@ -0,0 +1,186 @@
+import { ScrollView, View, Image } from '@tarojs/components'
+import { memo, useCallback, useEffect, useMemo, useState, useRef } from 'react'
+import styles from './index.module.scss'
+import classnames from 'classnames'
+// import BottomBtns from '@/components/BottomBtns'
+import { formatPriceDiv } from '@/common/format'
+import Taro from '@tarojs/taro'
+import Popup from '@/components/popup'
+import useCheckAuthorize from '@/use/useCheckAuthorize'
+import { alert } from '@/common/common'
+import { GetReturnPayCode } from "@/api/order"
+import { formatWeightDiv, formatDateTime } from '@/common/format'
+interface Props {
+    obj: any,
+    // picUrl?: string,
+    showPopup: boolean,
+    popupClose: () => void
+}
+
+export default memo((props: Props) => {
+
+    const { fetchData: payFetch } = GetReturnPayCode()
+    const [PicUrl, setPicUrl] = useState<string>('')
+    useEffect(() => {
+        //判断进来的是否是空对象，减少性能问题
+        var length = Object.keys(props.obj);
+        if (length.length > 0) getPic()
+    }, [props.obj])
+
+    const getPic = async () => {
+        Taro.showLoading({
+            title: '请稍等...',
+            mask: true
+        })
+        const list: any = [];
+        let arr: any[] = []
+        if (props.obj.type == 1) {
+            arr = props.obj.quality_check_pass_product
+        } else {
+            arr = props.obj.product_list
+        }
+        arr.forEach((item) => {
+            item.product_colors.forEach((it) => {
+                list.push({
+                    product_code: item.code,
+                    product_name: item.name,
+                    product_color_code: it.code,
+                    product_color_name: it.name,
+                    num: it.roll.toString(),
+                    weight: formatWeightDiv(it.actual_weight).toString(),
+                    deduction_weight: formatWeightDiv(it.deductions_weight).toString(),
+                    settle_weight: formatWeightDiv(it.settle_weight).toString(),
+                    deduction_amount: (it.deductions_amount / 100).toString(),
+                    sale_price: (it.sale_price / 100).toString(),
+                    total_price: (it.estimate_amount / 100).toString(),
+                    length: (it.length / 100).toString(),
+                    weight_error: formatWeightDiv(it.settle_weight_error).toString(),
+                });
+            });
+        });
+        const query = {
+            list: list,
+            title: "售后确认单",
+            // show_qrcode: true,
+            // show_barcode: true,
+            // show_wait_pay_amount: true,
+            order_type: props.obj.sale_mode_name,
+            // shipment_mode: props.obj.shipment_mode_name,
+            // company: props.obj.title_purchaser_name,
+            sale_user: props.obj.sale_user_name,
+            order_created_time: formatDateTime(props.obj.create_time),
+            order_no: props.obj.return_order_no,
+            // target_user_name: props.obj.target_user_name,
+            // target_address: props.obj.address_detail,
+            // target_description: props.obj.reason_describe,
+            pay_account: props.obj.transfer_remittance_account,
+            bank_account_name: props.obj.account_name,
+            bank_name: props.obj.bank_of_deposit,
+            // pay_type: props.obj.settle_mode_name,
+            client: props.obj.purchaser_name,
+            // phone: props.obj.target_user_phone,
+            order_total_length: (props.obj.total_number / 100).toString(),
+            order_total_price: (
+                props.obj.refund_amount / 100
+            ).toString(),
+            // total_weight_error_discount: (
+            //     props.obj.total_weight_error_discount / 100
+            // ).toString(),
+            order_total_num: props.obj.total_number.toString(),
+            // qrcode: "",
+            // order_total_weight: (props.obj.total_weight / 1000).toString(),
+            // estimate_amount: (props.obj.estimate_amount / 100).toString(),
+            // total_sale_price: (props.obj.total_sale_price / 100).toString(),
+            // show_total_sale_price: true,
+            // show_total_weight_error_discount: true,
+            // actual_amount: (props.obj.actual_amount / 100).toString(),
+            // wait_pay_amount: (props.obj.wait_pay_amount / 100).toString(),
+            order_total_settle_weight: (
+                props.obj.order_total_settle_weight / 1000
+            ).toString(),
+            order_total_deduction_weight: (
+                props.obj.order_total_deduction_weight / 1000
+            ).toString(),
+            order_total_deduction_amount: (
+                props.obj.order_total_deduction_amount / 100
+            ).toString(),
+            order_total_weight_error: (
+                props.obj.total_weight_error / 1000
+            ).toString(),
+        };
+        const res = await payFetch(query)
+        if (res.data) {
+            setPicUrl(res.data.base64)
+            Taro.hideLoading()
+        }
+    }
+
+    const fileData = useRef({
+        filePath: '',
+        base64: '',
+    })
+
+    //预览图片
+    const showImage = () => {
+        const time = new Date().valueOf()
+        const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(PicUrl) || []
+        let filePath = Taro.env.USER_DATA_PATH + '/img' + time + '.' + format
+        fileData.current.filePath = filePath
+        fileData.current.base64 = bodyData
+        const save = Taro.getFileSystemManager()
+        save.writeFile({
+            filePath: fileData.current.filePath,
+            data: fileData.current.base64,
+            encoding: 'base64',
+        })
+        Taro.previewImage({
+            current: fileData.current.filePath, // 当前显示
+            urls: [fileData.current.filePath], // 需要预览的图片http链接列表
+        })
+    }
+
+    //检查是否开启保存图片权限
+    const { check } = useCheckAuthorize({ scope: 'scope.writePhotosAlbum', msg: '您没授权，无法保存图片' })
+    const saveImageCheck = async () => {
+        const res = await check()
+        res && saveImage()
+    }
+
+    //保存图片
+    const saveImage = () => {
+        const time = new Date().valueOf()
+        const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(PicUrl) || []
+        let filePath = Taro.env.USER_DATA_PATH + '/img' + time + '.' + format
+        fileData.current.filePath = filePath
+        fileData.current.base64 = bodyData
+        const save = Taro.getFileSystemManager()
+        save.writeFile({
+            filePath: fileData.current.filePath,
+            data: fileData.current.base64,
+            encoding: 'base64',
+        })
+        alert.loading('正在保存图片')
+        Taro.saveImageToPhotosAlbum({
+            filePath: fileData.current.filePath,
+            success: function () {
+                alert.success('图片保存成功')
+            },
+            fail: function (err) {
+                console.log('err::', err)
+            },
+        })
+    }
+
+    return (
+        <Popup show={props.showPopup} title={'退款码单'} onClose={() => props.popupClose?.()}>
+            <View className={styles.popupBox}>
+                <ScrollView enhanced scrollY className={styles.scroStyle}>
+                    <View className={styles.pic}>
+                        <Image lazyLoad mode='widthFix' style={{ width: '100%', height: '100%' }} src={PicUrl} onClick={() => showImage()}></Image>
+                    </View>
+                </ScrollView>
+                <View className={styles.sure} onClick={() => saveImageCheck()}>保存图片</View>
+            </View>
+        </Popup>
+    )
+})

src/pages/applyMoney/index.tsx

@@ -276,7 +276,8 @@ export default () => {
         const query = {
             reason_describe: TextareaValue,
             fabric_piece_accessory_url: [],
-            goods_status: 100,
+            goods_status: 0,
+            return_reason: 1,
             return_explain: Query.reasonId,
             roll: 0,
             roll_list: arr,

src/pages/refundDetail/index.module.scss

@@ -81,8 +81,8 @@
 
         .cancleBtn {
             margin-right: 20px;
-            width: 224px;
+            width: 160px;
-            height: 64px;
+            height: 72px;
             border-radius: 40px;
             opacity: 0.6;
             border: 1px solid #000000;
@@ -90,7 +90,21 @@
             font-weight: 400;
             color: #000000;
             text-align: center;
-            line-height: 64px;
+            line-height: 72px;
+        }
+
+        .seeButon {
+            margin-right: 20px;
+            width: 160px;
+            height: 72px;
+            border-radius: 40px;
+            opacity: 0.6;
+            border: 1px solid #000000;
+            font-size: 28px;
+            font-weight: 400;
+            color: #000000;
+            text-align: center;
+            line-height: 72px;
         }
     }
 

src/pages/refundDetail/index.tsx

@@ -16,6 +16,7 @@ import { IMG_CND_Prefix } from "@/common/constant";
 import Popup from '@/components/popup';
 import UploadImage from '@/components/uploadImage'
 import { alert } from '@/common/common';
+import RefundCodelist from "@/components/RefundCodelist"
 export default () => {
     //页面下拉刷新
     usePullDownRefresh(() => {
@@ -226,7 +227,10 @@ export default () => {
             }), // 需要预览的图片 http 链接列表
         });
     };
-
+    const [ShowCode, setShowCode] = useState(false)
+    const handSee = () => {
+        setShowCode(true)
+    }
 
     return (
         <View className={styles.main}>
@@ -299,11 +303,23 @@ export default () => {
                 </View>
             </DefaultBox>
             <View className={styles.safeBox}></View>
-            {
+
-                (DeatailObj.stage === 0 || DeatailObj.stage === 1) && <View className={styles.bottomMuck}>
+            <View className={styles.bottomMuck}>
-                    <View className={styles.cancleBtn} onClick={() => handCancle()}>取消退货</View>
+                {
-                </View>
+                    (DeatailObj.stage === 0 || DeatailObj.stage === 1) && <View className={styles.cancleBtn} onClick={() => handCancle()}>取消退货</View>
-            }
+
+                }
+                {
+                    (DeatailObj.sale_mode == 0 && DeatailObj.stage == 3 && (DeatailObj.type == 1 || DeatailObj.type == 3)) && <View className={styles.seeButon} onClick={() => { handSee() }}>查看码单</View>
+                }
+
+            </View>
+            <RefundCodelist
+                obj={DeatailObj}
+                // picUrl={PicUrl}
+                showPopup={ShowCode}
+                popupClose={() => setShowCode(false)}
+            ></RefundCodelist>
             <Popup title={'查看/修改物流回单'} show={ShowPic} onClose={() => setShowPic(false)}>
                 <>
                     <UploadImage onChange={getImageList} defaultList={PicList} onlyRead={onlyRead} />

src/pages/refundMoneyDetail/index.module.scss

@@ -89,7 +89,21 @@
             font-weight: 400;
             color: #000000;
             text-align: center;
-            line-height: 64px;
+            line-height: 72px;
+        }
+
+        .seeButon {
+            margin-right: 20px;
+            width: 160px;
+            height: 72px;
+            border-radius: 40px;
+            opacity: 0.6;
+            border: 1px solid #000000;
+            font-size: 28px;
+            font-weight: 400;
+            color: #000000;
+            text-align: center;
+            line-height: 72px;
         }
     }
 

src/pages/refundMoneyDetail/index.tsx

@@ -13,7 +13,7 @@ import {
 import OrderState from './components/orderState'
 // import AddressDetailBox from './components/addressDetailBox'
 import { IMG_CND_Prefix } from "@/common/constant";
-
+import RefundCodelist from "@/components/RefundCodelist"
 export default () => {
     const router = useRouter()
     useEffect(() => {
@@ -182,7 +182,10 @@ export default () => {
             }), // 需要预览的图片 http 链接列表
         });
     };
-
+    const [ShowCode, setShowCode] = useState(false)
+    const handSee = () => {
+        setShowCode(true)
+    }
 
     return (
         <View className={styles.main}>
@@ -278,11 +281,22 @@ export default () => {
                 </View>
             </DefaultBox>
             <View className={styles.safeBox}></View>
-            {
+            <View className={styles.bottomMuck}>
-                (DeatailObj.stage === 0 || DeatailObj.stage === 1) && <View className={styles.bottomMuck}>
+                {
-                    <View className={styles.cancleBtn} onClick={() => handCancle()}>取消售后</View>
+                    (DeatailObj.stage === 0 || DeatailObj.stage === 1) && <View className={styles.cancleBtn} onClick={() => handCancle()}>取消退货</View>
-                </View>
+
-            }
+                }
+                {
+                    (DeatailObj.sale_mode == 0 && DeatailObj.stage == 3 && (DeatailObj.type == 1 || DeatailObj.type == 3)) && <View className={styles.seeButon} onClick={() => { handSee() }}>查看码单</View>
+                }
+
+            </View>
+            <RefundCodelist
+                obj={DeatailObj}
+                // picUrl={PicUrl}
+                showPopup={ShowCode}
+                popupClose={() => setShowCode(false)}
+            ></RefundCodelist>
         </View>
     )
 }

src/pages/refundPage/components/itemList/index.module.scss

@@ -222,6 +222,22 @@
     }
 
     .bottomBox {
-        margin-top: 40px;
+        margin-top: 10px;
+        display: flex;
+        justify-content: flex-end;
+
+        .seeButon {
+            margin-right: 30px;
+            width: 160px;
+            height: 72px;
+            border-radius: 40px;
+            opacity: 0.6;
+            border: 1px solid #000000;
+            font-size: 28px;
+            font-weight: 400;
+            color: #000000;
+            text-align: center;
+            line-height: 72px;
+        }
     }
 }

src/pages/refundPage/components/itemList/index.tsx

@@ -11,6 +11,7 @@ interface propsObj {
     cancle?: (arg: any, obj: any) => void,
     nextBuy?: (arg: any, obj: any) => void,
     toPay?: (arg: any, obj: any) => void
+    handSee?: (any) => void
 }
 
 
@@ -29,6 +30,7 @@ export default memo((props: propsObj) => {
     }
 
 
+
     return (
         <View className={styles.itemBox} onClick={() => navTo(props.obj)}>
             <View className={styles.topItem}>
@@ -104,15 +106,11 @@ export default memo((props: propsObj) => {
 
                 </View>
             }
-
+            {
-            {/* <View className={styles.bottomBox}>
+                (props.obj.sale_mode == 0 && props?.obj.stage == 3 && (props?.obj.type == 1 || props?.obj.type == 3)) && <View className={styles.bottomBox}>
-                <BottomBtns
+                    <View className={styles.seeButon} onClick={(e) => { props?.handSee?.(e) }}>查看码单</View>
-                    obj={props?.obj}
+                </View>
-                    cancle={(e) => props?.cancle?.(e, props?.obj)}
+            }
-                    nextBuy={(e) => props?.nextBuy?.(e, props?.obj)}
-                    toPay={(e) => props?.toPay?.(e, props?.obj)}
-                ></BottomBtns>
-            </View> */}
         </View>
     )
 })

src/pages/refundPage/index.tsx

@@ -18,6 +18,7 @@ import Tabs from "./components/tabs"
 import TimePickerPopup from '@/components/timePickerPopup'
 import dayjs from 'dayjs'
 import IconFont from '@/components/iconfont/iconfont'
+import RefundCodelist from "@/components/RefundCodelist"
 export default () => {
     //页码和页数
 
@@ -302,6 +303,13 @@ export default () => {
     }, [searchField])
 
 
+    const [ShowCode, setShowCode] = useState(false)
+    const [ItemInfo, setItemInfo] = useState<any>({})
+    const handSee = (e, item) => {
+        e.stopPropagation()
+        setItemInfo(item)
+        setShowCode(true)
+    }
 
     return (
         <>
@@ -328,6 +336,7 @@ export default () => {
                                 <ItemList
                                     obj={item}
                                     key={index}
+                                    handSee={(e) => handSee(e, item)}
                                 ></ItemList>
                             </View>
                         )
@@ -403,6 +412,12 @@ export default () => {
                 closePopup={handClose}
                 onSelectDate={(e) => handTime(e)}
             ></TimePickerPopup>
+            <RefundCodelist
+                obj={ItemInfo}
+                // picUrl={PicUrl}
+                showPopup={ShowCode}
+                popupClose={() => setShowCode(false)}
+            ></RefundCodelist>
         </>
     )
 }