xuan/TestRestructureWechatLymarketDist
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

订单列表对接

Browse Source
This commit is contained in:
czm 2022-05-27 20:34:13 +08:00
parent e73bd1bc25
commit b93b59332b
19 changed files with 236 additions and 111 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/api/order.ts
View File

@ -21,11 +21,11 @@ export const SaleOrderApi = () => {
}
/**
* 获取商城待配布订单详情
* 获取商城订单详情
*/
export const GetSaleOrderDetailApi = () => {
return useRequest({
url: `/v1/mall/saleOrder/arranging`,
url: `/v1/mall/saleOrder/detail`,
method: "get",
})
}

21
src/api/orderPay.ts Normal file
View File

@ -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",
})
}

15
src/common/common.ts
View File

@ -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})
}
}

4
src/common/constant.js
View File

@ -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
// 生成密钥

3
src/components/infiniteScroll/index.module.scss
View File

@ -11,6 +11,9 @@
display: flex;
align-items: center;
}
.noMore{
padding-top: 20px;
}
}
.scrollViewCon {
// height: 100%;

2
src/components/infiniteScroll/index.tsx
View File

@ -93,7 +93,7 @@ export default memo(({
<View className={style.infinite_scroll}>
{
(statusMore == 2)&&<View className={style.loading_more}>加载中<DotLoading/></View>||
<View>没有更多数据了</View>
<View className={style.noMore}>没有更多数据了</View>
}
</View>
</View>

35
src/components/orderBtns/index.tsx
View File

@ -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 (
<View className={styles.btns_list}>
{orderBtnsList.current.map((item, index) =>
orderBtnsShow(item, status)&&<View className={styles.btns_item} onClick={() => submitBtns(index)}>{item.label}</View>
orderBtnsShow(item, status)&&<View className={styles.btns_item} onClick={() => submitBtns(item.id)}>{item.label}</View>
)}
</View>
)

15
src/pages/order/comfirm.tsx
View File

@ -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)
}

8
src/pages/order/components/addressInfoDetail/index.tsx
View File

@ -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)
}

2
src/pages/order/components/amountShow/index.module.scss
View File

@ -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;

9
src/pages/order/components/estimatedAmount/index.tsx
View File

@ -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>
</>
)

25
src/pages/order/components/kindList/index.tsx
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>
</>

3
src/pages/order/components/orderState/index.module.scss
View File

@ -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;

17
src/pages/order/components/orderState/index.tsx
View File

@ -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>}

75
src/pages/order/components/payment/index.tsx
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)}/>

4
src/pages/order/index.config.ts
View File

@ -1,3 +1,5 @@
export default {
navigationBarTitleText: '订单详情'
navigationBarTitleText: '订单详情',
enablePullDownRefresh: true,
backgroundTextStyle: 'dark'
}

34
src/pages/order/index.tsx
View File

@ -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";
@ -38,6 +41,7 @@ import styles from './index.module.scss'
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 (
<View className={styles.order_main}>
@ -161,13 +185,13 @@ import styles from './index.module.scss'
<View className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></View>
</View>
<View className={styles.submit_order}>
<OrderBtns status={orderDetail?.status} orderId={orderDetail?.id}/>
<View className={styles.order_btn} onClick={() => toPay()}>去支付</View>
<OrderBtns status={orderDetail?.status} orderId={orderDetail?.id} onClick={orderStateClick}/>
{/* <View className={styles.order_btn} onClick={() => toPay()}>去支付</View> */}
</View>
<Popup show={showDesc} showTitle={false} onClose={() => setShowDesc(false)} >
<Remark onSave={(e) => getRemark(e)}/>
</Popup>
<Payment show={payMentShow} onClose={() => setPayMentShow(false)}/>
<Payment show={payMentShow} onClose={() => setPayMentShow(false)} orderId={orderDetail?.should_collect_order_id}/>
<View className="common_safe_area_y"></View>
</View>
)

51
src/pages/orderList/components/order/index.tsx
View File

@ -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 (
<View className={styles.order_item}>
<View className={styles.header} onClick={() => goLink('/pages/order/index', {id: value?.id})}>
<View className={styles.user}>
<Image src={`${userInfo.adminUserInfo.avatar_url}`}/>
<Text className={styles.name}>{userInfo.adminUserInfo.user_name}</Text>
<Image src={`${userInfo?.adminUserInfo?.avatar_url}`}/>
<Text className={styles.name}>{userInfo?.adminUserInfo?.user_name}</Text>
</View>
<View className={styles.order_num}>
<Text>订单号：{value?.order_no}</Text>
@ -114,7 +83,7 @@ export default memo(({value}: Param) => {
</View>
<View className={styles.color_count_num}>{`${value?.total_fabrics}种面料，${value?.total_colors}种颜色，共${value?.total_number}条`}</View>
</View>
<OrderBtns status={value?.status}/>
<OrderBtns status={value?.status} onClick={orderBtnsClick} orderId={value?.id as number}/>
</View>
)
})

18
src/pages/orderList/index.tsx
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, 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()
}
@ -83,6 +82,17 @@ export default () => {
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 (
<View className={styles.order_list_main}>
<View className={styles.title}>
@ -98,9 +108,9 @@ export default () => {
</View>
</View>
<View className={styles.order_list}>
<InfiniteScroll statusMore={statusMore} selfonScrollToLower={getScrolltolower} >
<InfiniteScroll statusMore={statusMore} selfonScrollToLower={getScrolltolower} refresherEnabled={true} selfOnRefresherRefresh={getRefresherRefresh}>
{orderData?.list.map(item => {
return <View key={item.id} className={styles.order_item_con}> <Order value={item}/></View>
return <View key={item.id} className={styles.order_item_con}> <Order value={item} onClickBtn={clickOrderBtn}/></View>
})}
</InfiniteScroll>
</View>