From 30efe70995dd92c1110729953ed79766ad2fcbee Mon Sep 17 00:00:00 2001 From: czm <2192718639@qq.com> Date: Thu, 9 Jun 2022 17:07:00 +0800 Subject: [PATCH] =?UTF-8?q?=E5=94=AE=E5=90=8E=E7=94=B3=E8=AF=B7=E9=A1=B5?= =?UTF-8?q?=E9=9D=A2=E5=AE=8C=E6=88=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/order.ts | 12 +- src/app.config.ts | 6 + src/common/uploadImage.js | 18 --- src/components/orderBtns/index.tsx | 38 +++++- src/components/shopCart/index.tsx | 2 - .../components/otherReason/index.module.scss | 36 +++++ .../components/otherReason/index.tsx | 37 +++++ .../components/reasonPopup/index.module.scss | 27 ++++ .../components/reasonPopup/index.tsx | 44 ++++++ src/pages/applyAfterSales/index.config.ts | 4 + .../applyAfterSales/index.module.scss | 84 ++++++------ .../components => }/applyAfterSales/index.tsx | 128 +++++++++--------- src/pages/order/index.tsx | 2 - .../orderList/components/order/index.tsx | 1 - src/reducers/userInfo.ts | 1 + src/use/useLogin.ts | 12 +- 16 files changed, 302 insertions(+), 150 deletions(-) create mode 100644 src/pages/applyAfterSales/components/otherReason/index.module.scss create mode 100644 src/pages/applyAfterSales/components/otherReason/index.tsx create mode 100644 src/pages/applyAfterSales/components/reasonPopup/index.module.scss create mode 100644 src/pages/applyAfterSales/components/reasonPopup/index.tsx create mode 100644 src/pages/applyAfterSales/index.config.ts rename src/pages/{order/components => }/applyAfterSales/index.module.scss (78%) rename src/pages/{order/components => }/applyAfterSales/index.tsx (55%) diff --git a/src/api/order.ts b/src/api/order.ts index f723f47..26c175c 100644 --- a/src/api/order.ts +++ b/src/api/order.ts @@ -84,9 +84,19 @@ export const SaleOrderApi = () => { /** * 作废销售单 */ - export const CancelOrderApi = () => { +export const CancelOrderApi = () => { return useRequest({ url: `/v1/mall/saleOrder/cancel`, method: "put", }) +} + +/** + * 确认收货 + */ +export const ReceiveOrderApi = () => { + return useRequest({ + url: `/v1/mall/saleOrder/receive`, + method: "put", + }) } \ No newline at end of file diff --git a/src/app.config.ts b/src/app.config.ts index 61bd39e..8130e2c 100644 --- a/src/app.config.ts +++ b/src/app.config.ts @@ -158,6 +158,12 @@ export default { pages: [ "index", ] + }, + { + root: "pages/applyAfterSales", + pages: [ + "index", + ] } ] } diff --git a/src/common/uploadImage.js b/src/common/uploadImage.js index 6a6cf8a..ae7724b 100644 --- a/src/common/uploadImage.js +++ b/src/common/uploadImage.js @@ -129,22 +129,4 @@ const uploadCDNImg = (file, secene, type) => { }) } -const taroChooseImg = () => { - Taro.chooseImage({ - count: 1, - sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有 - sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有 - success: (res) => { - console.log('res:', res) - Taro.chooseMessageFile({ - count: 1, - - }) - }, - fail: (err) => { - console.log('图片选择失败：', err) - } - }) -} - export default uploadCDNImg \ No newline at end of file diff --git a/src/components/orderBtns/index.tsx b/src/components/orderBtns/index.tsx index f098520..6cb1292 100644 --- a/src/components/orderBtns/index.tsx +++ b/src/components/orderBtns/index.tsx @@ -1,7 +1,7 @@ -import { CancelOrderApi } from "@/api/order" +import { CancelOrderApi, ReceiveOrderApi } from "@/api/order" import { alert } from "@/common/common" import { ORDER_STATUS } from "@/common/enum" -import { View } from "@tarojs/components" +import { ScrollView, View } from "@tarojs/components" import Taro from "@tarojs/taro" import { useCallback, useRef, memo } from "react" import styles from './index.module.scss' @@ -24,7 +24,6 @@ export default memo(({orderInfo, onClick}:Param) => { SaleOrderStatusArranged, SaleOrderStatusWaitingDelivery, SaleOrderStatusComplete, - SaleOrderStatusCancel, SaleOrderStatusRefund, SaleOrderStatusWaitingPayment, SaleOrderStatusWaitingReceipt, @@ -90,6 +89,7 @@ export default memo(({orderInfo, onClick}:Param) => { const submitBtns = (val) => { (val == 1)&&cancelOrder(); //取消订单按钮 (val == 2)&&onClick?.(val); //去付款按钮 + (val == 6)&&receiveOrder(); //确认收货 } //取消订单 @@ -113,11 +113,37 @@ export default memo(({orderInfo, onClick}:Param) => { }) } + //确认订单 + const {fetchData: receiveOrderFetchData} = ReceiveOrderApi() + const receiveOrder = async () => { + console.log('123456') + Taro.showModal({ + title: '确定收货？', + success: async function (res) { + if (res.confirm) { + let res = await receiveOrderFetchData({sale_order_id: orderInfo?.orderId}) + if(res.success){ + onClick?.(6) + alert.success('收货成功') + } else { + alert.error('收货失败') + } + } else if (res.cancel) { + console.log('用户点击取消') + } + } + }) + + } + return ( - {orderBtnsList.current.map((item) => - orderBtnsShow(item)&& submitBtns(item.id)}>{item.label} - )} + + {orderBtnsList.current.map((item) => + orderBtnsShow(item)&& submitBtns(item.id)}>{item.label} + )} + + ) }) \ No newline at end of file diff --git a/src/components/shopCart/index.tsx b/src/components/shopCart/index.tsx index 8eb3d75..2470ef1 100644 --- a/src/components/shopCart/index.tsx +++ b/src/components/shopCart/index.tsx @@ -117,8 +117,6 @@ export default ({show = false, onClose}: param) => { if(item.select) select_count++ } }) - console.log('list_count::',list_count) - console.log('select_count::',select_count) setSelectStatus(select_count == list_count) } diff --git a/src/pages/applyAfterSales/components/otherReason/index.module.scss b/src/pages/applyAfterSales/components/otherReason/index.module.scss new file mode 100644 index 0000000..e2d1b1b --- /dev/null +++ b/src/pages/applyAfterSales/components/otherReason/index.module.scss @@ -0,0 +1,36 @@ +.other_desc{ + padding: 0 20px; + box-sizing: border-box; + .title{ + font-size: $font_size; + font-weight: 700; + } + .textarea{ + position: relative; + height: 165.4px; + .descDataNum{ + position: absolute; + right: 10px; + bottom: 10px; + font-size: 22px; + color: #ABABAB; + } + } + .textarea_con, .textarea_con_pretend{ + background-color: #f3f3f3; + border: 2px solid #e6e6e6; + border-radius: 10px; + width: 100%; + font-size: 25px; + height: 165.4px; + padding: 20px 20px 30px 20px; + box-sizing: border-box; + margin-top: 20px; + } + .textarea_con_pretend{ + color: $color_font_two; + } + .textarea_con_pretend_ed{ + color: #000; + } +} \ No newline at end of file diff --git a/src/pages/applyAfterSales/components/otherReason/index.tsx b/src/pages/applyAfterSales/components/otherReason/index.tsx new file mode 100644 index 0000000..fc580c9 --- /dev/null +++ b/src/pages/applyAfterSales/components/otherReason/index.tsx @@ -0,0 +1,37 @@ +import {Textarea, View } from "@tarojs/components"; +import { memo, useMemo, useState } from "react"; +import styles from './index.module.scss' +import classnames from "classnames"; + +//其他说明 +export default memo(() => { + const [descData, setDescData] = useState({ + number: 0, + value: '', + count: 200, + show: false + }) + const getDesc = (e) => { + let value = e.detail.value + let res = value + if(value.length > descData.count) { + res = value.slice(0, descData.count) + } + setDescData({...descData, number:res.length, value: res}) + } + + const toggleShowRealTextarea = (show) => { + setDescData({...descData, show:show}) + } + return ( + + 其他说明 + + {descData.show&&|| + toggleShowRealTextarea(true)}>{descData.value||'一般情况下选填，当退货说明=“其它问题”时，必填'} + } + {descData.number +'/'+ descData.count} + + + ) +}) diff --git a/src/pages/applyAfterSales/components/reasonPopup/index.module.scss b/src/pages/applyAfterSales/components/reasonPopup/index.module.scss new file mode 100644 index 0000000..eba26cd --- /dev/null +++ b/src/pages/applyAfterSales/components/reasonPopup/index.module.scss @@ -0,0 +1,27 @@ +.reason_return_con{ + height: 50vh; + .reason_title{ + padding: 10px 20px 0 20px; + height: 60px; + border-bottom: 1PX solid #F3F3F3; + box-sizing: border-box; + Text{ + font-size: 26px; + border-bottom: 3px solid #000; + padding: 10px; + font-weight: 400; + } + + } + .reason_scroll{ + height: calc(100% - 70px); + .reason_list{ + font-size: 26px; + padding: 30px 20px 0 20px; + color: #707070; + .reason_item{ + margin-bottom: 36px; + } + } + } +} \ No newline at end of file diff --git a/src/pages/applyAfterSales/components/reasonPopup/index.tsx b/src/pages/applyAfterSales/components/reasonPopup/index.tsx new file mode 100644 index 0000000..fc7ba76 --- /dev/null +++ b/src/pages/applyAfterSales/components/reasonPopup/index.tsx @@ -0,0 +1,44 @@ +import Popup from "@/components/popup"; +import { ScrollView, Text, View } from "@tarojs/components"; +import { memo, useMemo } from "react"; +import styles from './index.module.scss' + +type ReasonParam = 1|2|3 //1 退货原因 2 货物状况 3 退货说明 +//原因选择 +type ReasonInfoParam = { + show?: boolean, + onClose?: () => void, + status: ReasonParam +} +export default memo(({show = false, onClose, status}: ReasonInfoParam) => { + const title = useMemo(() => { + if(status == 1) return '退货原因' + if(status == 2) return '货物状况' + if(status == 3) return '退货说明' + },[status]) + return ( + + + {title} + + + 完好无损带原标签 + 完好无损带原标签 + 完好无损带原标签 + 完好无损带原标签 + 完好无损带原标签 + 完好无损带原标签 + 完好无损带原标签 + 完好无损带原标签 + 完好无损带原标签 + 完好无损带原标签 + 完好无损带原标签 + 完好无损带原标签 + 完好无损带原标签 + 完好无损带原标签 + + + + + ) +}) \ No newline at end of file diff --git a/src/pages/applyAfterSales/index.config.ts b/src/pages/applyAfterSales/index.config.ts new file mode 100644 index 0000000..a7a7e32 --- /dev/null +++ b/src/pages/applyAfterSales/index.config.ts @@ -0,0 +1,4 @@ +export default { + navigationBarTitleText: '申请售后', + enableShareAppMessage: true, +} diff --git a/src/pages/order/components/applyAfterSales/index.module.scss b/src/pages/applyAfterSales/index.module.scss similarity index 78% rename from src/pages/order/components/applyAfterSales/index.module.scss rename to src/pages/applyAfterSales/index.module.scss index 978b749..e82626c 100644 --- a/src/pages/order/components/applyAfterSales/index.module.scss +++ b/src/pages/applyAfterSales/index.module.scss @@ -10,6 +10,7 @@ width: 100%; padding: 20px; box-sizing: border-box; + border-bottom: 1PX solid #f3f3f3; text{ background-color: #F6F6F6; border-radius: 10px; @@ -22,10 +23,12 @@ } } .apply_after_sales_con{ - height: 80vh; .scroll{ height: calc(100% - 170px); } + .scroll_con{ + padding: 20px 0 150px 0; + } .returnSaleInput{ margin: 0 20px; padding-top: 30px; @@ -109,36 +112,7 @@ } } } - .other_desc{ - padding: 0 20px; - box-sizing: border-box; - .title{ - font-size: $font_size; - font-weight: 700; - } - .textarea{ - position: relative; - height: 165.4px; - .descDataNum{ - position: absolute; - right: 10px; - bottom: 10px; - font-size: 22px; - color: #ABABAB; - } - } - Textarea{ - background-color: #f3f3f3; - border: 2px solid #e6e6e6; - border-radius: 10px; - width: 100%; - font-size: 25px; - height: 165.4px; - padding: 20px 20px 30px 20px; - box-sizing: border-box; - margin-top: 20px; - } - } + } .apply_after_sales_list{ padding: 0 20px; @@ -205,22 +179,40 @@ } - .reason_return_con{ - .reason_title{ - padding: 10px 20px 0 20px; - height: 60px; - border-bottom: 1PX solid #F3F3F3; - box-sizing: border-box; - Text{ - font-size: 26px; - border-bottom: 3px solid #000; - padding: 10px; - font-weight: 400; + + .btns_con{ + width: 100%; + position: fixed; + bottom:0; + padding: 0 20px; + box-sizing: border-box; + padding-bottom: constant(safe-area-inset-bottom); + padding-bottom: env(safe-area-inset-bottom); + .btns_two{ + display: flex; + height: 82px; + // border: 1PX solid #007aff; + font-size: $font_size_big; + border-radius: 40px; + margin-bottom: 20px; + .rest_btn{ + flex:1; + border: 1PX solid #007aff; + border-radius: 40px 0 0 40px; + text-align: center; + line-height: 82px; + color: $color_main; + background-color: #fff; + + } + .verify_btn{ + flex:1; + border-radius: 0 40px 40px 0; + background: #007aff; + text-align: center; + line-height: 82px; + color: #fff; } - - } - .reason_scroll{ - } } } diff --git a/src/pages/order/components/applyAfterSales/index.tsx b/src/pages/applyAfterSales/index.tsx similarity index 55% rename from src/pages/order/components/applyAfterSales/index.tsx rename to src/pages/applyAfterSales/index.tsx index 125733f..dec0ace 100644 --- a/src/pages/order/components/applyAfterSales/index.tsx +++ b/src/pages/applyAfterSales/index.tsx @@ -1,33 +1,36 @@ import { Image, ScrollView, Text, Textarea, View } from "@tarojs/components"; -import { memo, useCallback, useState } from "react"; +import { memo, useCallback, useMemo, useState } from "react"; import classnames from "classnames"; import styles from './index.module.scss' -import Popup from "@/components/popup"; import { formatImgUrl } from "@/common/fotmat"; import Counter from "@/components/counter"; +import ReasonPopup from "./components/reasonPopup"; +import OtherReason from "./components/otherReason"; +import Taro from "@tarojs/taro"; +import uploadCDNImg from "@/common/uploadImage"; -export default memo(() => { +type ReasonParam = 1|2|3 //1 退货原因 2 货物状况 3 退货说明 +export default () => { const [showDesc, setShowDesc] = useState(true) - const [descData, setDescData] = useState({ - number: 0, - value: '', - count: 200 - }) - const getDesc = useCallback((e) => { - let value = e.detail.value - let res = value - if(value.length > descData.count) { - res = value.slice(0, descData.count) - } - setDescData({...descData, number:res.length, value: res}) - },[]) + + //退货选择弹窗 + const [showReason, setShowReason] = useState<{show:true|false, status:ReasonParam}>({show:false, status:1}) + const closeReason = useCallback(() => setShowReason({...showReason, show:false}), []) + const onShowReason = (status) => setShowReason({...showReason, status, show:true}) + + + + //底部按钮 + const onSubmit = (val) => { + + } + return ( - setShowDesc(false)} > - - 申请退货 - 2种面料，3种颜色，共6条 - + + 2种面料，3种颜色，共6条 + + @@ -77,21 +80,21 @@ export default memo(() => { 退货原因 - + onShowReason(1)}> 请选择 货物状况 - + onShowReason(2)}> 请选择 退货说明 - + onShowReason(3)}> 请选择 @@ -99,61 +102,52 @@ export default memo(() => { 拍照上传 - - - 上传照片 - - - - - - 其他说明 - - - {descData.number +'/'+ descData.count} + - - - - - setShowDesc(false)} > - - 货物状况 - - - 完好无损带原标签 - 完好无损带原标签 - 完好无损带原标签 - 完好无损带原标签 - 完好无损带原标签 - 完好无损带原标签 - 完好无损带原标签 - 完好无损带原标签 - 完好无损带原标签 - 完好无损带原标签 - 完好无损带原标签 - 完好无损带原标签 - 完好无损带原标签 - 完好无损带原标签 - - - - + + + + + + + + onSubmit(1)}>取消 + onSubmit(2)}>确认 + + + ) -}) +} //图片列表 const PictureItem = memo(() => { + + //图片 + const uploadImage = () => { + Taro.chooseImage({ + count: 1, // 默认9 + sizeType: ['original', 'compressed'], + sourceType: ['album', 'camera'], + success: function (res) { + // var tempFilePaths = res.tempFilePaths + const file = res.tempFiles[0] + console.log('res:::',res.tempFiles[0]) + // uploadCDNImg(file, 'product', 'product') + } + }) + } return ( <> - + + + + + 上传照片 ) }) - -//其他说明 diff --git a/src/pages/order/index.tsx b/src/pages/order/index.tsx index 060dc54..1367b57 100644 --- a/src/pages/order/index.tsx +++ b/src/pages/order/index.tsx @@ -16,7 +16,6 @@ import classnames from "classnames"; import { useCallback, useEffect, useMemo, useRef, useState } from "react"; import order from "../orderList/components/order"; import AddressInfoDetail from "./components/addressInfoDetail"; -import ApplyAfterSales from "./components/applyAfterSales"; import KindList from "./components/kindList"; import OrderState from "./components/orderState"; import Payment from "./components/payment"; @@ -226,7 +225,6 @@ import styles from './index.module.scss' getRemark(e)}/> - ) diff --git a/src/pages/orderList/components/order/index.tsx b/src/pages/orderList/components/order/index.tsx index 7bff925..a78b6f1 100644 --- a/src/pages/orderList/components/order/index.tsx +++ b/src/pages/orderList/components/order/index.tsx @@ -99,7 +99,6 @@ export default memo(({value, onClickBtn}: Param) => { {`${value?.total_fabrics}种面料，${value?.total_colors}种颜色，共${value?.total_number}条`} - ) }) diff --git a/src/reducers/userInfo.ts b/src/reducers/userInfo.ts index bcf3724..928c4fa 100644 --- a/src/reducers/userInfo.ts +++ b/src/reducers/userInfo.ts @@ -39,6 +39,7 @@ export type UserAdminParam = { wechat_user_open_id?: number is_authorize_name?: false|true, is_authorize_phone?: false|true, + phone?:string, } export type SortCodeParam = { diff --git a/src/use/useLogin.ts b/src/use/useLogin.ts index c06e543..400e9cc 100644 --- a/src/use/useLogin.ts +++ b/src/use/useLogin.ts @@ -8,8 +8,6 @@ import { GetShortCodeApi } from "@/api/share" export default () => { const {setUserInfo, setAdminUserInfo, setSortCode, userInfo} = useUserInfo() - console.log('userInfo:::', userInfo) - //登录请求 (调用这个就不能再useHttp中使用，当前这个hook, 否则会死循环内存溢出) // const {fetchData} = LoginApi() @@ -26,9 +24,9 @@ export default () => { //获取用户信息 const {fetchData: useFetchData} = GetAdminUserInfoApi() - const getAdminUserInfo = async () => { + const getAdminUserInfo = async (params = {}) => { let res = await useFetchData() - setAdminUserInfo(res.data) + setAdminUserInfo({...res.data, ...params}) getShortCode(res.data.user_id) } @@ -76,7 +74,7 @@ export default () => { }) if(user_res.success) { setUserInfo({...user_res.data}) - reslove(user_res.data) + getAdminUserInfo() } else { reject(user_res.msg) @@ -94,7 +92,7 @@ export default () => { //获取手机号码 const {fetchData: fetchDataUserPhone} = GetPhoneNumberApi() - const getPhoneNumber = (code) =>{ + const getPhoneNumber = (code) => { return new Promise( async (reslove, reject) => { if(userInfo.adminUserInfo?.is_authorize_phone) { reslove(true) @@ -103,7 +101,7 @@ export default () => { const res = await fetchDataUserPhone({code}) if(res.success) { setUserInfo({...userInfo.userInfo, phone:res.data.phone_number}) - getAdminUserInfo() + getAdminUserInfo({phone:res.data.phone_number}) reslove(res.data) } else { reject(res.msg)