From a3780aba0fc6f62d9fd2093373ca25d25eaba29f Mon Sep 17 00:00:00 2001 From: czm <2192718639@qq.com> Date: Mon, 23 May 2022 20:31:38 +0800 Subject: [PATCH 1/8] =?UTF-8?q?=E6=94=AF=E4=BB=98=E9=A1=B5=E9=9D=A2?= =?UTF-8?q?=E5=BC=80=E5=8F=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/checkbox/index.module.scss | 2 +- src/components/searchInput/index.tsx | 10 +- .../components/amountShow/index.module.scss | 35 +++++ .../order/components/amountShow/index.tsx | 28 ++++ .../components/estimatedAmount/index.tsx | 17 +-- .../components/offlinePay/index.module.scss | 46 +++++++ .../order/components/offlinePay/index.tsx | 52 ++++++++ .../components/orderState/index.module.scss | 2 +- .../components/payment/index.module.scss | 126 ++++++++++++++++++ src/pages/order/components/payment/index.tsx | 104 +++++++++++++++ .../components/scanPay/index.module.scss | 54 ++++++++ src/pages/order/components/scanPay/index.tsx | 38 ++++++ .../order/components/submitOrderBtn/index.tsx | 1 + src/pages/order/index.tsx | 10 +- 14 files changed, 504 insertions(+), 21 deletions(-) create mode 100644 src/pages/order/components/amountShow/index.module.scss create mode 100644 src/pages/order/components/amountShow/index.tsx create mode 100644 src/pages/order/components/offlinePay/index.module.scss create mode 100644 src/pages/order/components/offlinePay/index.tsx create mode 100644 src/pages/order/components/payment/index.module.scss create mode 100644 src/pages/order/components/payment/index.tsx create mode 100644 src/pages/order/components/scanPay/index.module.scss create mode 100644 src/pages/order/components/scanPay/index.tsx diff --git a/src/components/checkbox/index.module.scss b/src/components/checkbox/index.module.scss index 345ad92..b50f17d 100644 --- a/src/components/checkbox/index.module.scss +++ b/src/components/checkbox/index.module.scss @@ -26,6 +26,6 @@ text-align: center; line-height: 40px; .miconfont{ - font-size: 26px; + font-size: 32px; } } \ No newline at end of file diff --git a/src/components/searchInput/index.tsx b/src/components/searchInput/index.tsx index 4be58c4..48c45fc 100644 --- a/src/components/searchInput/index.tsx +++ b/src/components/searchInput/index.tsx @@ -12,6 +12,8 @@ type Params = { changeOnInput?: (string) => void, clickOnInput?: () => void, children?: ReactNode + height?: number, + titleStyle?: Object } @@ -24,7 +26,9 @@ export default memo((props: Params) => { placeholder = '请输入', showBorder = true, changeOnInput, - clickOnInput + clickOnInput, + height = 80, + titleStyle = {} } = props let stylen = useMemo(() => { @@ -34,8 +38,8 @@ export default memo((props: Params) => { return {} }, [showBorder]) return ( - - {showTitle&&{title}} + + {showTitle&&{title}} {!props.children&& clickOnInput?.()} onInput={(e) => changeOnInput?.(e.detail.value)}/> ||{props.children} diff --git a/src/pages/order/components/amountShow/index.module.scss b/src/pages/order/components/amountShow/index.module.scss new file mode 100644 index 0000000..58368a8 --- /dev/null +++ b/src/pages/order/components/amountShow/index.module.scss @@ -0,0 +1,35 @@ +.order_price_num{ + color: $color_main; + font-weight: 700; + text{ + &:nth-child(1) { + font-size: $font_size_min; + } + &:nth-child(2) { + font-size: 26px; + } + &:nth-child(3) { + font-size: $font_size_medium; + } + } +} +.emphasis_num{ + .price_text{ + &:nth-child(2) { + font-size: $font_size_big; + } + } +} +.emphasis_num_big{ + .price_text{ + &:nth-child(1) { + font-size: $font_size_big; + } + &:nth-child(2) { + font-size: 60px; + } + &:nth-child(1) { + font-size: $font_size_big; + } + } +} \ No newline at end of file diff --git a/src/pages/order/components/amountShow/index.tsx b/src/pages/order/components/amountShow/index.tsx new file mode 100644 index 0000000..877f7df --- /dev/null +++ b/src/pages/order/components/amountShow/index.tsx @@ -0,0 +1,28 @@ +import { Text, View } from "@tarojs/components"; +import { memo, useCallback } from "react"; +import styles from './index.module.scss' +import classnames from "classnames"; + +type Param = { + number: number, //数字 + status: 0|1|2 //0 小型，1中型，2大 +} +export default memo(({number = 0, status = 1}:Param) => { + const priceDom = useCallback(() => { + let res = number.toFixed(2).split('.') + let int_num = parseInt(res[0]) + '' + let decimals_num = res[1] + return ( + <> + ¥ + {Number(int_num).toLocaleString()} + .{decimals_num} + + ) + }, [number]) + return ( + + {priceDom()} + + ) +}) \ No newline at end of file diff --git a/src/pages/order/components/estimatedAmount/index.tsx b/src/pages/order/components/estimatedAmount/index.tsx index 269487e..0292f6b 100644 --- a/src/pages/order/components/estimatedAmount/index.tsx +++ b/src/pages/order/components/estimatedAmount/index.tsx @@ -3,6 +3,7 @@ import { memo, useCallback, useEffect, useMemo } from "react" import {formatKbPrice} from '@/common/common' import classnames from "classnames"; import styles from './index.module.scss' +import AmountShow from "../amountShow"; type Param = { style?: Object, number?: number, @@ -10,18 +11,6 @@ type Param = { status?: true|false, //true 加大加深 } export default memo(({style, number = 0, status = true, title = ''}:Param) => { - const priceDom = useCallback(() => { - let res = number.toFixed(2).split('.') - let int_num = parseInt(res[0]) + '' - let decimals_num = res[1] - return ( - <> - ¥ - {Number(int_num).toLocaleString()} - .{decimals_num} - - ) - }, [number]) return ( <> @@ -32,9 +21,7 @@ export default memo(({style, number = 0, status = true, title = ''}:Param) => { {/* 123123123121212312312312312 */} - - {priceDom()} - + ) diff --git a/src/pages/order/components/offlinePay/index.module.scss b/src/pages/order/components/offlinePay/index.module.scss new file mode 100644 index 0000000..f84e995 --- /dev/null +++ b/src/pages/order/components/offlinePay/index.module.scss @@ -0,0 +1,46 @@ +$top:170px; +.offlinePay_main{ + .offlinePay_con{ + padding: 20px; + background-color: #F6F6F6; + border-radius: 20px; + .miconfont_title{ + transform: rotate(-180deg); + position: absolute; + left: 20px; + top: 27px; + font-size: 37px; + color: $color_font_three; + z-index: 99; + } + } + .title{ + font-size: $font_size_big; + color: #000000; + text-align: center; + font-weight: 700; + position: relative; + + } + + .offlinePay_list{ + border-radius: 10px; + padding: 60px 0; + .offlinePay_con_text{ + font-size: $font_size; + font-weight: 700; + } + } + .btns{ + background: #007aff; + border-radius: 40px; + width: 668px; + height: 82px; + text-align: center; + line-height: 80px; + width: 100%; + color: #fff; + font-size: 32px; + margin-top: 30px; + } +} \ No newline at end of file diff --git a/src/pages/order/components/offlinePay/index.tsx b/src/pages/order/components/offlinePay/index.tsx new file mode 100644 index 0000000..4022374 --- /dev/null +++ b/src/pages/order/components/offlinePay/index.tsx @@ -0,0 +1,52 @@ +import { Text, View } from "@tarojs/components"; +import { memo } from "react"; +import AmountShow from "../amountShow"; +import classnames from "classnames"; +import styles from './index.module.scss' + +import MCheckbox from "@/components/checkbox"; +import Popup from "@/components/popup"; +import SearchInput from "@/components/searchInput"; +import Taro from "@tarojs/taro"; + +type Param = { + show?: true|false, + onClose?: () => void +} +export default memo(({show = true, onClose}:Param) => { + //复制功能 + const clipboardData = () => { + Taro.setClipboardData({ + data: '开户名称:佛山市浩川盛世科技有限公司; 开户银行:招商银行汾江支行; 转账汇款账号:62062342120001221231212', + success: function (res) { + Taro.showToast({ + icon: 'none', + title: '复制成功' + }) + } + }) + } + return ( + + + + + 线下汇款 + + + 佛山市浩川盛世科技有限公司 + + + 招商银行汾江支行 + + + 62062342120001221231212 + + + 复制信息 + + + + + ) +}) \ No newline at end of file diff --git a/src/pages/order/components/orderState/index.module.scss b/src/pages/order/components/orderState/index.module.scss index 9101c29..195c10d 100644 --- a/src/pages/order/components/orderState/index.module.scss +++ b/src/pages/order/components/orderState/index.module.scss @@ -35,7 +35,7 @@ border-left: 2px solid $color_main; height: 100%; top: 10px; - left: 8px; + left: 9px; position: absolute; z-index: 1; } diff --git a/src/pages/order/components/payment/index.module.scss b/src/pages/order/components/payment/index.module.scss new file mode 100644 index 0000000..340b0ed --- /dev/null +++ b/src/pages/order/components/payment/index.module.scss @@ -0,0 +1,126 @@ +$top:190px; +.payment_main{ + .payment_con{ + padding: 20px; + background-color: #F6F6F6; + border-radius: 20px; + .miconfont_title{ + transform: rotate(-180deg); + position: absolute; + left: 20px; + top: 27px; + font-size: 37px; + color: $color_font_three; + z-index: 99; + } + + } + .title{ + font-size: $font_size_big; + color: #000000; + text-align: center; + font-weight: 700; + position: relative; + + } + .amount{ + text-align: center; + padding: 25px 0; + } + + .payment_list{ + background-color: #fff; + // box-shadow: 2px 2px 6px 0px rgba(0,0,0,0.16); + min-height: 300px; + border-radius: 10px; + padding-bottom: 100px; + position: relative; + background: radial-gradient(circle 20px at left $top, transparent 20px, #fff 20px + 3px) left 0px/60% no-repeat , + radial-gradient(circle 20px at right $top, transparent 20px, #fff 20px + 3px) right 0px/60% no-repeat; + filter: drop-shadow(2px 2px 6px rgba(0, 0, 0, .16)); + position: relative; + &::before{ + content: ''; + position: absolute; + border-bottom: 3px dashed #ccc; + top: $top; + width: calc(100% - 100px); + left:0; + right: 0; + margin: auto; + + } + .payment_list_top_border{ + height: 32px; + width: 100%; + background: linear-gradient(215deg,#cde5ff 2%, #cde5ff 2%, #68b4ff 72%); + border-radius: 10px 10px 0px 0px; + } + .payment_list_title{ + text-align: center; + padding: 30px 0 50px 0; + font-size: $font_size; + color: $color_font_three; + .payment_list_title_price_item{ + display: flex; + justify-content: space-between; + padding: 0 90px; + &:nth-child(1) { + margin-bottom: 15px; + } + } + text{ + &:nth-child(2) { + color: $color_main; + } + } + } + .payment_list_con{ + padding: 20px 30px 0 30px; + .payment_list_item{ + display: flex; + justify-content: space-between; + align-items: center; + height: 123px; + &:nth-last-child(n+2) { + border-bottom: 2px solid #F3F3F3; + } + } + .payment_list_item_left{ + display: flex; + flex-direction: column; + font-size: $font_size; + .payment_list_item_left_name{ + display: flex; + align-items: center; + } + .miconfont{ + font-size: 30px; + color: #FFC300; + padding-right: 10px; + } + .payment_list_item_left_price{ + font-size: $font_size_min; + color: $color_font_two; + padding-left: 35px; + padding-top: 5px; + } + } + .miconfont_more{ + font-size: 20px; + } + } + } + .btns{ + background: #007aff; + border-radius: 40px; + width: 668px; + height: 82px; + text-align: center; + line-height: 80px; + width: 100%; + color: #fff; + font-size: 32px; + margin-top: 30px; + } +} \ No newline at end of file diff --git a/src/pages/order/components/payment/index.tsx b/src/pages/order/components/payment/index.tsx new file mode 100644 index 0000000..4e6e223 --- /dev/null +++ b/src/pages/order/components/payment/index.tsx @@ -0,0 +1,104 @@ +import { Text, View } from "@tarojs/components"; +import { memo, useState } from "react"; +import AmountShow from "../amountShow"; +import classnames from "classnames"; +import styles from './index.module.scss' + +import MCheckbox from "@/components/checkbox"; +import Popup from "@/components/popup"; +import OfflinePay from "../offlinePay"; +import ScanPay from "../scanPay"; + +type Param = { + show?: true|false, + onClose?: () => void +} +export default memo(({show = false, onClose}:Param) => { + + //线下付款 + const [offlinePayShow, setofflinePayShow] = useState(false) + const onShowOfflinePay = () => { + setofflinePayShow(true) + onClose?.() + } + + //扫码支付 + const [scanPayShow, setScanPayShow] = useState(false) + const onShowScanPay = () => { + setScanPayShow(true) + onClose?.() + } + return ( + + + + + 订单支付 + + + + + + + {/* 向商家发起支付 */} + + + 订单金额 + ¥6,001.00 + + + 已付金额 + ¥1,801.00 + + + + + + + + + 预存款 + + 金额不足，剩余 ¥0.00 + + console.log()} onClose={() =>console.log()}/> + + + + + + x天账期 + + 可用额度 ¥3,000.00 + + console.log()} onClose={() =>console.log()}/> + + + + + + 线下汇款 + + + + + + + + + 扫码支付 + + + + + + + 确认交易 + + + setofflinePayShow(false)}/> + setScanPayShow(false)}/> + + + ) +}) \ No newline at end of file diff --git a/src/pages/order/components/scanPay/index.module.scss b/src/pages/order/components/scanPay/index.module.scss new file mode 100644 index 0000000..dcb356d --- /dev/null +++ b/src/pages/order/components/scanPay/index.module.scss @@ -0,0 +1,54 @@ +$top:170px; +.scanPay_main{ + .scanPay_con{ + padding: 20px; + background-color: #F6F6F6; + border-radius: 20px; + .miconfont_title{ + transform: rotate(-180deg); + position: absolute; + left: 20px; + top: 27px; + font-size: 37px; + color: $color_font_three; + z-index: 99; + + } + } + .title{ + font-size: $font_size_big; + color: #000000; + text-align: center; + font-weight: 700; + position: relative; + } + .desc{ + font-size: $font_size_min; + color: $color_main; + text-align: center; + padding: 10px 0; + .miconfont{ + font-size: 25px; + } + } + + .scanPay_list{ + border-radius: 10px; + height: 900px; + image{ + width: 100%; + } + } + .btns{ + background: #007aff; + border-radius: 40px; + width: 668px; + height: 82px; + text-align: center; + line-height: 80px; + width: 100%; + color: #fff; + font-size: 32px; + margin-top: 30px; + } +} \ No newline at end of file diff --git a/src/pages/order/components/scanPay/index.tsx b/src/pages/order/components/scanPay/index.tsx new file mode 100644 index 0000000..cd55c85 --- /dev/null +++ b/src/pages/order/components/scanPay/index.tsx @@ -0,0 +1,38 @@ +import { Image, ScrollView, Text, View } from "@tarojs/components"; +import { memo } from "react"; +import AmountShow from "../amountShow"; +import classnames from "classnames"; +import styles from './index.module.scss' + +import MCheckbox from "@/components/checkbox"; +import Popup from "@/components/popup"; +import SearchInput from "@/components/searchInput"; +import Taro from "@tarojs/taro"; +import { formatImgUrl } from "@/common/fotmat"; + +type Param = { + show?: true|false, + onClose?: () => void +} +export default memo(({show = true, onClose}:Param) => { + //复制功能 + return ( + + + + + 扫码支付 + + + 扫码支付成功后，自动更新状态 + + + + + {}}>保存电子确认单 + + + + + ) +}) \ No newline at end of file diff --git a/src/pages/order/components/submitOrderBtn/index.tsx b/src/pages/order/components/submitOrderBtn/index.tsx index 770d805..db9b432 100644 --- a/src/pages/order/components/submitOrderBtn/index.tsx +++ b/src/pages/order/components/submitOrderBtn/index.tsx @@ -33,6 +33,7 @@ export default memo(({style, number = 0}:Param) => { {priceDom()} + ) diff --git a/src/pages/order/index.tsx b/src/pages/order/index.tsx index 600443e..5a3f8d5 100644 --- a/src/pages/order/index.tsx +++ b/src/pages/order/index.tsx @@ -11,6 +11,7 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react"; import AddressInfo from "./components/addressInfo"; import KindList from "./components/kindList"; import OrderState from "./components/orderState"; +import Payment from "./components/payment"; import Remark from "./components/remark"; import WeightMemo from "./components/weightMemo"; import styles from './index.module.scss' @@ -135,6 +136,12 @@ import styles from './index.module.scss' ) goLink('/pages/editOrder/index') } + + //去付款 + const [payMentShow, setPayMentShow] = useState(false) + const toPay = () => { + setPayMentShow(true) + } return ( @@ -172,11 +179,12 @@ import styles from './index.module.scss' 申请退货 查看物流 确认收货 - 再次购买 + toPay()}>去支付 setShowDesc(false)} > getRemark(e)}/> + setPayMentShow(false)}/> ) From bbe59568133b5222ffa67347f1b9ece97f42dc04 Mon Sep 17 00:00:00 2001 From: czm <2192718639@qq.com> Date: Tue, 24 May 2022 20:32:20 +0800 Subject: [PATCH 2/8] =?UTF-8?q?=E6=94=AF=E4=BB=98=E9=A1=B5=E9=9D=A2?= =?UTF-8?q?=E5=BC=80=E5=8F=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/onlinePay.ts | 12 ++ src/api/order.ts | 4 +- src/common/constant.js | 3 +- src/components/searchInput/index.tsx | 2 +- .../addressInfoDetail/index.module.scss | 111 ++++++++++++++++++ .../components/addressInfoDetail/index.tsx | 87 ++++++++++++++ src/pages/order/components/kindList/index.tsx | 28 ++--- .../components/orderState/index.module.scss | 3 +- .../order/components/orderState/index.tsx | 49 ++++---- src/pages/order/components/payment/index.tsx | 2 +- src/pages/order/components/scanPay/index.tsx | 88 ++++++++++++-- src/pages/order/index.tsx | 73 ++++-------- src/styles/iconfont.scss | 22 +++- src/styles/iconfont.ttf | Bin 10856 -> 12196 bytes src/use/useCheckAuthorize.tsx | 51 ++++++++ src/use/useHttp.ts | 8 +- 16 files changed, 430 insertions(+), 113 deletions(-) create mode 100644 src/api/onlinePay.ts create mode 100644 src/pages/order/components/addressInfoDetail/index.module.scss create mode 100644 src/pages/order/components/addressInfoDetail/index.tsx create mode 100644 src/use/useCheckAuthorize.tsx diff --git a/src/api/onlinePay.ts b/src/api/onlinePay.ts new file mode 100644 index 0000000..3c23414 --- /dev/null +++ b/src/api/onlinePay.ts @@ -0,0 +1,12 @@ +import { useRequest } from "@/use/useHttp" + +/** + * 获取在线支付二维码 + */ + export const GetPayCode = () => { + return useRequest({ + url: `/`, + base_url: 'http://192.168.1.127:8081', + method: "post", + }) +} \ No newline at end of file diff --git a/src/api/order.ts b/src/api/order.ts index 10318d3..a1eb29f 100644 --- a/src/api/order.ts +++ b/src/api/order.ts @@ -21,11 +21,11 @@ export const SaleOrderApi = () => { } /** - * 获取销售单详情 + * 获取商城待配布订单详情 */ export const GetSaleOrderDetailApi = () => { return useRequest({ - url: `/v1/mall/saleOrder`, + url: `/v1/mall/saleOrder/arranging`, method: "get", }) } diff --git a/src/common/constant.js b/src/common/constant.js index 734263a..f62112f 100644 --- a/src/common/constant.js +++ b/src/common/constant.js @@ -8,8 +8,9 @@ // export const BASE_URL = `http://192.168.1.30:40001/lymarket` // 发 // export const BASE_URL = `https://dev.zzfzyc.com/lymarket` // 开发环境 // export const BASE_URL = `https://www.zzfzyc.com/lymarket` // 正式环境 -export const BASE_URL = `http://192.168.1.4:40001/lymarket` // 王霞 +// export const BASE_URL = `http://192.168.1.4:40001/lymarket` // 王霞 // export const BASE_URL = `http://192.168.1.224:50002/lymarket` // 添 +export const BASE_URL = `http://192.168.1.15:50001/lymarket` // 杰 // CDN // 生成密钥 diff --git a/src/components/searchInput/index.tsx b/src/components/searchInput/index.tsx index 48c45fc..4fe82cd 100644 --- a/src/components/searchInput/index.tsx +++ b/src/components/searchInput/index.tsx @@ -38,7 +38,7 @@ export default memo((props: Params) => { return {} }, [showBorder]) return ( - + {showTitle&&{title}} {!props.children&& clickOnInput?.()} onInput={(e) => changeOnInput?.(e.detail.value)}/> diff --git a/src/pages/order/components/addressInfoDetail/index.module.scss b/src/pages/order/components/addressInfoDetail/index.module.scss new file mode 100644 index 0000000..b4a9f1b --- /dev/null +++ b/src/pages/order/components/addressInfoDetail/index.module.scss @@ -0,0 +1,111 @@ +.order_address{ + height: 178px; + background: #ffffff; + border-radius: 20px; + display: flex; + align-items: center; + padding: 30px; + box-sizing: border-box; + margin-top: 20px; + position: relative; + .order_address_icon{ + font-size: 50px; + color: $color_main; + position: absolute; + top: 35px; + left: 20px; + } + .order_address_text_con{ + flex:1; + padding-left: 50px; + box-sizing: border-box; + height: 100%; + display: flex; + flex-direction: column; + justify-content: space-between; + .order_address_text_title{ + font-size: $font_size_medium; + margin-top: 10px; + @include common_ellipsis; + display: flex; + align-items: center; + justify-content: space-between; + .moreIconfont{ + font-size: 20px; + } + } + .order_address_text_name{ + + align-items: center; + text{ + &:nth-child(1) { + color: #000; + font-weight: 700; + font-size: $color_font_one; + margin-right: 40px; + } + &:nth-child(2) { + color: $color_font_one; + font-size: $font_size_medium; + } + } + } + } + .updateBtn{ + width:200px; + font-size: $font_size_min; + background-color: #F0F0F0; + height: 64px; + border-radius: 24px; + color: $color_font_two; + position: absolute; + bottom: 10px; + right: 10px; + .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: 24px; + position: absolute; + width: 100px; + height: 61px; + z-index: 1; + transition: all 0.3s ease-in-out; + } + + } + .order_address_text_no{ + flex: 1; + font-size: $font_size; + font-weight: 700; + margin-left: 30px; + } + .order_address_more_icon{ + color: $color_font_three; + font-size: $font_size; + } + +} +.order_address_list { + height: 900px; + .order_address_title{ + font-size: $font_size; + font-weight: 700; + width: 100%; + text-align: center; + padding: 20px 0 30px 0; + } +} \ No newline at end of file diff --git a/src/pages/order/components/addressInfoDetail/index.tsx b/src/pages/order/components/addressInfoDetail/index.tsx new file mode 100644 index 0000000..4675aec --- /dev/null +++ b/src/pages/order/components/addressInfoDetail/index.tsx @@ -0,0 +1,87 @@ +import AddressList from "@/components/AddressList"; +import Popup from "@/components/popup"; +import { Text, View } from "@tarojs/components" +import classnames from "classnames"; +import { memo, useCallback, useEffect, useMemo, useState } from "react"; +import styles from './index.module.scss' + +export type AddressInfoParam = { + province_name: string, + city_name: string, + district_name: string, + address_detail: string, + id?: number, + name: string, + phone: string +} +type Param = { + onSelect?: (val:any) => void, //选择 + defaultValue?: AddressInfoParam|null //默认值 + disabled?: false|true //true禁用后只用于展示 + shipment_mode?: 1|2 //1自提 2物流 +} + +export default memo(({onSelect, defaultValue = null, disabled = false, shipment_mode = 1}: Param) => { + const [showAddressList, setShowAddressList] = useState(false) + + useEffect(() => { + setUserInfo(() => defaultValue) + }, [defaultValue]) + + //选择地址 + const [userInfo, setUserInfo] = useState() + const getAddress = useCallback((val) => { + setShowAddressList(() => false) + setUserInfo(() => val) + onSelect?.(val) + }, []) + + //地址格式 + const formatAddress = useMemo(() => { + if(userInfo) + return userInfo.province_name + userInfo.city_name + userInfo.district_name + userInfo.address_detail + }, [userInfo]) + + const changeShow = () => { + if(receivingStatus == 2) + setShowAddressList(() => true) + } + //收货方法,1:自提，2物流 + const [receivingStatus, setReceivingStatus] = useState(1) + const onReceivingStatus = (val) => { + setReceivingStatus(val) + } + useEffect(() => { + setReceivingStatus(() => shipment_mode) + }, [shipment_mode]) + return ( + + changeShow()}> + + + + {formatAddress} + {(receivingStatus == 2)&&} + + + {userInfo?.name} + {userInfo?.phone} + + + + + onReceivingStatus(1)}>自提 + onReceivingStatus(2)}>物流 + + + + + {!disabled&& setShowAddressList(false)}> + + 请选择收货地址 + getAddress(item)}/> + + } + + ) +}) \ No newline at end of file diff --git a/src/pages/order/components/kindList/index.tsx b/src/pages/order/components/kindList/index.tsx index 1a42f7e..34d9542 100644 --- a/src/pages/order/components/kindList/index.tsx +++ b/src/pages/order/components/kindList/index.tsx @@ -6,13 +6,13 @@ import styles from './index.module.scss' type OrderParam = { estimate_amount: number, - estimate_weight: number, list: any[], sale_mode: number, - sale_mode_name: string + sale_mode_name: string, unit: string, - colo_count: number, - num_count: number + total_colors: number, + total_fabrics: number, + total_number: number } @@ -22,14 +22,14 @@ export default memo(({value}:{value:OrderParam|null}) => { return value?.sale_mode == 0? item.roll : Number(item.length / 100) }, [value]) //对应单价 - const standardPrice = useCallback(item => { - return formatPriceDiv(item.standard_price).toLocaleString() + '/' + (value?.sale_mode == 1?'m':'kg') + const standardPrice = useCallback(price => { + return formatPriceDiv(price).toLocaleString() + '/' + (value?.sale_mode == 1?'m':'kg') }, [value]) //数量格式 const numText = useMemo(() => { if(value) - return `${value?.list.length}种面料，${value?.colo_count}种颜色，共${value?.num_count }${value?.unit}` + return `${value?.total_fabrics}种面料，${value?.total_colors}种颜色，共${value?.total_number}${value?.unit}` }, [value]) return ( <> @@ -39,18 +39,18 @@ export default memo(({value}:{value:OrderParam|null}) => { value?.list.map(item => { return - {item.sale_mode_name} - {formatHashTag(item.product_code, item.product_name)} - 共{item.color_list.length}种 + {value.sale_mode_name} + {formatHashTag(item.code, item.name)} + 共{item?.product_colors.length}种 - {item.color_list?.map(colorItem => { - return + {item?.product_colors?.map(colorItem => { + return - {colorItem.product_color_code + ' ' + colorItem.product_color_name} - ¥{standardPrice(colorItem)} + {colorItem.code + ' ' + colorItem.name} + ¥{standardPrice(colorItem.sale_price)} ×{formatCount(colorItem)}{value.unit} diff --git a/src/pages/order/components/orderState/index.module.scss b/src/pages/order/components/orderState/index.module.scss index 195c10d..c1aef8a 100644 --- a/src/pages/order/components/orderState/index.module.scss +++ b/src/pages/order/components/orderState/index.module.scss @@ -16,7 +16,6 @@ .order_status_item{ position: relative; padding-left: 50px; - min-height: 120px; .order_status_tail_end, .order_status_tail{ width: 15px; height: 15px; @@ -44,7 +43,7 @@ align-items: center; .order_status_title{ color: $color_font_two; - font-size: $font_size_big; + font-size: $font_size; font-weight: 700; } .order_status_time{ diff --git a/src/pages/order/components/orderState/index.tsx b/src/pages/order/components/orderState/index.tsx index 7592c74..a3b51bb 100644 --- a/src/pages/order/components/orderState/index.tsx +++ b/src/pages/order/components/orderState/index.tsx @@ -4,7 +4,7 @@ import styles from './index.module.scss' import classnames from "classnames"; import { formatImgUrl } from "@/common/fotmat"; type Param = { - title: string, + status: string, time: string, tag: string, desc: string @@ -14,33 +14,30 @@ export default memo(({list = []}:{list?:Param[]}) => { const changeMore = () => { setShowMore(() => !showMore) } - list = [ - {title:'待配布', time:'2022-04-24 09:08', tag:'已接单', desc:'仓库正在为你配布...'}, - {title:'待配布', time:'2022-04-24 09:08', tag:'已接单', desc:'仓库正在为你配布...'}, - {title:'待接单', time:'2022-04-24 09:08', tag:'已提交', desc:''}, - ] return ( - - - {list.map((item, index) => - {(list.length > 1)&&} - {(list.length != (index + 1))&&} - - {item.title} - {item.time} - {item.tag} - - {item.desc} - )} - - {(list.length > 2) && changeMore()}> - {showMore&&'收起物流详情'||'点击查看更多物流详情'} - + <> + {(list.length > 0)&& + + {list.map((item, index) => + {(list.length > 1)&&} + {(list.length != (index + 1))&&} + + {item.status} + {item.time} + {item.tag} + + {item.desc} + )} + + {(list.length > 2) && changeMore()}> + {showMore&&'收起详情'||'点击查看详情'} + + } + + + } - - - - + ) }) \ No newline at end of file diff --git a/src/pages/order/components/payment/index.tsx b/src/pages/order/components/payment/index.tsx index 4e6e223..65e5c71 100644 --- a/src/pages/order/components/payment/index.tsx +++ b/src/pages/order/components/payment/index.tsx @@ -82,7 +82,7 @@ export default memo(({show = false, onClose}:Param) => { - + diff --git a/src/pages/order/components/scanPay/index.tsx b/src/pages/order/components/scanPay/index.tsx index cd55c85..8467da4 100644 --- a/src/pages/order/components/scanPay/index.tsx +++ b/src/pages/order/components/scanPay/index.tsx @@ -1,24 +1,96 @@ import { Image, ScrollView, Text, View } from "@tarojs/components"; -import { memo } from "react"; -import AmountShow from "../amountShow"; +import { memo, useEffect } from "react"; import classnames from "classnames"; import styles from './index.module.scss' - -import MCheckbox from "@/components/checkbox"; import Popup from "@/components/popup"; -import SearchInput from "@/components/searchInput"; import Taro from "@tarojs/taro"; +import { alert } from "@/common/common"; import { formatImgUrl } from "@/common/fotmat"; +import useCheckAuthorize from "@/use/useCheckAuthorize"; +import { GetPayCode } from "@/api/onlinePay"; + type Param = { show?: true|false, onClose?: () => void } export default memo(({show = true, onClose}:Param) => { + const base64 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAZAAAAGQAQMAAAC6caSPAAAABlBMVEX///8AAABVwtN+AAACFElEQVR42uyaMbKzMAyExVC8kiNwFI5GjsZRcgRKCgb9I69sY+Ik7R+8O/OKF/N1Gnklr1AURVEURf2sBnUd+P9PZdxFpFddRaZ4uhEhAiR+euBznM2q+hCRacXpROSuiJ0vjphG1YfVkRXM2lm5ECFSR/QpYn+hw+hBhMgnRCScCxA0JSJE3t1i4XdrTPa5e5gvFx+R9pBseqdN9AnTO6+9Pobjq08m8ttIKUP02ZdT0GcRaQuxDhOKyWvMTK/VmMi8droMBxEiNUw6Xawhaagxm5LipGRe+KUpEWkVifMz2hDOXcHwHqV/IdI6IvH3U41JaEqhV6HGLhiRuyBhRj7yyIMrKXnhNYw7L0t7Is0i0mF7snW5w+xp17/4w8+1wxBpF4G79ZEIhbWn2yqY3ortIdIu0mHhYrcYxuqwhRvwkhi88HULR6R5xBd3mmwPmlIaqdGciBBJyKmQjEeNddH2VGuMyO8jeaGCeyfnlAzxLVwlp0SkUeTsbv0dedxlNh8TN7qVRyEizSJlFg4exn7Oo/Xy9zEJSaQt5KS0hzmnaWuml0jDSJm1LqakwbNw28X0ErkPUuaUxg0F40mV+FooRIjUs9Y4n31S8ljTS40RIYLgW1yoxAQkPMzbtC2RlpF0i0mekrwpESFSn5IUq9vYkJba2pbIfZBT1trfkUNSpc/BNiJEKIqiKIqi/gv9CwAA//9IKiY1VjApygAAAABJRU5ErkJggg==' + + + + const {check} = useCheckAuthorize({scope:'scope.writePhotosAlbum', msg:'您没授权，无法保存图片'}) + const saveImageCheck = async () => { + const res = await check() + res&&saveImage() + } + //保存图片 + const saveImage = () => { + const save = Taro.getFileSystemManager() + const number = Math.random(); + const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(base64) || []; + let filePath = Taro.env.USER_DATA_PATH +'/pic.'+ format + alert.loading('正在保存图片') + save.writeFile({ + filePath: filePath, + data: base64, + encoding: 'base64', + success: function (res) { + console.log('aa::',res) + console.log('aa2::',filePath) + Taro.saveImageToPhotosAlbum({ + filePath: filePath, + success: function (res) { + alert.success('图片保存成功') + }, + fail: function (err) { + console.log('err::', err) + } + }) + } + }) + } + //预览图片 + const showImage = () => { + Taro.previewImage({ + current: formatImgUrl(''), // 当前显示图片的http链接 + urls: [formatImgUrl('')] // 需要预览的图片http链接列表 + }) + } + + // const {fetchData} = GetPayCode() + // useEffect(() => { + // fetchData({ + // title: "面料销售电子确认单", + // company: "什么什么公司123", + // order_type: "散剪", + // sale_user: "小崔", + // order_created_time:"2022/02/01 12:32:13", + // order_no:"XS-211005888", + // department:"嘻嘻嘻", + // shipment_mode:"自提", + // target_user_name:"大崔", + // target_address:"阿斯顿发斯蒂芬", + // target_description:"无", + // pay_account:"1234567890123450001", + // bank_account_name:"佛山市浩川长盛科技有限公司", + // bank_name:"招商银行佛山分行禅城支行", + // pay_type:"现结", + // client:"客户名称", + // phone:"15818085802", + // order_total_length:"12", + // order_total_price:"23000", + // qrcode:"www.zzfzyc.com/checkorder/XS-211005888", + // order_total_weight:"300.00", + // list: [{product_code:'5215',product_name:'26S双纱亲水滑爽棉',product_color_code:'053',product_color_name:'洋红',num:'4',weight:'123.23',sale_price:'43',total_price:'4510.7'}] + // }) + // }, []) + + //复制功能 return ( - + 扫码支付 @@ -27,9 +99,9 @@ export default memo(({show = true, onClose}:Param) => { 扫码支付成功后，自动更新状态 - + - {}}>保存电子确认单 + 保存电子确认单 diff --git a/src/pages/order/index.tsx b/src/pages/order/index.tsx index 5a3f8d5..47259cd 100644 --- a/src/pages/order/index.tsx +++ b/src/pages/order/index.tsx @@ -9,6 +9,7 @@ import Taro, { useDidShow, useRouter } from "@tarojs/taro"; import classnames from "classnames"; import { useCallback, useEffect, useMemo, useRef, useState } from "react"; import AddressInfo from "./components/addressInfo"; +import AddressInfoDetail from "./components/addressInfoDetail"; import KindList from "./components/kindList"; import OrderState from "./components/orderState"; import Payment from "./components/payment"; @@ -46,36 +47,19 @@ import styles from './index.module.scss' //格式化数据格式 const [formatDetailOrder, setFormatDetailOrder] = useState() //格式化后的数据 const formatData = () => { - if(orderDetail?.color_list&&orderDetail?.color_list.length > 0) { - let dataList = {} - let num_count = 0 //总数量 - orderDetail?.color_list.map(item => { - dataList[item.product_code] = dataList[item.product_code]||{} - dataList[item.product_code].product_code = item.product_code - dataList[item.product_code].product_name = item.product_name - dataList[item.product_code].sale_mode_name = orderDetail.sale_mode_name - dataList[item.product_code].color_list = dataList[item.product_code]?.color_list||[] - dataList[item.product_code].color_list.push(item) - //大货 - if (orderDetail.sale_mode == 0) num_count += item.roll - //剪板或散件 - if (orderDetail.sale_mode == 1 || orderDetail.sale_mode == 2) num_count += item.length - }) - if (orderDetail.sale_mode == 1 || orderDetail.sale_mode == 2) num_count = Number(num_count / 100); - setFormatDetailOrder({ - estimate_amount: orderDetail.estimate_amount, //预估金额 - estimate_weight: orderDetail.estimate_weight, - sale_mode: orderDetail.sale_mode, - sale_mode_name: orderDetail.sale_mode_name, - colo_count: orderDetail.color_list.length, //颜色数量 - num_count: num_count, //总数量 - unit: orderDetail.sale_mode == 0?'条':'m', //单位 - list: Object.values(dataList) - }) - } + setFormatDetailOrder({ + estimate_amount: orderDetail.estimate_amount, //预估金额 + sale_mode: orderDetail.sale_mode, + sale_mode_name: orderDetail.sale_mode_name, + total_colors: orderDetail.total_colors, //总颜色数量 + total_number: orderDetail.total_number, //总数量 + total_fabrics: orderDetail.total_fabrics, //面料数量 + unit: orderDetail.sale_mode == 0?'条':'m', //单位 + list: orderDetail.product_list + }) } - const formatPreViewOrderMemo = useMemo(() => { + console.log('formatDetailOrder::',formatDetailOrder) return formatDetailOrder }, [formatDetailOrder]) @@ -120,23 +104,6 @@ import styles from './index.module.scss' setShowDesc(() => false) }, []) - //修改地址 - const changeAddress = () => { - //临时传递数据 - setParam({ - province_name: orderDetail?.province_name, - city_name: orderDetail?.city_name, - district_name: orderDetail?.district_name, - address_detail: orderDetail?.address_detail, - id: orderId.current, - name: orderDetail?.target_user_name, - phone: orderDetail?.target_user_phone, - shipment_mode: orderDetail?.shipment_mode, - } - ) - goLink('/pages/editOrder/index') - } - //去付款 const [payMentShow, setPayMentShow] = useState(false) const toPay = () => { @@ -144,26 +111,26 @@ import styles from './index.module.scss' } return ( - + {/* - - - changeAddress()}> - + */} + + + 订单信息 - + {orderDetail?.order_no} clipboardData()}>复制 - + {formatDateTime(orderDetail?.create_time)} - + {formatDateTime(orderDetail?.create_time)} diff --git a/src/styles/iconfont.scss b/src/styles/iconfont.scss index 246e5e5..291d27f 100644 --- a/src/styles/iconfont.scss +++ b/src/styles/iconfont.scss @@ -1,6 +1,6 @@ @font-face { font-family: "iconfont"; /* Project id 2987621 */ - src: url('iconfont.ttf?t=1652868058352') format('truetype'); + src: url('iconfont.ttf?t=1653384789393') format('truetype'); } .iconfont { @@ -11,6 +11,26 @@ -moz-osx-font-smoothing: grayscale; } +.icon-yucunkuan:before { + content: "\e66c"; +} + +.icon-xianxiahuikuan:before { + content: "\e669"; +} + +.icon-xtianzhangqi:before { + content: "\e66a"; +} + +.icon-saomazhifu:before { + content: "\e66b"; +} + +.icon-fahuo:before { + content: "\e66d"; +} + .icon-zhuyi:before { content: "\e668"; } diff --git a/src/styles/iconfont.ttf b/src/styles/iconfont.ttf index 7167c2af488d962281b74576a2c8465a58eaa670..65bed9ce356493a9a3134d4706a948a357404b39 100644 GIT binary patch delta 2211 zcmZWpU2GIp6h3#hJ2N}mooV;4P+;5c!fvg`4^Ir_zrS#G8tYTAb7T3bBdm*l!2B}Uwd47* zp^6VXz94FB!8;2_CXRZJ4Oad;OVo4@4%b_kB3*G}hy|)EJY5H@jyvQogM;YTxm`am zJr@@j?K0+g1-4F#@Zu8d;`1R^!DfogKeJZJH_nxuM4ywRG)mxUAaah%=w*cKayj3| z$7a4#R%Ca;w~UrkHLakPw2DGhL$y>#0SZ%uf>cGTX$?imq;j&Tf-1>NKJt@?+}Kwq z7ipv-AqVzn|DswR%65J3IJ z_eg*V;(H~)3Grtozz*?!65xsWb7YGffimKK5+INGehJV>{D1@qCEhOqYKiA1Kr-=z z5}=#-fCPvqJ}4oigZQunxoivy5>SZvhy=7EJ}M#Fh(9j@{fHlufRe-yONbug zV-ir8Zb2FW=uEdDjewB2boJ9U*1|3-+mz27c7x-mvWw1I=Yo1c+oa9u+x72UEv_kJ z%J{_{a=%%=rTksbO3$li(A;jmXr3{zS%cP>*3F7g#X_a-^?Os^oa}SQka7bYZAKG^ zO~oHllATIA6^q8AzGTp^HnKq5y{BIdN7u7RIGW0=vsqdWSPW*ehP7u9Wif?qJvo@k z44yoFYM{Nfxp!xoVOd5`wYXPXeoGE|4AV3kJ2cC$XLGvW(mIqInZZ-1r-#JSt@-SZ z=GNjBgs04anG$PD131Ql8%x)bpbXy`Spkj)tta#;s|&AXnJy+XDrK)pPbuZL zx@3r{7E{|D$*N#g(66bQ8Wsg-+Qsi77L>P(*IgBQnHJLmrslfiHqB1WV>=yA*FPdN zR%^)Fs@JmJo8!1PcYlOI0~4d{Lv*n7Zm&;`=~h6~QO-Htw45#!DZOp%rKRQf_lYMT zW=7O(qlrqD{{ihHl%@>Pn($gB)u|*yN}yDeLo?Yb=C2AS+cWD~DjL(m&Fp__sj)}& z+W%T$`8(yI^7GaHH#|m@W(KryRts2q-c`M_ec+x(({^`%wzs)eX>Cv=fyupnn%1{> zG7wR38%;u?x*V$0`;De0iJnw06$VwfCDd80T zCPGVAP%fy8gl*A;EGg=eQ>qWkQyGYhroC!diBLhPQ!q?R*<)Cy8za*w)FiB8q7X`e zdsv8IXXJ$2ge&2@`<_^(9K>BAELw_$>S6~G6DqjPqMa!{mz;9DQcx(tT4CZZ6v9UX zGTF+X_(rZl{f~ix9&ms&&%!Yl4QmXiD%Fl=tzsc&GSqgT8c~0&EgkVa>a!!xN1c%> zaFDJPj07tEL2!||Z>f$Uw^saG^XuYfX>3EVGr%^e4%JiKx5wl2dBiQ7N^N=2V3oVY z)Na%3&85@R#o?MpG%K2Z|9MFUD`;$^rWF^&S!Rz1gT-%D%hbhgUa#0PnJQkv2Blp* zzSi{cgT{}E5F{S8ha!|McL%H+SaDxpU6>&y+{L50v&6UwnJl z0XR1R&rmjhZPJ~;eH!qmfMjECA~T*Wq!$6y$i5s6fv=u2*GnXon<~tfocdqD{NTQn zpB~GUm*+nNzE9luPGx3iOb1qY-o$z}}`hjd!G zyVQ0d1w&s_eNtNTOq`E>aWr(xw-dFbKfD_HlPt3u?d^ege^#*8Cwy@Hndi zD$E0NRAEMtK83kKjw#F%a$I4)kP`|shZIk8A}j*Zudp1*DTReW1{9VEVdpI@7BZ-? zY{(gf0zl3xlmc>2p(qgc#zJ`@7nCBEf($8Edl^=!9^|58HIfm9ib6&eY75CIR2gzf zq27=&g~~(574`r!p|Bf}Nfhk_HU^Sa>|2qXVjsmS<+ZSFSf#uc+a``t)XXhs-1+D! zcn7_|eL275zwVbnd$2utCs=LhYWNfC4}A!ChTle^>3!9=^- diff --git a/src/use/useCheckAuthorize.tsx b/src/use/useCheckAuthorize.tsx new file mode 100644 index 0000000..05ae81f --- /dev/null +++ b/src/use/useCheckAuthorize.tsx @@ -0,0 +1,51 @@ +import { alert } from "@/common/common"; +import Taro from "@tarojs/taro"; +import { memo, useCallback, useState } from "react"; + +type Scope = 'scope.userLocation'|'scope.userLocation'|'scope.record'|'scope.camera'|'scope.bluetooth'|'scope.writePhotosAlbum'|'scope.addPhoneContact'|'scope.addPhoneCalendar'|'scope.werun'|'scope.address'|'scope.invoiceTitle'|'scope.invoice'|'scope.userInfo' +type Param = { + scope: Scope, + msg: string //检查不通过时警告 +} +export default ({scope, msg}: Param) => { + //检查授权 + const check = useCallback(() => { + return new Promise((reslove, reject) => { + Taro.getSetting({ + success: (res) => { + if(res.authSetting[scope]) { + reslove(true) + } else if (res.authSetting[scope] === undefined) { + Taro.authorize({ + scope: scope, + success() { + reslove(true) + }, + fail() { + alert.none(msg) + reject(false) + } + }) + } else { + Taro.openSetting({ + success(res) { + if(res.authSetting[scope]) { + reslove(true) + } else { + alert.none(msg) + reject(false) + } + } + }) + } + } + }) + }) + + }, [scope]) + + return { + check, + } + +} \ No newline at end of file diff --git a/src/use/useHttp.ts b/src/use/useHttp.ts index 05b143b..592321f 100644 --- a/src/use/useHttp.ts +++ b/src/use/useHttp.ts @@ -32,7 +32,8 @@ type option = { data?: any, page?: number, pageSize?: number, - pagination?: true|false + pagination?: true|false, + base_url?: string } /** @@ -99,9 +100,9 @@ export const useRequest = (options:option = { page: 1, pageSize: 24, pagination: false, // 是否分页 + base_url: '' }) => { - - options.url = `${BASE_URL}${options.url}` + options.url = `${options.base_url||BASE_URL}${options.url}` let params:Params = { code: null, // 业务码 success: false, // 请求是否成功 @@ -121,7 +122,6 @@ export const useRequest = (options:option = { const stateRef = useRef({...params}) const [state, setState] = useState({...stateRef.current}) const {removeToken, removeSessionKey} = useUserInfo() - const router = useRouter() // 请求函数 const fetchData = async (sub_options?:any) => { stateRef.current.loading = true From 1367c0f65434c5816202c56a5702c8965d43ea94 Mon Sep 17 00:00:00 2001 From: czm <2192718639@qq.com> Date: Wed, 25 May 2022 20:32:15 +0800 Subject: [PATCH 3/8] =?UTF-8?q?=E8=AE=A2=E5=8D=95=E5=88=97=E8=A1=A8?= =?UTF-8?q?=E5=AF=B9=E6=8E=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/onlinePay.ts | 5 +- src/api/order.ts | 20 +++ .../addressInfoDetail/index.module.scss | 1 + .../components/addressInfoDetail/index.tsx | 23 +-- src/pages/order/components/kindList/index.tsx | 3 +- .../order/components/orderState/index.tsx | 6 +- src/pages/order/components/scanPay/index.tsx | 132 ++++++++++++------ src/pages/order/index.module.scss | 4 + src/pages/order/index.tsx | 12 +- .../orderList/components/order/index.tsx | 92 +++++++----- src/pages/orderList/index.module.scss | 12 +- src/pages/orderList/index.tsx | 96 +++++++++---- src/use/useHttp.ts | 10 +- 13 files changed, 287 insertions(+), 129 deletions(-) diff --git a/src/api/onlinePay.ts b/src/api/onlinePay.ts index 3c23414..b5ce06f 100644 --- a/src/api/onlinePay.ts +++ b/src/api/onlinePay.ts @@ -6,7 +6,8 @@ import { useRequest } from "@/use/useHttp" export const GetPayCode = () => { return useRequest({ url: `/`, - base_url: 'http://192.168.1.127:8081', + base_url: 'http://192.168.1.127:8081/caphtml', method: "post", }) -} \ No newline at end of file +} + diff --git a/src/api/order.ts b/src/api/order.ts index a1eb29f..d48b41d 100644 --- a/src/api/order.ts +++ b/src/api/order.ts @@ -59,4 +59,24 @@ export const SaleOrderApi = () => { url: `/v1/mall/saleOrder/shipmentMode`, method: "put", }) +} + +/** + * 获取订单状态枚举 + */ + export const GetOrderStatusListApi = () => { + return useRequest({ + url: `/v1/mall/enum/sale/order/status`, + method: "get", + }) +} + +/** + * 获取订单列表 + */ + export const GetOrderListApi = () => { + return useRequest({ + url: `/v1/mall/saleOrder/list`, + method: "get", + }) } \ No newline at end of file diff --git a/src/pages/order/components/addressInfoDetail/index.module.scss b/src/pages/order/components/addressInfoDetail/index.module.scss index b4a9f1b..68e6171 100644 --- a/src/pages/order/components/addressInfoDetail/index.module.scss +++ b/src/pages/order/components/addressInfoDetail/index.module.scss @@ -61,6 +61,7 @@ position: absolute; bottom: 10px; right: 10px; + z-index: 999; .updateBtn_list{ position: absolute; display: flex; diff --git a/src/pages/order/components/addressInfoDetail/index.tsx b/src/pages/order/components/addressInfoDetail/index.tsx index 4675aec..9d774e6 100644 --- a/src/pages/order/components/addressInfoDetail/index.tsx +++ b/src/pages/order/components/addressInfoDetail/index.tsx @@ -2,7 +2,7 @@ import AddressList from "@/components/AddressList"; import Popup from "@/components/popup"; import { Text, View } from "@tarojs/components" import classnames from "classnames"; -import { memo, useCallback, useEffect, useMemo, useState } from "react"; +import { forwardRef, memo, useCallback, useEffect, useImperativeHandle, useMemo, useState } from "react"; import styles from './index.module.scss' export type AddressInfoParam = { @@ -21,7 +21,7 @@ type Param = { shipment_mode?: 1|2 //1自提 2物流 } -export default memo(({onSelect, defaultValue = null, disabled = false, shipment_mode = 1}: Param) => { +export default memo(forwardRef(({onSelect, defaultValue = null, disabled = false, shipment_mode = 1}: Param, ref) => { const [showAddressList, setShowAddressList] = useState(false) useEffect(() => { @@ -48,12 +48,19 @@ export default memo(({onSelect, defaultValue = null, disabled = false, shipment_ } //收货方法,1:自提，2物流 const [receivingStatus, setReceivingStatus] = useState(1) - const onReceivingStatus = (val) => { + const onReceivingStatus = (val, e) => { + e.stopPropagation() setReceivingStatus(val) + console.log("e::::", e) } useEffect(() => { setReceivingStatus(() => shipment_mode) }, [shipment_mode]) + + //把内部方法提供给外部 + useImperativeHandle(ref, () => ({ + changeShow + })) return ( changeShow()}> @@ -70,18 +77,18 @@ export default memo(({onSelect, defaultValue = null, disabled = false, shipment_ - onReceivingStatus(1)}>自提 - onReceivingStatus(2)}>物流 + onReceivingStatus(1,e)}>自提 + onReceivingStatus(2,e)}>物流 - {!disabled&& setShowAddressList(false)}> + setShowAddressList(false)}> 请选择收货地址 getAddress(item)}/> - } + ) -}) \ No newline at end of file +})) \ No newline at end of file diff --git a/src/pages/order/components/kindList/index.tsx b/src/pages/order/components/kindList/index.tsx index 34d9542..db30c54 100644 --- a/src/pages/order/components/kindList/index.tsx +++ b/src/pages/order/components/kindList/index.tsx @@ -15,7 +15,6 @@ type OrderParam = { total_number: number } - export default memo(({value}:{value:OrderParam|null}) => { //对应数量 const formatCount = useCallback((item) => { @@ -36,7 +35,7 @@ export default memo(({value}:{value:OrderParam|null}) => { {numText} { - value?.list.map(item => { + value?.list?.map(item => { return {value.sale_mode_name} diff --git a/src/pages/order/components/orderState/index.tsx b/src/pages/order/components/orderState/index.tsx index a3b51bb..d710730 100644 --- a/src/pages/order/components/orderState/index.tsx +++ b/src/pages/order/components/orderState/index.tsx @@ -2,7 +2,7 @@ import { Image, Text, View } from "@tarojs/components" import { memo, useState } from "react" import styles from './index.module.scss' import classnames from "classnames"; -import { formatImgUrl } from "@/common/fotmat"; +import { formatDateTime, formatImgUrl } from "@/common/fotmat"; type Param = { status: string, time: string, @@ -24,7 +24,7 @@ export default memo(({list = []}:{list?:Param[]}) => { {(list.length != (index + 1))&&} {item.status} - {item.time} + {formatDateTime(item.time)} {item.tag} {item.desc} @@ -35,7 +35,7 @@ export default memo(({list = []}:{list?:Param[]}) => { } - + {/* */} } diff --git a/src/pages/order/components/scanPay/index.tsx b/src/pages/order/components/scanPay/index.tsx index 8467da4..40ee09a 100644 --- a/src/pages/order/components/scanPay/index.tsx +++ b/src/pages/order/components/scanPay/index.tsx @@ -1,5 +1,5 @@ import { Image, ScrollView, Text, View } from "@tarojs/components"; -import { memo, useEffect } from "react"; +import { memo, useEffect, useRef, useState } from "react"; import classnames from "classnames"; import styles from './index.module.scss' import Popup from "@/components/popup"; @@ -14,32 +14,106 @@ type Param = { show?: true|false, onClose?: () => void } + + +type Item = { + product_code: string, + product_name: string, + product_color_code: string, + product_color_name: string, + num: string, + weight: string, + sale_price: string, + total_price: string +} +type CodeParam = { + title: string, + company: string, + order_type: string, + sale_user: string, + order_created_time: string, + order_no: string, + department: string, + shipment_mode: string, + target_user_name: string, + target_address: string, + target_description: string, + pay_account: string, + bank_account_name: string, + bank_name: string, + pay_type: string, + client: string, + phone: string, + order_total_length: string, + order_total_price: string, + qrcode: string, + order_total_weight: string, + list: Item[] +} export default memo(({show = true, onClose}:Param) => { - const base64 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAZAAAAGQAQMAAAC6caSPAAAABlBMVEX///8AAABVwtN+AAACFElEQVR42uyaMbKzMAyExVC8kiNwFI5GjsZRcgRKCgb9I69sY+Ik7R+8O/OKF/N1Gnklr1AURVEURf2sBnUd+P9PZdxFpFddRaZ4uhEhAiR+euBznM2q+hCRacXpROSuiJ0vjphG1YfVkRXM2lm5ECFSR/QpYn+hw+hBhMgnRCScCxA0JSJE3t1i4XdrTPa5e5gvFx+R9pBseqdN9AnTO6+9Pobjq08m8ttIKUP02ZdT0GcRaQuxDhOKyWvMTK/VmMi8droMBxEiNUw6Xawhaagxm5LipGRe+KUpEWkVifMz2hDOXcHwHqV/IdI6IvH3U41JaEqhV6HGLhiRuyBhRj7yyIMrKXnhNYw7L0t7Is0i0mF7snW5w+xp17/4w8+1wxBpF4G79ZEIhbWn2yqY3ortIdIu0mHhYrcYxuqwhRvwkhi88HULR6R5xBd3mmwPmlIaqdGciBBJyKmQjEeNddH2VGuMyO8jeaGCeyfnlAzxLVwlp0SkUeTsbv0dedxlNh8TN7qVRyEizSJlFg4exn7Oo/Xy9zEJSaQt5KS0hzmnaWuml0jDSJm1LqakwbNw28X0ErkPUuaUxg0F40mV+FooRIjUs9Y4n31S8ljTS40RIYLgW1yoxAQkPMzbtC2RlpF0i0mekrwpESFSn5IUq9vYkJba2pbIfZBT1trfkUNSpc/BNiJEKIqiKIqi/gv9CwAA//9IKiY1VjApygAAAABJRU5ErkJggg==' - + //获取支付二维码 + const [payCodeImage, setPayCodeImage] = useState('') + const fileData = useRef({ + filePath: '', + base64: '' + }) + const {fetchData} = GetPayCode() + const getCore = async () => { + let res = await fetchData({ + title: "面料销售电子确认单", + company: "什么什么公司123", + order_type: "散剪", + sale_user: "小崔", + order_created_time:"2022/02/01 12:32:13", + order_no:"XS-211005888", + department:"嘻嘻嘻", + shipment_mode:"自提", + target_user_name:"大崔", + target_address:"阿斯顿发斯蒂芬", + target_description:"无", + pay_account:"1234567890123450001", + bank_account_name:"佛山市浩川长盛科技有限公司", + bank_name:"招商银行佛山分行禅城支行", + pay_type:"现结", + client:"客户名称", + phone:"15818085802", + order_total_length:"12", + order_total_price:"63000", + qrcode:"www.zzfzyc.com/checkorder/XS-211005888", + order_total_weight:"300.00", + list: [{product_code:'5215',product_name:'26S双纱亲水滑爽棉',product_color_code:'053',product_color_name:'洋红',num:'4',weight:'123.23',sale_price:'43',total_price:'4510.7'}] + }) + const base64 = res.data.base64 + setPayCodeImage(() => base64) + const time = new Date().valueOf() + const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(base64) || []; + let filePath = Taro.env.USER_DATA_PATH + '/img' + time +'.'+ format + fileData.current.filePath = filePath + fileData.current.base64 = bodyData + } + useEffect(() => { + getCore() + }, []) + //检查是否开启保存图片权限 const {check} = useCheckAuthorize({scope:'scope.writePhotosAlbum', msg:'您没授权，无法保存图片'}) const saveImageCheck = async () => { const res = await check() res&&saveImage() } + //保存图片 const saveImage = () => { const save = Taro.getFileSystemManager() - const number = Math.random(); - const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(base64) || []; - let filePath = Taro.env.USER_DATA_PATH +'/pic.'+ format alert.loading('正在保存图片') save.writeFile({ - filePath: filePath, - data: base64, + filePath: fileData.current.filePath, + data: fileData.current.base64, encoding: 'base64', success: function (res) { - console.log('aa::',res) - console.log('aa2::',filePath) Taro.saveImageToPhotosAlbum({ - filePath: filePath, + filePath: fileData.current.filePath, success: function (res) { alert.success('图片保存成功') }, @@ -50,42 +124,14 @@ export default memo(({show = true, onClose}:Param) => { } }) } + //预览图片 const showImage = () => { Taro.previewImage({ - current: formatImgUrl(''), // 当前显示图片的http链接 - urls: [formatImgUrl('')] // 需要预览的图片http链接列表 + current: fileData.current.filePath, // 当前显示图片的http链接 + urls: [fileData.current.filePath] // 需要预览的图片http链接列表 }) } - - // const {fetchData} = GetPayCode() - // useEffect(() => { - // fetchData({ - // title: "面料销售电子确认单", - // company: "什么什么公司123", - // order_type: "散剪", - // sale_user: "小崔", - // order_created_time:"2022/02/01 12:32:13", - // order_no:"XS-211005888", - // department:"嘻嘻嘻", - // shipment_mode:"自提", - // target_user_name:"大崔", - // target_address:"阿斯顿发斯蒂芬", - // target_description:"无", - // pay_account:"1234567890123450001", - // bank_account_name:"佛山市浩川长盛科技有限公司", - // bank_name:"招商银行佛山分行禅城支行", - // pay_type:"现结", - // client:"客户名称", - // phone:"15818085802", - // order_total_length:"12", - // order_total_price:"23000", - // qrcode:"www.zzfzyc.com/checkorder/XS-211005888", - // order_total_weight:"300.00", - // list: [{product_code:'5215',product_name:'26S双纱亲水滑爽棉',product_color_code:'053',product_color_name:'洋红',num:'4',weight:'123.23',sale_price:'43',total_price:'4510.7'}] - // }) - // }, []) - //复制功能 return ( @@ -99,7 +145,7 @@ export default memo(({show = true, onClose}:Param) => { 扫码支付成功后，自动更新状态 - + 保存电子确认单 diff --git a/src/pages/order/index.module.scss b/src/pages/order/index.module.scss index e965350..662cb6e 100644 --- a/src/pages/order/index.module.scss +++ b/src/pages/order/index.module.scss @@ -89,6 +89,10 @@ margin-left: 34px; } } + .order_btn_select{ + color: $color_main; + border: 2px solid $color_main; + } .order_number_desc{ font-size: $font_size_medium; color: $color_font_two; diff --git a/src/pages/order/index.tsx b/src/pages/order/index.tsx index 47259cd..e306c36 100644 --- a/src/pages/order/index.tsx +++ b/src/pages/order/index.tsx @@ -109,6 +109,10 @@ import styles from './index.module.scss' const toPay = () => { setPayMentShow(true) } + + //打开地址修改 + const addressRef = useRef(null) + return ( {/* @@ -116,7 +120,7 @@ import styles from './index.module.scss' */} - + @@ -143,9 +147,9 @@ import styles from './index.module.scss' - 申请退货 - 查看物流 - 确认收货 + + {(orderDetail?.status == 0)&&取消订单} + {(orderDetail?.status == 0)&& addressRef.current.changeShow()}>修改地址} toPay()}>去支付 setShowDesc(false)} > diff --git a/src/pages/orderList/components/order/index.tsx b/src/pages/orderList/components/order/index.tsx index 6fe747c..e6fc8d5 100644 --- a/src/pages/orderList/components/order/index.tsx +++ b/src/pages/orderList/components/order/index.tsx @@ -1,11 +1,33 @@ -import { formatImgUrl } from "@/common/fotmat"; +import { formatHashTag, formatImgUrl, formatPriceDiv } from "@/common/fotmat"; import { useSelector } from "@/reducers/hooks"; import { Image, Text, View } from "@tarojs/components" import classnames from "classnames"; -import { memo } from "react"; +import { memo, useCallback } from "react"; import styles from './index.module.scss' -export default memo(() => { + +type Param = { + value?: { + order_no: string, + sale_mode: number, + sale_mode_name: string, + status_name: string, + shipment_mode_name: string, + product_list: any[], + total_fabrics: number, + total_colors: number, + total_number: number + } +} +export default memo(({value}: Param) => { const userInfo = useSelector(state => state.userInfo) + //对应数量 + const formatCount = useCallback((item, sale_mode) => { + return sale_mode == 0? item.roll : Number(item.length / 100) + }, [value]) + //对应单价 + const standardPrice = useCallback((price, sale_mode) => { + return formatPriceDiv(price).toLocaleString() + '/' + (sale_mode == 1?'m':'kg') + }, [value]) return ( @@ -14,41 +36,43 @@ export default memo(() => { {userInfo.adminUserInfo.user_name} - 订单号：LY2278204399678 + 订单号：{value?.order_no} - 自提 + {value?.shipment_mode_name} - - 大货 - 0770# 21S单面平纹(食毛) - 待接单 + + + {value?.sale_mode_name} + {formatHashTag(value?.product_list[0].code, value?.product_list[0].name)} + {value?.status_name} + + + + + {value?.product_list[0].product_colors[0].code} + + + {value?.product_list[0].product_colors.map((itemColor, index) => { + return ( + (index <= 1)&& + {formatHashTag(itemColor.code, itemColor.name)} + {standardPrice(itemColor.sale_price, value.sale_mode)} + ×{formatCount(itemColor, value.sale_mode)}条 + + ) + + }) + } + + …… + …… + …… + + + + {`${value?.total_fabrics}种面料，${value?.total_colors}种颜色，共${value?.total_number}条`} - - - - 24色 - - - - 1# 薄荷绿 - ¥40/kg - ×2条 - - - 1# 薄荷绿 - ¥40/kg - ×2条 - - - …… - …… - …… - - - - - 2种面料，3种颜色，共6条 取消订单 修改地址 diff --git a/src/pages/orderList/index.module.scss b/src/pages/orderList/index.module.scss index 1a68dbc..f7222c8 100644 --- a/src/pages/orderList/index.module.scss +++ b/src/pages/orderList/index.module.scss @@ -9,28 +9,30 @@ box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.16); border-bottom: 2px solid #e2e2e2; .order_status_list{ - display: flex; - justify-content: space-between; font-size: $font_size; color: #9E9E9E; margin-top: 20px; .order_status_item{ - padding: 20px 10px; + padding: 20px; box-sizing: border-box; } .selected{ font-weight: 700; color: #000; border-bottom: 4px solid #707070; - // border-radius: 4px; + } + .order_list_scroll{ + white-space: nowrap; + display: flex; } } } .order_list{ flex:1; height: 0; - .order_item{ + .order_item_con{ margin-top: 20px; + padding: 0 20px; } } } \ No newline at end of file diff --git a/src/pages/orderList/index.tsx b/src/pages/orderList/index.tsx index 010f815..7e446d2 100644 --- a/src/pages/orderList/index.tsx +++ b/src/pages/orderList/index.tsx @@ -1,15 +1,16 @@ import Search from "@/components/search" import useLogin from "@/use/useLogin" -import { Image, Text, View } from "@tarojs/components" -import { useDidShow, useRouter } from "@tarojs/taro" -import { useCallback, useState } from "react" +import { Image, ScrollView, Text, View } from "@tarojs/components" +import Taro, { useDidShow, useRouter } from "@tarojs/taro" +import { useCallback, useEffect, useMemo, useRef, useState } from "react" import {ORDER_STATUS} from '@/common/enum' import styles from './index.module.scss' import classnames from "classnames"; -import { useSelector } from "@/reducers/hooks" -import { formatImgUrl } from "@/common/fotmat" import Order from "./components/order" import InfiniteScroll from "@/components/infiniteScroll" +import {GetOrderStatusListApi, GetOrderListApi} from '@/api/order' +import { dataLoadingStatus, getFilterData } from "@/common/util" +import Tabs from "@/components/tabs" export default () => { const {checkLogin} = useLogin() @@ -17,46 +18,89 @@ export default () => { await checkLogin() }) - const router = useRouter() //搜索参数 const [searchField, setSearchField] = useState({ - shipment_mode:'', + status: -1, page : 1, size : 10, - key:'' + Name:'' }) - //订单状态 - type orderStatusParam = {value:number, label:string}[] - const order_status: orderStatusParam = [{value:-1, label:'全部'}, ...Object.values(ORDER_STATUS)] - const [selectStatus, setSelectStatus] = useState(-1) - const changeStatus = useCallback((e) => { - setSelectStatus(() => e) + //获取订单状态 + const {fetchData: statusFetchData} = GetOrderStatusListApi() + const [statusList, setStatusList] = useState([{id: -1, name: '全部'}]) + const getOrderStatusList = async () => { + let res = await statusFetchData() + let list = [...statusList, ...res.data.list||[]] + setStatusList(() => list) + } + useEffect(() => { + getOrderStatusList() }, []) + //获取订单列表 + const {fetchData: listFetchData, state:orderState} = GetOrderListApi() + const [orderData, setOrderData] = useState<{list:any[], total:number}>({list:[], total:0}) + const getOrderList = async () => { + let res = await listFetchData(getFilterData(searchField)) + setOrderData({list: res.data.list, total: res.data.total}) + Taro.stopPullDownRefresh() + } + + + //监听筛选条件变化 + useEffect(() => { + getOrderList() + }, [searchField]) + + //上拉加载数据 + const pageNum = useRef({size: searchField.size, page: searchField.page}) + 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 changeStatus = useCallback((e) => { + pageNum.current.page = 1 + setSearchField((value) => ({...value, status:e, size:10})) + setOrderData(() => ({list:[], total:0})) + }, []) + + + //数据加载状态 + const statusMore = useMemo(() => { + return dataLoadingStatus({list:orderData.list, total: orderData.total, status: orderState.loading}) + }, [orderData, orderState]) + //输入了搜索关键字 const getSearchData = useCallback((e) => { - // setMaterialList(() => ({list:[], total:0})) - setSearchField((val) => ({...val, code_or_name:e, size:10})) + pageNum.current.page = 1 + setOrderData(() => ({list:[], total:0})) + setSearchField((val) => ({...val, name:e, size:10})) }, []) - - return ( - + - {order_status.map(item => { - return changeStatus(item.value)} className={classnames(styles.order_status_item, (selectStatus==item.value)&&styles.selected)}>{item.label} - })} + + + {statusList.map(item => { + return changeStatus(item.id)} className={classnames(styles.order_status_item, (searchField.status==item.id)&&styles.selected)}>{item.name} + })} + + - - {new Array(10).fill('').map(item => { - return - + + {orderData?.list.map(item => { + return })} diff --git a/src/use/useHttp.ts b/src/use/useHttp.ts index 592321f..74ee064 100644 --- a/src/use/useHttp.ts +++ b/src/use/useHttp.ts @@ -1,7 +1,7 @@ import Taro, { useRouter } from '@tarojs/taro' -import { useRef, useState } from 'react' +import { useEffect, useRef, useState } from 'react' import {BASE_URL, WX_APPID} from '@/common/constant' import useUserInfo from "./useUserInfo" import qs from 'qs'; @@ -122,10 +122,15 @@ export const useRequest = (options:option = { const stateRef = useRef({...params}) const [state, setState] = useState({...stateRef.current}) const {removeToken, removeSessionKey} = useUserInfo() + + useEffect(() => { + console.log('变化::', state.loading) + }, [state.loading]) // 请求函数 const fetchData = async (sub_options?:any) => { stateRef.current.loading = true setState((e) => ({...e, loading:true})) + console.log('tf:::', stateRef.current.loading) stateRef.current.query = { ...sub_options, ...options.pagination && { @@ -153,6 +158,7 @@ export const useRequest = (options:option = { } } const result = await Taro.request(q as any) + const { statusCode } = result const { code, @@ -189,7 +195,7 @@ export const useRequest = (options:option = { } stateRef.current.error = false stateRef.current.loading = false - setState(() => stateRef.current) + setState(() => ({...stateRef.current})) return stateRef.current } From e73bd1bc25eb43f4ce70085ca6f7f4a08f253d52 Mon Sep 17 00:00:00 2001 From: czm <2192718639@qq.com> Date: Thu, 26 May 2022 17:32:59 +0800 Subject: [PATCH 4/8] =?UTF-8?q?=E8=AE=A2=E5=8D=95=E5=88=97=E8=A1=A8?= =?UTF-8?q?=E5=AF=B9=E6=8E=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/order.ts | 10 +++ src/components/orderBtns/index.module.scss | 22 +++++ src/components/orderBtns/index.tsx | 80 +++++++++++++++++++ src/pages/order/comfirm.tsx | 47 +++-------- .../components/addressInfoDetail/index.tsx | 66 ++++++++++----- src/pages/order/components/scanPay/index.tsx | 47 ++++++----- src/pages/order/index.tsx | 34 +++++--- .../components/order/index.module.scss | 22 ----- .../orderList/components/order/index.tsx | 61 +++++++++++--- src/pages/orderList/index.tsx | 2 +- 10 files changed, 271 insertions(+), 120 deletions(-) create mode 100644 src/components/orderBtns/index.module.scss create mode 100644 src/components/orderBtns/index.tsx diff --git a/src/api/order.ts b/src/api/order.ts index d48b41d..45eb243 100644 --- a/src/api/order.ts +++ b/src/api/order.ts @@ -79,4 +79,14 @@ export const SaleOrderApi = () => { url: `/v1/mall/saleOrder/list`, method: "get", }) +} + +/** + * 作废销售单 + */ + export const CancelOrderApi = () => { + return useRequest({ + url: `/v1/mall/saleOrder/cancel`, + method: "put", + }) } \ No newline at end of file diff --git a/src/components/orderBtns/index.module.scss b/src/components/orderBtns/index.module.scss new file mode 100644 index 0000000..28023d0 --- /dev/null +++ b/src/components/orderBtns/index.module.scss @@ -0,0 +1,22 @@ +.btns_list{ + display: flex; + justify-content: flex-end; + margin-top: 30px; + .btns_item{ + width: 152px; + height: 72px; + border: 2px solid #dddddd; + border-radius: 38px; + text-align: center; + line-height: 72px; + font-size: $font_size; + color: $color_font_three; + &:nth-child(n+2) { + margin-left: 32px; + } + } + .end_btn{ + border: 2px solid $color_main; + color: $color_main; + } +} \ No newline at end of file diff --git a/src/components/orderBtns/index.tsx b/src/components/orderBtns/index.tsx new file mode 100644 index 0000000..53e33a1 --- /dev/null +++ b/src/components/orderBtns/index.tsx @@ -0,0 +1,80 @@ +import { CancelOrderApi } from "@/api/order" +import { alert } from "@/common/common" +import { View } from "@tarojs/components" +import Taro from "@tarojs/taro" +import { useCallback, useRef, memo } from "react" +import styles from './index.module.scss' + +type Param = { + status?: number //订单状态 + orderId?: number //订单id +} +export default memo(({status = 0, orderId = 0}:Param) => { + //订单按钮按订单状态归类 + const orderBtnsList = useRef([ + { + value: [0, 1, 2, 9, 3], //取消订单按钮对应： 待接单，待配布，已配布, 待付款， 待发货 + label: '取消订单' + }, + { + value: [3, 9], //去付款按钮对应：待付款， 待发货 + label: '去付款' + }, + { + value: [3], //取消订单按钮对应： 待发货 + label: '申请退款' + }, + { + value: [4, 7, 8, 6], //取消订单按钮对应： 待收货, 已收货, 已完成, 已退款 + label: '查看物流' + }, + { + value: [4, 7, 6], //取消订单按钮对应： 待收货, 已收货, 已退款 + label: '申请退货' + }, + { + value: [4], //取消订单按钮对应： 待收货 + label: '确认收货' + }, + { + value: [4,7,8,6], //取消订单按钮对应： 待收货，已收货，已完成, 已退款 + label: '再次购买' + } + ]) + const orderBtnsShow = useCallback((item, status) => { + return item.value.includes(status) + },[]) + + //点击按钮操作 + const submitBtns = (val) => { + if( val == 0 ) cancelOrder() + } + + //取消订单 + const {fetchData: cancelFetchData} = CancelOrderApi() + const cancelOrder = () => { + Taro.showModal({ + title: '要取消该订单吗？', + success: async function (res) { + if (res.confirm) { + let res = await cancelFetchData({id: orderId}) + if(res.success) { + alert.success('取消成功') + } else { + alert.none(res.msg) + } + } else if (res.cancel) { + console.log('用户点击取消') + } + } + }) + } + + return ( + + {orderBtnsList.current.map((item, index) => + orderBtnsShow(item, status)&& submitBtns(index)}>{item.label} + )} + + ) +}) \ No newline at end of file diff --git a/src/pages/order/comfirm.tsx b/src/pages/order/comfirm.tsx index 5db9fc2..87a0048 100644 --- a/src/pages/order/comfirm.tsx +++ b/src/pages/order/comfirm.tsx @@ -31,7 +31,7 @@ import SubmitOrderBtn from "./components/submitOrderBtn"; const param = getParam() const idsAndSaleModel = useRef({shopping_cart_product_color_list:[], sale_mode:0}) useDidShow(async () => { - await checkLogin() + // await checkLogin() idsAndSaleModel.current.sale_mode = Number(param?.sale_mode) param?.ids?.split('-')?.map(item => { return idsAndSaleModel.current.shopping_cart_product_color_list?.push({ @@ -43,8 +43,7 @@ import SubmitOrderBtn from "./components/submitOrderBtn"; }) //获取销售预览订单 - type preViewOrderParam = {estimate_amount:number, estimate_weight:number, product_color_list:any[], sale_mode:number, sale_mode_name:string, default_address:AddressInfoParam} - const [preViewOrder, setPreViewOrder] = useState() //获取到的原始数据 + const [preViewOrder, setPreViewOrder] = useState() //获取到的原始数据 const {fetchData} = SaleOrderPreViewApi() const getSaleOrderPreView = async () => { if(idsAndSaleModel.current.shopping_cart_product_color_list?.length > 0) { @@ -65,36 +64,16 @@ import SubmitOrderBtn from "./components/submitOrderBtn"; //格式化数据格式 const [formatPreViewOrder, setFormatPreViewOrder] = useState() //格式化后的数据 const formatData = () => { - if(preViewOrder?.product_color_list&&preViewOrder?.product_color_list.length > 0) { - let dataList = {} - let num_count = 0 //总数量 - let orderList:{shopping_cart_product_color_id:number}[] = [] //提交订单时的格式 - preViewOrder?.product_color_list.map(item => { - dataList[item.product_code] = dataList[item.product_code]||{} - dataList[item.product_code].product_code = item.product_code - dataList[item.product_code].product_name = item.product_name - dataList[item.product_code].sale_mode_name = preViewOrder.sale_mode_name - dataList[item.product_code].color_list = dataList[item.product_code]?.color_list||[] - dataList[item.product_code].color_list.push(item) - //大货 - if (preViewOrder.sale_mode == 0) num_count += item.roll - //剪板或散件 - if (preViewOrder.sale_mode == 1 || preViewOrder.sale_mode == 2) num_count += item.length - orderList.push({shopping_cart_product_color_id:item.id}) - }) - if (preViewOrder.sale_mode == 1 || preViewOrder.sale_mode == 2) num_count = Number(num_count / 100); - setFormatPreViewOrder({ - estimate_amount: preViewOrder.estimate_amount, //预估金额 - estimate_weight: preViewOrder.estimate_weight, - sale_mode: preViewOrder.sale_mode, - sale_mode_name: preViewOrder.sale_mode_name, - colo_count: preViewOrder.product_color_list.length, //颜色数量 - num_count: num_count, //总数量 - unit: preViewOrder.sale_mode == 0?'条':'m', //单位 - list: Object.values(dataList) - }) - setSubmitOrderData({...submitOrderData, list: orderList}) - } + setFormatPreViewOrder({ + estimate_amount: preViewOrder.estimate_amount, //预估金额 + sale_mode: preViewOrder.sale_mode, + sale_mode_name: preViewOrder.sale_mode_name, + total_colors: preViewOrder.total_colors, //总颜色数量 + total_number: preViewOrder.total_number, //总数量 + total_fabrics: preViewOrder.total_fabrics, //面料数量 + unit: preViewOrder.sale_mode == 0?'条':'m', //单位 + list: preViewOrder.product_list + }) } const formatPreViewOrderMemo = useMemo(() => { console.log('formatPreViewOrder::',formatPreViewOrder) @@ -185,7 +164,7 @@ import SubmitOrderBtn from "./components/submitOrderBtn"; - {`${formatPreViewOrder?.list.length}种面料，${formatPreViewOrder?.colo_count}种颜色，共${formatPreViewOrder?.num_count + formatPreViewOrder?.unit}`} + {`${formatPreViewOrder?.total_fabrics}种面料，${formatPreViewOrder?.total_colors}种颜色，共${formatPreViewOrder?.total_number + formatPreViewOrder?.unit}`} submitOrderEven()}>提交订单 diff --git a/src/pages/order/components/addressInfoDetail/index.tsx b/src/pages/order/components/addressInfoDetail/index.tsx index 9d774e6..fe9b337 100644 --- a/src/pages/order/components/addressInfoDetail/index.tsx +++ b/src/pages/order/components/addressInfoDetail/index.tsx @@ -1,3 +1,6 @@ +import { EditSaleOrderAddressApi, EditSaleOrderShipmentModeApi } from "@/api/order"; +import { alert } from "@/common/common"; +import { debounce } from "@/common/util"; import AddressList from "@/components/AddressList"; import Popup from "@/components/popup"; import { Text, View } from "@tarojs/components" @@ -12,29 +15,25 @@ export type AddressInfoParam = { address_detail: string, id?: number, name: string, - phone: string + phone: string, } type Param = { onSelect?: (val:any) => void, //选择 - defaultValue?: AddressInfoParam|null //默认值 - disabled?: false|true //true禁用后只用于展示 - shipment_mode?: 1|2 //1自提 2物流 + defaultValue?: AddressInfoParam|null, //默认值 + disabled?: false|true, //true禁用后只用于展示 + shipment_mode?: 1|2, //1自提 2物流 + onChangeShipmentMode?: (val: number) => void, //返回收货方式 + orderId?: number //订单id } -export default memo(forwardRef(({onSelect, defaultValue = null, disabled = false, shipment_mode = 1}: Param, ref) => { +export default memo(forwardRef(({onSelect, onChangeShipmentMode, defaultValue = null, orderId = 0, shipment_mode = 1}: Param, ref) => { const [showAddressList, setShowAddressList] = useState(false) useEffect(() => { setUserInfo(() => defaultValue) }, [defaultValue]) - //选择地址 const [userInfo, setUserInfo] = useState() - const getAddress = useCallback((val) => { - setShowAddressList(() => false) - setUserInfo(() => val) - onSelect?.(val) - }, []) //地址格式 const formatAddress = useMemo(() => { @@ -46,13 +45,7 @@ export default memo(forwardRef(({onSelect, defaultValue = null, disabled = false if(receivingStatus == 2) setShowAddressList(() => true) } - //收货方法,1:自提，2物流 - const [receivingStatus, setReceivingStatus] = useState(1) - const onReceivingStatus = (val, e) => { - e.stopPropagation() - setReceivingStatus(val) - console.log("e::::", e) - } + useEffect(() => { setReceivingStatus(() => shipment_mode) }, [shipment_mode]) @@ -61,6 +54,41 @@ export default memo(forwardRef(({onSelect, defaultValue = null, disabled = false useImperativeHandle(ref, () => ({ changeShow })) + + //收货方法,1:自提，2物流 + const [receivingStatus, setReceivingStatus] = useState(1) + const {fetchData: shipmentModeFetchData} = EditSaleOrderShipmentModeApi() + const onReceivingStatus = (value, e) => { + e.stopPropagation() + changeReceivingStatus(value) + } + const changeReceivingStatus = debounce(async (value) => { + alert.loading('正在修改') + const res = await shipmentModeFetchData({id: orderId, shipment_mode:value}) + if(res.success) { + alert.success('修改成功') + onChangeShipmentMode?.(value) + setReceivingStatus(value) + } else { + alert.none(res.msg) + } + }, 10) + + //修改地址 + const {fetchData: addressFetchData} = EditSaleOrderAddressApi() + const getAddress = async (value) => { + alert.loading('正在修改') + setShowAddressList(() => false) + setUserInfo(() => value) + const res = await addressFetchData({id: orderId, address_id: value.id}) + if(res.success) { + alert.success('修改成功') + onSelect?.(value) + } else { + alert.none(res.msg) + } + } + return ( changeShow()}> @@ -86,7 +114,7 @@ export default memo(forwardRef(({onSelect, defaultValue = null, disabled = false setShowAddressList(false)}> 请选择收货地址 - getAddress(item)}/> + diff --git a/src/pages/order/components/scanPay/index.tsx b/src/pages/order/components/scanPay/index.tsx index 40ee09a..d6fb06e 100644 --- a/src/pages/order/components/scanPay/index.tsx +++ b/src/pages/order/components/scanPay/index.tsx @@ -8,6 +8,7 @@ import { alert } from "@/common/common"; import { formatImgUrl } from "@/common/fotmat"; import useCheckAuthorize from "@/use/useCheckAuthorize"; import { GetPayCode } from "@/api/onlinePay"; +import LoadingCard from "@/components/loadingCard"; type Param = { @@ -58,7 +59,7 @@ export default memo(({show = true, onClose}:Param) => { filePath: '', base64: '' }) - const {fetchData} = GetPayCode() + const {fetchData, state} = GetPayCode() const getCore = async () => { let res = await fetchData({ title: "面料销售电子确认单", @@ -80,7 +81,7 @@ export default memo(({show = true, onClose}:Param) => { phone:"15818085802", order_total_length:"12", order_total_price:"63000", - qrcode:"www.zzfzyc.com/checkorder/XS-211005888", + qrcode:"https://www.zzfzyc.com/checkorder/XS-211005888", order_total_weight:"300.00", list: [{product_code:'5215',product_name:'26S双纱亲水滑爽棉',product_color_code:'053',product_color_name:'洋红',num:'4',weight:'123.23',sale_price:'43',total_price:'4510.7'}] }) @@ -91,10 +92,18 @@ export default memo(({show = true, onClose}:Param) => { let filePath = Taro.env.USER_DATA_PATH + '/img' + time +'.'+ format fileData.current.filePath = filePath fileData.current.base64 = bodyData + const save = Taro.getFileSystemManager() + save.writeFile({ + filePath: fileData.current.filePath, + data: fileData.current.base64, + encoding: 'base64', + }) + } useEffect(() => { - getCore() - }, []) + if(show) + getCore() + }, [show]) //检查是否开启保存图片权限 const {check} = useCheckAuthorize({scope:'scope.writePhotosAlbum', msg:'您没授权，无法保存图片'}) @@ -105,30 +114,23 @@ export default memo(({show = true, onClose}:Param) => { //保存图片 const saveImage = () => { - const save = Taro.getFileSystemManager() alert.loading('正在保存图片') - save.writeFile({ + Taro.saveImageToPhotosAlbum({ filePath: fileData.current.filePath, - data: fileData.current.base64, - encoding: 'base64', success: function (res) { - Taro.saveImageToPhotosAlbum({ - filePath: fileData.current.filePath, - success: function (res) { - alert.success('图片保存成功') - }, - fail: function (err) { - console.log('err::', err) - } - }) + alert.success('图片保存成功') + }, + fail: function (err) { + console.log('err::', err) } }) } //预览图片 const showImage = () => { + console.log('fileData.current.filePath::', fileData.current.filePath) Taro.previewImage({ - current: fileData.current.filePath, // 当前显示图片的http链接 + current: fileData.current.filePath, // 当前显示 urls: [fileData.current.filePath] // 需要预览的图片http链接列表 }) } @@ -144,9 +146,12 @@ export default memo(({show = true, onClose}:Param) => { 扫码支付成功后，自动更新状态 - - - + + {(state.loading)&&|| + + + } + 保存电子确认单 diff --git a/src/pages/order/index.tsx b/src/pages/order/index.tsx index e306c36..cc718f3 100644 --- a/src/pages/order/index.tsx +++ b/src/pages/order/index.tsx @@ -1,20 +1,22 @@ -import { GetSaleOrderDetailApi, EditSaleOrderRemarkApi } from "@/api/order"; +import { + GetSaleOrderDetailApi, + EditSaleOrderRemarkApi, + CancelOrderApi +} from "@/api/order"; import { alert, goLink } from "@/common/common"; import { formatDateTime, formatPriceDiv } from "@/common/fotmat"; -import { setParam } from "@/common/system"; +import OrderBtns from "@/components/orderBtns"; import Popup from "@/components/popup"; import SearchInput from "@/components/searchInput"; import { Text, Textarea, View } from "@tarojs/components" import Taro, { useDidShow, useRouter } from "@tarojs/taro"; import classnames from "classnames"; import { useCallback, useEffect, useMemo, useRef, useState } from "react"; -import AddressInfo from "./components/addressInfo"; import AddressInfoDetail from "./components/addressInfoDetail"; import KindList from "./components/kindList"; import OrderState from "./components/orderState"; import Payment from "./components/payment"; import Remark from "./components/remark"; -import WeightMemo from "./components/weightMemo"; import styles from './index.module.scss' export default () => { @@ -59,7 +61,6 @@ import styles from './index.module.scss' }) } const formatPreViewOrderMemo = useMemo(() => { - console.log('formatDetailOrder::',formatDetailOrder) return formatDetailOrder }, [formatDetailOrder]) @@ -97,7 +98,8 @@ import styles from './index.module.scss' setOrderRemark(() => e) let res = await remarkFetchData({remark:e, id: orderId.current}) if(res.success) { - alert.success('修改成功') + getSaleOrderPreView() + alert.success('提交成功') } else { alert.error(res.msg) } @@ -113,6 +115,18 @@ import styles from './index.module.scss' //打开地址修改 const addressRef = useRef(null) + //修改收货方式 + const getShipmentMode = useCallback(() => { + getSaleOrderPreView() + }, [orderDetail]) + + //修改地址 + const getAddress = useCallback(() => { + getSaleOrderPreView() + }, [orderDetail]) + + + return ( {/* @@ -120,7 +134,7 @@ import styles from './index.module.scss' */} - + @@ -141,15 +155,13 @@ import styles from './index.module.scss' setShowDesc(true)}> 订单备注 { - orderRemark&&{orderRemark}|| + orderRemark&&{orderDetail?.remark}|| 填写备注 } - - {(orderDetail?.status == 0)&&取消订单} - {(orderDetail?.status == 0)&& addressRef.current.changeShow()}>修改地址} + toPay()}>去支付 setShowDesc(false)} > diff --git a/src/pages/orderList/components/order/index.module.scss b/src/pages/orderList/components/order/index.module.scss index 4bba847..e453de3 100644 --- a/src/pages/orderList/components/order/index.module.scss +++ b/src/pages/orderList/components/order/index.module.scss @@ -118,26 +118,4 @@ border-radius: 10px; padding: 10px 22px; } - .btns_list{ - display: flex; - justify-content: flex-end; - margin-top: 30px; - .btns_item{ - width: 152px; - height: 72px; - border: 2px solid #dddddd; - border-radius: 38px; - text-align: center; - line-height: 72px; - font-size: $font_size; - color: $color_font_three; - &:nth-child(n+2) { - margin-left: 32px; - } - } - .end_btn{ - border: 2px solid $color_main; - color: $color_main; - } - } } \ No newline at end of file diff --git a/src/pages/orderList/components/order/index.tsx b/src/pages/orderList/components/order/index.tsx index e6fc8d5..659d18c 100644 --- a/src/pages/orderList/components/order/index.tsx +++ b/src/pages/orderList/components/order/index.tsx @@ -1,8 +1,10 @@ +import { goLink } from "@/common/common"; import { formatHashTag, formatImgUrl, formatPriceDiv } from "@/common/fotmat"; +import OrderBtns from "@/components/orderBtns"; import { useSelector } from "@/reducers/hooks"; import { Image, Text, View } from "@tarojs/components" import classnames from "classnames"; -import { memo, useCallback } from "react"; +import { memo, useCallback, useMemo, useRef } from "react"; import styles from './index.module.scss' type Param = { @@ -15,7 +17,9 @@ type Param = { product_list: any[], total_fabrics: number, total_colors: number, - total_number: number + total_number: number, + status: 0, + id: number } } export default memo(({value}: Param) => { @@ -28,9 +32,47 @@ export default memo(({value}: Param) => { const standardPrice = useCallback((price, sale_mode) => { return formatPriceDiv(price).toLocaleString() + '/' + (sale_mode == 1?'m':'kg') }, [value]) + + + + //订单按钮按订单状态归类 + const orderBtnsList = useRef([ + { + value: [0, 1, 2, 9, 3], //取消订单按钮对应： 待接单，待配布，已配布, 待付款， 待发货 + label: '取消订单' + }, + { + value: [3, 9], //去付款按钮对应：待付款， 待发货 + label: '去付款' + }, + { + value: [3], //取消订单按钮对应： 待发货 + label: '申请退款' + }, + { + value: [4, 7, 8, 6], //取消订单按钮对应： 待收货, 已收货, 已完成, 已退款 + label: '查看物流' + }, + { + value: [4, 7, 6], //取消订单按钮对应： 待收货, 已收货, 已退款 + label: '申请退货' + }, + { + value: [4], //取消订单按钮对应： 待收货 + label: '确认收货' + }, + { + value: [4,7,8,6], //取消订单按钮对应： 待收货，已收货，已完成, 已退款 + label: '再次购买' + } + ]) + const orderBtnsShow = useCallback((item, status) => { + return item.value.includes(status) + },[]) + return ( - + goLink('/pages/order/index', {id: value?.id})}> {userInfo.adminUserInfo.user_name} @@ -41,7 +83,7 @@ export default memo(({value}: Param) => { {value?.shipment_mode_name} - + goLink('/pages/order/index', {id: value?.id})}> {value?.sale_mode_name} {formatHashTag(value?.product_list[0].code, value?.product_list[0].name)} @@ -61,7 +103,6 @@ export default memo(({value}: Param) => { ×{formatCount(itemColor, value.sale_mode)}条 ) - }) } @@ -73,12 +114,8 @@ export default memo(({value}: Param) => { {`${value?.total_fabrics}种面料，${value?.total_colors}种颜色，共${value?.total_number}条`} - - 取消订单 - 修改地址 - 修改地址 - 去付款 - + ) -}) \ No newline at end of file +}) + diff --git a/src/pages/orderList/index.tsx b/src/pages/orderList/index.tsx index 7e446d2..8bceb49 100644 --- a/src/pages/orderList/index.tsx +++ b/src/pages/orderList/index.tsx @@ -100,7 +100,7 @@ export default () => { {orderData?.list.map(item => { - return + return })} From b93b59332b18f98abd7b7726641cb230ef6e6a07 Mon Sep 17 00:00:00 2001 From: czm <2192718639@qq.com> Date: Fri, 27 May 2022 20:34:13 +0800 Subject: [PATCH 5/8] =?UTF-8?q?=E8=AE=A2=E5=8D=95=E5=88=97=E8=A1=A8?= =?UTF-8?q?=E5=AF=B9=E6=8E=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/order.ts | 4 +- src/api/orderPay.ts | 21 ++++++ src/common/common.ts | 15 ++-- src/common/constant.js | 4 +- .../infiniteScroll/index.module.scss | 3 + src/components/infiniteScroll/index.tsx | 2 +- src/components/orderBtns/index.tsx | 35 ++++++--- src/pages/order/comfirm.tsx | 15 +++- .../components/addressInfoDetail/index.tsx | 8 +- .../components/amountShow/index.module.scss | 2 +- .../components/estimatedAmount/index.tsx | 9 ++- src/pages/order/components/kindList/index.tsx | 25 ++++++- .../components/orderState/index.module.scss | 3 + .../order/components/orderState/index.tsx | 17 +++-- src/pages/order/components/payment/index.tsx | 75 ++++++++++++++++--- src/pages/order/index.config.ts | 4 +- src/pages/order/index.tsx | 36 +++++++-- .../orderList/components/order/index.tsx | 51 +++---------- src/pages/orderList/index.tsx | 18 ++++- 19 files changed, 236 insertions(+), 111 deletions(-) create mode 100644 src/api/orderPay.ts diff --git a/src/api/order.ts b/src/api/order.ts index 45eb243..f723f47 100644 --- a/src/api/order.ts +++ b/src/api/order.ts @@ -21,11 +21,11 @@ export const SaleOrderApi = () => { } /** - * 获取商城待配布订单详情 + * 获取商城订单详情 */ export const GetSaleOrderDetailApi = () => { return useRequest({ - url: `/v1/mall/saleOrder/arranging`, + url: `/v1/mall/saleOrder/detail`, method: "get", }) } diff --git a/src/api/orderPay.ts b/src/api/orderPay.ts new file mode 100644 index 0000000..99ba9d9 --- /dev/null +++ b/src/api/orderPay.ts @@ -0,0 +1,21 @@ +import { useRequest } from "@/use/useHttp" + +/** + * 获取订单支付方式信息 + */ + export const GetOrderPayApi = () => { + return useRequest({ + url: `/v1/mall/orderPayment/orderPaymentMethodInfo`, + method: "get", + }) +} + +/** + * 订单支付提交 + */ + export const SubmitOrderPayApi = () => { + return useRequest({ + url: `/v1/mall/orderPayment/orderPaymentSubmission`, + method: "put", + }) +} \ No newline at end of file diff --git a/src/common/common.ts b/src/common/common.ts index 080373b..0c814aa 100644 --- a/src/common/common.ts +++ b/src/common/common.ts @@ -7,20 +7,15 @@ import Qs from 'qs' * @param params * @param type false 跳转普通页面，true 跳转tabbar页面 */ -export const goLink = (path = '', params = {}, type:false|true = false) => { +type ParamLink = 'navigateTo'|'switchTab'|'reLaunch'|'redirectTo' +export const goLink = (path = '', params = {}, way: ParamLink = 'navigateTo') => { if(path) { let params_str = Qs.stringify(params) console.log('params_str::',params_str) path = params_str?path+'?'+params_str:path - if(!type) { - Taro.navigateTo({ - url: path - }) - } else { - Taro.switchTab({ - url: path - }) - } + console.log('path::', way) + Taro[way]({url: path}) + } } diff --git a/src/common/constant.js b/src/common/constant.js index f62112f..861155e 100644 --- a/src/common/constant.js +++ b/src/common/constant.js @@ -8,9 +8,9 @@ // export const BASE_URL = `http://192.168.1.30:40001/lymarket` // 发 // export const BASE_URL = `https://dev.zzfzyc.com/lymarket` // 开发环境 // export const BASE_URL = `https://www.zzfzyc.com/lymarket` // 正式环境 -// export const BASE_URL = `http://192.168.1.4:40001/lymarket` // 王霞 +export const BASE_URL = `http://192.168.1.4:40001/lymarket` // 王霞 // export const BASE_URL = `http://192.168.1.224:50002/lymarket` // 添 -export const BASE_URL = `http://192.168.1.15:50001/lymarket` // 杰 +// export const BASE_URL = `http://192.168.1.15:50001/lymarket` // 杰 // CDN // 生成密钥 diff --git a/src/components/infiniteScroll/index.module.scss b/src/components/infiniteScroll/index.module.scss index c92bd1f..aab1d77 100644 --- a/src/components/infiniteScroll/index.module.scss +++ b/src/components/infiniteScroll/index.module.scss @@ -11,6 +11,9 @@ display: flex; align-items: center; } + .noMore{ + padding-top: 20px; + } } .scrollViewCon { // height: 100%; diff --git a/src/components/infiniteScroll/index.tsx b/src/components/infiniteScroll/index.tsx index 26ab828..cb22671 100644 --- a/src/components/infiniteScroll/index.tsx +++ b/src/components/infiniteScroll/index.tsx @@ -93,7 +93,7 @@ export default memo(({ { (statusMore == 2)&&加载中|| - 没有更多数据了 + 没有更多数据了 } diff --git a/src/components/orderBtns/index.tsx b/src/components/orderBtns/index.tsx index 53e33a1..3cc4690 100644 --- a/src/components/orderBtns/index.tsx +++ b/src/components/orderBtns/index.tsx @@ -6,38 +6,46 @@ import { useCallback, useRef, memo } from "react" import styles from './index.module.scss' type Param = { - status?: number //订单状态 - orderId?: number //订单id + status?: number, //订单状态 + orderId: number, //订单id + onClick?: (val: number) => void //点击后触发的事件，返回订单状态 } -export default memo(({status = 0, orderId = 0}:Param) => { +export default memo(({status = 0, orderId = 0, onClick}:Param) => { //订单按钮按订单状态归类 const orderBtnsList = useRef([ { - value: [0, 1, 2, 9, 3], //取消订单按钮对应： 待接单，待配布，已配布, 待付款， 待发货 + id: 1, + value: [0, 1, 2, 3, 4], //取消订单按钮对应： 待接单，待配布，已配布, 待付款， 待发货 label: '取消订单' }, { - value: [3, 9], //去付款按钮对应：待付款， 待发货 + id: 2, + value: [3, 4], //去付款按钮对应：待付款， 待发货 label: '去付款' }, { - value: [3], //取消订单按钮对应： 待发货 + id: 3, + value: [4], //取消订单按钮对应： 待发货 label: '申请退款' }, { - value: [4, 7, 8, 6], //取消订单按钮对应： 待收货, 已收货, 已完成, 已退款 + id: 4, + value: [5, 6, 7, 8], //取消订单按钮对应： 待收货, 已收货, 已完成, 已退款 label: '查看物流' }, { - value: [4, 7, 6], //取消订单按钮对应： 待收货, 已收货, 已退款 + id: 5, + value: [5, 6, 8], //取消订单按钮对应： 待收货, 已收货, 已退款 label: '申请退货' }, { - value: [4], //取消订单按钮对应： 待收货 + id: 6, + value: [5], //取消订单按钮对应： 待收货 label: '确认收货' }, { - value: [4,7,8,6], //取消订单按钮对应： 待收货，已收货，已完成, 已退款 + id: 7, + value: [5,6,7,8], //取消订单按钮对应： 待收货，已收货，已完成, 已退款 label: '再次购买' } ]) @@ -47,7 +55,9 @@ export default memo(({status = 0, orderId = 0}:Param) => { //点击按钮操作 const submitBtns = (val) => { - if( val == 0 ) cancelOrder() + (val == 1)&&cancelOrder(); //取消订单按钮 + (val == 2)&&onClick?.(val); //去付款按钮 + } //取消订单 @@ -60,6 +70,7 @@ export default memo(({status = 0, orderId = 0}:Param) => { let res = await cancelFetchData({id: orderId}) if(res.success) { alert.success('取消成功') + onClick?.(1) } else { alert.none(res.msg) } @@ -73,7 +84,7 @@ export default memo(({status = 0, orderId = 0}:Param) => { return ( {orderBtnsList.current.map((item, index) => - orderBtnsShow(item, status)&& submitBtns(index)}>{item.label} + orderBtnsShow(item, status)&& submitBtns(item.id)}>{item.label} )} ) diff --git a/src/pages/order/comfirm.tsx b/src/pages/order/comfirm.tsx index 87a0048..3dd3e12 100644 --- a/src/pages/order/comfirm.tsx +++ b/src/pages/order/comfirm.tsx @@ -56,6 +56,7 @@ import SubmitOrderBtn from "./components/submitOrderBtn"; useEffect(() => { if(preViewOrder) { formatData() + getDataList() //当有默认地址时设置默认地址id preViewOrder.default_address&&setSubmitOrderData((val) => ({...val, address_id:preViewOrder.default_address.id})) } @@ -76,7 +77,6 @@ import SubmitOrderBtn from "./components/submitOrderBtn"; }) } const formatPreViewOrderMemo = useMemo(() => { - console.log('formatPreViewOrder::',formatPreViewOrder) return formatPreViewOrder }, [formatPreViewOrder]) @@ -97,6 +97,17 @@ import SubmitOrderBtn from "./components/submitOrderBtn"; return null }, [preViewOrder]) + //获取提交格式数据列表 + const getDataList = () => { + let list:{shopping_cart_product_color_id:number}[] = [] + preViewOrder.product_list?.map(item => { + item.product_colors?.map(colorItem => { + list.push({shopping_cart_product_color_id:colorItem.id}) + }) + }) + setSubmitOrderData((val) => ({...val, list})) + } + //获取地址 const getAddress = (e) => { setSubmitOrderData((val) => ({...val, address_id:e.id})) @@ -138,7 +149,7 @@ import SubmitOrderBtn from "./components/submitOrderBtn"; if (res.confirm) { const res = await saleOrderFetchData(submitOrderData) if(res.success) { - goLink('/pages/order/index',{id: res.data.id}) + goLink('/pages/order/index',{id: res.data.id}, 'redirectTo') } else { alert.none(res.msg) } diff --git a/src/pages/order/components/addressInfoDetail/index.tsx b/src/pages/order/components/addressInfoDetail/index.tsx index fe9b337..7290ae6 100644 --- a/src/pages/order/components/addressInfoDetail/index.tsx +++ b/src/pages/order/components/addressInfoDetail/index.tsx @@ -66,7 +66,7 @@ export default memo(forwardRef(({onSelect, onChangeShipmentMode, defaultValue = alert.loading('正在修改') const res = await shipmentModeFetchData({id: orderId, shipment_mode:value}) if(res.success) { - alert.success('修改成功') + alert.success('收货方式修改成功') onChangeShipmentMode?.(value) setReceivingStatus(value) } else { @@ -78,12 +78,12 @@ export default memo(forwardRef(({onSelect, onChangeShipmentMode, defaultValue = const {fetchData: addressFetchData} = EditSaleOrderAddressApi() const getAddress = async (value) => { alert.loading('正在修改') - setShowAddressList(() => false) - setUserInfo(() => value) const res = await addressFetchData({id: orderId, address_id: value.id}) if(res.success) { - alert.success('修改成功') + alert.success('地址修改成功') onSelect?.(value) + setShowAddressList(() => false) + setUserInfo(() => value) } else { alert.none(res.msg) } diff --git a/src/pages/order/components/amountShow/index.module.scss b/src/pages/order/components/amountShow/index.module.scss index 58368a8..647e203 100644 --- a/src/pages/order/components/amountShow/index.module.scss +++ b/src/pages/order/components/amountShow/index.module.scss @@ -6,7 +6,7 @@ font-size: $font_size_min; } &:nth-child(2) { - font-size: 26px; + font-size: $font_size; } &:nth-child(3) { font-size: $font_size_medium; diff --git a/src/pages/order/components/estimatedAmount/index.tsx b/src/pages/order/components/estimatedAmount/index.tsx index 0292f6b..04bc49a 100644 --- a/src/pages/order/components/estimatedAmount/index.tsx +++ b/src/pages/order/components/estimatedAmount/index.tsx @@ -8,20 +8,21 @@ type Param = { style?: Object, number?: number, title?: string, - status?: true|false, //true 加大加深 + titleStatus?: true|false, //true 标题加大加深 + numberStatus?: 0|1|2, //数字尺寸 } -export default memo(({style, number = 0, status = true, title = ''}:Param) => { +export default memo(({style, number = 0, titleStatus = true, title = '', numberStatus = 1}:Param) => { return ( <> - + {title} {/* 123123123121212312312312312 */} - + ) diff --git a/src/pages/order/components/kindList/index.tsx b/src/pages/order/components/kindList/index.tsx index db30c54..e6ea05a 100644 --- a/src/pages/order/components/kindList/index.tsx +++ b/src/pages/order/components/kindList/index.tsx @@ -5,17 +5,22 @@ import EstimatedAmount from "../estimatedAmount" import styles from './index.module.scss' type OrderParam = { - estimate_amount: number, + estimate_amount: number, //预估金额 list: any[], sale_mode: number, sale_mode_name: string, unit: string, total_colors: number, total_fabrics: number, - total_number: number + total_number: number, + status: number, //订单状态 + total_sale_price: number, //销售金额 + total_should_collect_money: number, //应收金额 + total_weight_error_discount: number, //空差优惠 + } -export default memo(({value}:{value:OrderParam|null}) => { +export default memo(({value}:{value?:OrderParam}) => { //对应数量 const formatCount = useCallback((item) => { return value?.sale_mode == 0? item.roll : Number(item.length / 100) @@ -30,6 +35,18 @@ export default memo(({value}:{value:OrderParam|null}) => { if(value) return `${value?.total_fabrics}种面料，${value?.total_colors}种颜色，共${value?.total_number}${value?.unit}` }, [value]) + + const priceConDom = useMemo(() => { + return ( + <> + {(value&&value.status < 3)&&} + {(value&&value.status >= 3)&&} + {(value&&value.status >= 3)&&} + {(value&&value.status >= 3)&&} + + ) + }, [value]) + return ( <> {numText} @@ -63,7 +80,7 @@ export default memo(({value}:{value:OrderParam|null}) => { }) } - + {priceConDom} diff --git a/src/pages/order/components/orderState/index.module.scss b/src/pages/order/components/orderState/index.module.scss index c1aef8a..90dbcbb 100644 --- a/src/pages/order/components/orderState/index.module.scss +++ b/src/pages/order/components/orderState/index.module.scss @@ -16,6 +16,9 @@ .order_status_item{ position: relative; padding-left: 50px; + &:nth-last-child(n+2) { + padding-bottom: 30px; + } .order_status_tail_end, .order_status_tail{ width: 15px; height: 15px; diff --git a/src/pages/order/components/orderState/index.tsx b/src/pages/order/components/orderState/index.tsx index d710730..0ba593d 100644 --- a/src/pages/order/components/orderState/index.tsx +++ b/src/pages/order/components/orderState/index.tsx @@ -1,5 +1,5 @@ import { Image, Text, View } from "@tarojs/components" -import { memo, useState } from "react" +import { memo, useMemo, useState } from "react" import styles from './index.module.scss' import classnames from "classnames"; import { formatDateTime, formatImgUrl } from "@/common/fotmat"; @@ -14,23 +14,26 @@ export default memo(({list = []}:{list?:Param[]}) => { const changeMore = () => { setShowMore(() => !showMore) } + const dataList = useMemo(() => { + return list.reverse() + }, [list]) return ( <> - {(list.length > 0)&& + {(dataList.length > 0)&& - {list.map((item, index) => - {(list.length > 1)&&} - {(list.length != (index + 1))&&} + {dataList.map((item, index) => + {(dataList.length > 1)&&} + {(dataList.length != (index + 1))&&} {item.status} {formatDateTime(item.time)} - {item.tag} + {/* {item.tag} */} {item.desc} )} - {(list.length > 2) && changeMore()}> + {(dataList.length > 2) && changeMore()}> {showMore&&'收起详情'||'点击查看详情'} } diff --git a/src/pages/order/components/payment/index.tsx b/src/pages/order/components/payment/index.tsx index 65e5c71..a354b1f 100644 --- a/src/pages/order/components/payment/index.tsx +++ b/src/pages/order/components/payment/index.tsx @@ -1,5 +1,5 @@ import { Text, View } from "@tarojs/components"; -import { memo, useState } from "react"; +import { memo, useEffect, useState } from "react"; import AmountShow from "../amountShow"; import classnames from "classnames"; import styles from './index.module.scss' @@ -8,12 +8,28 @@ import MCheckbox from "@/components/checkbox"; import Popup from "@/components/popup"; import OfflinePay from "../offlinePay"; import ScanPay from "../scanPay"; +import { GetOrderPayApi, SubmitOrderPayApi } from "@/api/orderPay"; +import { formatPriceDiv } from "@/common/fotmat"; +import {alert} from "@/common/common" type Param = { show?: true|false, - onClose?: () => void + onClose?: () => void, + orderId?: number //应付单id } -export default memo(({show = false, onClose}:Param) => { + +type PayInfo = { + amount: string +} + +type PayStatus = 0|1|2|3|4|null //0:预存款， 1:账期，2：线下汇款， 3：扫码支付, 4:货到付款 +export default memo(({show = false, onClose, orderId = 0}:Param) => { + + //提交参数 + const [submitData, setSubmitData] = useState<{id:number, payment_method: PayStatus}>({ + id:0, + payment_method: null + }) //线下付款 const [offlinePayShow, setofflinePayShow] = useState(false) @@ -28,6 +44,45 @@ export default memo(({show = false, onClose}:Param) => { setScanPayShow(true) onClose?.() } + + //获取支付方式数据 + const [payInfo, setPayInfo] = useState() + const {fetchData: orderFetchData} = GetOrderPayApi() + const getOrderPay = async () => { + let {data} = await orderFetchData({id: orderId}) + setPayInfo(() => data) + } + useEffect(() => { + if(show&&orderId) + setSubmitData((val) => ({...val, id:orderId})) + getOrderPay() + }, [show, orderId]) + + //预存款选择 + const advanceSelectData = (val) => { + setSubmitData((e) => ({...e, payment_method:val})) + } + //账期选择 + const periodSelectData = (val) => { + setSubmitData((e) => ({...e, payment_method:val})) + } + + //提交支付 + const {fetchData: submitFetchData} = SubmitOrderPayApi() + const submitPay = async () => { + if(submitData.payment_method === null) { + alert.error('请选择支付方式') + return false + } + alert.loading('正在支付') + let res = await submitFetchData(submitData) + if(res.success) { + alert.success('支付成功') + } else { + alert.none(res.msg) + } + } + return ( @@ -35,7 +90,7 @@ export default memo(({show = false, onClose}:Param) => { 订单支付 - + @@ -59,19 +114,19 @@ export default memo(({show = false, onClose}:Param) => { 预存款 - 金额不足，剩余 ¥0.00 + 金额不足，剩余 ¥{payInfo?.advance_deposit_balance} - console.log()} onClose={() =>console.log()}/> + advanceSelectData(0)} onClose={() => advanceSelectData(null)}/> - x天账期 + {payInfo?.account_period}天账期 - 可用额度 ¥3,000.00 + 可用额度 ¥{payInfo?.account_period_credit_available_line} - console.log()} onClose={() =>console.log()}/> + periodSelectData(1)} onClose={() => periodSelectData(null)}/> @@ -93,7 +148,7 @@ export default memo(({show = false, onClose}:Param) => { - 确认交易 + 确认交易 setofflinePayShow(false)}/> diff --git a/src/pages/order/index.config.ts b/src/pages/order/index.config.ts index d88c826..b518f53 100644 --- a/src/pages/order/index.config.ts +++ b/src/pages/order/index.config.ts @@ -1,3 +1,5 @@ export default { - navigationBarTitleText: '订单详情' + navigationBarTitleText: '订单详情', + enablePullDownRefresh: true, + backgroundTextStyle: 'dark' } diff --git a/src/pages/order/index.tsx b/src/pages/order/index.tsx index cc718f3..5c9d498 100644 --- a/src/pages/order/index.tsx +++ b/src/pages/order/index.tsx @@ -3,17 +3,20 @@ import { EditSaleOrderRemarkApi, CancelOrderApi } from "@/api/order"; +import { GetOrderPayApi } from "@/api/orderPay"; import { alert, goLink } from "@/common/common"; import { formatDateTime, formatPriceDiv } from "@/common/fotmat"; import OrderBtns from "@/components/orderBtns"; import Popup from "@/components/popup"; import SearchInput from "@/components/searchInput"; import { Text, Textarea, View } from "@tarojs/components" -import Taro, { useDidShow, useRouter } from "@tarojs/taro"; +import Taro, { useDidShow, usePullDownRefresh, useRouter } from "@tarojs/taro"; import classnames from "classnames"; import { useCallback, useEffect, useMemo, useRef, useState } from "react"; +import order from "../orderList/components/order"; import AddressInfoDetail from "./components/addressInfoDetail"; import KindList from "./components/kindList"; +import orderState from "./components/orderState"; import OrderState from "./components/orderState"; import Payment from "./components/payment"; import Remark from "./components/remark"; @@ -37,7 +40,8 @@ import styles from './index.module.scss' let res = await getOrderFetchData({id: orderId.current}) setOrderDetail(res.data) setOrderRemark(res.data.remark) - } + } + Taro.stopPullDownRefresh() } //监听获取到的数据 @@ -57,7 +61,11 @@ import styles from './index.module.scss' total_number: orderDetail.total_number, //总数量 total_fabrics: orderDetail.total_fabrics, //面料数量 unit: orderDetail.sale_mode == 0?'条':'m', //单位 - list: orderDetail.product_list + list: orderDetail.product_list, + status: orderDetail.status, //订单状态 + total_sale_price: orderDetail.total_sale_price, //销售金额 + total_should_collect_money: orderDetail.total_should_collect_money, //应收金额 + total_weight_error_discount: orderDetail.total_weight_error_discount, //空差优惠 }) } const formatPreViewOrderMemo = useMemo(() => { @@ -125,7 +133,23 @@ import styles from './index.module.scss' getSaleOrderPreView() }, [orderDetail]) + //获取底部按钮点击, 获取按钮状态 + const orderStateClick = useCallback((val) => { + console.log('val::', val) + if(val == 1) { + //取消订单 + getSaleOrderPreView() + } + if(val == 2) { + //待付款 + toPay() + } + }, [orderDetail]) + //页面下拉刷新 + usePullDownRefresh(() => { + getSaleOrderPreView() + }) return ( @@ -161,13 +185,13 @@ import styles from './index.module.scss' - - toPay()}>去支付 + + {/* toPay()}>去支付 */} setShowDesc(false)} > getRemark(e)}/> - setPayMentShow(false)}/> + setPayMentShow(false)} orderId={orderDetail?.should_collect_order_id}/> ) diff --git a/src/pages/orderList/components/order/index.tsx b/src/pages/orderList/components/order/index.tsx index 659d18c..7ad9512 100644 --- a/src/pages/orderList/components/order/index.tsx +++ b/src/pages/orderList/components/order/index.tsx @@ -20,9 +20,10 @@ type Param = { total_number: number, status: 0, id: number - } + }, + onClickBtn?: (val:number) => void } -export default memo(({value}: Param) => { +export default memo(({value, onClickBtn}: Param) => { const userInfo = useSelector(state => state.userInfo) //对应数量 const formatCount = useCallback((item, sale_mode) => { @@ -33,49 +34,17 @@ export default memo(({value}: Param) => { return formatPriceDiv(price).toLocaleString() + '/' + (sale_mode == 1?'m':'kg') }, [value]) - - - //订单按钮按订单状态归类 - const orderBtnsList = useRef([ - { - value: [0, 1, 2, 9, 3], //取消订单按钮对应： 待接单，待配布，已配布, 待付款， 待发货 - label: '取消订单' - }, - { - value: [3, 9], //去付款按钮对应：待付款， 待发货 - label: '去付款' - }, - { - value: [3], //取消订单按钮对应： 待发货 - label: '申请退款' - }, - { - value: [4, 7, 8, 6], //取消订单按钮对应： 待收货, 已收货, 已完成, 已退款 - label: '查看物流' - }, - { - value: [4, 7, 6], //取消订单按钮对应： 待收货, 已收货, 已退款 - label: '申请退货' - }, - { - value: [4], //取消订单按钮对应： 待收货 - label: '确认收货' - }, - { - value: [4,7,8,6], //取消订单按钮对应： 待收货，已收货，已完成, 已退款 - label: '再次购买' - } - ]) - const orderBtnsShow = useCallback((item, status) => { - return item.value.includes(status) - },[]) + //点击订单按钮 + const orderBtnsClick = useCallback((status) => { + onClickBtn?.(status) + }, [value]) return ( goLink('/pages/order/index', {id: value?.id})}> - - {userInfo.adminUserInfo.user_name} + + {userInfo?.adminUserInfo?.user_name} 订单号：{value?.order_no} @@ -114,7 +83,7 @@ export default memo(({value}: Param) => { {`${value?.total_fabrics}种面料，${value?.total_colors}种颜色，共${value?.total_number}条`} - + ) }) diff --git a/src/pages/orderList/index.tsx b/src/pages/orderList/index.tsx index 8bceb49..04aedfe 100644 --- a/src/pages/orderList/index.tsx +++ b/src/pages/orderList/index.tsx @@ -1,7 +1,7 @@ import Search from "@/components/search" import useLogin from "@/use/useLogin" import { Image, ScrollView, Text, View } from "@tarojs/components" -import Taro, { useDidShow, useRouter } from "@tarojs/taro" +import Taro, { useDidShow, usePullDownRefresh, useRouter } from "@tarojs/taro" import { useCallback, useEffect, useMemo, useRef, useState } from "react" import {ORDER_STATUS} from '@/common/enum' import styles from './index.module.scss' @@ -44,7 +44,6 @@ export default () => { const getOrderList = async () => { let res = await listFetchData(getFilterData(searchField)) setOrderData({list: res.data.list, total: res.data.total}) - Taro.stopPullDownRefresh() } @@ -82,6 +81,17 @@ export default () => { setOrderData(() => ({list:[], total:0})) setSearchField((val) => ({...val, name:e, size:10})) }, []) + + const clickOrderBtn = useCallback((state) => { + getOrderList() + }, [orderData]) + + //列表下拉刷新 + const [refresherTriggeredStatus, setRefresherTriggeredStatus] = useState(false) + const getRefresherRefresh = async () => { + pageNum.current.size = 1 + setRefresherTriggeredStatus(true) + } return ( @@ -98,9 +108,9 @@ export default () => { - + {orderData?.list.map(item => { - return + return })} From 55cbaac8f5bdca9f50dca9163af83af3684049f9 Mon Sep 17 00:00:00 2001 From: czm <2192718639@qq.com> Date: Mon, 30 May 2022 20:32:47 +0800 Subject: [PATCH 6/8] =?UTF-8?q?=E8=AE=A2=E5=8D=95=E5=88=97=E8=A1=A8?= =?UTF-8?q?=E5=AF=B9=E6=8E=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/orderBtns/index.tsx | 14 ++- src/pages/details/index.tsx | 4 +- src/pages/order/components/payment/index.tsx | 23 ++-- src/pages/order/components/remark/index.tsx | 2 +- src/pages/order/index.module.scss | 1 + src/pages/order/index.tsx | 13 ++- .../orderStatusList/index.module.scss | 18 +++ .../components/orderStatusList/index.tsx | 46 ++++++++ src/pages/orderList/index.tsx | 17 +-- src/use/useCheckAuthorize.tsx | 2 +- src/use/useHttp.ts | 7 +- src/use/useLogin.ts | 69 +++--------- src/use/useLoginRequest.ts | 106 ++++++++++++++++++ src/use/useManualPullDownRefresh.ts | 24 ---- 14 files changed, 239 insertions(+), 107 deletions(-) create mode 100644 src/pages/orderList/components/orderStatusList/index.module.scss create mode 100644 src/pages/orderList/components/orderStatusList/index.tsx create mode 100644 src/use/useLoginRequest.ts delete mode 100644 src/use/useManualPullDownRefresh.ts diff --git a/src/components/orderBtns/index.tsx b/src/components/orderBtns/index.tsx index 3cc4690..efd97b1 100644 --- a/src/components/orderBtns/index.tsx +++ b/src/components/orderBtns/index.tsx @@ -8,9 +8,12 @@ import styles from './index.module.scss' type Param = { status?: number, //订单状态 orderId: number, //订单id + payModel: number, //支付方式 + realPayPrice: number, //实付金额 + pendingPayPrice: number, //待付金额 onClick?: (val: number) => void //点击后触发的事件，返回订单状态 } -export default memo(({status = 0, orderId = 0, onClick}:Param) => { +export default memo(({status = 0, orderId = 0, onClick, realPayPrice = 0, pendingPayPrice = 0}:Param) => { //订单按钮按订单状态归类 const orderBtnsList = useRef([ { @@ -49,15 +52,22 @@ export default memo(({status = 0, orderId = 0, onClick}:Param) => { label: '再次购买' } ]) + //判断是否显示该按钮 const orderBtnsShow = useCallback((item, status) => { + if(item.id == 1) { + return( realPayPrice == 0 && status <= 4) //在代发货之前没有付过款 + } + if(item.id == 2) { + return( pendingPayPrice != 0 && status <= 4) //在代发货之前没有付完款 + } return item.value.includes(status) + },[]) //点击按钮操作 const submitBtns = (val) => { (val == 1)&&cancelOrder(); //取消订单按钮 (val == 2)&&onClick?.(val); //去付款按钮 - } //取消订单 diff --git a/src/pages/details/index.tsx b/src/pages/details/index.tsx index 75f1899..c845f9e 100644 --- a/src/pages/details/index.tsx +++ b/src/pages/details/index.tsx @@ -8,7 +8,7 @@ import ShopCart from '@/components/shopCart'; import Preview,{colorItem} from './components/preview'; import styles from './index.module.scss' import { useEffect, useMemo, useState } from 'react'; -import {formatHashTag} from '@/common/fotmat' +import {formatHashTag, formatImgUrl} from '@/common/fotmat' import useManualPullDownRefresh from '@/use/useManualPullDownRefresh'; import { goLink } from '@/common/common'; import useUserInfo from '@/use/useUserInfo'; @@ -147,7 +147,7 @@ export default (props:params) => { {productInfo?.product_color_list?.map(item => { return getColorItem(item)}> - + {item.code} diff --git a/src/pages/order/components/payment/index.tsx b/src/pages/order/components/payment/index.tsx index a354b1f..3d6f42a 100644 --- a/src/pages/order/components/payment/index.tsx +++ b/src/pages/order/components/payment/index.tsx @@ -1,5 +1,5 @@ import { Text, View } from "@tarojs/components"; -import { memo, useEffect, useState } from "react"; +import { memo, useEffect, useMemo, useState } from "react"; import AmountShow from "../amountShow"; import classnames from "classnames"; import styles from './index.module.scss' @@ -15,7 +15,8 @@ import {alert} from "@/common/common" type Param = { show?: true|false, onClose?: () => void, - orderId?: number //应付单id + orderId?: number, //应付单id + onSubmitSuccess?: () => void //支付成功 } type PayInfo = { @@ -23,7 +24,7 @@ type PayInfo = { } type PayStatus = 0|1|2|3|4|null //0:预存款， 1:账期，2：线下汇款， 3：扫码支付, 4:货到付款 -export default memo(({show = false, onClose, orderId = 0}:Param) => { +export default memo(({show = false, onClose, orderId = 0, onSubmitSuccess}:Param) => { //提交参数 const [submitData, setSubmitData] = useState<{id:number, payment_method: PayStatus}>({ @@ -78,11 +79,19 @@ export default memo(({show = false, onClose, orderId = 0}:Param) => { let res = await submitFetchData(submitData) if(res.success) { alert.success('支付成功') + onSubmitSuccess?.() } else { alert.none(res.msg) } } + const advance_payment = useMemo(() => { + const price = formatPriceDiv(payInfo?.should_collect_money - payInfo?.amount_paid) + return ( + {(payInfo?.advance_deposit_balance < price)&&'余额不足，' }剩余 ¥{payInfo?.advance_deposit_balance} + ) + }, [payInfo]) + return ( @@ -90,7 +99,7 @@ export default memo(({show = false, onClose, orderId = 0}:Param) => { 订单支付 - + @@ -99,11 +108,11 @@ export default memo(({show = false, onClose, orderId = 0}:Param) => { 订单金额 - ¥6,001.00 + ¥{formatPriceDiv(payInfo?.should_collect_money)} 已付金额 - ¥1,801.00 + ¥{formatPriceDiv(payInfo?.amount_paid)} @@ -114,7 +123,7 @@ export default memo(({show = false, onClose, orderId = 0}:Param) => { 预存款 - 金额不足，剩余 ¥{payInfo?.advance_deposit_balance} + {advance_payment} advanceSelectData(0)} onClose={() => advanceSelectData(null)}/> diff --git a/src/pages/order/components/remark/index.tsx b/src/pages/order/components/remark/index.tsx index 67d6bb6..14d981b 100644 --- a/src/pages/order/components/remark/index.tsx +++ b/src/pages/order/components/remark/index.tsx @@ -27,7 +27,7 @@ export default ({onBlur, onSave}:Param) => { } return ( - 添加备注 + 编辑备注 {descData.number}/{descData.count} diff --git a/src/pages/order/index.module.scss b/src/pages/order/index.module.scss index 662cb6e..a032fbe 100644 --- a/src/pages/order/index.module.scss +++ b/src/pages/order/index.module.scss @@ -52,6 +52,7 @@ color: $color_font_two; margin-right: 10px; flex:1; + word-break:break-all; } .order_desc_text_hint{ text-align: right; diff --git a/src/pages/order/index.tsx b/src/pages/order/index.tsx index 5c9d498..c5043d5 100644 --- a/src/pages/order/index.tsx +++ b/src/pages/order/index.tsx @@ -151,6 +151,17 @@ import styles from './index.module.scss' getSaleOrderPreView() }) + //支付成功 + const onPaySuccess = useCallback(() => { + getSaleOrderPreView() + closePayShow() + }, [orderDetail]) + + //关闭支付弹窗 + const closePayShow = useCallback(() => { + setPayMentShow(() => false) + }, [orderDetail]) + return ( {/* @@ -191,7 +202,7 @@ import styles from './index.module.scss' setShowDesc(false)} > getRemark(e)}/> - setPayMentShow(false)} orderId={orderDetail?.should_collect_order_id}/> + ) diff --git a/src/pages/orderList/components/orderStatusList/index.module.scss b/src/pages/orderList/components/orderStatusList/index.module.scss new file mode 100644 index 0000000..47de83d --- /dev/null +++ b/src/pages/orderList/components/orderStatusList/index.module.scss @@ -0,0 +1,18 @@ +.order_status_list{ + font-size: $font_size; + color: #9E9E9E; + margin-top: 20px; + .order_status_item{ + padding: 20px; + box-sizing: border-box; + } + .selected{ + font-weight: 700; + color: #000; + border-bottom: 4px solid #707070; + } + .order_list_scroll{ + white-space: nowrap; + display: flex; + } +} \ No newline at end of file diff --git a/src/pages/orderList/components/orderStatusList/index.tsx b/src/pages/orderList/components/orderStatusList/index.tsx new file mode 100644 index 0000000..3e12f6f --- /dev/null +++ b/src/pages/orderList/components/orderStatusList/index.tsx @@ -0,0 +1,46 @@ +import { ScrollView, View } from "@tarojs/components" +import { memo, useEffect, useState } from "react" +import styles from './index.module.scss' +import classnames from "classnames"; + +type Param = { + list: {id: number, name: string}[], + defaultId?: number|null, + onSelect?: (val: number) => void +} +export default memo(({list = [], defaultId = null, onSelect}: Param) => { + const [selectInfo, setSelectInfo] = useState({ + selected: -1, //当前选中的id + tabId: '', //需要滚动到的id + }) + useEffect(() => { + if(defaultId) { + const index = list?.findIndex(item => { + console.log(item.id, defaultId) + return item.id == defaultId + }) + if(index !== -1) { + const num = index > 0?( index - 1) : 0 + setSelectInfo((e) => ({...e, tabId:list[num].id.toString()})) + } + } + }, [defaultId]) + const clickEvent = ({item, index}: {item:any, index:number}) => { + const num = index > 0?( index - 1) : 0 + setSelectInfo((e) => ({...e, tabId:list[num].id.toString(), selected: item.id})) + onSelect?.(item.id) + } + + return ( + + + + {list.map((item, index) => { + return clickEvent({item, index})} className={classnames(styles.order_status_item, (selectInfo.selected==item.id)&&styles.selected)}>{item.name} + })} + + + + ) +}) + diff --git a/src/pages/orderList/index.tsx b/src/pages/orderList/index.tsx index 04aedfe..866597b 100644 --- a/src/pages/orderList/index.tsx +++ b/src/pages/orderList/index.tsx @@ -3,14 +3,13 @@ import useLogin from "@/use/useLogin" import { Image, ScrollView, Text, View } from "@tarojs/components" import Taro, { useDidShow, usePullDownRefresh, useRouter } from "@tarojs/taro" import { useCallback, useEffect, useMemo, useRef, useState } from "react" -import {ORDER_STATUS} from '@/common/enum' import styles from './index.module.scss' import classnames from "classnames"; import Order from "./components/order" import InfiniteScroll from "@/components/infiniteScroll" import {GetOrderStatusListApi, GetOrderListApi} from '@/api/order' import { dataLoadingStatus, getFilterData } from "@/common/util" -import Tabs from "@/components/tabs" +import OrderStatusList from "./components/orderStatusList" export default () => { const {checkLogin} = useLogin() @@ -44,6 +43,7 @@ export default () => { const getOrderList = async () => { let res = await listFetchData(getFilterData(searchField)) setOrderData({list: res.data.list, total: res.data.total}) + setRefresherTriggeredStatus(() => false) } @@ -91,24 +91,17 @@ export default () => { const getRefresherRefresh = async () => { pageNum.current.size = 1 setRefresherTriggeredStatus(true) + setSearchField((val) => ({...val, size:10})) } return ( - - - - {statusList.map(item => { - return changeStatus(item.id)} className={classnames(styles.order_status_item, (searchField.status==item.id)&&styles.selected)}>{item.name} - })} - - - + - + {orderData?.list.map(item => { return })} diff --git a/src/use/useCheckAuthorize.tsx b/src/use/useCheckAuthorize.tsx index 05ae81f..d0ece73 100644 --- a/src/use/useCheckAuthorize.tsx +++ b/src/use/useCheckAuthorize.tsx @@ -8,7 +8,7 @@ type Param = { msg: string //检查不通过时警告 } export default ({scope, msg}: Param) => { - //检查授权 + //这个hook微信授权检查授权 const check = useCallback(() => { return new Promise((reslove, reject) => { Taro.getSetting({ diff --git a/src/use/useHttp.ts b/src/use/useHttp.ts index 74ee064..ead24a2 100644 --- a/src/use/useHttp.ts +++ b/src/use/useHttp.ts @@ -5,6 +5,8 @@ import { useEffect, useRef, useState } from 'react' import {BASE_URL, WX_APPID} from '@/common/constant' import useUserInfo from "./useUserInfo" import qs from 'qs'; +import useLogin from './useLogin'; +import useLoginRequest from './useLoginRequest'; type Params = { @@ -122,6 +124,7 @@ export const useRequest = (options:option = { const stateRef = useRef({...params}) const [state, setState] = useState({...stateRef.current}) const {removeToken, removeSessionKey} = useUserInfo() + const {login} = useLoginRequest() useEffect(() => { console.log('变化::', state.loading) @@ -176,9 +179,7 @@ export const useRequest = (options:option = { if (statusCode === 401) { removeToken() removeSessionKey() - // Taro.reLaunch({ - // url: router.path +'?' + qs.stringify(router.params) - // }) + login() } else { Taro.showToast({ title: `错误：${showStatus(statusCode)}`, diff --git a/src/use/useLogin.ts b/src/use/useLogin.ts index 45847ef..aa662d7 100644 --- a/src/use/useLogin.ts +++ b/src/use/useLogin.ts @@ -1,69 +1,31 @@ import { useEffect, useState } from "react" -import { WX_APPID } from "@/common/constant" +import {BASE_URL, WX_APPID } from "@/common/constant" import useUserInfo from "./useUserInfo" import Taro, { useRouter } from "@tarojs/taro" import { LoginApi } from "@/api/login" import { GetWxUserInfoApi, GetAdminUserInfoApi, GetPhoneNumberApi } from "@/api/user" import qs from 'qs'; +import useLoginRequest from "./useLoginRequest" export default () => { - const {setToken, setSessionKey, setUserInfo, setAdminUserInfo, userInfo} = useUserInfo() + const {setUserInfo, setAdminUserInfo, userInfo} = useUserInfo() useEffect(() => { console.log('userInfo::',userInfo.token) }, [userInfo]) - const router = useRouter() - //登录请求 - const {fetchData} = LoginApi() - - //微信登录 - const wxLogin = () => { - return new Promise((reslove, reject) => { - Taro.login({ - success: async (res) => { - if (res.code) { - const {data, success, msg} = await fetchData({js_code: res.code}) - if(success) { - console.log('token::',data.token) - setToken(data.token) - setSessionKey(data.session_key) - reslove(data) - let params = router.params - delete params.$taroTimestamp - console.log('params::',params) - if(router.path === '/pages/index/index' || router.path === '/pages/user/index') { - Taro.reLaunch({ - url: router.path +'?' + qs.stringify(params) - }) - } else { - Taro.redirectTo({ - url: router.path +'?' + qs.stringify(params) - }) - } - getAdminUserInfo() + //登录请求 (调用这个就不能再useHttp中使用，当前这个hook, 否则会死循环内存溢出) + // const {fetchData} = LoginApi() - //todo 删除本地授权用户信息，获取最新授权信息 - - } else { - Taro.showToast({ - title:'登录失败', - icon:"none" - }) - reject(msg) - } - } else { - console.log('登录失败！' + res.errMsg) - reject(res.errMsg) - } - }, - fail: function(e) { - console.log('登录失败！::',e) - reject(e) - } - }) - }) - + //登录请求 + const {login} = useLoginRequest() + const wxLogin = async () => { + try { + await login() + getAdminUserInfo() + } catch(e) { + console.log('登录失败::',e) + } } //获取用户信息 @@ -83,6 +45,7 @@ export default () => { Taro.checkSession({ success: async () => { reslove(true) + if(!userInfo.adminUserInfo) getAdminUserInfo() }, fail: async () => { await wxLogin() @@ -91,8 +54,6 @@ export default () => { }) } }) - - } //获取用户头像等信息数据 diff --git a/src/use/useLoginRequest.ts b/src/use/useLoginRequest.ts new file mode 100644 index 0000000..dc7d55e --- /dev/null +++ b/src/use/useLoginRequest.ts @@ -0,0 +1,106 @@ +import {BASE_URL, WX_APPID } from "@/common/constant" +import Taro, { useRouter } from "@tarojs/taro" +import { useRef, useState } from "react" +import qs from 'qs' +import useUserInfo from "./useUserInfo" + +//开这个hook 主要是为了让useHttp 能够调用 + +type Param = {success: true|false, data: any, msg: string, code: null|number, loading: false|true} +export default () => { + let initData = { + success: false, + data: null, + msg: '', + code: null, + loading: false + } + let loginData = useRef(initData) + const {setToken, setSessionKey} = useUserInfo() + const router = useRouter() + //微信登录请求v2 + const fetchData = async (login_code) => { + const q = { + url: BASE_URL + '/v1/mall/login', + header: { + "Platform": 6, + "Appid": WX_APPID, + }, + method: 'post', + data:{js_code: login_code} + } + try{ + const result = await Taro.request(q as any) + const {code, data, msg} = result.data + if(result.statusCode === 200) { + loginData.current.success = (code === 0 ? true : false) + loginData.current.code = code + loginData.current.msg = msg + loginData.current.data = data + } else { + Taro.showToast({ + title: `错误：登录失败`, + icon: 'none' + }) + console.log('登录错误：', result.errMsg) + + } + }catch(e) { + Taro.showToast({ + title: `错误：登录失败`, + icon: 'none' + }) + console.log('登录错误：', e.errMsg) + } + return loginData.current + } + + //微信登录 + const login = () => { + return new Promise((reslove, reject) => { + Taro.login({ + success: async (res) => { + if (res.code) { + const {data, success, msg} = await fetchData(res.code) + if(success) { + setToken(data.token) + setSessionKey(data.session_key) + reslove(data) + let params = router.params + delete params.$taroTimestamp + if(router.path === '/pages/index/index' || router.path === '/pages/user/index') { + Taro.reLaunch({ + url: router.path +'?' + qs.stringify(params) + }) + } else { + Taro.redirectTo({ + url: router.path +'?' + qs.stringify(params) + }) + } + } else { + Taro.showToast({ + title:'登录失败', + icon:"none" + }) + reject(msg) + } + } else { + console.log('登录失败！' + res.errMsg) + reject(res.errMsg) + } + }, + fail: function(e) { + console.log('登录失败！::',e) + reject(e) + } + }) + }) + + } + + return { + login + } + +} + diff --git a/src/use/useManualPullDownRefresh.ts b/src/use/useManualPullDownRefresh.ts deleted file mode 100644 index 4ff1ff3..0000000 --- a/src/use/useManualPullDownRefresh.ts +++ /dev/null @@ -1,24 +0,0 @@ -import Taro, { usePullDownRefresh } from "@tarojs/taro" -import { useCallback, useState } from "react" - -type Arg = {[index:string]:any} -export default (fn?:(val:Arg) => any, arg?:Arg) => { - const [data, setData] = useState({}) - - usePullDownRefresh(() => { - getData() - }) - - const getData = useCallback(() => { - setTimeout(() => { - const res = fn?.({...arg}) - setData((e) => ({...e, res})) - Taro.stopPullDownRefresh() - }, 1000) - }, []) - - return { - getData, - data - } -} \ No newline at end of file From 864f2342b6dfe3003254ce36ca5421504fb113ff Mon Sep 17 00:00:00 2001 From: czm <2192718639@qq.com> Date: Tue, 31 May 2022 10:16:21 +0800 Subject: [PATCH 7/8] =?UTF-8?q?=E8=AE=A2=E5=8D=95=E5=88=97=E8=A1=A8?= =?UTF-8?q?=E5=AF=B9=E6=8E=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/orderBtns/index.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/orderBtns/index.tsx b/src/components/orderBtns/index.tsx index efd97b1..736fd9d 100644 --- a/src/components/orderBtns/index.tsx +++ b/src/components/orderBtns/index.tsx @@ -61,7 +61,6 @@ export default memo(({status = 0, orderId = 0, onClick, realPayPrice = 0, pendin return( pendingPayPrice != 0 && status <= 4) //在代发货之前没有付完款 } return item.value.includes(status) - },[]) //点击按钮操作 From b5c4500866da14819354ed5d712132670eecfc5f Mon Sep 17 00:00:00 2001 From: czm <2192718639@qq.com> Date: Tue, 31 May 2022 10:27:07 +0800 Subject: [PATCH 8/8] =?UTF-8?q?=E8=AE=A2=E5=8D=95=E5=88=97=E8=A1=A8?= =?UTF-8?q?=E5=AF=B9=E6=8E=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/orderBtns/index.tsx | 20 +++++++++++--------- src/pages/order/index.tsx | 13 ++++++++++++- 2 files changed, 23 insertions(+), 10 deletions(-) diff --git a/src/components/orderBtns/index.tsx b/src/components/orderBtns/index.tsx index 736fd9d..4ae23d6 100644 --- a/src/components/orderBtns/index.tsx +++ b/src/components/orderBtns/index.tsx @@ -6,14 +6,16 @@ import { useCallback, useRef, memo } from "react" import styles from './index.module.scss' type Param = { - status?: number, //订单状态 - orderId: number, //订单id - payModel: number, //支付方式 - realPayPrice: number, //实付金额 - pendingPayPrice: number, //待付金额 + orderInfo: { + status?: number, //订单状态 + orderId: number, //订单id + payModel: number, //支付方式 + realPayPrice: number, //实付金额 + pendingPayPrice: number, //待付金额 + }, onClick?: (val: number) => void //点击后触发的事件，返回订单状态 } -export default memo(({status = 0, orderId = 0, onClick, realPayPrice = 0, pendingPayPrice = 0}:Param) => { +export default memo(({orderInfo, onClick}:Param) => { //订单按钮按订单状态归类 const orderBtnsList = useRef([ { @@ -55,10 +57,10 @@ export default memo(({status = 0, orderId = 0, onClick, realPayPrice = 0, pendin //判断是否显示该按钮 const orderBtnsShow = useCallback((item, status) => { if(item.id == 1) { - return( realPayPrice == 0 && status <= 4) //在代发货之前没有付过款 + return( orderInfo.realPayPrice == 0 && status <= 4) //在代发货之前没有付过款 } if(item.id == 2) { - return( pendingPayPrice != 0 && status <= 4) //在代发货之前没有付完款 + return( orderInfo.pendingPayPrice != 0 && status <= 4) //在代发货之前没有付完款 } return item.value.includes(status) },[]) @@ -76,7 +78,7 @@ export default memo(({status = 0, orderId = 0, onClick, realPayPrice = 0, pendin title: '要取消该订单吗？', success: async function (res) { if (res.confirm) { - let res = await cancelFetchData({id: orderId}) + let res = await cancelFetchData({id: orderInfo.orderId}) if(res.success) { alert.success('取消成功') onClick?.(1) diff --git a/src/pages/order/index.tsx b/src/pages/order/index.tsx index c5043d5..abeee6e 100644 --- a/src/pages/order/index.tsx +++ b/src/pages/order/index.tsx @@ -162,6 +162,17 @@ import styles from './index.module.scss' setPayMentShow(() => false) }, [orderDetail]) + //按钮所需数据 + const orderInfo = useMemo(() => { + return { + status: orderDetail?.status, + orderId: orderDetail?.id, + payModel: orderDetail?.id, //支付方式 + realPayPrice: orderDetail?.id, //实付金额 + pendingPayPrice: orderDetail?.id, //待付金额 + } + }, [orderDetail]) + return ( {/* @@ -196,7 +207,7 @@ import styles from './index.module.scss' - + {/* toPay()}>去支付 */} setShowDesc(false)} >