订单按钮优化完成

This commit is contained in:
2022-07-15 21:09:46 +08:00
parent b688195a60
commit 3eafc7539f
18 changed files with 158 additions and 875 deletions
+2 -2
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>
+54 -49
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,23 +29,7 @@ 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, // 待接单
SaleOrderStatusArranging, // 配布中
@@ -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])
//确认金额展示
+4 -4
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}>
+2 -1
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;
+3 -7
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])