From d2a144181032a88cbfd3a39963c1ad77f0614bef Mon Sep 17 00:00:00 2001 From: Haiyi <1021441632@qq.com> Date: Thu, 22 Sep 2022 15:11:16 +0800 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat:=E5=94=AE=E5=90=8E=E6=A8=A1?= =?UTF-8?q?=E5=9D=97100%?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- project.private.config.json | 7 + src/api/order.ts | 8 +- src/app.config.ts | 6 + src/components/timePicker/index.tsx | 6 + src/pages/applyMoney/index.config.ts | 4 + src/pages/applyMoney/index.module.scss | 284 ++++++++++++++++++ src/pages/applyMoney/index.tsx | 206 +++++++++++++ src/pages/order/index.tsx | 14 + src/pages/orderDetails/index.tsx | 10 +- src/pages/refundDetail/index.module.scss | 3 +- src/pages/refundMoneyDetail/index.module.scss | 8 +- src/pages/refundMoneyDetail/index.tsx | 11 +- .../components/itemList/index.module.scss | 4 +- .../refundPage/components/itemList/index.tsx | 17 +- src/pages/refundPage/index.tsx | 24 +- 15 files changed, 585 insertions(+), 27 deletions(-) create mode 100644 src/pages/applyMoney/index.config.ts create mode 100644 src/pages/applyMoney/index.module.scss create mode 100644 src/pages/applyMoney/index.tsx diff --git a/project.private.config.json b/project.private.config.json index 2b2baa0..772adba 100644 --- a/project.private.config.json +++ b/project.private.config.json @@ -113,6 +113,13 @@ "query": "orderId=28114", "launchMode": "default", "scene": null + }, + { + "name": "", + "pathName": "pages/applyMoney/index", + "query": "orderId=28411", + "launchMode": "default", + "scene": null } ] } diff --git a/src/api/order.ts b/src/api/order.ts index a34436f..b0ef2bd 100644 --- a/src/api/order.ts +++ b/src/api/order.ts @@ -172,4 +172,10 @@ export const mpreturnApplyOrder = () => { method: "put", }) } - +//退款说明 +export const mpenumrefundExplainone = () => { + return useRequest({ + url: `/v1/mp/enum/refundExplain`, + method: "get", + }) +} diff --git a/src/app.config.ts b/src/app.config.ts index c21693a..5f7398b 100644 --- a/src/app.config.ts +++ b/src/app.config.ts @@ -99,6 +99,12 @@ export default defineAppConfig({ pages: [ "index" ] + }, + { + root: "pages/applyMoney", + pages: [ + "index" + ] } ], }) diff --git a/src/components/timePicker/index.tsx b/src/components/timePicker/index.tsx index 83ce2cb..1b7cd1d 100644 --- a/src/components/timePicker/index.tsx +++ b/src/components/timePicker/index.tsx @@ -21,11 +21,17 @@ export default memo((props: Props) => { const handTime = (e) => { const { start, end } = e.value // 如果选的是同一天的日期, end 自动加一天 + if (!end) { + //判断如果没选下一天的时候 + e.value.end = `${dayjs(new Date(start)).add(1, 'day').format('YYYY-MM-DD')} 00:00:00` + } if (start === end) { e.value.end = `${dayjs(new Date(start)).add(1, 'day').format('YYYY-MM-DD')} 00:00:00` } setTime(e) } + + return ( closePopup?.()}> diff --git a/src/pages/applyMoney/index.config.ts b/src/pages/applyMoney/index.config.ts new file mode 100644 index 0000000..6098173 --- /dev/null +++ b/src/pages/applyMoney/index.config.ts @@ -0,0 +1,4 @@ +export default { + navigationBarTitleText: '申请退款', + enableShareAppMessage: true, +} diff --git a/src/pages/applyMoney/index.module.scss b/src/pages/applyMoney/index.module.scss new file mode 100644 index 0000000..4267754 --- /dev/null +++ b/src/pages/applyMoney/index.module.scss @@ -0,0 +1,284 @@ +.main {} + +.resonBig { + overflow: hidden; + margin: 24px; + background: #FFFFFF; + + border-radius: 16px; + + + .reasonItem { + display: flex; + align-items: center; + margin: 32px; + padding-bottom: 32px; + justify-content: space-between; + + .reasonLeft { + display: flex; + align-items: center; + + .reasonFont { + font-size: 28px; + font-weight: 500; + color: #000000; + } + + .xing { + font-size: 28px; + font-weight: 500; + color: #E42945; + } + + .selectFont { + font-size: 28px; + font-weight: 400; + color: #000000; + margin-left: 40px; + } + } + + .chakanquanbukehu { + font-size: 50px; + } + } +} + + +.descBox { + margin: 32px; + background: #FFFFFF; + border-radius: 16px 16px 0px 0px; + overflow: hidden; + + .title { + font-size: 28px; + font-weight: 500; + color: #000000; + margin-top: 24px; + margin-left: 32px; + } + + .textBox { + padding-top: 15px; + padding-left: 24px; + padding-right: 24px; + padding-bottom: 24px; + margin-right: 32px; + margin-top: 24px; + margin-left: 32px; + height: 210px; + background: #f6f6f6; + border-radius: 8px; + font-size: 28px; + font-weight: 400; + color: #000000; + margin-bottom: 32px; + } + + +} + + +.bottomBox { + width: 750px; + height: 160px; + background: #FFFFFF; + position: fixed; + bottom: 0; + z-index: 99; + display: flex; + padding-top: 16px; + justify-content: space-between; + + .resetBox { + margin-left: 48px; + width: 311px; + height: 80px; + border-radius: 44px; + border: 1px solid #087EFF; + font-size: 28px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #337FFF; + text-align: center; + line-height: 80px; + } + + .button { + margin-right: 32px; + width: 311px; + height: 80px; + background: #68b4ff; + border-radius: 44px; + font-size: 32px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #FFFFFF; + text-align: center; + line-height: 80px; + } + + .activeButton { + margin-right: 32px; + width: 311px; + height: 80px; + background: #337FFF; + border-radius: 44px; + font-size: 32px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #fff; + text-align: center; + line-height: 80px; + } +} + +.safeBox { + height: 160px; + width: 100%; +} + +.popupBox { + padding-bottom: env(safe-area-inset-bottom); + + + + + .thirdBox { + margin-top: 20px; + padding-left: 48px; + + .thirdTopfont { + font-size: 28px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #000000; + } + + .timeBox2 { + margin-top: 24px; + background-color: #f6f6f6; + height: 68px; + background: #E9E9E9; + border-radius: 8px; + margin-right: 48px; + text-align: center; + line-height: 68px; + position: relative; + font-size: 28px; + font-weight: 400; + color: #000000; + + .more { + position: absolute; + right: 30px; + top: 5px; + font-size: 40px; + } + } + + .flexModebox { + margin-top: 24px; + display: flex; + flex-wrap: wrap; + + .activemodeBox { + margin-bottom: 16px; + margin-right: 16px; + // width: 152px; + // height: 68px; + padding: 17px 34px 17px 34px; + background: rgba(51, 127, 255, 0.1); + border-radius: 8px; + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #337FFF; + text-align: center; + // line-height: 68px; + border: 1px solid #337FFF; + box-sizing: border-box; + } + + .modeBox { + margin-bottom: 16px; + margin-right: 16px; + padding: 17px 34px 17px 34px; + // width: 152px; + // height: 68px; + background: #f6f6f6; + border-radius: 8px; + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + border: 1px solid #f6f6f6; + text-align: center; + // line-height: 68px; + box-sizing: border-box; + // opacity: 0.4; + } + } + } + + .bottomBox1 { + width: 750px; + height: 160px; + background: #FFFFFF; + position: fixed; + bottom: 0; + z-index: 99; + display: flex; + padding-top: 16px; + justify-content: space-between; + + .resetBox1 { + margin-left: 48px; + width: 311px; + height: 80px; + border-radius: 44px; + border: 1px solid #087EFF; + font-size: 28px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #337FFF; + text-align: center; + line-height: 80px; + } + + .button1 { + margin-right: 32px; + width: 311px; + height: 80px; + background: #68b4ff; + border-radius: 44px; + font-size: 32px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #FFFFFF; + text-align: center; + line-height: 80px; + } + + .activeButton1 { + margin-right: 32px; + width: 311px; + height: 80px; + background: #337FFF; + border-radius: 44px; + font-size: 32px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #fff; + text-align: center; + line-height: 80px; + } + } + + // .areaBox { + // height: calc($customTabBarHeight + env(safe-area-inset-bottom)); + // width: 100%; + // } +} \ No newline at end of file diff --git a/src/pages/applyMoney/index.tsx b/src/pages/applyMoney/index.tsx new file mode 100644 index 0000000..644b526 --- /dev/null +++ b/src/pages/applyMoney/index.tsx @@ -0,0 +1,206 @@ +import { View, Input, Button, Image, Text, Textarea } from '@tarojs/components' +import { useCallback, useEffect, useMemo, useRef, useState, ReactNode, memo } from 'react' +import styles from "./index.module.scss" +import classnames from "classnames"; +import Taro, { faceVerifyForPay, useDidShow, useRouter } from '@tarojs/taro' +import { formatDateTime, formatHashTag, formatImgUrl, formatPriceDiv, formatWeightDiv } from '@/common/format' +import { + mpreturnApplyOrder, + mpenumrefundExplainone, +} from "@/api/order" +import Popup from '@/components/popup' + + +export default () => { + + useEffect(() => { + getEnum() + }, []) + const Router = useRouter() + + //获取枚举 + const [List, setList] = useState([]) + const { fetchData: explanFetch } = mpenumrefundExplainone() + const getEnum = async () => { + const res = await explanFetch() + if (res.data) { + setList(res.data.list) + } + } + + //选择退货原因 + const handReasonOne = (item) => { + List.map(it => { + if (it.id === item.id) { + it.default = true + } else { + it.default = false + } + return it + }) + setList([...List]) + setQuery((val) => ({ ...val, reasonId: item.id })) + queryRef.current.reasonName = item.name + } + + //筛选内容展示 + const [showPopup, setshowPopup] = useState(false) + + const queryRef = useRef({ + reasonName: '请选择' + }) + const [Query, setQuery] = useState({ + reasonId: '', + reasonName: '请选择' + }) + + + //备注信息 + const [TextareaValue, setTextareaValue] = useState('') + const getDesc = (e) => { + setTextareaValue(e) + } + + //取消返回 + const handCancl = () => { + Taro.navigateBack({ + delta: 1 + }) + } + + //确认选择 + const handSlect = () => { + setQuery((val) => ({ ...val, reasonName: queryRef.current.reasonName })) + setshowPopup(false) + } + + //重置 + const handReset = () => { + setQuery(({ reasonId: '', reasonName: '请选择' })) + queryRef.current.reasonName = '请选择' + const arrOne = resetArr(List) + setList([...arrOne]) + } + + //判断是否允许提交 + const isDisabled = useMemo(() => { + if (Query.reasonId !== '') { + return false + } else { + return true + } + }, [Query]) + + //数组重置 + const resetArr = (arr) => { + arr.map(it => { + it.default = false + return it + }) + return arr + } + //确认退款 + const { fetchData: sureFetch } = mpreturnApplyOrder() + const handSure = () => { + const query = { + reason_describe: TextareaValue, + fabric_piece_accessory_url: [], + goods_status: 100, + return_explain: Query.reasonId, + roll: 0, + roll_list: [], + sale_order_id: Number(Router.params.orderId), + }; + Taro.showModal({ + content: "确认退款吗？", + confirmText: "确认", + cancelText: "取消", + success: async function (res) { + if (res.confirm) { + Taro.showLoading({ + title: '请稍等...', + mask: true + }) + const res = await sureFetch(query) + if (res?.msg === 'success') { + Taro.showToast({ + title: '成功' + }) + Taro.hideLoading() + handCancl() + } else { + Taro.hideLoading() + Taro.showToast({ + title: res?.msg, + icon: 'error' + }) + } + } + + } + }) + } + + return ( + + + { setshowPopup(true) }}> + + 退货原因 + * + { + Query.reasonName === '请选择' && 请选择 + } + { + Query.reasonName !== '请选择' && {Query.reasonName} + } + + + + + + 其他说明 + + + + + + + + + + + + { setshowPopup?.(false) }}> + + + + 退款原因 + + { + List.map((item, index) => { + return ( + { handReasonOne(item) }} className={classnames(item.default ? styles.activemodeBox : styles.modeBox)} key={index}>{item.name} + ) + }) + } + + + + + + + + + + + + ) +} \ No newline at end of file diff --git a/src/pages/order/index.tsx b/src/pages/order/index.tsx index 4d885ff..9420491 100644 --- a/src/pages/order/index.tsx +++ b/src/pages/order/index.tsx @@ -219,6 +219,20 @@ export default () => { sale_mode: undefined, shipment_mode: undefined }) + const arrOne = resetArr(modeList) + setModeList([...arrOne]) + const arrTwo = resetArr(deliveryList) + setdeliveryList([...arrTwo]) + } + + + //数组重置 + const resetArr = (arr) => { + arr.map(it => { + it.checked = false + return it + }) + return arr } //确认筛选 const handSure = async () => { diff --git a/src/pages/orderDetails/index.tsx b/src/pages/orderDetails/index.tsx index 48324bb..0ada023 100644 --- a/src/pages/orderDetails/index.tsx +++ b/src/pages/orderDetails/index.tsx @@ -519,10 +519,18 @@ export default () => { } } + //申请退款 + const handApplyMoney = () => { + Taro.navigateTo({ + url: '/pages/applyMoney/index?orderId=' + infoObj.id + }) + setShowMore(false) + } + + //确认收货 const { fetchData: receveFetch } = mpsaleOrderreceive() const handSureGoods = async () => { - Taro.showModal({ content: "确认收货吗？", confirmText: "确认", diff --git a/src/pages/refundDetail/index.module.scss b/src/pages/refundDetail/index.module.scss index 37c70a3..877156c 100644 --- a/src/pages/refundDetail/index.module.scss +++ b/src/pages/refundDetail/index.module.scss @@ -49,7 +49,8 @@ width: 134px; height: 134px; margin-right: 10px; - margin-bottom: 10px; + margin-top: 20px; + border-radius: 8px; } .noPic { diff --git a/src/pages/refundMoneyDetail/index.module.scss b/src/pages/refundMoneyDetail/index.module.scss index c56c1aa..f3eae4f 100644 --- a/src/pages/refundMoneyDetail/index.module.scss +++ b/src/pages/refundMoneyDetail/index.module.scss @@ -80,8 +80,8 @@ .cancleBtn { margin-right: 20px; - width: 224px; - height: 64px; + width: 160px; + height: 72px; border-radius: 40px; opacity: 0.6; border: 1px solid #000000; @@ -94,12 +94,12 @@ } .totalBox { + margin-top: 10px; width: 100%; - height: 100px; display: flex; align-items: center; justify-content: space-between; - margin-bottom: 10px; + // margin-bottom: 10px; .totalLeft { font-size: 28px; diff --git a/src/pages/refundMoneyDetail/index.tsx b/src/pages/refundMoneyDetail/index.tsx index ca61255..e34801a 100644 --- a/src/pages/refundMoneyDetail/index.tsx +++ b/src/pages/refundMoneyDetail/index.tsx @@ -211,8 +211,9 @@ export default () => { { DeatailObj.stage == 0 && + 合计金额 - { + { formatPriceDiv(DeatailObj.total_refund_amount) } @@ -220,7 +221,7 @@ export default () => { { (DeatailObj.stage == 5 || DeatailObj.stage == 6) && 退款金额 - { + { formatPriceDiv(DeatailObj.refund_amount) } @@ -228,7 +229,7 @@ export default () => { { (DeatailObj.stage == 5 || DeatailObj.stage == 6) && 其他扣除金额 - { + { formatPriceDiv(DeatailObj.other_deduction_amount) } @@ -236,7 +237,7 @@ export default () => { { (DeatailObj.stage == 5 || DeatailObj.stage == 6) && 退款去向 - { + { formatPriceDiv(DeatailObj.refund_flow_name) } @@ -279,7 +280,7 @@ export default () => { { (DeatailObj.stage === 0 || DeatailObj.stage === 1) && - handCancle()}>取消退货 + handCancle()}>取消售后 } diff --git a/src/pages/refundPage/components/itemList/index.module.scss b/src/pages/refundPage/components/itemList/index.module.scss index 8695091..cf68a78 100644 --- a/src/pages/refundPage/components/itemList/index.module.scss +++ b/src/pages/refundPage/components/itemList/index.module.scss @@ -1,8 +1,8 @@ .itemBox { margin-top: 38px; overflow: hidden; - width: 702px; - height: 560px; + margin: 24px; + height: 416px; background: #FFFFFF; border-radius: 16px; margin-left: 24px; diff --git a/src/pages/refundPage/components/itemList/index.tsx b/src/pages/refundPage/components/itemList/index.tsx index 347357e..e68bf88 100644 --- a/src/pages/refundPage/components/itemList/index.tsx +++ b/src/pages/refundPage/components/itemList/index.tsx @@ -30,7 +30,7 @@ export default memo((props: propsObj) => { return ( - navTo(e)}> + navTo(props.obj)}> 单号：{props?.obj?.order_no} {props?.obj?.stage_name} @@ -94,12 +94,15 @@ export default memo((props: propsObj) => { props?.obj?.total_colors } 种颜色，共 {props?.obj?.sale_mode === 0 ? props?.obj?.total_number : props?.obj?.total_number / 100} {props?.obj?.sale_mode === 0 ? '条' : 'm'} - - 退款金额： - { - (props?.obj.stage == 5 || props?.obj.stage == 6 || props?.obj.stage == 3) && ¥{formatPriceDiv(props?.obj?.refundable_amount)} - } - + { + (props?.obj.stage == 5 || props?.obj.stage == 6 || props?.obj.stage == 3) && + 退款金额： + + ¥{formatPriceDiv(props?.obj?.refundable_amount)} + + + } + {/* { @@ -256,16 +257,24 @@ export default () => { setShowTime(false) } let myDate = new Date(); - const [start, setStart] = useState(myDate.toLocaleDateString()) - const [end, setEnd] = useState('') + const [start, setStart] = useState(myDate.toLocaleDateString()) + const [end, setEnd] = useState('') //选择时间 const handTime = (eq) => { - console.log(eq?.value?.start, 'eq?.value?.start') - setSearchField((val) => ({ ...val, saleStartTime: eq?.value?.start, saleEndTime: eq?.value?.start })) + //直接进来点确定的时候做处理 + if (Object.keys(eq).length === 0) { + let obj = { + start: '', + end: '' + } + obj.start = myDate?.toLocaleDateString() + ' ' + '00:00:00' + obj.end = `${dayjs(new Date(obj?.start)).add(1, 'day').format('YYYY-MM-DD')} 00:00:00` + eq.value = obj + } + setSearchField((val) => ({ ...val, saleStartTime: eq?.value?.start, saleEndTime: eq?.value?.end })) setStart(eq?.value?.start) setEnd(eq?.value?.end) setShowTime(false) - console.log(searchField, 8888) } const timeArea = useMemo(() => { @@ -278,6 +287,7 @@ export default () => { useEffect(() => { setSearchField(searchField) + console.log(searchField, 9999) }, [searchField]) return ( @@ -352,7 +362,9 @@ export default () => { 售后时间 { setShowTime(true) }}>{timeArea} - + { + timeArea != '自定义起始时间' && + }