feat(order): 在待发货订单列表增加关闭订单功能

- 在 OrderCard 组件中新增 onCloseOrder 可选回调属性
- 待发货且未取消的订单显示“关闭订单”按钮
- 点击按钮阻止事件冒泡,避免触发卡片跳转
- 列表页实现 handleCloseOrder,弹窗确认后调用 updateShopOrder
- 关闭订单后显示成功提示并刷新当前列表数据
- 复用订单详情页取消订单的状态更新逻辑,保持一致性
This commit is contained in:
2026-07-14 22:25:33 +08:00
parent dfbcbcf615
commit f878ea146e
3 changed files with 69 additions and 5 deletions

View File

@@ -1,10 +1,10 @@
import React, { useState, useEffect, useCallback, useRef } from 'react'
import { View, Text, ScrollView } from '@tarojs/components'
import Taro from '@tarojs/taro'
import { pageShopOrder } from '@/api/shop/shopOrder'
import { pageShopOrder, updateShopOrder } from '@/api/shop/shopOrder'
import type { ShopOrder, ShopOrderParam } from '@/api/shop/shopOrder/model'
import { useUser } from '@/hooks/useUser'
import { OrderListStatus, OrderListTabText } from '@/types/order'
import { OrderListStatus, OrderListTabText, OrderStatus } from '@/types/order'
import OrderCard from '@/components/common/OrderCard'
import EmptyState from '@/components/common/EmptyState'
import LoadMore from '@/components/common/LoadMore'
@@ -147,6 +147,27 @@ const OrderListPage: React.FC = () => {
}
}
/** 关闭订单(待发货状态下允许客户取消) */
const handleCloseOrder = (order: ShopOrder) => {
Taro.showModal({
title: '确认关闭订单',
content: '关闭后订单将取消,是否确认?',
confirmColor: '#ee0a24',
success: async (res) => {
if (res.confirm && order?.orderId) {
try {
await updateShopOrder({ ...order, orderStatus: OrderStatus.Cancelled })
Taro.showToast({ title: '订单已关闭', icon: 'success' })
// 刷新当前 tab
loadOrders(tabIndex, 1)
} catch (err: any) {
Taro.showToast({ title: err?.message || '关闭失败', icon: 'none' })
}
}
}
})
}
const handleTabChange = (index: number) => {
if (index !== tabIndex) {
setTabIndex(index)
@@ -209,7 +230,11 @@ const OrderListPage: React.FC = () => {
<View className='p-3'>
{tabStates[idx].orders.length > 0 ? (
tabStates[idx].orders.map(order => (
<OrderCard key={order.orderId} order={order} />
<OrderCard
key={order.orderId}
order={order}
onCloseOrder={handleCloseOrder}
/>
))
) : tabStates[idx].initialized && !tabStates[idx].loading ? (
<EmptyState text='暂无订单' />