订单列表对接

This commit is contained in:
2022-05-27 20:34:13 +08:00
parent e73bd1bc25
commit b93b59332b
19 changed files with 236 additions and 111 deletions
@@ -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)
}
@@ -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;
@@ -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 (
<>
<View className={styles.order_price}>
<View className={classnames(styles.order_price_text, status&&styles.emphasis)}>
<View className={classnames(styles.order_price_text, titleStatus&&styles.emphasis)}>
<Text>{title}</Text>
<View className={styles.iconfont_msg}>
<Text className={classnames(styles.miconfont, 'iconfont icon-zhushi')}></Text>
{/* <View className={classnames(styles.message)}>123123123121212312312312312</View> */}
</View>
</View>
<AmountShow status={1} number={number}/>
<AmountShow status={numberStatus} number={number}/>
</View>
</>
)
+21 -4
View File
@@ -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)&&<EstimatedAmount number={formatPriceDiv(value?.estimate_amount)} title="预估金额" />}
{(value&&value.status >= 3)&&<EstimatedAmount number={formatPriceDiv(value?.total_sale_price)} titleStatus={false} numberStatus={0} title="合计金额" />}
{(value&&value.status >= 3)&&<EstimatedAmount number={formatPriceDiv(value?.total_weight_error_discount)} titleStatus={false} numberStatus={0} title="空差优惠" />}
{(value&&value.status >= 3)&&<EstimatedAmount number={formatPriceDiv(value?.total_should_collect_money)} title="应付金额" />}
</>
)
}, [value])
return (
<>
<View className={styles.orders_list_title}>{numText}</View>
@@ -63,7 +80,7 @@ export default memo(({value}:{value:OrderParam|null}) => {
})
}
<View className={styles.order_estimated_amount}>
<EstimatedAmount number={formatPriceDiv(value?.estimate_amount)} title="预估金额" />
{priceConDom}
</View>
</View>
</>
@@ -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;
@@ -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)&&<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)}>
{list.map((item, index) => <View className={styles.order_status_item}>
{(list.length > 1)&&<View className={classnames(styles.order_status_tail, (index == 0)&&styles.order_status_tail_end)}></View>}
{(list.length != (index + 1))&&<View className={styles.order_status_line}></View>}
{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>}
{(dataList.length != (index + 1))&&<View className={styles.order_status_line}></View>}
<View className={styles.order_status_content}>
<View className={classnames(styles.order_status_title, (index == 0)&&styles.order_status_select)}>{item.status}</View>
<View className={classnames(styles.order_status_time, (index == 0)&&styles.order_status_select)}>{formatDateTime(item.time)}</View>
<View className={classnames(styles.order_status_tag, (index == 0)&&styles.order_status_tag_select)}>{item.tag}</View>
{/* <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>
</View>)}
</View>
{(list.length > 2) && <View className={styles.more} onClick={() => changeMore()}>
{(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>}
+65 -10
View File
@@ -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<any>()
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 (
<View className={styles.payment_main}>
<Popup show={show} showTitle={false} onClose={onClose} >
@@ -35,7 +90,7 @@ export default memo(({show = false, onClose}: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={6000.33}/>
<AmountShow status={2} number={formatPriceDiv(payInfo?.amount)}/>
</View>
<View className={styles.payment_list}>
<View className={styles.payment_list_top_border}></View>
@@ -59,19 +114,19 @@ export default memo(({show = false, onClose}:Param) => {
<View className={classnames('iconfont icon-a-tuikuanshouhou', styles.miconfont)}></View>
<View className={styles.payment_list_item_left_text}>预存款</View>
</View>
<View className={styles.payment_list_item_left_price}>金额不足,剩余 ¥0.00</View>
<View className={styles.payment_list_item_left_price}>金额不足,剩余 ¥{payInfo?.advance_deposit_balance}</View>
</View>
<MCheckbox status={true} onSelect={() => console.log()} onClose={() =>console.log()}/>
<MCheckbox status={submitData.payment_method == 0} onSelect={() => advanceSelectData(0)} onClose={() => advanceSelectData(null)}/>
</View>
<View className={styles.payment_list_item}>
<View className={styles.payment_list_item_left}>
<View className={styles.payment_list_item_left_name}>
<View className={classnames('iconfont icon-a-tuikuanshouhou', styles.miconfont)}></View>
<View className={styles.payment_list_item_left_text}>x天账期</View>
<View className={styles.payment_list_item_left_text}>{payInfo?.account_period}天账期</View>
</View>
<View className={styles.payment_list_item_left_price}>可用额度 ¥3,000.00</View>
<View className={styles.payment_list_item_left_price}>可用额度 ¥{payInfo?.account_period_credit_available_line}</View>
</View>
<MCheckbox status={true} onSelect={() => console.log()} onClose={() =>console.log()}/>
<MCheckbox status={submitData.payment_method == 1} onSelect={() => periodSelectData(1)} onClose={() => periodSelectData(null)}/>
</View>
<View className={styles.payment_list_item} onClick={onShowOfflinePay}>
<View className={styles.payment_list_item_left}>
@@ -93,7 +148,7 @@ export default memo(({show = false, onClose}:Param) => {
</View>
</View>
</View>
<View className={styles.btns}>确认交易</View>
<View className={styles.btns} onClick={submitPay}>确认交易</View>
</View>
</Popup>
<OfflinePay show={offlinePayShow} onClose={() => setofflinePayShow(false)}/>