剪板流程
This commit is contained in:
@@ -144,16 +144,15 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
|
||||
const {getSelfUserInfo} = UseLogin()
|
||||
const {fetchData:addFetchData} = AddShoppingCartApi()
|
||||
const addShopCart = async () => {
|
||||
// try {
|
||||
// await getSelfUserInfo()
|
||||
// } catch(msg) {
|
||||
// Taro.showToast({
|
||||
// icon:'none',
|
||||
// title:'授权失败,请求完善授权'
|
||||
// })
|
||||
// return false
|
||||
// }
|
||||
|
||||
try {
|
||||
await getSelfUserInfo()
|
||||
} catch(msg) {
|
||||
Taro.showToast({
|
||||
icon:'none',
|
||||
title:'授权失败,请求完善授权'
|
||||
})
|
||||
return false
|
||||
}
|
||||
if(selectCount.sumCount == 0) {
|
||||
Taro.showToast({
|
||||
icon:'none',
|
||||
@@ -161,6 +160,7 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
|
||||
})
|
||||
return false
|
||||
}
|
||||
|
||||
const state = await addFetchData({
|
||||
"sale_mode": selectIndex,
|
||||
color_list: selectCount.color_list
|
||||
|
||||
@@ -89,6 +89,21 @@
|
||||
}
|
||||
|
||||
}
|
||||
.logisticsBtn{
|
||||
width: 152px;
|
||||
height: 72px;
|
||||
background: #ffffff;
|
||||
border: 2px solid #dddddd;
|
||||
border-radius: 38px;
|
||||
position: absolute;
|
||||
bottom: 10px;
|
||||
right: 10px;
|
||||
z-index: 999;
|
||||
font-size: 28px;
|
||||
color: #707070;
|
||||
text-align: center;
|
||||
line-height: 72px;
|
||||
}
|
||||
.order_address_text_no{
|
||||
flex: 1;
|
||||
font-size: $font_size;
|
||||
|
||||
@@ -1,11 +1,12 @@
|
||||
import { EditSaleOrderAddressApi, EditSaleOrderShipmentModeApi } from "@/api/order";
|
||||
import { alert } from "@/common/common";
|
||||
import { ORDER_STATUS } from "@/common/enum";
|
||||
import { debounce } from "@/common/util";
|
||||
import AddressList from "@/components/AddressList";
|
||||
import Popup from "@/components/popup";
|
||||
import { Text, View } from "@tarojs/components"
|
||||
import classnames from "classnames";
|
||||
import { forwardRef, memo, useCallback, useEffect, useImperativeHandle, useMemo, useState } from "react";
|
||||
import { forwardRef, memo, useEffect, useImperativeHandle, useMemo, useState } from "react";
|
||||
import styles from './index.module.scss'
|
||||
|
||||
export type AddressInfoParam = {
|
||||
@@ -18,15 +19,18 @@ export type AddressInfoParam = {
|
||||
phone: string,
|
||||
}
|
||||
type Param = {
|
||||
onSelect?: (val:any) => void, //选择
|
||||
onSelect?: (val:any) => void, //选择地址
|
||||
defaultValue?: AddressInfoParam|null, //默认值
|
||||
disabled?: false|true, //true禁用后只用于展示
|
||||
shipment_mode?: 1|2, //1自提 2物流
|
||||
onChangeShipmentMode?: (val: number) => void, //返回收货方式
|
||||
orderId?: number //订单id
|
||||
orderInfo?: {
|
||||
orderId: number //订单id
|
||||
shipment_mode: 1|2, //1自提 2物流
|
||||
status: number //订单状态
|
||||
}
|
||||
}
|
||||
|
||||
export default memo(forwardRef(({onSelect, onChangeShipmentMode, defaultValue = null, orderId = 0, shipment_mode = 1}: Param, ref) => {
|
||||
export default memo(forwardRef(({onSelect, onChangeShipmentMode, defaultValue = null, orderInfo}: Param, ref) => {
|
||||
const [showAddressList, setShowAddressList] = useState(false)
|
||||
|
||||
useEffect(() => {
|
||||
@@ -42,13 +46,14 @@ export default memo(forwardRef(({onSelect, onChangeShipmentMode, defaultValue =
|
||||
}, [userInfo])
|
||||
|
||||
const changeShow = () => {
|
||||
if(receivingStatus == 2)
|
||||
if(receivingStatus == 2 && !logisticsShow)
|
||||
setShowAddressList(() => true)
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
setReceivingStatus(() => shipment_mode)
|
||||
}, [shipment_mode])
|
||||
if(orderInfo)
|
||||
setReceivingStatus(() => orderInfo.shipment_mode)
|
||||
}, [orderInfo])
|
||||
|
||||
//把内部方法提供给外部
|
||||
useImperativeHandle(ref, () => ({
|
||||
@@ -63,8 +68,9 @@ export default memo(forwardRef(({onSelect, onChangeShipmentMode, defaultValue =
|
||||
changeReceivingStatus(value)
|
||||
}
|
||||
const changeReceivingStatus = debounce(async (value) => {
|
||||
if(!orderInfo) return false
|
||||
alert.loading('正在修改')
|
||||
const res = await shipmentModeFetchData({id: orderId, shipment_mode:value})
|
||||
const res = await shipmentModeFetchData({id: orderInfo.orderId, shipment_mode:value})
|
||||
if(res.success) {
|
||||
alert.success('收货方式修改成功')
|
||||
onChangeShipmentMode?.(value)
|
||||
@@ -78,8 +84,9 @@ export default memo(forwardRef(({onSelect, onChangeShipmentMode, defaultValue =
|
||||
const [addressId, setAddressId] = useState(0)
|
||||
const {fetchData: addressFetchData} = EditSaleOrderAddressApi()
|
||||
const getAddress = async (value) => {
|
||||
if(!orderInfo) return false
|
||||
alert.loading('正在修改')
|
||||
const res = await addressFetchData({id: orderId, address_id: value.id})
|
||||
const res = await addressFetchData({id: orderInfo.orderId, address_id: value.id})
|
||||
if(res.success) {
|
||||
alert.success('地址修改成功')
|
||||
onSelect?.(value)
|
||||
@@ -91,6 +98,21 @@ export default memo(forwardRef(({onSelect, onChangeShipmentMode, defaultValue =
|
||||
}
|
||||
}
|
||||
|
||||
//订单状态
|
||||
const {
|
||||
SaleOrderStatusWaitingReceipt,
|
||||
SaleOrderStatusAlreadyReceipt,
|
||||
SaleOrderStatusComplete,
|
||||
SaleOrderStatusRefund,
|
||||
SaleOrderStatusCancel
|
||||
} = ORDER_STATUS
|
||||
|
||||
//根据订单状态判断是否显示物流
|
||||
const logisticsShowList = [SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value]
|
||||
const logisticsShow = useMemo(() => {
|
||||
return logisticsShowList.includes(orderInfo?.status as number)
|
||||
}, [orderInfo])
|
||||
|
||||
return (
|
||||
<View>
|
||||
<View className={styles.order_address} onClick={() => changeShow()}>
|
||||
@@ -98,20 +120,23 @@ export default memo(forwardRef(({onSelect, onChangeShipmentMode, defaultValue =
|
||||
<View className={styles.order_address_text_con}>
|
||||
<View className={styles.order_address_text_title}>
|
||||
<Text className={styles.address_text}>{formatAddress}</Text>
|
||||
{(receivingStatus == 2)&&<Text className={classnames(styles.moreIconfont,'iconfont icon-a-moreback')}></Text>}
|
||||
{(receivingStatus == 2 && !logisticsShow)&&<Text className={classnames(styles.moreIconfont,'iconfont icon-a-moreback')}></Text>}
|
||||
</View>
|
||||
<View className={styles.order_address_text_name}>
|
||||
<Text>{userInfo?.name}</Text>
|
||||
<Text>{userInfo?.phone}</Text>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.updateBtn}>
|
||||
{!logisticsShow&&<View className={styles.updateBtn}>
|
||||
<View className={styles.updateBtn_list}>
|
||||
<View className={classnames(styles.updateBtn_item, receivingStatus==1&&styles.updateBtn_item_select)} onClick={(e) => onReceivingStatus(1,e)}>自提</View>
|
||||
<View className={classnames(styles.updateBtn_item, receivingStatus==2&&styles.updateBtn_item_select)} onClick={(e) => onReceivingStatus(2,e)}>物流</View>
|
||||
</View>
|
||||
<View style={{transform: receivingStatus==1?'translateX(0)':'translateX(100%)'}} className={classnames(styles.updateBtn_select)}></View>
|
||||
</View>
|
||||
</View>||
|
||||
<View className={styles.logisticsBtn}>
|
||||
查看物流
|
||||
</View>}
|
||||
</View>
|
||||
<Popup show={showAddressList} showTitle={false} onClose={() => setShowAddressList(false)}>
|
||||
<View className={styles.order_address_list}>
|
||||
|
||||
@@ -40,7 +40,7 @@
|
||||
|
||||
.order_list_item {
|
||||
display: flex;
|
||||
&:nth-child(2) {
|
||||
&:nth-child(n + 2) {
|
||||
margin-top: 30px;
|
||||
}
|
||||
.order_list_item_img{
|
||||
|
||||
@@ -40,8 +40,10 @@ export default memo(({order, comfirm = false}:Param) => {
|
||||
|
||||
//数量格式
|
||||
const numText = useMemo(() => {
|
||||
if(order)
|
||||
return `${order?.total_fabrics}种面料,${order?.total_colors}种颜色,共${order?.total_number}${order?.unit}`
|
||||
if(order) {
|
||||
let total_number = order?.sale_mode == 0?order?.total_number:(order?.total_number/100)
|
||||
return `${order?.total_fabrics}种面料,${order?.total_colors}种颜色,共${total_number}${order?.unit}`
|
||||
}
|
||||
}, [order])
|
||||
|
||||
const {
|
||||
|
||||
@@ -15,7 +15,7 @@
|
||||
}
|
||||
.order_status_item{
|
||||
position: relative;
|
||||
padding-left: 50px;
|
||||
// padding-left: 50px;
|
||||
&:nth-last-child(n+2) {
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
@@ -44,6 +44,7 @@
|
||||
.order_status_content{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 30px;
|
||||
.order_status_title{
|
||||
color: $color_font_two;
|
||||
font-size: $font_size;
|
||||
@@ -75,6 +76,24 @@
|
||||
.order_status_des_select{
|
||||
color: $color_font_one;
|
||||
}
|
||||
.pay_time{
|
||||
height: 56px;
|
||||
background: #f6f6f6;
|
||||
border-radius: 20px;
|
||||
color: #3C3C3C;
|
||||
font-size: 24px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-weight: 700;
|
||||
margin-top: 20px;
|
||||
text{
|
||||
font-size: 28px;
|
||||
color: $color_main;
|
||||
padding: 0 10px;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
.more{
|
||||
width: 100%;
|
||||
@@ -102,4 +121,17 @@
|
||||
top: -10px;
|
||||
right: -10px;
|
||||
}
|
||||
.refresh{
|
||||
position: absolute;
|
||||
top: 23px;
|
||||
right: 20px;
|
||||
display: flex;
|
||||
color: #707070;
|
||||
.mconfont{
|
||||
font-size: 30px;
|
||||
}
|
||||
.refresh_text{
|
||||
font-size: 23px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -3,40 +3,53 @@ import { memo, useMemo, useState } from "react"
|
||||
import styles from './index.module.scss'
|
||||
import classnames from "classnames";
|
||||
import { formatDateTime, formatImgUrl } from "@/common/fotmat";
|
||||
import { PAYMENT_METHOD, PAYMENT_METHOD_PARAM } from "@/common/enum";
|
||||
import { ORDER_STATUS, PAYMENT_METHOD, PAYMENT_METHOD_PARAM } from "@/common/enum";
|
||||
|
||||
|
||||
|
||||
type Param = {
|
||||
list: {
|
||||
status: string,
|
||||
time: string,
|
||||
tag: string,
|
||||
desc: string
|
||||
}[],
|
||||
payment_method: 0|PAYMENT_METHOD_PARAM,
|
||||
|
||||
type List = {
|
||||
status: string,
|
||||
time: string,
|
||||
tag: string,
|
||||
desc: string
|
||||
}
|
||||
|
||||
//支付方式枚举
|
||||
const {
|
||||
PaymentMethodAccountPeriod,
|
||||
PaymentMethodCashOnDelivery,
|
||||
} = PAYMENT_METHOD
|
||||
type Param = {
|
||||
onRefresh?: () => void,
|
||||
orderInfo?: {
|
||||
logistics_details:List[], //订单状态列表
|
||||
payment_method: 0|PAYMENT_METHOD_PARAM, //支付方式
|
||||
status: number //订单状态
|
||||
}
|
||||
}
|
||||
|
||||
export default memo(({list = [], payment_method = 0}:Param) => {
|
||||
|
||||
|
||||
export default memo(({orderInfo = {logistics_details: [],payment_method: 0, status: 0}, onRefresh}:Param) => {
|
||||
|
||||
const [showMore, setShowMore] = useState(false)
|
||||
const changeMore = () => {
|
||||
setShowMore(() => !showMore)
|
||||
}
|
||||
const dataList = useMemo(() => {
|
||||
return list.reverse()
|
||||
}, [list])
|
||||
return orderInfo?.logistics_details?.reverse()||[]
|
||||
}, [orderInfo])
|
||||
|
||||
//订单状态枚举
|
||||
const {SaleorderstatusWaitingPrePayment} = ORDER_STATUS
|
||||
|
||||
//支付方式枚举
|
||||
const {
|
||||
PaymentMethodAccountPeriod,
|
||||
PaymentMethodCashOnDelivery,
|
||||
} = PAYMENT_METHOD
|
||||
|
||||
//倒计时
|
||||
const count_down = useMemo(() => {
|
||||
|
||||
}, [orderInfo])
|
||||
|
||||
return (
|
||||
<>
|
||||
{(dataList.length > 0)&&<View className={styles.order_flow_state}>
|
||||
{(dataList?.length > 0)&&<View className={styles.order_flow_state}>
|
||||
<View className={classnames(styles.order_status_list, showMore&&styles.order_status_list_show)}>
|
||||
{dataList.map((item, index) => <View className={styles.order_status_item}>
|
||||
{(dataList.length > 1)&&<View className={classnames(styles.order_status_tail, (index == 0)&&styles.order_status_tail_end)}></View>}
|
||||
@@ -47,6 +60,9 @@ export default memo(({list = [], payment_method = 0}:Param) => {
|
||||
{/* <View className={classnames(styles.order_status_tag, (index == 0)&&styles.order_status_tag_select)}>{item.tag}</View> */}
|
||||
</View>
|
||||
<Text className={classnames(styles.order_status_des, (index == 0)&&styles.order_status_des_select)}>{item.desc}</Text>
|
||||
{(orderInfo.status == SaleorderstatusWaitingPrePayment.value)&&<View className={styles.pay_time}>
|
||||
剩<Text>23:58:55</Text>支付关闭,订单自动取消
|
||||
</View>}
|
||||
</View>)}
|
||||
</View>
|
||||
{(dataList.length > 2) && <View className={styles.more} onClick={() => changeMore()}>
|
||||
@@ -54,8 +70,12 @@ export default memo(({list = [], payment_method = 0}:Param) => {
|
||||
<Text className={classnames('iconfont icon-a-moreback', styles.miconfonts, showMore&&styles.open_miconfonts)}></Text>
|
||||
</View>}
|
||||
<View className={styles.image_tag}>
|
||||
{(payment_method == PaymentMethodCashOnDelivery.value)&&<Image mode="aspectFit" src={formatImgUrl('/mall/order_pay_status.png')} className={styles.image}/>}
|
||||
{(payment_method == PaymentMethodAccountPeriod.value)&&<Image mode="aspectFit" src={formatImgUrl('/mall/order_pay_status_7day.png')} className={styles.image}/>}
|
||||
{(orderInfo.payment_method == PaymentMethodCashOnDelivery.value)&&<Image mode="aspectFit" src={formatImgUrl('/mall/order_pay_status.png')} className={styles.image}/>}
|
||||
{(orderInfo.payment_method == PaymentMethodAccountPeriod.value)&&<Image mode="aspectFit" src={formatImgUrl('/mall/order_pay_status_7day.png')} className={styles.image}/>}
|
||||
</View>
|
||||
<View className={styles.refresh} onClick={onRefresh}>
|
||||
<Text className={classnames(styles.mconfont, 'iconfont icon-xianxiahuikuan')}></Text>
|
||||
<Text className={classnames(styles.refresh_text)}>刷新</Text>
|
||||
</View>
|
||||
</View>}
|
||||
</>
|
||||
|
||||
@@ -126,6 +126,11 @@ import styles from './index.module.scss'
|
||||
setPayMentShow(true)
|
||||
}
|
||||
|
||||
//地址组件所需数据
|
||||
const addressInfoDetailData = useMemo(() => {
|
||||
return {orderId:orderDetail?.id, shipment_mode:orderDetail?.shipment_mode, status: orderDetail?.status}
|
||||
}, [orderDetail])
|
||||
|
||||
//打开地址修改
|
||||
const addressRef = useRef<any>(null)
|
||||
|
||||
@@ -174,6 +179,7 @@ import styles from './index.module.scss'
|
||||
settle_mode: orderDetail?.settle_mode,
|
||||
actual_amount: orderDetail?.actual_amount, //实付金额
|
||||
wait_pay_amount: orderDetail?.wait_pay_amount, //待付金额
|
||||
sale_mode: orderDetail?.sale_mode, //订单类型
|
||||
}
|
||||
}, [orderDetail])
|
||||
|
||||
@@ -184,12 +190,9 @@ import styles from './index.module.scss'
|
||||
|
||||
return (
|
||||
<View className={styles.order_main}>
|
||||
{/* <View className={styles.weight_memo_con}>
|
||||
<WeightMemo/>
|
||||
</View> */}
|
||||
<OrderState list={orderDetail?.logistics_details} payment_method={orderDetail?.payment_method}/>
|
||||
<OrderState orderInfo={{logistics_details:orderDetail?.logistics_details, payment_method: orderDetail?.payment_method, status:orderDetail?.status}}/>
|
||||
<View >
|
||||
<AddressInfoDetail orderId={orderDetail?.id} onSelect={getAddress} onChangeShipmentMode={getShipmentMode} ref={addressRef} defaultValue={defaultAddress} shipment_mode={orderDetail?.shipment_mode}/>
|
||||
<AddressInfoDetail orderInfo={addressInfoDetailData} onSelect={getAddress} onChangeShipmentMode={getShipmentMode} ref={addressRef} defaultValue={defaultAddress} />
|
||||
</View>
|
||||
<KindList order={formatPreViewOrderMemo}/>
|
||||
<View className={styles.order_info} >
|
||||
|
||||
@@ -55,6 +55,7 @@ export default memo(({value, onClickBtn}: Param) => {
|
||||
orderId: value?.id,
|
||||
actual_amount: value?.actual_amount, //实付金额
|
||||
wait_pay_amount: value?.wait_pay_amount, //待付金额
|
||||
sale_mode: value?.sale_mode, //订单类型
|
||||
}
|
||||
}, [value])
|
||||
|
||||
|
||||
Reference in New Issue
Block a user