订单按钮优化完成

This commit is contained in:
czm 2022-07-15 21:09:46 +08:00
parent b688195a60
commit 3eafc7539f
18 changed files with 158 additions and 875 deletions

View File

@ -42,7 +42,7 @@ export const weightDigit = 1000
*/
export const formatPriceDiv = (val, digit = Digit, priceStatus = false) => {
let res = strip(Number(val / digit)) || 0
return priceStatus?res.toLocaleString('en', {minimumFractionDigits: 2}):res
return priceStatus?res.toLocaleString('zh', {minimumFractionDigits: 2}):res
}
/**
* 乘以

View File

@ -38,73 +38,49 @@ export default memo(({orderInfo, onClick, fixedBottom = true}:Param) => {
ReturnApplyOrderTypeSalesRefund // 销售退款
} = REFUND_STATUS_ORDER
//订单类型
// const {
// SaLeModeBulk,
// SaleModeLengthCut,
// SaLeModeWeightCut,
// } = SALE_MODE
//注册订单
const orderBtnsList = useRef([
//注册按钮
type orderBtnsListParams = {id: number, label: string, validatarFunc: (val: typeof orderInfo) => any}
const orderBtnsList = useRef<orderBtnsListParams[]>([
{
id: 8,
big_value: [ReturnStageQualityCheckPendingRefund.value, ReturnStageServiceOrderPendingRefund.value],
cut_value: [ReturnStageQualityCheckPendingRefund.value, ReturnStageServiceOrderPendingRefund.value, ReturnStageReturned.value ],
model_value: [],
label: '申请记录'
label: '申请记录',
validatarFunc: (orderInfo) => {
if(orderInfo.sale_mode !== 1) return [ReturnStageQualityCheckPendingRefund.value, ReturnStageServiceOrderPendingRefund.value, ReturnStageReturned.value].includes(orderInfo.stage)
return false
},
},
{
id: 1,
big_value: [ReturnStageApplying.value, ReturnStageWaitCheck.value],
cut_value: [ReturnStageApplying.value, ReturnStageWaitCheck.value, ],
model_value: [],
label: '取消退货'
label: '取消退货',
validatarFunc: (orderInfo) => {
if(orderInfo.sale_mode !== 1) return [ReturnStageApplying.value, ReturnStageWaitCheck.value].includes(orderInfo.stage)
return false
}
},
{
id: 4,
big_value: [ReturnStageQualityCheckPendingRefund.value, ReturnStageServiceOrderPendingRefund.value, ReturnStageReturned.value],
cut_value: [ReturnStageQualityCheckPendingRefund.value, ReturnStageServiceOrderPendingRefund.value, ReturnStageReturned.value],
model_value: [],
label: '质检结果'
label: '质检结果',
validatarFunc: (orderInfo) => {
if(orderInfo.sale_mode !== 1) return [ReturnStageQualityCheckPendingRefund.value, ReturnStageServiceOrderPendingRefund.value, ReturnStageReturned.value].includes(orderInfo.stage)
return false
}
},
{
id: 6,
big_value: [ReturnStageApplying.value, ReturnStageServiceOrderPendingRefund.value],
cut_value: [ReturnStageWaitCheck.value, ReturnStageApplying.value],
model_value: [ReturnStageApplying.value],
label: '取消退款'
},
])
//判断是否显示该按钮
const orderBtnsShow = (item) => {
let key = ['big_value', 'model_value', 'cut_value']
if(item.id == 1) {
//取消退货
return (orderInfo.type == ReturnApplyOrderTypeReturnForRefund.value)&&item[key[orderInfo?.sale_mode]]?.includes(orderInfo.stage)
} else if (item.id == 6) {
//取消退款
if(orderInfo?.sale_mode == 0) {
return (orderInfo.type != ReturnApplyOrderTypeReturnForRefund.value)&&item[key[orderInfo?.sale_mode]]?.includes(orderInfo.stage)
} else {
return item[key[orderInfo?.sale_mode]]?.includes(orderInfo.stage)
label: '取消退款',
validatarFunc: (orderInfo) => {
//大货 是销售退款时
if(orderInfo?.sale_mode == 0 && orderInfo.type != ReturnApplyOrderTypeReturnForRefund.value) return [ReturnStageApplying.value, ReturnStageServiceOrderPendingRefund.value]?.includes(orderInfo.stage)
if(orderInfo?.sale_mode == 1) return [ReturnStageApplying.value].includes(orderInfo.stage)
return false
}
} else if (item.id == 4) {
//质检结果
return (orderInfo?.type == ReturnApplyOrderTypeReturnForRefund.value)&&item[key[orderInfo?.sale_mode]]?.includes(orderInfo.stage) //退货才有
} else {
return item[key[orderInfo?.sale_mode]]?.includes(orderInfo.stage)
}
}
},
])
//显示的按钮数组
const orderBtnsShowList: any[] = useMemo(() => {
return orderBtnsList.current.filter(item => {
return orderBtnsShow(item)
return item.validatarFunc(orderInfo)
})
}, [orderInfo])

View File

@ -19,6 +19,7 @@ type Param = {
wait_pay_amount: number, //待付金额
sale_mode: number, //订单类型
av_return_roll?: number, //可退数量
is_return?: true|false, //是否申请了售后
},
onClick?: (val: number) => void //点击后触发的事件,返回订单状态
@ -67,38 +68,6 @@ export default memo(({orderInfo, onClick}:Param) => {
return orderInfo.actual_amount == 0 && orderStatus.includes(orderInfo.status)
}
},
{
id: 3,
label: '申请退款',
validatarFunc: (orderInfo) => {
//大货在待发货付过款
let orderStatus = [
SaleOrderStatusWaitingDelivery.value,
SaleOrderStatusTaking.value
]
return orderInfo.sale_mode == SaLeModeBulk.value && orderInfo.actual_amount != 0 && orderInfo.av_return_roll && orderStatus.includes(orderInfo.status)
}
},
{
id: 5,
label: '申请退货',
validatarFunc: (orderInfo) => {
let orderStatus = [
SaleOrderStatusAlreadyReceipt.value,
]
return orderInfo&&orderStatus.includes(orderInfo.status)
}
},
{
id: 6,
label: '确认收货',
validatarFunc: (orderInfo) => {
let orderStatus = [
SaleOrderStatusWaitingReceipt.value
]
return orderStatus.includes(orderInfo.status)
}
},
{
id: 7,
label: '再次购买',
@ -121,10 +90,39 @@ export default memo(({orderInfo, onClick}:Param) => {
id: 9,
label: '售后记录',
validatarFunc: (orderInfo) => {
return orderInfo.is_return
}
},
{
id: 3,
label: '申请退款',
validatarFunc: (orderInfo) => {
//大货在待发货付过款
let orderStatus = [
SaleOrderStatusRefund.value
SaleOrderStatusWaitingDelivery.value,
SaleOrderStatusTaking.value
]
return orderInfo&&orderStatus.includes(orderInfo.status)
return orderInfo.sale_mode == SaLeModeBulk.value && orderInfo.actual_amount != 0 && orderInfo.av_return_roll && orderStatus.includes(orderInfo.status)
}
},
{
id: 5,
label: '申请退货',
validatarFunc: (orderInfo) => {
let orderStatus = [
SaleOrderStatusAlreadyReceipt.value,
]
return orderStatus.includes(orderInfo.status)
}
},
{
id: 6,
label: '确认收货',
validatarFunc: (orderInfo) => {
let orderStatus = [
SaleOrderStatusWaitingReceipt.value
]
return orderStatus.includes(orderInfo.status)
}
},
{
@ -153,7 +151,7 @@ export default memo(({orderInfo, onClick}:Param) => {
})
}, [orderInfo])
//订阅消息
//小程序订阅
const {ApplyGoods} = SUBSCRIPTION_MESSAGE_SCENE
const {openSubscriptionMessage} = UseSubscriptionMessage()
@ -236,7 +234,6 @@ export default memo(({orderInfo, onClick}:Param) => {
//退款
const {fetchData: fetchDataApplyRefund} = ApplyRefundApi()
const applyRefund = async () => {
// if(!orderInfo?.av_return_roll) return alert.none('该订单没有可退条数')
Taro.showModal({
title: '确定退款?',
success: async function async (res) {

View File

@ -143,6 +143,8 @@ export default () => {
//底部按钮
const onSubmit = throttle((val) => {
if(val == 2) {
if(submitData.goods_status === '') return alert.error('请选择货物状况')
if(submitData.return_explain === '') return alert.error('请选择退货原因')
if(!submitData.return_explain && !submitData.reason_describe) return alert.error('请填写其他说明')
onSubmitData()
} else {

View File

@ -131,7 +131,7 @@ import { throttle } from "@/common/util";
const numText = useMemo(() => {
if(formatPreViewOrder) {
let total_number = formatPreViewOrder?.sale_mode == 0?formatPreViewOrder?.total_number:(formatPreViewOrder?.total_number/100)
return `${formatPreViewOrder?.total_fabrics}种面料,${formatPreViewOrder?.total_colors}种颜色,共${total_number}${formatPreViewOrder?.unit}`
return `${formatPreViewOrder?.total_fabrics} 种面料,${formatPreViewOrder?.total_colors} 种颜色,共 ${total_number}${formatPreViewOrder?.unit}`
}
}, [formatPreViewOrder])
@ -178,7 +178,7 @@ import { throttle } from "@/common/util";
</View>
<View className={styles.submit_order}>
<View className={styles.submit_order_number}>
<SubmitOrderBtn style={{color:'#007AFF'}} number={formatPriceDiv(preViewOrder?.sale_mode == 1?formatPreViewOrder?.total_should_collect_money:formatPreViewOrder?.estimate_amount)} priceTitle={preViewOrder?.sale_mode == 1?'合计金额':'预估金额'}/>
<SubmitOrderBtn style={{color:'#007AFF'}} number={formatPriceDiv(preViewOrder?.sale_mode == 1?formatPreViewOrder?.total_should_collect_money:formatPreViewOrder?.estimate_amount) as number} priceTitle={preViewOrder?.sale_mode == 1?'合计金额':'预估金额'}/>
<View className={styles.order_number_desc}>{numText}</View>
</View>
<View className={classnames(styles.order_btn, btnStatus&&styles.ok_order_btn)} onClick={() => submitOrderEven()}></View>

View File

@ -17,10 +17,10 @@ type OrderParam = {
total_number: number,
status: number, //订单状态
total_sale_price: number, //合计金额
total_should_collect_money: number, //应收金额
total_weight_error_discount: number, //空差优惠
the_previous_status: number, //取消订单时的订单状态
actual_amount: number //实付金额
actual_amount: number, //实付金额
wait_pay_amount: number //待付金额
}
type Param = {
@ -29,22 +29,6 @@ type Param = {
}
export default memo(({order, comfirm = false}:Param) => {
//对应数量
const formatCount = useCallback((item) => {
return order?.sale_mode == 0? item.roll : Number(item.length / 100)
}, [order])
//对应单价
const standardPrice = useCallback(price => {
return formatPriceDiv(price).toLocaleString() + '/' + (order?.sale_mode == 1?'m':'kg')
}, [order])
//数量格式
const numText = useMemo(() => {
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 {
SaleOrderStatusBooking, // 待接单
@ -61,59 +45,63 @@ export default memo(({order, comfirm = false}:Param) => {
SaleOrderStatusTaking //提货
} = ORDER_STATUS
//金额列表枚举
const priceList = [
//注册金额
type orderPriceListParams = {id: number, label: string, field: string, message: string, validatarFunc: (val: typeof order) => any}
const priceList:orderPriceListParams[] = [
{
id:1,
value:[SaleorderstatusWaitingPrePayment.value, SaleOrderStatusBooking.value, SaleOrderStatusArranging.value],
label:'预估金额',
field: 'estimate_amount',
message: '预估金额按生产商定义的标准匹重计算,仅供参考。详细交易金额以出单为准!',
validatarFunc: (order) => {
let value = [SaleorderstatusWaitingPrePayment.value, SaleOrderStatusBooking.value, SaleOrderStatusArranging.value]
return value.includes(order.status)
}
},
{
id:2,
value:[SaleOrderStatusTaking.value, SaleOrderStatusArranged.value, SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value],
label:'合计金额',
field: 'total_sale_price',
message: '包含空差的货款金额',
validatarFunc: (order) => {
let value = [SaleOrderStatusTaking.value, SaleOrderStatusArranged.value, SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value]
return (value.includes(order.status)|| order.sale_mode == 1)
}
},
{
id:3,
value:[SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value],
label:'空差优惠',
field: 'total_weight_error_discount',
message: '扣除空差金额',
},
{
id:4,
value:[ SaleOrderStatusWaitingPayment.value],
label:'应付金额',
field: 'total_should_collect_money',
message: '扣除空差后的货款金额',
validatarFunc: (order) => {
let value = [SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value]
return (value.includes(order.status) && order.sale_mode == 0 )
}
},
{
id:5,
value:[SaleOrderStatusTaking.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value],
label:'实付金额',
field: 'actual_amount',
message: '本单实付总金额',
}
validatarFunc: (order) => {
let value = [SaleOrderStatusWaitingPayment.value, SaleOrderStatusTaking.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value]
return value.includes(order.status)
}
},
{
id:4,
label:'待付金额',
field: 'wait_pay_amount',
message: '扣除空差后的货款金额',
validatarFunc: (order) => {
let value = [SaleOrderStatusWaitingPayment.value, SaleOrderStatusTaking.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value]
return value.includes(order.status)
}
},
]
//订单流程是否显示价格
const showPrice = (item) => {
if (item.id == 2) {
//合计金额 (剪板特殊情况)
return (item.value.includes(order.status)|| order.sale_mode == 1)
} else if (item.id == 3) {
//空差优惠只有大货才有
return (item.value.includes(order.status) && order.sale_mode == 0 )
} else {
return (item.value.includes(order.status) && order.sale_mode != 1 )
}
}
//订单流程金额展示
const priceConDom = useMemo(() => {
if(!order) return
@ -121,18 +109,35 @@ export default memo(({order, comfirm = false}:Param) => {
<>
{
priceList.map(item => {
return <>{showPrice(item)&&<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field])} title={item.label} messageTitle={item.message} />}</>
return <>{item.validatarFunc(order)&&<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field]) as number} title={item.label} messageTitle={item.message} />}</>
})
}
</>
)
}, [order])
//对应数量
const formatCount = useCallback((item) => {
return order?.sale_mode == 0? item.roll : Number(item.length / 100)
}, [order])
//对应单价
const standardPrice = useCallback(price => {
return formatPriceDiv(price).toLocaleString() + '/' + (order?.sale_mode == 1?'m':'kg')
}, [order])
//数量格式
const numText = useMemo(() => {
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 comfirmPriceConDom = useMemo(() => {
if(!order) return
let item = order.sale_mode == 1?priceList[1]:priceList[0]
return<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field])} title={item.label} />
return<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field]) as number} title={item.label} />
}, [order])
//确认金额展示

View File

@ -11,7 +11,7 @@ import ScanPay from "../scanPay";
import { GetOrderPayApi, SubmitOrderPayApi, GetPrepayOrderPayApi, SubmitPrepayOrderPayApi } from "@/api/orderPay";
import { formatPriceDiv } from "@/common/fotmat";
import {alert} from "@/common/common"
import { ORDER_STATUS, PAYMENT_METHOD, PAYMENT_METHOD_PARAM, SUBSCRIPTION_MESSAGE_SCENE } from "@/common/enum";
import { ORDER_STATUS, PAYMENT_METHOD, SUBSCRIPTION_MESSAGE_SCENE } from "@/common/enum";
import { UseSubscriptionMessage } from "@/use/useCommon";
type Param = {
@ -26,7 +26,7 @@ type OrderInfo = {
should_collect_order_id?: number, //应付单id
pre_collect_order_id?: number, //预付单id
status?: number, //订单状态
payment_method?: 0|PAYMENT_METHOD_PARAM //支付方式
payment_method?: number, //支付方式
sale_mode?: number, //订单类型 0大货 1剪板 2散剪
[val: string]: any
}
@ -133,7 +133,7 @@ export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param)
//是否显示七天账期
const show_account_payment = useMemo(() => {
//剪板散剪不显示
//剪板散剪不显示
if(orderInfo?.sale_mode != 0) return false
//支付方式是账期支付,不显示
if(orderInfo?.payment_method == PaymentMethodAccountPeriod.value) return false
@ -169,7 +169,7 @@ export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param)
<View className={classnames('iconfont icon-a-moreback', styles.miconfont_title)} onClick={onClose}></View>
<View className={styles.title}></View>
<View className={styles.amount}>
<AmountShow status={2} number={formatPriceDiv(payInfo?.should_collect_money - payInfo?.amount_paid)}/>
<AmountShow status={2} number={formatPriceDiv(payInfo?.amount_to_be_paid) as number}/>
</View>
{(payInfo?.delivery_payment_name)&&<View className={styles.playMode}>使{payInfo?.delivery_payment_name}</View>}
<View className={styles.payment_list}>

View File

@ -49,13 +49,14 @@
}
.order_desc_text, .order_desc_text_hint{
font-size: $font_size_medium;
color: $color_font_two;
margin-right: 10px;
flex:1;
word-break:break-all;
}
.order_desc_text_hint{
text-align: right;
color: $color_font_two;
}
.miconfont{
font-size: 20px;

View File

@ -90,7 +90,8 @@ import styles from './index.module.scss'
total_weight_error_discount: orderDetail.total_weight_error_discount, //空差优惠
actual_amount: orderDetail.actual_amount, //实付金额
the_previous_status: orderDetail.the_previous_status, //取消订单时的订单状态
account_period: orderDetail.account_period
account_period: orderDetail.account_period,
wait_pay_amount: orderDetail.wait_pay_amount //待付金额
})
}
@ -217,13 +218,8 @@ import styles from './index.module.scss'
//按钮所需数据
const orderInfo = useMemo(() => {
return {
status: orderDetail?.status, //订单状态
orderId: orderDetail?.id,
settle_mode: orderDetail?.settle_mode,
actual_amount: orderDetail?.actual_amount, //实付金额
wait_pay_amount: orderDetail?.wait_pay_amount, //待付金额
sale_mode: orderDetail?.sale_mode, //订单类型
av_return_roll: orderDetail?.av_return_roll //可退条数
...orderDetail
}
}, [orderDetail])

View File

@ -33,7 +33,8 @@ type Param = {
should_collect_order_id: number, //应付单id
av_return_roll: number,
total_sale_price: number,
estimate_amount: number
estimate_amount: number,
is_return: true|false
},
onClickBtn?: (val:{status:number, orderInfo:Param['value']}) => void
}
@ -64,12 +65,8 @@ export default memo(({value, onClickBtn}: Param) => {
//按钮所需数据
const orderInfo = useMemo(() => {
return {
status: value?.status, //订单状态
orderId: value?.id,
actual_amount: value?.actual_amount, //实付金额
wait_pay_amount: value?.wait_pay_amount, //待付金额
sale_mode: value?.sale_mode, //订单类型
av_return_roll: value?.av_return_roll //可退条数
...value
}
}, [value])

View File

@ -50,6 +50,7 @@
font-size: $font_size;
margin-left: 20px;
flex:1;
@include common_ellipsis(1);
}
.num{
color: $color_font_two;
@ -62,7 +63,7 @@
.order_list_item {
display: flex;
&:nth-child(2) {
&:nth-child(n+2) {
margin-top: 30px;
}
.order_list_item_img{
@ -101,7 +102,6 @@
.order_list_item_count{
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-end;
.count_num{
color: $color_main;

View File

@ -68,8 +68,10 @@ export default memo(({show, onClose, onSubmit, id}:Param) => {
}, [formatDetailOrder])
//数量格式
const numText = useMemo(() => {
if(formatDetailOrder)
return `${formatDetailOrder?.total_fabrics}种面料,${formatDetailOrder?.total_colors}种颜色,共${formatDetailOrder?.total_number}${formatDetailOrder?.unit}`
if(formatDetailOrder) {
let tatal_number = formatDetailOrder?.sale_mode == 0?formatDetailOrder?.total_number:formatDetailOrder?.total_number/100
return `${formatDetailOrder?.total_fabrics}种面料,${formatDetailOrder?.total_colors}种颜色,共${tatal_number}${formatDetailOrder?.unit}`
}
}, [formatDetailOrder])
//整理颜色
@ -109,7 +111,7 @@ export default memo(({show, onClose, onSubmit, id}:Param) => {
</View>
<View className={styles.order_list_item_count}>
<View className={styles.count_num}>×{formatCount(colorItem)}<text>{formatDetailOrder.unit}</text></View>
<View className={styles.count_price}><text>¥</text>{formatPriceDiv(colorItem.estimate_amount).toLocaleString()}</View>
<View className={styles.count_price}><text>¥</text>{formatPriceDiv(colorItem.estimate_amount, 100, true)}</View>
</View>
</View>
</View>
@ -118,10 +120,10 @@ export default memo(({show, onClose, onSubmit, id}:Param) => {
</View>
})
}
<View className={styles.order_total}>
<Text></Text>
{/* <View className={styles.order_total}>
<Text></Text>
<Text>×{orderDetail?.total_number}</Text>
</View>
</View> */}
</View>
</ScrollView>
</>}

View File

@ -1,131 +0,0 @@
.kindsList_main{
margin-top: 20px;
}
.orders_list_con{
background-color: #fff;
border-radius: 20px;
padding: 20px;
.orders_return_title{
font-size: 28px;
font-weight: 700;
padding-bottom: 20px;
}
.order_list{
&:nth-child(n+2) {
margin-top: 30px;
}
.order_list_title{
display: flex;
align-items: center;
.tag{
font-size: $font_size_min;
background-color: #CDE5FF;
padding: 5px 10px;
border-radius: 6px;
color: $color_main;
}
.title{
font-weight: 700;
font-size: $font_size;
margin-left: 20px;
flex:1;
}
.num{
color: $color_font_two;
font-size: $font_size_min;
}
}
}
.order_list_scroll{
margin-top: 30px;
.order_list_item {
display: flex;
&:nth-child(2) {
margin-top: 30px;
}
.order_list_item_img{
width: 126px;
height: 126px;
border-radius: 20px;
}
.order_list_item_con{
display: flex;
width: 100%;
flex:1;
border-bottom: 1px solid #f0f0f0;
height: 150px;
padding-top: 20px;
box-sizing: border-box;
}
.order_list_item_des{
flex:1;
box-sizing: border-box;
padding-left: 30px;
.order_list_item_title{
font-weight: 700;
font-size: $font_size;
margin-bottom: 15px;
}
.order_list_item_price{
font-size: 26px;
color: $color_font_three;
text{
&:nth-child(n+1) {
margin-right: 20px;
}
}
}
}
.order_list_item_count{
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-end;
.count_num{
color: $color_main;
font-size: $font_size;
margin-bottom: 15px;
font-weight: 400;
text{
font-size: $font_size_min;
}
}
.count_price {
font-size: $font_size;
font-weight: 700;
text{
font-size: $font_size_min;
}
}
}
}
}
.order_total{
padding-top: 20px;
display: flex;
justify-content: space-between;
text{
&:nth-child(1) {
font-size: 28px;
font-weight: 700;
}
&:nth-child(2) {
font-size: 24px;
font-weight: 700;
}
}
}
.order_estimated_amount{
display: flex;
align-items: flex-end;
flex-direction: column;
padding: 30px 0;
.order_price_des{
font-size: $font_size_medium;
color: $color_font_two;
}
}
}

View File

@ -1,192 +0,0 @@
import { AFTER_ORDER_STATUS, ORDER_STATUS } from "@/common/enum"
import { formatHashTag, formatPriceDiv, formatWeightDiv } from "@/common/fotmat"
import LabAndImg from "@/components/LabAndImg"
import { Text, View } from "@tarojs/components"
import { memo, useCallback, useMemo } from "react"
import EstimatedAmount from "../estimatedAmount"
import styles from './index.module.scss'
type OrderParam = {
estimate_amount: number, //预估金额
list: any[],
sale_mode: number,
sale_mode_name: string,
unit: string,
total_colors: number,
total_fabrics: number,
total_number: number,
stage: number, //订单状态
type: 1|2, //1退货 2退款
total_sale_price: number, //销售金额
total_should_collect_money: number, //应收金额
total_weight_error_discount: number, //空差优惠
the_previous_status: number, //取消订单时的订单状态
actual_amount: number //实付金额
}
type Param = {
order: OrderParam,
comfirm?: boolean //是否是确认订单页面使用
}
export default memo(({order, comfirm = false}:Param) => {
//对应数量
const formatCount = useCallback((item) => {
return order?.sale_mode == 0? item.roll : Number(item.length / 100)
}, [order])
//对应单价
const standardPrice = useCallback(price => {
return formatPriceDiv(price).toLocaleString() + '/' + (order?.sale_mode == 1?'m':'kg')
}, [order])
//数量格式
const numText = useMemo(() => {
if(order)
return `${order?.total_fabrics}种面料,${order?.total_colors}种颜色,共${order?.total_number}${order?.unit}`
}, [order])
//售后单状态枚举
const {
ReturnStageApplying, // 申请中
ReturnStageWaitCheck, // 退货中
ReturnStageChecked, // 待验布
ReturnStageReturned, // 已退款
ReturnStageCancel, // 已取消
ReturnStageQualityCheckPendingRefund, // 已验布
ReturnStageServiceOrderPendingRefund, // 待退款
ReturnStageRejected, // 已拒绝
} = AFTER_ORDER_STATUS
//金额列表枚举
const priceList = [
{
id:1,
value:[],
label:'退货条数',
field: ''
},
{
id:2,
value:[
ReturnStageServiceOrderPendingRefund.value,
ReturnStageReturned.value
],
label:'扣款金额',
field: 'total_sale_price'
},
{
id:3,
value:[
ReturnStageServiceOrderPendingRefund.value,
ReturnStageReturned.value
],
label:'其他扣款',
field: 'total_weight_error_discount'
},
{
id:4,
value:[
ReturnStageServiceOrderPendingRefund.value,
ReturnStageReturned.value
],
label:'应退金额',
field: 'total_should_collect_money'
},
{
id:5,
value:[ReturnStageReturned.value],
label:'退款金额',
field: 'total_should_collect_money'
},
{
id:6,
value:[ReturnStageReturned.value],
label:'退款去向',
field: 'actual_amount'
},
{
id:7,
value:[ReturnStageQualityCheckPendingRefund.value],
label:'合计金额',
field: 'actual_amount'
},
]
//是否显示价格
const showPrice = useCallback((priceInfo) => {
if(priceInfo.value == 8) {
//合计金额
}
return priceInfo.value.includes(order?.stage)
}, [order])
const priceConDom = useMemo(() => {
if(!order) return
return (
<>
{
priceList.map(item => {
return <>{showPrice(item)&&<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field])} title={item.label} />}</>
})
}
</>
)
}, [order])
//整理颜色
const labAndRgbAndUrl = useCallback((item) => {
return {lab:{...item?.lab}, rgb:{...item?.rgb}, texturl_url: item?.texturl_url}
}, [])
//单价显示判断
const sale_price_show = useMemo(() => {
return order?.stage != ReturnStageServiceOrderPendingRefund.value && order?.stage != ReturnStageQualityCheckPendingRefund.value
}, [order])
return (
<View className={styles.kindsList_main}>
<View className={styles.orders_list_con}>
<View className={styles.orders_return_title}>{order?.type == 1?'退货信息':'退款信息'}</View>
{
order?.list?.map(item => {
return <View key={item.product_code} className={styles.order_list}>
<View className={styles.order_list_title}>
<View className={styles.tag}>{order.sale_mode_name}</View>
<View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
<View className={styles.num}>{item?.product_colors?.length}</View>
</View>
<View className={styles.order_list_scroll}>
{item?.product_colors?.map(colorItem => {
return <View key={colorItem.id} className={styles.order_list_item}>
<View className={styles.order_list_item_img}>
<LabAndImg value={labAndRgbAndUrl(colorItem)}/>
</View>
<View className={styles.order_list_item_con}>
<View className={styles.order_list_item_des}>
<View className={styles.order_list_item_title}>{colorItem.code + ' ' + colorItem.name}</View>
<View className={styles.order_list_item_price}>
{sale_price_show&&<Text>¥{standardPrice(colorItem.sale_price)}</Text>}
<Text>{formatWeightDiv(colorItem.estimate_weight)}kg</Text>
</View>
</View>
<View className={styles.order_list_item_count}>
<View className={styles.count_num}>×{formatCount(colorItem)}<text>{order.unit}</text></View>
<View className={styles.count_price}><text>¥</text>{formatPriceDiv(colorItem.estimate_amount).toLocaleString()}</View>
</View>
</View>
</View>
})}
</View>
</View>
})
}
<View className={styles.order_total}><Text></Text><Text>{numText}</Text></View>
<View className={styles.order_estimated_amount}>
{priceConDom}
</View>
</View>
</View>
)
})

View File

@ -1,131 +0,0 @@
.kindsList_main{
margin-top: 20px;
}
.orders_list_con{
background-color: #fff;
border-radius: 20px;
padding: 20px;
.orders_return_title{
font-size: 28px;
font-weight: 700;
padding-bottom: 20px;
}
.order_list{
&:nth-child(n+2) {
margin-top: 30px;
}
.order_list_title{
display: flex;
align-items: center;
.tag{
font-size: $font_size_min;
background-color: #CDE5FF;
padding: 5px 10px;
border-radius: 6px;
color: $color_main;
}
.title{
font-weight: 700;
font-size: $font_size;
margin-left: 20px;
flex:1;
}
.num{
color: $color_font_two;
font-size: $font_size_min;
}
}
}
.order_list_scroll{
margin-top: 30px;
.order_list_item {
display: flex;
&:nth-child(2) {
margin-top: 30px;
}
.order_list_item_img{
width: 126px;
height: 126px;
border-radius: 20px;
}
.order_list_item_con{
display: flex;
width: 100%;
flex:1;
border-bottom: 1px solid #f0f0f0;
height: 150px;
padding-top: 20px;
box-sizing: border-box;
}
.order_list_item_des{
flex:1;
box-sizing: border-box;
padding-left: 30px;
.order_list_item_title{
font-weight: 700;
font-size: $font_size;
margin-bottom: 15px;
}
.order_list_item_price{
font-size: 26px;
color: $color_font_three;
text{
&:nth-child(n+1) {
margin-right: 20px;
}
}
}
}
.order_list_item_count{
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-end;
.count_num{
color: $color_main;
font-size: $font_size;
margin-bottom: 15px;
font-weight: 400;
text{
font-size: $font_size_min;
}
}
.count_price {
font-size: $font_size;
font-weight: 700;
text{
font-size: $font_size_min;
}
}
}
}
}
.order_total{
padding-top: 20px;
display: flex;
justify-content: space-between;
text{
&:nth-child(1) {
font-size: 28px;
font-weight: 700;
}
&:nth-child(2) {
font-size: 24px;
font-weight: 700;
}
}
}
.order_estimated_amount{
display: flex;
align-items: flex-end;
flex-direction: column;
padding: 30px 0;
.order_price_des{
font-size: $font_size_medium;
color: $color_font_two;
}
}
}

View File

@ -1,168 +0,0 @@
import { AFTER_ORDER_STATUS, ORDER_STATUS } from "@/common/enum"
import { formatHashTag, formatPriceDiv, formatWeightDiv } from "@/common/fotmat"
import LabAndImg from "@/components/LabAndImg"
import { Text, View } from "@tarojs/components"
import { memo, useCallback, useMemo } from "react"
import EstimatedAmount from "../estimatedAmount"
import styles from './index.module.scss'
type OrderParam = {
estimate_amount: number, //预估金额
list: any[],
sale_mode: number,
sale_mode_name: string,
unit: string,
total_colors: number,
total_fabrics: number,
total_number: number,
stage: number, //订单状态
type: 1|2, //1退货 2退款
total_sale_price: number, //销售金额
total_should_collect_money: number, //应收金额
total_weight_error_discount: number, //空差优惠
the_previous_status: number, //取消订单时的订单状态
actual_amount: number //实付金额
}
type Param = {
order: OrderParam,
comfirm?: boolean //是否是确认订单页面使用
}
export default memo(({order, comfirm = false}:Param) => {
//对应数量
const formatCount = useCallback((item) => {
return order?.sale_mode == 0? item.roll : Number(item.length / 100)
}, [order])
//对应单价
const standardPrice = useCallback(price => {
return formatPriceDiv(price).toLocaleString() + '/' + (order?.sale_mode == 1?'m':'kg')
}, [order])
//数量格式
const numText = useMemo(() => {
if(order)
return `${order?.total_fabrics}种面料,${order?.total_colors}种颜色,共${order?.total_number}${order?.unit}`
}, [order])
//售后单状态枚举
const {
ReturnStageApplying, // 申请中
ReturnStageWaitCheck, // 退货中
ReturnStageChecked, // 待验布
ReturnStageReturned, // 已退款
ReturnStageCancel, // 已取消
ReturnStageQualityCheckPendingRefund, // 已验布
ReturnStageServiceOrderPendingRefund, // 待退款
ReturnStageRejected, // 已拒绝
} = AFTER_ORDER_STATUS
//金额列表枚举
const priceList = [
{
id:1,
value:[
ReturnStageServiceOrderPendingRefund.value,
ReturnStageReturned.value
],
label:'应退金额',
field: 'total_should_collect_money'
},
{
id:2,
value:[ReturnStageReturned.value],
label:'退款金额',
field: 'total_should_collect_money'
},
{
id:3,
value:[ReturnStageReturned.value],
label:'退款去向',
field: 'actual_amount'
},
{
id:4,
value:[ReturnStageQualityCheckPendingRefund.value],
label:'合计金额',
field: 'actual_amount'
},
]
//是否显示价格
const showPrice = useCallback((priceInfo) => {
if(priceInfo.value == 8) {
//合计金额
}
return priceInfo.value.includes(order?.stage)
}, [order])
const priceConDom = useMemo(() => {
if(!order) return
return (
<>
{
priceList.map(item => {
return <>{showPrice(item)&&<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field])} title={item.label} />}</>
})
}
</>
)
}, [order])
//整理颜色
const labAndRgbAndUrl = useCallback((item) => {
return {lab:{...item?.lab}, rgb:{...item?.rgb}, texturl_url: item?.texturl_url}
}, [])
//单价显示判断
const sale_price_show = useMemo(() => {
return order?.stage != ReturnStageServiceOrderPendingRefund.value && order?.stage != ReturnStageQualityCheckPendingRefund.value
}, [order])
return (
<View className={styles.kindsList_main}>
<View className={styles.orders_list_con}>
<View className={styles.orders_return_title}>{order?.type == 1?'退货信息':'退款信息'}</View>
{
order?.list?.map(item => {
return <View key={item.product_code} className={styles.order_list}>
<View className={styles.order_list_title}>
<View className={styles.tag}>{order.sale_mode_name}</View>
<View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
<View className={styles.num}>{item?.product_colors?.length}</View>
</View>
<View className={styles.order_list_scroll}>
{item?.product_colors?.map(colorItem => {
return <View key={colorItem.id} className={styles.order_list_item}>
<View className={styles.order_list_item_img}>
<LabAndImg value={labAndRgbAndUrl(colorItem)}/>
</View>
<View className={styles.order_list_item_con}>
<View className={styles.order_list_item_des}>
<View className={styles.order_list_item_title}>{colorItem.code + ' ' + colorItem.name}</View>
<View className={styles.order_list_item_price}>
{sale_price_show&&<Text>¥{standardPrice(colorItem.sale_price)}</Text>}
<Text>{formatWeightDiv(colorItem.estimate_weight)}kg</Text>
</View>
</View>
<View className={styles.order_list_item_count}>
<View className={styles.count_num}>×{formatCount(colorItem)}<text>{order.unit}</text></View>
<View className={styles.count_price}><text>¥</text>{formatPriceDiv(colorItem.estimate_amount).toLocaleString()}</View>
</View>
</View>
</View>
})}
</View>
</View>
})
}
<View className={styles.order_total}><Text></Text><Text>{numText}</Text></View>
<View className={styles.order_estimated_amount}>
{priceConDom}
</View>
</View>
</View>
)
})

View File

@ -1,10 +1,9 @@
import { Image, Text, View } from "@tarojs/components"
import { memo, useEffect, useMemo, useRef, useState } from "react"
import { Text, View } from "@tarojs/components"
import { memo, useMemo, useState } from "react"
import styles from './index.module.scss'
import classnames from "classnames";
import { formatDateTime, formatImgUrl } from "@/common/fotmat";
import { ORDER_STATUS, PAYMENT_METHOD, PAYMENT_METHOD_PARAM } from "@/common/enum";
import * as dayjs from 'dayjs'
import { formatDateTime } from "@/common/fotmat";
import { ORDER_STATUS } from "@/common/enum";
type List = {
status: string,
@ -18,13 +17,11 @@ type Param = {
onRefresh?: () => void,
orderInfo?: {
logistics_details:List[], //订单状态列表
payment_method: 0|PAYMENT_METHOD_PARAM, //支付方式
payment_method: number, //支付方式
status: number, //订单状态
}
}
export default memo(({orderInfo = {logistics_details: [],payment_method: 0, status: 0}, onRefresh}:Param) => {
const [showMore, setShowMore] = useState(false)
@ -38,19 +35,7 @@ export default memo(({orderInfo = {logistics_details: [],payment_method: 0, stat
//订单状态枚举
const {SaleorderstatusWaitingPrePayment} = ORDER_STATUS
//支付方式枚举
const {
PaymentMethodAccountPeriod,
PaymentMethodCashOnDelivery,
} = PAYMENT_METHOD
//获取预付款最后时间
const endTime = useMemo(() => {
if(orderInfo.status == SaleorderstatusWaitingPrePayment.value && orderInfo.logistics_details.length > 0) {
return orderInfo.logistics_details[0].expire_time
}
return ''
}, [orderInfo])
return (
<>
{(dataList?.length > 0)&&<View className={styles.order_flow_state}>
@ -63,70 +48,13 @@ export default memo(({orderInfo = {logistics_details: [],payment_method: 0, stat
<View className={classnames(styles.order_status_time, (index == 0)&&styles.order_status_select)}>{formatDateTime(item.time)}</View>
</View>
<Text className={classnames(styles.order_status_des, (index == 0)&&styles.order_status_des_select)}>{item.desc}</Text>
{(orderInfo.status == SaleorderstatusWaitingPrePayment.value)&&<CountDown onFinish={onRefresh} endTime={endTime}/>}
</View>)}
</View>
{(dataList.length > 2) && <View className={styles.more} onClick={() => changeMore()}>
<Text>{showMore&&'收起详情'||'点击查看详情'}</Text>
<Text className={classnames('iconfont icon-a-moreback', styles.miconfonts, showMore&&styles.open_miconfonts)}></Text>
</View>}
<View className={styles.image_tag}>
{(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>
{(orderInfo.status == SaleorderstatusWaitingPrePayment.value)&&<View className={styles.refresh} onClick={onRefresh}>
<Text className={classnames(styles.mconfont, 'iconfont icon-xianxiahuikuan')}></Text>
<Text className={classnames(styles.refresh_text)}></Text>
</View>}
</View>}
</>
)
})
//倒计时
const CountDown = ({endTime = '', onFinish}:{endTime:string, onFinish?:() => void}) => {
const [showTime, setShowTime] = useState('')
const timeObj:any = useRef()
useEffect(() => {
if(endTime) {
clearInterval(timeObj.current)
timeObj.current = setInterval(() => {
count_down()
}, 1000)
}
return () => {
clearInterval(timeObj.current)
}
}, [endTime])
const count_down = () => {
var startData = dayjs();
var endDate = dayjs(endTime);
if(startData >= endDate) {
clearInterval(timeObj.current)
onFinish?.()
setShowTime(() => '00:00:00')
return false
}
var _dd = endDate.diff(startData,'day');
var _hh = endDate.diff(startData,'hour');
var _mm = endDate.diff(startData,'minute');
var _ss = endDate.diff(startData,'second');
// 转换
var hh = _hh - (_dd*24);
var mm = _mm - (_hh*60);
var ss = _ss - (_mm*60);
// 格式化
var DD = ('00'+_dd).slice(-2);
var HH = ('00'+hh).slice(-2);
var MM = ('00'+mm).slice(-2);
var SS = ('00'+ss).slice(-2);
setShowTime(() => ` ${HH}:${MM}:${SS}`)
}
return (
<>
<View className={styles.pay_time}>
<Text>{showTime||'--:--:--'}</Text>
</View>
</>
)
}

View File

@ -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, usePullDownRefresh, useRouter } from "@tarojs/taro"
import {View } from "@tarojs/components"
import Taro, { useDidShow} from "@tarojs/taro"
import { useCallback, useEffect, useMemo, useRef, useState } from "react"
import styles from './index.module.scss'
import classnames from "classnames";
@ -9,23 +9,20 @@ import Order from "./components/order"
import InfiniteScroll from "@/components/infiniteScroll"
import { dataLoadingStatus, getFilterData } from "@/common/util"
import OrderStatusList from "./components/orderStatusList"
import { AFTER_ORDER_STATUS } from "@/common/enum"
import { GetSaleOrderListApi, RefundOrderSatausApi } from "@/api/salesAfterOrder"
import ReturnLogistics from "./components/returnLogistics"
import ApplyRecord from "../salesAfter/components/applyRecord"
export default () => {
useLogin()
useDidShow(() => {
getOrderList()
})
//搜索参数
const [searchField, setSearchField] = useState({
status: -1,
const [searchField, setSearchField] = useState<{status: number|null, page: number, size: number, name: string}>({
status: null,
page : 1,
size : 10,
Name:''
name:''
})
//获取订单状态
@ -37,6 +34,7 @@ export default () => {
}
useEffect(() => {
getOrderStatusList()
setSearchField((e) => ({...e, status:-1}))
}, [])
//获取订单列表
@ -48,10 +46,13 @@ export default () => {
setRefresherTriggeredStatus(() => false)
}
useDidShow(() => {
if(searchField.status != null) getOrderList()
})
//监听筛选条件变化
useEffect(() => {
getOrderList()
if(searchField.status != null) getOrderList()
}, [searchField])
//上拉加载数据