From 02f2cf2bd7cda700000667eb28831863e329f4de Mon Sep 17 00:00:00 2001 From: Haiyi <1021441632@qq.com> Date: Wed, 11 Jan 2023 18:29:51 +0800 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat(ID1000804):=E9=94=80=E5=94=AE?= =?UTF-8?q?=E5=8D=95=E6=8D=AE=E8=B0=83=E6=95=B4=E6=95=B0=E9=87=8F=E3=80=81?= =?UTF-8?q?=E5=88=A0=E9=99=A4=E6=88=96=E6=96=B0=E5=A2=9E=E9=9D=A2=E6=96=99?= =?UTF-8?q?=EF=BC=9B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- project.private.config.json | 14 + src/api/order.ts | 14 + src/app.config.ts | 8 + src/components/AddressList/index.tsx | 1 + src/components/BottomBtns/index.tsx | 26 + .../components/goods/index.module.scss | 125 +++ .../addFabric/components/goods/index.tsx | 43 + .../components/goodsItem/index.module.scss | 221 +++++ .../addFabric/components/goodsItem/index.tsx | 126 +++ .../components/shoppingCart/index.module.scss | 163 ++++ .../components/shoppingCart/index.tsx | 216 +++++ src/pages/addFabric/index.config.ts | 3 + src/pages/addFabric/index.module.scss | 91 ++ src/pages/addFabric/index.tsx | 428 ++++++++++ .../components/itemList/index.module.scss | 425 +++++----- src/pages/order/components/itemList/index.tsx | 7 +- .../components/BottomApply/index.tsx | 26 + src/pages/orderDetails/index.tsx | 31 +- .../components/GoodsItem/index.module.scss | 253 ++++++ .../orderEdit/components/GoodsItem/index.tsx | 110 +++ .../addressDetailBox/index.module.scss | 144 ++++ .../components/addressDetailBox/index.tsx | 76 ++ src/pages/orderEdit/index.config.ts | 4 + src/pages/orderEdit/index.module.scss | 212 +++++ src/pages/orderEdit/index.tsx | 789 ++++++++++++++++++ 25 files changed, 3347 insertions(+), 209 deletions(-) create mode 100644 src/pages/addFabric/components/goods/index.module.scss create mode 100644 src/pages/addFabric/components/goods/index.tsx create mode 100644 src/pages/addFabric/components/goodsItem/index.module.scss create mode 100644 src/pages/addFabric/components/goodsItem/index.tsx create mode 100644 src/pages/addFabric/components/shoppingCart/index.module.scss create mode 100644 src/pages/addFabric/components/shoppingCart/index.tsx create mode 100644 src/pages/addFabric/index.config.ts create mode 100644 src/pages/addFabric/index.module.scss create mode 100644 src/pages/addFabric/index.tsx create mode 100644 src/pages/orderEdit/components/GoodsItem/index.module.scss create mode 100644 src/pages/orderEdit/components/GoodsItem/index.tsx create mode 100644 src/pages/orderEdit/components/addressDetailBox/index.module.scss create mode 100644 src/pages/orderEdit/components/addressDetailBox/index.tsx create mode 100644 src/pages/orderEdit/index.config.ts create mode 100644 src/pages/orderEdit/index.module.scss create mode 100644 src/pages/orderEdit/index.tsx diff --git a/project.private.config.json b/project.private.config.json index 59fe0c7..b7ef913 100644 --- a/project.private.config.json +++ b/project.private.config.json @@ -281,6 +281,20 @@ "query": "", "launchMode": "default", "scene": null + }, + { + "name": "", + "pathName": "pages/orderEdit/index", + "query": "orderId=34111", + "launchMode": "default", + "scene": null + }, + { + "name": "", + "pathName": "pages/orderEdit/index", + "query": "orderId=33992", + "launchMode": "default", + "scene": null } ] } diff --git a/src/api/order.ts b/src/api/order.ts index d005496..3d6853b 100644 --- a/src/api/order.ts +++ b/src/api/order.ts @@ -211,3 +211,17 @@ export const EnumPurchaserType = () => { method: 'get', }) } +// 订单修改添加面料 +export const MpsaleOrderaddProductList = () => { + return useRequest({ + url: '/v2/mp/saleOrder/addProductList', + method: 'post', + }) +} +// 提交修改订单 +export const MpsaleOrdersubmit = () => { + return useRequest({ + url: '/v2/mp/saleOrder/submit', + method: 'put', + }) +} diff --git a/src/app.config.ts b/src/app.config.ts index 6e48a01..ccfdd8a 100644 --- a/src/app.config.ts +++ b/src/app.config.ts @@ -140,5 +140,13 @@ export default defineAppConfig({ root: 'pages/customerEditor', pages: ['index'], }, + { + root: 'pages/orderEdit', + pages: ['index'], + }, + { + root: 'pages/addFabric', + pages: ['index'], + }, ], }) diff --git a/src/components/AddressList/index.tsx b/src/components/AddressList/index.tsx index e988de5..79f88a4 100644 --- a/src/components/AddressList/index.tsx +++ b/src/components/AddressList/index.tsx @@ -72,6 +72,7 @@ const AddressList = (props: Params, AddressListRef) => { const { fetchData: selectFetch } = MpSaleOrderAddress() const handleSelect = async(item: any, index: number) => { if (router.params.orderId && router.params.orderId != '-100') { + console.log(router.params.orderId != '-100', 'ssss') console.log(typeof (router.params.orderId) != 'undefined', 'router.params.orderId') Taro.showLoading({ title: '请稍等...', diff --git a/src/components/BottomBtns/index.tsx b/src/components/BottomBtns/index.tsx index 47085f4..67d0fd0 100644 --- a/src/components/BottomBtns/index.tsx +++ b/src/components/BottomBtns/index.tsx @@ -20,6 +20,7 @@ interface prosObj { handApplyGoods?: () => void handApplyMoney?: () => void handShowCodeList?: () => void + handEdit?: () => void showDetail?: boolean goodsObj?: any } @@ -42,6 +43,7 @@ const BottomBtns = (props: prosObj, ref) => { handApplyGoods, handApplyMoney, handShowCodeList, + handEdit, showDetail = false, goodsObj = {}, } = props @@ -94,6 +96,7 @@ const BottomBtns = (props: prosObj, ref) => { || (obj.sale_mode === 2 && obj.status === 2) || (obj.sale_mode === 2 && obj.status === 7) || (obj.sale_mode === 1 && obj.status === 10) + || (obj.sale_mode === 1 && obj.status === 7) || (obj.sale_mode === 2 && obj.status === 10) ) { return true @@ -158,6 +161,16 @@ const BottomBtns = (props: prosObj, ref) => { else { return false } }, [obj]) + // 判断是否显示修改订单 + const showEdit = useMemo(() => { + if (obj.status == 0 || obj.status == 1) { + return true + } + else { + return false + } + }, [obj]) + // 多的不显示别的按钮 const [btnList, setbtnList] = useState([]) const itemNums = useMemo(() => { @@ -233,6 +246,16 @@ const BottomBtns = (props: prosObj, ref) => { sort: 2, }) } + if (showEdit) { + nums = nums + 1 + console.log('101010') + arr.push({ + key: 'showEdit', + label: '修改订单', + bgKind: 3, + sort: 9, + }) + } console.log(arr, 'arr') const fiterArr = arr.sort((a, b) => a.sort - b.sort) setbtnList([...fiterArr]) @@ -266,6 +289,9 @@ const BottomBtns = (props: prosObj, ref) => { if (key === 'canBuy') { toPay?.(e) } + if (key === 'showEdit') { + handEdit?.() + } } return ( diff --git a/src/pages/addFabric/components/goods/index.module.scss b/src/pages/addFabric/components/goods/index.module.scss new file mode 100644 index 0000000..6fdeb36 --- /dev/null +++ b/src/pages/addFabric/components/goods/index.module.scss @@ -0,0 +1,125 @@ +.itemBox { + width: 686px; + padding-bottom: 18px; + border-bottom: 1px solid #e7e7e7; + display: flex; + margin-left: 32px; + margin-bottom: 24px; + + .picBox { + margin-right: 24px; + width: 144px; + height: 144px; + border-radius: 8px; + position: relative; + + .pic { + width: 144px; + height: 144px; + border-radius: 8px; + } + + .posBox { + position: absolute; + bottom: 0px; + right: 0px; + width: 69px; + height: 29px; + background: #000000; + border-radius: 15px 0px 8px 0px; + font-size: 18px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #FFFFFF; + text-align: center; + line-height: 29px; + + opacity: 0.55; + } + } + + + .leftBox { + width: 144px; + height: 144px; + border-radius: 8px; + position: relative; + margin-right: 24px; + + .pic { + width: 144px; + height: 144px; + border-radius: 8px; + } + + .posBox { + position: absolute; + bottom: 0px; + right: 0px; + width: 69px; + height: 29px; + background: #000000; + border-radius: 15px 0px 8px 0px; + font-size: 18px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #FFFFFF; + text-align: center; + line-height: 29px; + + opacity: 0.55; + } + } + + .rightBox { + .productName { + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + margin-bottom: 6px; + } + + .tips { + font-size: 24px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #a6a6a6; + margin-bottom: 17px; + } + + .flexTag { + display: flex; + + .tagOne { + padding-left: 8px; + padding-right: 8px; + padding-top: 3px; + padding-bottom: 3px; + background: #e3ecff; + border-radius: 8px; + font-size: 22px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #4581FF; + text-align: center; + margin-right: 16px; + } + + .tagTwo { + padding-left: 8px; + padding-right: 8px; + padding-top: 3px; + padding-bottom: 3px; + background: #ffeedb; + border-radius: 8px; + font-size: 22px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #FE8E0F; + text-align: center; + } + } + } + +} \ No newline at end of file diff --git a/src/pages/addFabric/components/goods/index.tsx b/src/pages/addFabric/components/goods/index.tsx new file mode 100644 index 0000000..7eee85c --- /dev/null +++ b/src/pages/addFabric/components/goods/index.tsx @@ -0,0 +1,43 @@ +import { Image, View } from '@tarojs/components' +import React, { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react' +import styles from '../goods/index.module.scss' +import LabAndImg from '@/components/LabAndImg' +import { formatDateTime, formatHashTag, formatPriceDiv, formatRemoveHashTag, formatWeightDiv } from '@/common/format' + +const Goods = (props: any) => { + const labAndImgObj = useCallback((item) => { + return { lab: item.lab, rgb: item.rgb, texture_url: item.texture_url } + }, []) + return ( + props?.clickItem?.()}> + { + props.data?.texture_url === '' && <> + + + + {props.data?.product_color_count}色 + + + } + { + props.data?.texture_url !== '' + && <> + + + {/* */} + {props.data?.product_color_count}色 + + + } + + {formatHashTag(props.data?.code, props.data?.name)} + {props.data?.component} + + {props.data?.width} + {props.data?.weight_density} + + + + ) +} +export default memo(Goods) diff --git a/src/pages/addFabric/components/goodsItem/index.module.scss b/src/pages/addFabric/components/goodsItem/index.module.scss new file mode 100644 index 0000000..038ed2e --- /dev/null +++ b/src/pages/addFabric/components/goodsItem/index.module.scss @@ -0,0 +1,221 @@ +.goodsBox { + display: flex; + margin-bottom: 32px; + + // justify-content: space-between; + .pic { + width: 118px; + height: 118px; + border-radius: 8px; + margin-right: 32px; + } + + .rightGoodbox { + padding-bottom: 31px; + border-bottom: 1px solid #efefef; + display: flex; + justify-content: space-between; + // margin-right: 32px; + width: 538px; + + .leftFontsbox { + .title { + width: 260px; + height: 34px; + font-size: 28px; + font-weight: 400; + color: #000000; + margin-bottom: 8px; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + background: 0, 124, 247; + } + + .activeTitle { + width: 260px; + height: 34px; + font-size: 28px; + font-weight: 400; + color: #9c9c9c; + margin-bottom: 8px; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + background: 0, 124, 247; + } + .productName { + width: 260px; + height: 30px; + font-size: 24px; + font-weight: 400; + color: #000000; + margin-bottom: 16px; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + } + + .productNums { + font-size: 24px; + font-weight: 400; + color: #000000; + } + .activeProductNums { + color: #9c9c9c; + font-size: 24px; + font-weight: 400; + } + .productNameone { + font-size: 24px; + font-weight: 400; + color: #000000; + height: 40px; + } + .activepPoductName { + font-size: 24px; + font-weight: 400; + color: #9c9c9c; + height: 40px; + } + } + + .rightFontsbox { + .moneyFlex { + margin-bottom: 14px; + display: flex; + justify-content: flex-end; + .lastBox { + font-size: 28px; + font-weight: 500; + text-decoration: line-through; + color: #7f7f7f; + } + .money { + margin-left: 15px; + font-size: 28px; + font-weight: 500; + color: #f41a39; + } + .activeMoney { + color: #fba4b0; + margin-left: 15px; + font-size: 28px; + font-weight: 500; + } + } + + // .inputBox { + // width: 189px; + // height: 64px; + // border-radius: 8px; + // border: 1px solid #979797; + // display: flex; + + // .reduceBox { + // width: 64px; + // height: 64px; + // display: flex; + // align-items: center; + // justify-content: center; + + // .reduce { + // width: 20px; + // height: 3px; + // background: #000000; + // border-radius: 1px; + // opacity: 0.8; + // } + // } + + // .numsBox { + // width: 61px; + // display: flex; + // align-items: center; + // justify-content: center; + // font-size: 24px; + // font-weight: 400; + // color: #000000; + // text-align: center; + // } + + // .addBox { + // width: 64px; + // height: 64px; + // display: flex; + // line-height: 64px; + // align-items: center; + // justify-content: center; + // flex-direction: column; + // color: #000; + // font-size: 35px; + // } + // } + .inputBox { + display: flex; + align-items: center; + + .reduceBox { + width: 50px; + height: 50px; + display: flex; + align-items: center; + justify-content: center; + border-radius: 18px; + border: 1px solid #337fff; + .reduce { + width: 20px; + height: 3px; + background: #337fff; + border-radius: 16px; + opacity: 0.8; + } + } + + .numsBox { + width: 81px; + display: flex; + align-items: center; + justify-content: center; + font-size: 24px; + font-weight: 400; + color: #000000; + text-align: center; + } + + .addBox { + width: 50px; + height: 50px; + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + color: #fff; + font-size: 35px; + border-radius: 18px; + border: 1px solid #337fff; + background-color: #337fff; + } + } + .addtine { + width: 64px; + height: 64px; + display: flex; + align-items: center; + justify-content: center; + color: #000; + font-size: 35px; + border-radius: 8px; + border: 1px solid #979797; + float: right; + } + .isAdd { + margin-top: 30px; + float: right; + color: #999999; + font-size: 28px; + font-weight: 400; + } + } + } +} diff --git a/src/pages/addFabric/components/goodsItem/index.tsx b/src/pages/addFabric/components/goodsItem/index.tsx new file mode 100644 index 0000000..78da8e6 --- /dev/null +++ b/src/pages/addFabric/components/goodsItem/index.tsx @@ -0,0 +1,126 @@ +import { Image, Input, ScrollView, View } from '@tarojs/components' +import { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react' +import classnames from 'classnames' +import styles from './index.module.scss' +import LabAndImg from '@/components/LabAndImg' + +interface props { + clickAdd: (any) => void + // onInputEven?: (a: any, c: any) => void, + clickReduce: (any) => void + handPlus: (any) => void + modeFont?: number + value: { + showInput?: boolean + nums?: string + bulk_price?: Number | 0 + length_cut_price?: Number + weight_cut_price?: Number + code?: string + rgb?: { r: number; g: number; b: number } + lab?: { l: number; a: number; b: number } + texture_url: string + name?: string + roll?: number | string + buyNums?: number | string + id?: number + isChecked?: boolean + weight_error?: number | string + last_bulk_price?: number + last_length_cut_price?: number + last_weight_cut_price?: number + } + goodList?: any[] + onBlur?: (a: any, c: any) => void +} +const GoodsItem = (props: props) => { + const [value, setValue] = useState({ count: props.value.nums }) + + const onInputEven = (e) => { + const res = e.detail.value + if (props.modeFont == 0) { + if (Number(res) < 1) { + setValue({ count: '' }) + } + } + if (props.modeFont == 1) { + if (Number(res) < 0) { + setValue({ count: '' }) + } + } + if (props.modeFont == 2) { + if (Number(res) < 0) { + setValue({ count: '' }) + } + } + } + + const type = useMemo(() => { + if (props.modeFont === 0) { + return 'number' + } + else { + return 'digit' + } + }, [props.modeFont]) + + const labAndImgObj = useCallback((item) => { + return { lab: item.lab, rgb: item.rgb, texture_url: item.texture_url } + }, []) + return ( + + + {/* { + props?.value?.rgb?.r == 0 && props?.value?.rgb?.g == 0 && props?.value?.rgb?.b == 0 && + } + { + (props?.value?.rgb?.r != 0 || props?.value?.rgb?.g != 0 || props?.value?.rgb?.b != 0) + && + } */} + + + + + + {props.value?.code} {props.value?.name} + 剩：{props.value?.roll}件 + { + props?.modeFont == 0 && 空差：{props?.value?.weight_error as number / 1000 || 0}Kg + } + + + + { + props?.modeFont == 0 && props.value?.last_bulk_price !== props.value?.bulk_price && ¥{props?.modeFont == 0 ? Number(props.value?.last_bulk_price) / 100 : props.modeFont === 1 ? Number(props.value?.last_length_cut_price) / 100 : Number(props.value?.last_weight_cut_price) / 100} {props.modeFont as any != 1 ? '/Kg' : '/m'} + } + ¥{props?.modeFont == 0 ? Number(props.value?.bulk_price) / 100 : props.modeFont == 1 ? Number(props.value?.length_cut_price) / 100 : Number(props.value?.weight_cut_price) / 100}{props.modeFont != 1 ? '/Kg' : '/m'} + + { + !props.value.isChecked && props.value.showInput && + { props.clickReduce?.(props.value) }}> + + + + + props.onBlur?.(e, props.value.id)}> + + {/* onInputEven($event, props.value)}> */} + + { props.handPlus?.(props.value) }}> + + + + + } + { + !props.value.showInput && !props.value.isChecked && props.clickAdd?.(props.value)}>+ + } + { + props.value.isChecked && 面料已添加 + } + + + + ) +} +export default memo(GoodsItem) +// ($event) => onInputEven($event, props.value) diff --git a/src/pages/addFabric/components/shoppingCart/index.module.scss b/src/pages/addFabric/components/shoppingCart/index.module.scss new file mode 100644 index 0000000..b392c8d --- /dev/null +++ b/src/pages/addFabric/components/shoppingCart/index.module.scss @@ -0,0 +1,163 @@ +.shopcartBox { + padding: 0 32px; + + .topTitle { + font-size: 32px; + font-weight: 500; + color: #000000; + margin-top: 24px; + margin-bottom: 8px; + } + + .selectFont { + font-size: 24px; + font-weight: 400; + color: #000000; + margin-bottom: 24px; + } + + .line { + margin-bottom: 24px; + height: 1px; + background: #000000; + opacity: 0.1; + } + + .typeFont { + font-size: 28px; + font-weight: 500; + color: #000000; + margin-bottom: 24px; + } + + .flexType { + display: flex; + align-items: center; + margin-bottom: 32px; + + .activemodeFont { + margin-right: 16px; + width: 160px; + height: 68px; + background: rgba(51, 127, 255, 0.1); + border-radius: 8px; + border: 1px solid #337fff; + box-sizing: border-box; + font-size: 28px; + font-weight: 400; + color: #337fff; + text-align: center; + line-height: 68px; + } + + .modeFont { + margin-right: 16px; + width: 160px; + height: 68px; + background: #e9e9e9; + border-radius: 8px; + opacity: 0.4; + font-size: 28px; + font-weight: 400; + color: #000000; + box-sizing: border-box; + text-align: center; + line-height: 68px; + } + } + + .flexFonts { + display: flex; + // justify-content: space-between; + margin-bottom: 24px; + align-items: center; + padding-bottom: 10px; + + .kingFont { + font-size: 28px; + font-weight: 500; + color: #000000; + } + + .danwei { + margin-left: 16px; + width: 148px; + height: 30px; + border-radius: 4px; + border: 1px solid #e42945; + font-size: 22px; + font-weight: 500; + color: #e42945; + text-align: center; + line-height: 30px; + } + } + + .searchBox { + margin-bottom: 32px; + } + + .scrollviewBig { + .scrollview { + // height: 300px; + + .kongBox { + height: 181px; + width: 100%; + } + } + } + + .kongOne { + height: 200px; + } + + .loading_more { + height: 300px; + padding-bottom: 200px; + display: flex; + align-items: center; + width: 100%; + justify-content: center; + } + + .posBox { + width: 100%; + position: fixed; + z-index: 999; + bottom: calc($customTabBarHeight + env(safe-area-inset-bottom)); + } + + .noBottom { + width: 100vw; + position: fixed; + z-index: 999; + bottom: env(safe-area-inset-bottom); + .flexBox { + display: flex; + align-items: center; + justify-content: space-between; + .selectFont { + font-size: 24px; + font-weight: 400; + color: #cfcfcf; + } + .rightBtn { + margin-right: 48px; + width: 256px; + height: 80px; + background: #4581ff; + border-radius: 40px; + font-size: 32px; + font-weight: 500; + color: #ffffff; + text-align: center; + line-height: 80px; + } + } + } +} + +.scrllStyle { + height: 75vh; +} diff --git a/src/pages/addFabric/components/shoppingCart/index.tsx b/src/pages/addFabric/components/shoppingCart/index.tsx new file mode 100644 index 0000000..614f03d --- /dev/null +++ b/src/pages/addFabric/components/shoppingCart/index.tsx @@ -0,0 +1,216 @@ +import { ScrollView, View } from '@tarojs/components' +import Taro, { useDidShow } from '@tarojs/taro' +import { forwardRef, memo, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react' +import classnames from 'classnames' +import VirtualList from '@tarojs/components/virtual-list' +import Goods from '../goodsItem' +import styles from './index.module.scss' +import Divider from '@/components/Divider' +import Search from '@/components/search' +import Popup from '@/components/popup' +import BottomCustomer from '@/components/BottomCustomer' +import DotLoading from '@/components/dotLoading' +import { formatDateTime, formatHashTag, formatPriceDiv, formatRemoveHashTag, formatWeightDiv } from '@/common/format' + +interface prosObj { + sale_mode?: number + showPopup?: false | true + closePopup?: () => void + goodList?: any[] + // typeList?: any[] + handCheck?: (any) => void + addNums?: (any) => void + reduceNums?: (any) => void + getSearchData: (any) => void + handPlus: (any) => void + handSure: () => void + obj?: { + code?: string + name?: string + + } + modeFont: Number | string + hasBottom?: true | false // 默认不占位底部 + onBlur?: (e: string, res: object) => void +} +const ShoppingCart = (props: prosObj, ref) => { + const { + sale_mode = -1, + showPopup = false, + closePopup, + goodList = [], + handCheck, + addNums, + reduceNums, + getSearchData, + handPlus, + obj = {}, + modeFont = 0, + handSure, + hasBottom = true, + onBlur, + } = props + + const SearchRef = useRef() + + useImperativeHandle(ref, () => ({ + Object: props, + SearchRef, + })) + + // 判断选择的类型 + const showModefont = useMemo(() => { + if (sale_mode == 0) { + return '条' + } + else { + return '米' + } + }, [sale_mode]) + + // 已选的颜色 + const selectTotal = useMemo(() => { + const totalArr = goodList.filter((item) => { + return item.showInput + }) + return totalArr.length + }, [goodList]) + + // 选择的条数或者米数 + const selectNums = useMemo(() => { + const arr: any = [] + goodList.forEach((item) => { + if (item.showInput) { + arr.push(Number(item.nums)) + } + }) + const hate = sum(arr) + return hate + }, [goodList]) + // onInputEven={(e, item) => oninputEvent?.(e, item)} + + function sum(arr) { + let s = 0 + for (let i = arr.length - 1; i >= 0; i--) { + s += arr[i] + } + return s + } + + // 确认添加 + const handTake = () => { + if (selectTotal == 0) { + return Taro.showToast({ + title: '请选择一条添加！', + icon: 'error', + }) + } + else { + handSure() + } + } + + const rows = ({ id, index, style, data }: any) => { + const item = data[index] + return ( + <> + onBlur?.(e, id)} + modeFont={(sale_mode as number)} + handPlus={item => handPlus?.(item)} + value={item || {}} + clickAdd={item => addNums?.(item)} + clickReduce={(item) => { reduceNums?.(item) }} + goodList={goodList} + > + + ) + } + const Rows = memo(rows) + + return ( + closePopup?.()}> + + + + {formatHashTag(obj?.code, obj?.name)} + + {/* */} + {/* 布料类型 + + {typeList.map((item, index) => { + return ( + { + handCheck?.(item) + }} + key={index} + className={classnames(item.checked ? styles.activemodeFont : styles.modeFont)} + > + {item.name} + + ) + })} + */} + + + + 颜色分类({goodList?.length}) + + {sale_mode == 0 ? '大货' : sale_mode == 1 ? '剪版' : '散剪'}单位：{showModefont} + + + + + + + {goodList.length > 0 && ( + <> + + + {Rows} + + + + {/* */} + + )} + {goodList.length === 0 && ( + <> + + 加载中 + + + + )} + {/* {!hasBottom && } */} + {/* */} + + + + 当前已选{selectTotal} 种颜色，共 {selectNums} {showModefont} + + handTake()}>确认添加 + + + + + + ) +} +export default memo(forwardRef(ShoppingCart)) diff --git a/src/pages/addFabric/index.config.ts b/src/pages/addFabric/index.config.ts new file mode 100644 index 0000000..24ab439 --- /dev/null +++ b/src/pages/addFabric/index.config.ts @@ -0,0 +1,3 @@ +export default { + navigationBarTitleText: '添加面料', +} diff --git a/src/pages/addFabric/index.module.scss b/src/pages/addFabric/index.module.scss new file mode 100644 index 0000000..a6c6cf0 --- /dev/null +++ b/src/pages/addFabric/index.module.scss @@ -0,0 +1,91 @@ +page { + background: #ffff; +} + +.main { + background: #ffff; + + .topBox { + padding-left: 24px; + } + + .cancelFont { + width: 76px; + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + margin-left: 32px; + margin-right: 32px; + } + + .line { + width: 750px; + height: 1px; + background: #000000; + opacity: 0.05; + margin-top: 16px; + margin-bottom: 32px; + } + + .order_list { + height: calc(100vh - 200px); + } + .topBox { + display: flex; + align-items: center; + justify-content: space-between; + margin-bottom: 32px; + + .histroyLeft { + display: flex; + align-items: center; + justify-content: space-between; + width: 100%; + overflow: hidden; + + .histroyFonts { + margin-left: 32px; + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + } + + .back { + margin-right: 32px; + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + } + } + + .icon_delect { + margin-right: 45px; + color: #f7f7f7; + } + } + + .bigBox { + display: flex; + flex-wrap: wrap; + padding-left: 32px; + + .itemBox { + background: #f7f7f7; + border-radius: 8px; + text-align: center; + padding-top: 12px; + padding-bottom: 12px; + padding-left: 17px; + padding-right: 17px; + font-size: 24px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + margin-right: 16px; + margin-bottom: 16px; + } + } +} diff --git a/src/pages/addFabric/index.tsx b/src/pages/addFabric/index.tsx new file mode 100644 index 0000000..c8a2155 --- /dev/null +++ b/src/pages/addFabric/index.tsx @@ -0,0 +1,428 @@ +import { View } from '@tarojs/components' +import Taro, { useDidShow, useRouter } from '@tarojs/taro' +import React, { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react' +import classnames from 'classnames' +import styles from './index.module.scss' +import Goods from './components/goods' +import ShopCart from './components/shoppingCart' +import Search from '@/components/search' +import Empty from '@/components/empty' +import { MpProductList } from '@/api/search' +import { dataLoadingStatus, debounce, getFilterData } from '@/common/util' +import { + MpProductColorList, +} from '@/api/order' +import { ProductListApi } from '@/api/index' +import InfiniteScroll from '@/components/infiniteScroll' + +const SearchPage = () => { + const pages = Taro.getCurrentPages() // 获取当前的页面栈 + const prevPage = pages[pages.length - 2] + const router: any = useRouter() + const onj = JSON.parse(Taro.getStorageSync('userInfo')) + const [search, setSearchObj] = useState({ + modeId: router.params.sale_mode, + goodsId: null, + code_or_name: '', + physical_warehouse: onj.physical_warehouse, + purchaser_id: -1, + }) + + const [paramGoods, setparamGoods] = useState([]) + + useDidShow(() => { + prevPage.setData({ // 设置上一个页面的值 + selectGoodsList: [], + productId: '', + }) + let arr: any[] = [] + arr = JSON.parse(decodeURIComponent(router.params.goodList)) + setparamGoods(arr) + }) + + const [goodList, setGoodlist] = useState([]) + + const [showShopCart, setShowShopCart] = useState(false) + + // 获取商品 + const { fetchData: colorlistFetch } = MpProductColorList() + const getGoodList = async() => { + const res = await colorlistFetch({ product_id: search.goodsId, code_or_name: search.code_or_name, physical_warehouse: search?.physical_warehouse, purchaser_id: router.params.purchaser_id }) + res.data.list.map((item) => { + item.showInput = false + if (search.modeId == 0) { + item.nums = 1 + item.buyNums = 1 + } + if (search.modeId == 1) { + item.nums = 0.3 + item.buyNums = 0.3 + } + if (search.modeId == 2) { + item.nums = 3 + item.buyNums = 3 + } + return item + }) + paramGoods?.forEach((edg) => { + if (search.goodsId == edg.id) { + edg?.product_colors?.forEach((it) => { + res.data.list?.map((gg) => { + if (it.id == gg.id) { + gg.isChecked = true + } + return gg + }) + }) + } + }) + setGoodlist([...res.data.list]) + } + + // 监听选择的类型 + useEffect(() => { + setSearchObj(search) + if (search.goodsId) { getGoodList() } + }, [search]) + + // 确认添加 + const handSure = () => { + setShowShopCart(false) + let arr: any[] = [] + // 洗数据将面料Id底下的数据再装到自己的颜色列表里面 + arr = orderData?.list?.filter((item) => { + return item.id == search.goodsId + }) + const filterArr = goodList.filter((item) => { + return item.showInput + }) + arr.forEach((item) => { + filterArr.forEach((it) => { + // it.sale_price = search.modeId == 0 ? it.bulk_price : search.modeId == 1 ? it.length_cut_price : it.weight_cut_price + item.product_colors = [...filterArr] + }) + }) + if (filterArr.length > 0) { + prevPage.setData({ // 设置上一个页面的值 + selectGoodsList: arr, + productId: search.goodsId, + }) + } + Taro.navigateBack({ + delta: 1, + }) + } + + // 点击输入框的加 + const handPlus = useCallback((item) => { + goodList.map((it) => { + if (item.id === it.id) { + if (isInteger(item.nums)) { + item.nums++ + } + else { + item.nums++ + item.nums = Math.trunc(item.nums) + } + } + return item + }) + setGoodlist([...goodList]) + }, [goodList]) + + // 输入了搜索关键字 + const getSearchDataInput = useCallback((eq) => { + setSearchObj(e => ({ ...e, code_or_name: eq })) + }, []) + + const [goodObj, setGoodsobj] = useState({}) + const ShopCartRef = useRef() + // 点击对应商品显示购物车 + const showCart = async(item) => { + setSearchObj(e => ({ ...e, goodsId: item.id, purchaser_id: router.params.purchaser_id })) + setShowShopCart(true) + setGoodsobj(item) + ShopCartRef.current.SearchRef.current.clearInput() + } + + // 点击加展示输入框 + const handAdd = useCallback((item) => { + goodList.map((it) => { + if (item.id === it.id) { + it.showInput = true + } + return item + }) + setGoodlist([...goodList]) + }, [goodList]) + + // 点击减 + const reduceNums = useCallback((item) => { + goodList.map((it) => { + if (item.id === it.id) { + if (isInteger(item.nums)) { + item.nums-- + } + else { + item.nums = Math.trunc(item.nums) + } + + if (search.modeId == 0) { + if (item.nums < 1) { + it.showInput = false + it.nums = 1 + } + } + if (search.modeId == 1) { + if (item.nums < 0.3) { + it.showInput = false + it.nums = 0.3 + } + } + if (search.modeId == 2) { + if (item.nums < 3) { + it.showInput = false + it.nums = 3 + } + } + } + return item + }) + setGoodlist([...goodList]) + }, [goodList]) + + // 选择类型 + // const handCheckMode = (item) => { + // typeList.map((it) => { + // if (it.id === item.id) { + // it.checked = true + // setSearchObj(e => ({ ...e, modeId: it.id })) + // } + // else { + // it.checked = false + // } + // return it + // }) + // setTypeList([...typeList]) + // setGoodlist([]) + // } + + // 关闭弹窗 + const closePoup = () => { + setShowShopCart(false) + } + + // 搜索商品的数组 + const [searchList, setSearchList] = useState([]) + // 是否有值输入框 + const [hasFonts, setHasFonts] = useState(false) + // useEffect(() => { + // getHistory() + // }, []) + + // 搜索获取商品数据 + const { fetchData: productFetch } = MpProductList() + const getProduct = debounce(async(e) => { + Taro.showLoading({ + title: '加载中...', + mask: true, + }) + // await historyputFetch({ key: e, scene: 0 }).then((res) => { + // if (res.data) { + // getHistory() + // } + // }) + productFetch({ code_or_name: e }).then((res) => { + if (res.data) { + Taro.hideLoading() + setSearchList([...res?.data?.list]) + } + }) + }, 300) + + // 输入了搜索关键字 + const getSearchData = useCallback((e) => { + if (e) { + setHasFonts(true) + getProduct(e) + } + else { + setHasFonts(false) + setSearchList([]) + } + }, []) + + // 返回 + const back = () => { + Taro.navigateBack({ + delta: 1, + }) + } + // 判断是否整数类型 + function isInteger(obj) { + return (obj | 0) === obj + } + + // 输入框失焦 + const onBlur = (e, id) => { + goodList.map((item) => { + if (item.id == id) { + if (search.modeId == 0 && (e.detail.value == '' || Number(e.detail.value) == 0)) { + item.showInput = false + item.nums = 1 + } + else if (search.modeId == 0 && (e.detail.value != '' || Number(e.detail.value) > 0)) { + item.nums = e.detail.value + } + if (search.modeId == 1 && Number(e.detail.value) < 0.3) { + item.nums = 0.3 + item.showInput = false + } + else if (search.modeId == 1 && Number(e.detail.value) >= 0.3) { + if (isInteger(Number(e.detail.value))) { + item.nums = Number(e.detail.value) + } + else { + item.nums = Number(e.detail.value).toFixed(2) + } + } + if (search.modeId == 2 && Number(e.detail.value) < 3) { + item.nums = 3 + item.showInput = false + } + else if (search.modeId == 2 && Number(e.detail.value) >= 3) { + if (isInteger(Number(e.detail.value))) { + item.nums = Number(e.detail.value) + } + else { + item.nums = Number(e.detail.value).toFixed(2) + } + } + } + return item + }) + setGoodlist([...goodList]) + } + + // 选择中后的值到输入框 + const [defaultvalue, setdefaultvalue] = useState('') + + const { fetchData: productFetchData, state: orderState } = ProductListApi() + + // 页码和页数 + const [searchField, setSearchField] = useState<{ page: number; size: number }>({ + page: 1, + size: 10, + }) + + // 监听筛选条件变化 + useEffect(() => { + getOrderList() + }, [searchField]) + + const [orderData, setOrderData] = useState<{ list: any[]; total: number }>({ list: [], total: 0 }) + + const pageNum = useRef({ size: searchField.size, page: searchField.page }) + + // 数据加载状态 + const statusMore = useMemo(() => { + console.log({ list: orderData.list, total: orderData.total, status: orderState.loading }, '{ list: orderData.list, total: orderData.total, status: orderState.loading }') + return dataLoadingStatus({ list: orderData.list, total: orderData.total, status: orderState.loading! }) + }, [orderData, orderState]) + + const getScrolltolower = useCallback(() => { + if (orderData.list.length < orderData.total) { + pageNum.current.page++ + const size = pageNum.current.size * pageNum.current.page + setSearchField({ ...searchField, size }) + } + }, [orderData]) + + // 列表下拉刷新 + const [refresherTriggeredStatus, setRefresherTriggeredStatus] = useState(false) + const getOrderList = async() => { + const res = await productFetchData({ + ...getFilterData(searchField), + }) + setOrderData(e => ({ ...e, list: res.data?.list, total: res.data?.total })) + setRefresherTriggeredStatus(() => false) + } + + const getRefresherRefresh = async() => { + pageNum.current.size = 1 + setRefresherTriggeredStatus(true) + setSearchField(val => ({ ...val, size: 10 })) + } + + return ( + + + + back()}>取消 + + + + { + !hasFonts && <> + + + {orderData?.list?.map((item, index) => { + return ( + + showCart(item)} key={index} data={item}> + + ) + })} + + + + } + { + hasFonts && <> + + + 搜索结果 + {/* handBack()}>返回 */} + + + { + !!searchList.length && searchList.map((item, index) => { + return ( + showCart(item)} key={index} data={item}> + ) + }) + } + { + !searchList.length && + } + + } + handSure()} + modeFont={router.params.sale_mode} + handPlus={item => handPlus(item)} + obj={goodObj} + getSearchData={(e) => { getSearchDataInput(e) }} + hasBottom={false} + reduceNums={(item) => { reduceNums(item) }} + addNums={(item) => { handAdd(item) }} + showPopup={showShopCart} + closePopup={() => closePoup()} + goodList={goodList} + onBlur={(e, id) => onBlur(e, id)} + > + + + + ) +} +export default memo(SearchPage) +// oninputEvent={(e, item) => { onInputEven?.(e, item) }} diff --git a/src/pages/order/components/itemList/index.module.scss b/src/pages/order/components/itemList/index.module.scss index 13701c1..b003522 100644 --- a/src/pages/order/components/itemList/index.module.scss +++ b/src/pages/order/components/itemList/index.module.scss @@ -1,228 +1,239 @@ .itemBox { - margin-top: 38px; - overflow: hidden; - margin-right: 24px; - // height: 560px; - padding-bottom: 20px; - background: #FFFFFF; - border-radius: 16px; - margin-left: 24px; + margin-top: 38px; + overflow: hidden; + margin-right: 24px; + // height: 560px; + padding-bottom: 20px; + background: #ffffff; + border-radius: 16px; + margin-left: 24px; - .topItem { - display: flex; - align-items: center; - justify-content: space-between; - margin-top: 24px; + .topItem { + display: flex; + align-items: center; + justify-content: space-between; + margin-top: 24px; - .orderNo { + .orderNo { + font-size: 28px; - font-size: 28px; - font-family: PingFangSC-Medium, PingFang SC; - font-weight: 500; - color: #000000; - margin-left: 32px; - - } - - .status { - margin-right: 32px; - font-size: 28px; - font-family: PingFangSC-Medium, PingFang SC; - font-weight: 500; - color: #0D7CFF; - } + font-weight: 500; + color: #000000; + margin-left: 32px; } + .status { + margin-right: 32px; + font-size: 28px; + + font-weight: 500; + color: #0d7cff; + } + } + .flexBox { + display: flex; + align-items: center; + justify-content: space-between; .pussName { - margin-left: 32px; - font-size: 28px; - font-family: PingFangSC-Medium, PingFang SC; - font-weight: 500; - color: #000000; + margin-left: 32px; + font-size: 28px; + + font-weight: 500; + color: #000000; + } + .editFont { + margin-right: 32px; + width: 84px; + height: 32px; + border-radius: 8px; + border: 1px solid #337fff; + font-size: 22px; + text-align: center; + line-height: 32px; + font-weight: 400; + color: #337fff; + } + } + + .line { + margin-left: 32px; + // width: 638px; + margin-right: 32px; + height: 1px; + background: #e7e7e7; + // opacity: 0.1; + margin-top: 16px; + margin-bottom: 24px; + } + + .contBox { + // padding-right: 32px; + // width: 100%; + // width: 638rpx; + margin-left: 32px; + display: flex; + justify-content: space-between; + + .leftCont { + // min-width: 24%; + width: 134px; + height: 134px; + border-radius: 8px; + position: relative; + + .leftContNums { + width: 134px; + height: 39px; + background: #000000; + border-radius: 0px 0px 8px 8px; + opacity: 0.5; + position: absolute; + bottom: 0; + font-size: 20px; + + font-weight: 400; + color: #ffffff; + text-align: center; + line-height: 39px; + } } - .line { - margin-left: 32px; - // width: 638px; - margin-right: 32px; - height: 1px; - background: #e7e7e7; - // opacity: 0.1; - margin-top: 16px; - margin-bottom: 24px; - } + .rightCont { + min-width: 76%; + margin-left: 24px; - .contBox { - // padding-right: 32px; - // width: 100%; - // width: 638rpx; - margin-left: 32px; - display: flex; - justify-content: space-between; - - .leftCont { - // min-width: 24%; - width: 134px; - height: 134px; - border-radius: 8px; - position: relative; - - .leftContNums { - width: 134px; - height: 39px; - background: #000000; - border-radius: 0px 0px 8px 8px; - opacity: 0.5; - position: absolute; - bottom: 0; - font-size: 20px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #FFFFFF; - text-align: center; - line-height: 39px; - } - } - - .rightCont { - min-width: 76%; - margin-left: 24px; - - .rightTop { - display: flex; - align-items: center; - justify-content: space-between; - min-width: 76%; - // width: 480px; - margin-bottom: 12px; - - .productBox { - display: flex; - align-items: center; - - .productName { - max-width: 285px; - height: 34px; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - margin-right: 8px; - font-size: 28px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #000000; - } - - .productMode { - width: 60px; - height: 28px; - background: #337FFF; - border-radius: 8px; - font-size: 20px; - font-family: PingFangSC-Medium, PingFang SC; - font-weight: 500; - color: #FFFFFF; - text-align: center; - line-height: 28px; - } - } - - .shipMode { - margin-right: 60px; - font-size: 28px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #000000; - } - } - - .colorsBox { - padding-right: 60px; - display: flex; - align-items: center; - // width: 480px; - // margin-right: 32px; - margin-bottom: 8px; - - .colorNameOne { - flex: 1; - font-size: 24px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #000000; - width: 133px; - height: 30px; - text-align: left; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - } - - .colorName { - flex: 1; - font-size: 24px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #000000; - text-align: center; - } - - .colorNameTwo { - flex: 1; - font-size: 24px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #000000; - text-align: right; - } - } - } - - - } - - .lineOne { - // width: 638px; - margin-right: 32px; - height: 1px; - background: #e7e7e7; - // opacity: 0.1; - margin-left: 32px; - margin-top: 24px; - } - - .bottomMsg { - - margin-top: 16px; + .rightTop { display: flex; align-items: center; justify-content: space-between; + min-width: 76%; + // width: 480px; + margin-bottom: 12px; - .msgLeft { - margin-left: 32px; - font-size: 24px; - font-weight: 400; - color: #a1a1a1; - } + .productBox { + display: flex; + align-items: center; - .msgRight { - margin-right: 32px; - font-size: 24px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #a1a1a1; - } - - .msgRightOne { - margin-right: 32px; + .productName { + max-width: 285px; + height: 34px; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + margin-right: 8px; font-size: 28px; - font-family: PingFangSC-Medium, PingFang SC; + + font-weight: 400; + color: #000000; + } + + .productMode { + width: 60px; + height: 28px; + background: #337fff; + border-radius: 8px; + font-size: 20px; + font-weight: 500; - color: #F64861; + color: #ffffff; + text-align: center; + line-height: 28px; + } } + + .shipMode { + margin-right: 60px; + font-size: 28px; + + font-weight: 400; + color: #000000; + } + } + + .colorsBox { + padding-right: 60px; + display: flex; + align-items: center; + // width: 480px; + // margin-right: 32px; + margin-bottom: 8px; + + .colorNameOne { + flex: 1; + font-size: 24px; + + font-weight: 400; + color: #000000; + width: 133px; + height: 30px; + text-align: left; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + } + + .colorName { + flex: 1; + font-size: 24px; + + font-weight: 400; + color: #000000; + text-align: center; + } + + .colorNameTwo { + flex: 1; + font-size: 24px; + + font-weight: 400; + color: #000000; + text-align: right; + } + } + } + } + + .lineOne { + // width: 638px; + margin-right: 32px; + height: 1px; + background: #e7e7e7; + // opacity: 0.1; + margin-left: 32px; + margin-top: 24px; + } + + .bottomMsg { + margin-top: 16px; + display: flex; + align-items: center; + justify-content: space-between; + + .msgLeft { + margin-left: 32px; + font-size: 24px; + font-weight: 400; + color: #a1a1a1; } - .bottomBox { - margin-top: 40px; + .msgRight { + margin-right: 32px; + font-size: 24px; + + font-weight: 400; + color: #a1a1a1; } -} \ No newline at end of file + + .msgRightOne { + margin-right: 32px; + font-size: 28px; + + font-weight: 500; + color: #f64861; + } + } + + .bottomBox { + margin-top: 40px; + } +} diff --git a/src/pages/order/components/itemList/index.tsx b/src/pages/order/components/itemList/index.tsx index bb5adea..2f5b944 100644 --- a/src/pages/order/components/itemList/index.tsx +++ b/src/pages/order/components/itemList/index.tsx @@ -49,7 +49,12 @@ const ItemList = (props: propsObj) => { 单号：{props?.obj?.order_no} {props?.obj?.status_name} - {props?.obj?.purchaser_name} + + {props?.obj?.purchaser_name} + { + props?.obj?.is_modify && 已修改 + } + diff --git a/src/pages/orderDetails/components/BottomApply/index.tsx b/src/pages/orderDetails/components/BottomApply/index.tsx index 81f750c..addbca6 100644 --- a/src/pages/orderDetails/components/BottomApply/index.tsx +++ b/src/pages/orderDetails/components/BottomApply/index.tsx @@ -18,6 +18,7 @@ interface prosObj { handSureGoods?: (any) => void handShowCodeList?: (any) => void cancle?: (any) => void + handEdit?: () => void goodsObj?: any // handSureGoods?: () => void, } @@ -36,6 +37,7 @@ const BottomApply = (props: prosObj) => { handSureGoods, cancle, handShowCodeList, + handEdit, goodsObj = {}, nextBuy, // handSureGoods @@ -149,6 +151,7 @@ const BottomApply = (props: prosObj) => { || (obj.sale_mode === 2 && obj.status === 2) || (obj.sale_mode === 2 && obj.status === 7) || (obj.sale_mode === 1 && obj.status === 10) + || (obj.sale_mode === 1 && obj.status === 7) || (obj.sale_mode === 2 && obj.status === 10) ) { return true @@ -156,6 +159,16 @@ const BottomApply = (props: prosObj) => { else { return false } }, [obj]) + // 判断是否显示修改订单 + const showEdit = useMemo(() => { + if (obj.status == 0 || obj.status == 1) { + return true + } + else { + return false + } + }, [obj]) + const [btnList, setbtnList] = useState([]) useMemo(() => { const arr: any[] = [] @@ -223,6 +236,16 @@ const BottomApply = (props: prosObj) => { sort: 2, }) } + if (showEdit) { + nums = nums + 1 + console.log('101010') + arr.push({ + key: 'showEdit', + label: '修改订单', + bgKind: 3, + sort: 9, + }) + } const fiterArr = arr.sort((a, b) => a.sort - b.sort) setbtnList([...fiterArr]) return nums @@ -250,6 +273,9 @@ const BottomApply = (props: prosObj) => { // if (key === 'canBuy') { // toPay?.(e) // } + if (key === 'showEdit') { + handEdit?.() + } } return ( diff --git a/src/pages/orderDetails/index.tsx b/src/pages/orderDetails/index.tsx index 86b7c01..dc27158 100644 --- a/src/pages/orderDetails/index.tsx +++ b/src/pages/orderDetails/index.tsx @@ -202,6 +202,16 @@ const OrderDetails = () => { if (it.leftTitle === '业务员：') { it.rightTitle = res.data.sale_user_name } + if (res.data.change_time !== '') { + if (it.leftTitle === '编辑时间：') { + it.rightTitle = formatDateTime(res.data.change_time) + } + } + else { + if (it.leftTitle === '编辑时间：') { + it.showFont = false + } + } }) setOrderMsg([...orderMsg]) setReceivingStatus(res.data.shipment_mode) @@ -231,18 +241,28 @@ const OrderDetails = () => { leftTitle: '订单编号：', rightTitle: '------', showBtn: true, + showFont: true, }, { leftTitle: '创建时间：', rightTitle: '------', + showFont: true, }, { leftTitle: '发货时间：', rightTitle: '------', + showFont: true, }, { leftTitle: '业务员：', rightTitle: '------', + showFont: true, + }, + { + leftTitle: '编辑时间：', + rightTitle: '------', + showFont: true, + }, ]) @@ -766,6 +786,13 @@ const OrderDetails = () => { setshowCodeList(true) } + // 修改订单 + const handEdit = () => { + Taro.navigateTo({ + url: `/pages/orderEdit/index?orderId=${infoObj.id}`, + }) + } + return ( {(infoObj?.status != 10 && )} @@ -831,7 +858,8 @@ const OrderDetails = () => { { orderMsg.map((item, index) => { return ( - + + item.showFont && {item.leftTitle} @@ -902,6 +930,7 @@ const OrderDetails = () => { handSureGoods={() => handSureGoods?.()} handApplyGoods={() => handApplyGood?.()} handApplyMoney={() => handApplyMoney?.()} + handEdit={() => handEdit?.()} > void + handPlus?: (item: any) => void + onBlur?: (e: any, item: any) => void +} +const GoodsItem = (porps: PropGoods) => { + const { list = [], obj = {} } = porps + const labAndImgObj = useCallback((item) => { + return { lab: item.lab, rgb: item.rgb, texture_url: item.texture_url } + }, []) + + // const [value, setValue] = useState({ count: props.value.nums }) + + const onInputEven = (e, it) => { + const res = e.detail.value + if (porps.modeFont == 0) { + if (Number(res) < 1) { + // setValue({ count: '' }) + } + } + if (porps.modeFont == 1) { + if (Number(res) < 0) { + // setValue({ count: '' }) + } + } + if (porps.modeFont == 2) { + if (Number(res) < 0) { + // setValue({ count: '' }) + } + } + } + + const type = useMemo(() => { + if (porps.modeFont === 0) { + return 'number' + } + else { + return 'digit' + } + }, [porps.modeFont]) + + return ( + <> + { + list.map((item, index) => { + return ( + + {item.code}# {item.name} + + { + item.product_colors.map((it, inx) => { + return ( + + + + + {/* */} + + + {formatHashTag(it.code, it.name)} + ¥{formatPriceDiv(it.total_sale_price)} + {/* x{obj?.sale_mode === 0 ? it.roll : it.length / 100}{obj?.sale_mode === 0 ? '条' : 'm'} */} + + + + ¥{formatPriceDiv(it.sale_price)}/{obj?.sale_mode === 1 ? 'm' : 'kg'} + {/* { + obj?.sale_mode === 0 && it?.sale_price !== it?.standard_sale_price && ¥{it?.standard_sale_price / 100}/{obj?.sale_mode === 1 ? 'm' : 'kg'} + } */} + + + { porps.clickReduce?.(it) }}> + + + + + onInputEven(e, it)} onBlur={e => porps.onBlur?.(e, it)}> + + { porps.handPlus?.(it) }}> + + + + + + + + ) + }) + } + + ) + }) + } + + + ) +} +export default memo(GoodsItem) diff --git a/src/pages/orderEdit/components/addressDetailBox/index.module.scss b/src/pages/orderEdit/components/addressDetailBox/index.module.scss new file mode 100644 index 0000000..5af4958 --- /dev/null +++ b/src/pages/orderEdit/components/addressDetailBox/index.module.scss @@ -0,0 +1,144 @@ +.addressBox { + margin-right: 24px; + // width: 702px; + min-height: 223px; + background: #ffffff; + border-radius: 16px; + margin-top: 24px; + margin-left: 24px; + + .topBox { + padding-top: 28px; + display: flex; + align-items: center; + + .cirle { + border-radius: 50%; + margin-left: 32px; + width: 64px; + height: 64px; + background: #4a7fff; + display: flex; + align-items: center; + justify-content: center; + + .dingwei { + color: #ffffff; + font-size: 26px; + } + } + + .address { + margin-left: 24px; + width: 461px; + height: 78px; + font-size: 28px; + font-weight: 500; + color: #000000; + margin-right: 41px; + display: flex; + align-items: center; + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; /*这里设置几行*/ + overflow: hidden; + } + + .icon_more { + font-size: 50px; + } + } + + .line { + margin-top: 16px; + float: right; + margin-right: 32px; + width: 550px; + height: 1px; + background: #000000; + opacity: 0.1; + } + + .bottom { + display: flex; + align-items: center; + justify-content: space-between; + margin-top: 44px; + .reatName { + font-size: 28px; + font-weight: 500; + color: #337fff; + margin-right: 32px; + } + .leftbottom { + margin-left: 120px; + display: flex; + align-items: center; + .name { + line-height: 34px; + width: 84px; + height: 34px; + @include common_ellipsis(); + font-size: 28px; + font-weight: 400; + color: #343434; + margin-right: 16px; + } + + .phone { + height: 34px; + font-size: 28px; + font-weight: 400; + color: #343434; + // margin-right: 70px; + } + } + + .reatBox { + position: relative; + margin-right: 32px; + + .updateBtn { + width: 200px; + font-size: $font_size_min; + background-color: #f0f0f0; + height: 64px; + border-radius: 16px; + color: $color_font_two; + // position: absolute; + bottom: 10px; + // right: -10px; + text-align: center; + z-index: 999; + + .updateBtn_list { + position: absolute; + display: flex; + z-index: 5; + width: 100%; + + .updateBtn_item_select { + color: #fff; + } + } + + .updateBtn_item { + flex: 1; + text-align: center; + line-height: 64px; + } + + .updateBtn_select { + color: #fff; + background-color: $color_main; + border-radius: 16px; + position: absolute; + width: 100px; + height: 61px; + z-index: 1; + transition: all 0.3s ease-in-out; + } + } + } + } +} diff --git a/src/pages/orderEdit/components/addressDetailBox/index.tsx b/src/pages/orderEdit/components/addressDetailBox/index.tsx new file mode 100644 index 0000000..815e820 --- /dev/null +++ b/src/pages/orderEdit/components/addressDetailBox/index.tsx @@ -0,0 +1,76 @@ +import { Image, Text, View } from '@tarojs/components' +import { memo, useEffect, useMemo, useRef, useState } from 'react' +import classnames from 'classnames' +import styles from './index.module.scss' +import IconFont from '@/components/iconfont/iconfont' +import { alert } from '@/common/common' + +interface propsObj { + receivingStatus: Number | null + onReceivingStatus?: (any, Number) => void + obj?: any + navSelect?: (any) => void + showBtn?: boolean + showWhatFont?: string +} +const AddressDetailBox = (props: propsObj) => { + const { + receivingStatus = null, + onReceivingStatus, + obj = {}, + navSelect, + showBtn = true, + showWhatFont = '', + } = props + + return ( + + navSelect?.(obj)}> + + + + { + receivingStatus == 1 && {obj.take_goods_address || '中华人民共和国广东省佛山市禅城区陆盈纺织仓库'} + } + { + (obj?.address_id != 0 && receivingStatus == 2) + && {obj?.province_name}{obj?.city_name}{obj?.district_name}{obj?.address_detail} + } + { + (obj?.address_id == 0 && receivingStatus == 2) + && + } + { + receivingStatus !== 1 + && + } + + + + + {receivingStatus === 1 ? '谭先生' : obj?.address_id == 0 ? '' : obj.target_user_name} + {receivingStatus === 1 ? 13242128982 : obj?.address_id == 0 ? '' : obj.purchaser_phone} + + { + showBtn && + + + onReceivingStatus?.(e, 1)}> + 自提 + + onReceivingStatus?.(e, 2)}> + 物流 + + + + + + } + { + !showBtn && {showWhatFont} + } + + + ) +} +export default memo(AddressDetailBox) diff --git a/src/pages/orderEdit/index.config.ts b/src/pages/orderEdit/index.config.ts new file mode 100644 index 0000000..3b15beb --- /dev/null +++ b/src/pages/orderEdit/index.config.ts @@ -0,0 +1,4 @@ +export default { + navigationBarTitleText: '订单详情', + +} diff --git a/src/pages/orderEdit/index.module.scss b/src/pages/orderEdit/index.module.scss new file mode 100644 index 0000000..52dde0e --- /dev/null +++ b/src/pages/orderEdit/index.module.scss @@ -0,0 +1,212 @@ +page { + background: #f7f7f7; +} + +.mainBox { + .pussBox { + margin-top: 24px; + display: flex; + align-items: center; + + .pussName { + font-size: 28px; + font-weight: 400; + color: #000000; + } + + .pussPhone { + margin-left: 88px; + font-size: 28px; + font-weight: 400; + color: #000000; + } + } + .addBtn { + margin: 24px; + width: 702px; + height: 82px; + background: #ffffff; + border-radius: 16px; + border: 1px solid #337fff; + font-size: 28px; + font-weight: 400; + color: #337fff; + text-align: center; + line-height: 82px; + } + .total { + margin-top: 44px; + font-size: 24px; + font-weight: 400; + color: #000000; + margin-left: 32px; + margin-bottom: 8px; + } + + .productBox { + // width: 702px; + margin-right: 24px; + background: #ffffff; + border-radius: 16px; + margin-left: 24px; + padding-bottom: 36px; + overflow: hidden; + + .flexMoney { + display: flex; + margin-top: 32px; + align-items: center; + justify-content: space-between; + + .flexTotalBox { + display: flex; + align-items: center; + + .totalFont { + margin-left: 32px; + margin-right: 8px; + font-size: 28px; + font-weight: 400; + color: #000000; + } + + .tishi { + font-size: 28px; + } + } + + .shoudPay { + font-size: 28px; + font-weight: 500; + color: #f64861; + margin-right: 32px; + } + } + } +} + +.defaltBox { + margin: 24px; + padding: 24px 32px 24px 24px; + background: #ffffff; + border-radius: 16px; + + .titleBox { + // margin-right: 24px; + // margin-left: 24px; + // width: 638px; + display: flex; + justify-content: space-between; + align-items: center; + + .title { + font-size: 28px; + font-weight: 500; + color: #000000; + } + + .modeName { + font-size: 28px; + font-weight: 500; + color: #337fff; + } + } + + .modeLine { + margin-top: 24px; + // width: 638px; + // margin-right: 24px; + // margin-left: 24px; + height: 1px; + background: #000000; + opacity: 0.1; + } +} + +.detailBox { + display: flex; + margin-top: 24px; + align-items: center; + justify-content: space-between; + + .detailRightFlex { + display: flex; + align-items: center; + + .detailRight { + font-size: 28px; + font-weight: 400; + color: #000000; + } + + .detailBtn { + margin-left: 16px; + width: 65px; + height: 32px; + border-radius: 8px; + border: 1px solid #337fff; + font-size: 24px; + font-weight: 400; + color: #337fff; + text-align: center; + line-height: 32px; + } + } + + .detailFont { + font-size: 28px; + font-weight: 400; + color: #b8b8b8; + } +} + +.remarkFont { + margin-top: 24px; + font-size: 28px; + font-weight: 400; + color: #000000; +} + +.safeBottom { + height: 300px; +} + +.bottomBox { + display: flex; + align-items: center; + // width: 750px; + width: 100%; + height: 160px; + background: #ffffff; + position: fixed; + bottom: 0; + z-index: 10000; + padding-bottom: 24px; + .bottomBtn { + width: 702px; + margin-left: 24px; + margin-right: 24px; + font-size: 28px; + font-weight: 500; + color: #ffffff; + height: 80px; + background: #337fff; + border-radius: 44px; + text-align: center; + line-height: 80px; + } +} + +.order_save_address { + height: 82px; + background: #007aff; + border-radius: 40px; + // width: 668px; + text-align: center; + line-height: 82px; + color: #fff; + margin-top: 20px; + margin-left: 24px; + margin-right: 24px; + margin-bottom: 20px; +} diff --git a/src/pages/orderEdit/index.tsx b/src/pages/orderEdit/index.tsx new file mode 100644 index 0000000..14c5106 --- /dev/null +++ b/src/pages/orderEdit/index.tsx @@ -0,0 +1,789 @@ +import { View } from '@tarojs/components' +import Taro, { useDidShow, usePullDownRefresh, useRouter } from '@tarojs/taro' +import type { ReactNode } from 'react' +import React, { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react' +import classnames from 'classnames' +import styles from './index.module.scss' +import AddressDetailBox from './components/addressDetailBox' +import GoodsItem from './components/GoodsItem' +import Remark from '@/components/textareaEnhance' +import Popup from '@/components/popup' +import { debounce } from '@/common/util' +import { + MpSaleOrder, + MpSaleOrderPut, + MpsaleOrderaddProductList, + MpsaleOrdersubmit, +} from '@/api/order' +import { alert, goLink } from '@/common/common' +import { formatDateTime, formatHashTag, formatPriceDiv, formatRemoveHashTag, formatWeightDiv } from '@/common/format' +import { MpPurchaserAddressList } from '@/api/addressList' + +// 卡片盒子元素 +interface Obs { + title?: string + modeName?: string + showMode?: boolean + children?: ReactNode + clickNode?: () => void +} + +const DefaultBox = (props: Obs) => { + const { + title = '标题', + modeName = '大货', + showMode = false, + children, + clickNode, + } = props + + return ( + + + {title} + { + showMode && clickNode?.()}>{modeName} + } + + + {children} + + ) +} +const DefaultBoxWithMemo = memo(DefaultBox) + +const OrderDetails = () => { + const router = useRouter() + const addrssRef = useRef([]) + const pages = Taro.getCurrentPages() + const currPage = pages[pages.length - 1] // 获取当前页面 + const { fetchData: addressFetch } = MpPurchaserAddressList() + let selectId = -1 + + // 收货方法,1:自提，2物流 + const [receivingStatus, setReceivingStatus] = useState(null) + // 切换自提或者物流 + const onReceivingStatus = debounce(async(e, value) => { + e.stopPropagation() + if (receivingStatus === value) { + alert.error('不能选择相同的方式') + return false + } + Taro.showLoading({ + title: '请稍等...', + mask: true, + }) + // 判断是否有默认地址 + if (value === 2 && addrssRef.current.length > 0 && !currPage.data?.addressObj) { + setInfoObj(val => ({ + ...val, + province_name: addrssRef.current[0]?.province_name, + address_id: addrssRef.current[0]?.id, + city_name: addrssRef.current[0]?.city_name, + address_detail: addrssRef.current[0]?.address_detail, + district_name: addrssRef.current[0]?.district_name, + target_user_name: addrssRef.current[0]?.name, + purchaser_phone: addrssRef.current[0]?.phone, + })) + } + // 没有默认地址提示进去选择地址 + if (value === 2 && !addrssRef.current.length && !infoObj?.address_id) { + alert.error('请选择地址') + } + setReceivingStatus(value) + Taro.hideLoading() + }, 300) + + // 获取客户地址 + // 获取地址 + const getAddress = async(id) => { + const result = await addressFetch({ purchaser_id: id }) + addrssRef.current = result?.data?.list.filter((item) => { return item.is_default }) + } + + const { fetchData: infoFetch } = MpSaleOrder() + const [infoObj, setInfoObj] = useState({}) + const [goodList, setgoodList] = useState([]) + // 获取订单详情 + const getDetail = async() => { + Taro.showLoading({ + title: '加载中...', + mask: true, + }) + const res = await infoFetch({ id: router.params.orderId }) + setInfoObj(res.data) + res.data.product_list.forEach((item) => { + item.product_colors.map((it) => { + it.nums = res.data?.sale_mode == 0 ? it.roll : it.length / 100 + return it + }) + }) + setgoodList([...res.data.product_list]) + orderMsg.map((it) => { + if (it.leftTitle === '订单编号：') { + it.rightTitle = res.data.order_no + } + if (it.leftTitle === '创建时间：') { + it.rightTitle = formatDateTime(res.data.create_time) + } + if (it.leftTitle === '发货时间：') { + it.rightTitle = formatDateTime(res.data.delivery_time) + } + if (it.leftTitle === '业务员：') { + it.rightTitle = res.data.sale_user_name + } + }) + setOrderMsg([...orderMsg]) + setReceivingStatus(res.data.shipment_mode) + // 小程序提供的api，通知页面停止下拉刷新效果 + Taro.stopPullDownRefresh() + Taro.hideLoading() + getAddress(res.data?.purchaser_id) + } + + // 订单信息文字数组 + const [orderMsg, setOrderMsg] = useState([ + { + leftTitle: '订单编号：', + rightTitle: '------', + showBtn: true, + }, + { + leftTitle: '创建时间：', + rightTitle: '------', + }, + { + leftTitle: '发货时间：', + rightTitle: '------', + }, + { + leftTitle: '业务员：', + rightTitle: '------', + }, + ]) + + // 备注操作 + const [showDesc, setShowDesc] = useState(false) + const { fetchData: remarkFetch } = MpSaleOrderPut() + const getRemark = async() => { + const res = await remarkFetch({ remark: infoObj.remark, id: Number(router.params.orderId) }) + if (res.msg === 'success') { + Taro.showToast({ + title: '成功', + icon: 'success', + }) + setShowDesc(false) + getDetail() + } + } + + useEffect(() => { + getDetail() + }, []) + + // 面料修改获取金额列表接口 + const { fetchData: editFetch } = MpsaleOrderaddProductList() + + useDidShow(() => { + // getDetail() + const pages = Taro.getCurrentPages() + const currPage = pages[pages.length - 1] // 获取当前页面 + // 获取选择回来的地址 + if (currPage.data?.addressObj) { + setInfoObj(val => ({ + ...val, + province_name: currPage.data?.addressObj?.province_name ? currPage.data?.addressObj?.province_name : '', + address_id: currPage.data?.addressObj?.id ? currPage.data?.addressObj?.id : '', + city_name: currPage.data?.addressObj?.city_name ? currPage.data?.addressObj?.city_name : '', + address_detail: currPage.data?.addressObj?.address_detail ? currPage.data?.addressObj?.address_detail : '', + district_name: currPage.data?.addressObj?.district_name ? currPage.data?.addressObj?.district_name : '', + target_user_name: currPage.data?.addressObj?.name ? currPage.data?.addressObj?.name : '', + purchaser_phone: currPage.data?.addressObj?.phone ? currPage.data?.addressObj?.phone : '', + })) + } + + selectId = currPage.data?.addressObj?.id + const obj = currPage?.data?.ids?.filter((item) => { return item == selectId }) + if (currPage?.data?.ids && obj.length === 0 && infoObj?.address_id == 0) { + setInfoObj(val => ({ + ...val, + province_name: '', + address_id: '', + city_name: '', + address_detail: '', + district_name: '', + target_user_name: '', + purchaser_phone: '', + })) + } + if (!currPage.data?.addressObj && infoObj?.address_id == 0) { + setReceivingStatus(1) + } + else { + setReceivingStatus(2) + } + // 获取选择回来的商品 + if (currPage.data?.selectGoodsList && currPage.data?.selectGoodsList.length > 0) { + for (let i = 0; i < currPage.data?.selectGoodsList.length; i++) { + let flag = true + for (let j = 0; j < goodList.length; j++) { + if (goodList[j].id === currPage.data?.selectGoodsList[i].id) { + flag = false + goodList[j].product_colors.push(...currPage.data?.selectGoodsList[i].product_colors) + } + } + if (flag) { goodList.push(currPage.data?.selectGoodsList[i]) } + } + handEditMoney(1) + } + }) + + const goodsObjRef = useRef() + useEffect(() => { + goodsObjRef.current = goodList + }, [goodList]) + + // 面料修改或者添加获取实时金额 + const handEditMoney = async(toastEnum) => { + let toastMsg = '' + if (toastEnum == 1) { + toastMsg = '添加商品成功' + } + else { + toastMsg = '修改商品成功' + } + Taro.showLoading({ + title: '请稍等...', + }) + const arr: any = [] + goodsObjRef.current.forEach((ec) => { + ec.product_colors.forEach((v) => { + const colorsArr: any[] = [] + colorsArr.push({ + product_color_id: v.id, + length: infoObj?.sale_mode == 0 ? 0 : Number(v.nums) * 100, + roll: infoObj?.sale_mode != 0 ? 0 : Number(v.nums), + sale_price: v.sale_price, + }) + arr.push({ + product_id: ec.id, + sale_mode: Number(infoObj?.sale_mode), + color_list: colorsArr, + }) + }) + }) + // 合并相同的数据 + const idArray: any[] = [] + const newAarray: any[] = [] + + arr.forEach((ele, i) => { + if (!idArray.includes(ele.product_id)) { + newAarray.push({ + product_id: ele.product_id, + name: ele.name, + sale_mode: Number(infoObj?.sale_mode), + color_list: ele.color_list, + }) + + idArray.push(ele.product_id) + } + else { + newAarray.map((dom, k) => { + if (dom.product_id == ele.product_id) { + dom.color_list = [...ele.color_list, ...dom.color_list] + } + }) + } + }) + + const res = await editFetch({ add_product_list_param: newAarray, sale_order_id: infoObj?.id }) + if (res.data) { + Taro.hideLoading() + Taro.showToast({ + title: toastMsg, + icon: 'none', + }) + goodList.map((item) => { + res.data.list?.map((v) => { + if (item.id == v.id) { + item.product_colors?.forEach((edg) => { + v.product_colors?.forEach((ac) => { + if (edg.id == ac.id) { + edg.total_sale_price = ac.total_sale_price + } + }) + }) + } + }) + return item + }) + setgoodList([...goodList]) + } + else { + Taro.hideLoading() + } + } + + // 页面下拉刷新 + usePullDownRefresh(() => { + getDetail() + }) + + // 选择地址 + const handSelect = (obj) => { + Taro.navigateTo({ + url: `/pages/addressManager/index?orderId=${-100}&purchaser_id=${obj.purchaser_id}`, + }) + } + + // 是否显示按钮 + const showBtn = useMemo(() => { + if ((infoObj.status === 8 || infoObj.status === 9 || infoObj.status === 4 || infoObj.status === 5 || infoObj.status === 11 || infoObj.status === 3)) { + return false + } + else { + return true + } + }, [infoObj]) + + const showWhatFont = useMemo(() => { + if (infoObj.shipment_mode === 1) { + return '自提商品' + } + else { + return '物流' + } + }, [infoObj]) + + const onChange = (e) => { + setInfoObj(val => ({ ...val, remark: e })) + } + + useEffect(() => { + setInfoObj(infoObj) + }, [infoObj]) + + const showRemarkFont = useMemo(() => { + if (infoObj.status === 10 || infoObj.status == 0 || infoObj.status == 1 || infoObj.status == 2 || infoObj.status == 7) { + return `${'填写/修改备注'} >` + } + else { + return '' + } + }, [infoObj]) + + // 待接单、配布中、已配布状态时，叫预估金额，其他状态叫合计金额。 + const payFont = useMemo(() => { + if (infoObj?.status === 0 || infoObj?.status === 1 || infoObj?.status === 2) { + return '预估金额' + } + else { + return '合计金额' + } + }, [infoObj]) + + // 复制功能 + const clipboardData = () => { + Taro.setClipboardData({ + data: infoObj?.order_no || '', + success(res) { + Taro.showToast({ + icon: 'none', + title: '复制成功', + }) + }, + }) + } + + // 判断是否整数类型 + function isInteger(obj) { + return (obj | 0) === obj + } + + // 删除面料的ids数组 + const [deleteProductIds, setdeleteProductIds] = useState([]) + + // 删除商品弹窗 + const handCancelToast = (item) => { + // const deletIds: any[] = [] + for (let i = 0; i < goodList?.length; i++) { + if (goodList.length === 1 && goodList[i].product_colors?.length === 1) { + return Taro.showToast({ + icon: 'none', + title: '至少保留一个面料', + }) + } + } + Taro.showModal({ + content: '删除所选商品？', + async success(res) { + if (res.confirm) { + // 删除某项商品 + goodList.forEach((edg) => { + edg?.product_colors.map((it, index) => { + if (item.id == it.id) { + deleteProductIds.push(item.id) + edg?.product_colors.splice(index, 1) + } + return it + }) + return edg + }) + // 子商品没有了大商品也删除 + goodList.forEach((edg, index) => { + if (!edg?.product_colors.length) { + goodList.splice(index, 1) + } + }) + setgoodList([...goodList]) + setdeleteProductIds([...deleteProductIds]) + } + else if (res.cancel) { + console.log('用户点击取消') + } + }, + }) + } + + // 输入框减 + const clickReduce = useCallback((item) => { + goodList.forEach((edg) => { + edg?.product_colors.map((it) => { + if (item.id == it.id) { + if (infoObj?.sale_mode == 0 && item.nums == 1) { + return handCancelToast(item) + } + if (infoObj?.sale_mode == 1 && item.nums == 0.3) { + return handCancelToast(item) + } + if (infoObj?.sale_mode == 2 && item.nums == 3) { + return handCancelToast(item) + } + if (isInteger(item.nums)) { + it.nums-- + handEditMoney(2) + } + else { + it.nums = Math.trunc(item.nums) + handEditMoney(2) + } + } + return it + }) + return edg + }) + setgoodList([...goodList]) + // if ((infoObj?.sale_mode == 0 && item.nums > 1) || (infoObj?.sale_mode == 1 && item.nums > 0.3) || (infoObj?.sale_mode == 2 && item.nums > 3)) { + // handEditMoney(2) + // } + }, [goodList]) + + // 输入框加 + const handPlus = useCallback((item) => { + goodList.forEach((edg) => { + edg?.product_colors.map((it) => { + if (item.id == it.id) { + if (isInteger(item.nums)) { + item.nums++ + } + else { + item.nums++ + item.nums = Math.trunc(item.nums) + } + } + return it + }) + return edg + }) + setgoodList([...goodList]) + handEditMoney(2) + }, [goodList]) + + // 输入框监听 + const onBlur = useCallback((e, item) => { + goodList.forEach((edg) => { + edg?.product_colors.map((it) => { + if (it.id == item.id) { + if (infoObj.sale_mode == 0 && (e.detail.value == '' || Number(e.detail.value) == 0)) { + it.nums = 1 + } + else if (infoObj.sale_mode == 0 && (e.detail.value != '' || Number(e.detail.value) > 0)) { + it.nums = Number(e.detail.value) + } + + if (infoObj.sale_mode == 1 && Number(e.detail.value) < 0.3) { + it.nums = 0.3 + } + else if (infoObj.sale_mode == 1 && Number(e.detail.value) >= 0.3) { + if (isInteger(Number(e.detail.value))) { + it.nums = Number(e.detail.value) + } + else { + it.nums = Number(e.detail.value).toFixed(2) + } + } + + if (infoObj.sale_mode == 2 && Number(e.detail.value) < 3) { + it.nums = 3 + } + else if (infoObj.sale_mode == 2 && Number(e.detail.value) >= 3) { + if (isInteger(Number(e.detail.value))) { + it.nums = Number(e.detail.value) + } + else { + it.nums = Number(e.detail.value).toFixed(2) + } + } + } + return it + }) + return edg + }) + setgoodList([...goodList]) + handEditMoney(2) + }, [goodList]) + + // 添加面料 + const navTo = () => { + const arr = JSON.stringify(goodList).replace(/%/g, '%25') + Taro.navigateTo({ + url: `/pages/addFabric/index?goodList=${arr}&purchaser_id=${infoObj?.purchaser_id}&sale_mode=${infoObj?.sale_mode}`, + }) + } + + const { fetchData: submitFetch } = MpsaleOrdersubmit() + // 提交修改 + const handSubmit = () => { + if (infoObj?.address_id == 0 || !infoObj?.address_id) { + return Taro.showToast( + { + title: '请选择收货地址', + icon: 'error', + }, + ) + } + const quertArr: any[] = [] + + goodList.forEach((item) => { + item.product_colors?.forEach((edc) => { + quertArr.push({ + length: infoObj?.sale_mode != 0 ? edc.nums * 100 : 0, + product_color_id: edc.id, + product_id: item.id, + roll: infoObj?.sale_mode == 0 ? edc.nums : 0, + // sale_order_detail_id: edc.sale_order_detail_id ? edc.sale_order_detail_id : 0, + }) + }) + }) + + const query = { + address_id: infoObj?.address_id, + commodity_list: quertArr, + delete_detail_list: filterArr(deleteProductIds), + remar: infoObj?.remark, + sale_order_id: infoObj?.id, + shipment_mode: receivingStatus, + } + console.log(query, 'quertArrquertArr') + Taro.showModal({ + content: '是否确认提交修改', + async success(res) { + if (res.confirm) { + Taro.showLoading({ + title: '加载中...', + }) + const res = await submitFetch(query) + if (res.data) { + Taro.hideLoading() + Taro.redirectTo({ + url: `/pages/orderDetails/index?id=${res.data.id}`, + }) + } + else { + Taro.hideLoading() + } + } + else if (res.cancel) { + console.log('用户点击取消') + } + }, + }) + } + + // 数组去重 + const filterArr = (arr) => { + const newArr: any[] = [] + // 控制外循环 + for (let i = 0; i < arr.length; i++) { + for (let j = i + 1; j < arr.length; j++) { + if (arr[i] == arr[j]) { + arr[j] = 0 + } + } + // 去除值为0的 + if (arr[i] == 0) { + continue + } + else { + // 放入新的数组 + newArr.push(arr[i]) + } + } + return newArr + } + + // 计算预估金额 + const totalMoney = useMemo(() => { + const arr: any = [] + goodList.forEach((item) => { + item.product_colors.forEach((it) => { + arr.push(Number(it.total_sale_price)) + }) + }) + const hate = sum(arr) + return hate + }, [goodList]) + + // 计算总面料 + const totalProduct = useMemo(() => { + const arr: any = [] + goodList.forEach((item) => { + arr.push(item) + }) + return arr.length + }, [goodList]) + + // 计算总颜色 + const totalColors = useMemo(() => { + const arr: any = [] + goodList.forEach((item) => { + item.product_colors.forEach((it) => { + arr.push(it) + }) + }) + return arr.length + }, [goodList]) + + // 计算总颜色数量 + const totalColorsNums = useMemo(() => { + const arr: any = [] + goodList.forEach((item) => { + item.product_colors.forEach((it) => { + arr.push(Number(it.nums)) + }) + }) + const hate = sum(arr) + return hate + }, [goodList]) + + function sum(arr) { + let s = 0 + for (let i = arr.length - 1; i >= 0; i--) { + s += arr[i] + } + return s + } + + return ( + + handSelect(obj)} + obj={infoObj} + receivingStatus={receivingStatus} + onReceivingStatus={(e, value) => onReceivingStatus(e, value)} + > + + + {infoObj.purchaser_name} + {infoObj.purchaser_phone} + + + navTo()}>添加面料 + {totalProduct} 种面料，{totalColors} 个颜色，共 {totalColorsNums} {infoObj.sale_mode === 0 ? '条' : 'm'} + + clickReduce(it)} + handPlus={it => handPlus(it)} + onBlur={(e, it) => onBlur(e, it)} + modeFont={infoObj?.sale_mode} + > + + + {payFont} + + ¥{formatPriceDiv(totalMoney)} + + {/* + + 实付金额 + + ¥{formatPriceDiv(infoObj.actual_amount)} + */} + { + infoObj?.wait_pay_amount < 0 && + + {infoObj?.wait_pay_amount?.toString().indexOf('-') !== -1 ? '退款金额' : '待付金额'} + + ¥{formatPriceDiv(infoObj.wait_pay_amount)} + + } + { + infoObj?.wait_pay_amount > 0 && + + {infoObj?.wait_pay_amount?.toString().indexOf('-') !== -1 ? '退款金额' : '待付金额'} + + ¥{formatPriceDiv(infoObj.wait_pay_amount)} + + } + + + + { + orderMsg.map((item, index) => { + return ( + + + {item.leftTitle} + + + {item.rightTitle} + {item.showBtn && clipboardData()}>复制} + + + + ) + }) + } + + + setShowDesc(showRemarkFont != '')}> + {infoObj.remark === '' ? '暂无' : infoObj.remark} + + + setShowDesc(false)}> + + getRemark(e)} + onChange={e => onChange(e)} + defaultValue={infoObj.remark} + /> + getRemark()}>保存 + + + + + + handSubmit()}>提交修改 + + + ) +} +export default OrderDetails