refactor(app): 重构用户中心和订单相关页面

-调整了 app.config.ts 中的页面路径和顺序
- 移除了 article 页面
- 重构了 cart、find、order 和 user 页面的布局和功能
- 优化了导航栏和订单状态的显示逻辑
- 统一了页面样式和图标使用
This commit is contained in:
2025-08-11 21:03:27 +08:00
parent 87b83b4d2c
commit f69decdf4d
23 changed files with 206 additions and 354 deletions

View File

@@ -7,7 +7,8 @@ import {
InputNumber,
Button,
Empty,
Divider
Divider,
ConfigProvider
} from '@nutui/nutui-react-taro';
import {ArrowLeft, Del, Shopping} from '@nutui/icons-react-taro';
import {View} from '@tarojs/components';
@@ -26,6 +27,16 @@ function Cart() {
clearCart
} = useCart();
// InputNumber 主题配置
const customTheme = {
nutuiInputnumberButtonWidth: '28px',
nutuiInputnumberButtonHeight: '28px',
nutuiInputnumberInputWidth: '40px',
nutuiInputnumberInputHeight: '28px',
nutuiInputnumberInputBorderRadius: '4px',
nutuiInputnumberButtonBorderRadius: '4px',
}
useShareTimeline(() => {
return {
title: '购物车 - 网宿小店'
@@ -138,11 +149,52 @@ function Cart() {
}
}, [selectedItems, cartItems]);
if (cartItems.length === 0) {
return (
<>
<NavBar
fixed={true}
style={{marginTop: `${statusBarHeight}px`}}
left={<ArrowLeft onClick={() => Taro.navigateBack()}/>}
right={
cartItems.length > 0 && (
<Button
size="small"
type="primary"
fill="none"
onClick={() => {
Taro.showModal({
title: '确认清空',
content: '确定要清空购物车吗?',
success: (res) => {
if (res.confirm) {
clearCart();
setSelectedItems([]);
}
}
});
}}
>
</Button>
)
}
>
<span className="text-lg">({cartCount})</span>
</NavBar>
<Empty
description="购物车空空如也"
actions={[{ text: '去逛逛' }]}
style={{ marginTop: `${statusBarHeight + 50}px` }}
onClick={() => Taro.switchTab({ url: '/pages/index/index' })}
/>
</>
)
}
return (
<>
<View style={{backgroundColor: '#f6f6f6', height: `${statusBarHeight}px`}}
className="fixed z-10 top-0 w-full"></View>
className="fixed z-10 top-0 w-full"></View>
<NavBar
fixed={true}
style={{marginTop: `${statusBarHeight}px`}}
@@ -224,16 +276,14 @@ function Cart() {
<span className={'text-xs'}></span>
<span className={'font-bold text-lg'}>{item.price}</span>
</View>
<View className="flex items-center gap-2">
<ConfigProvider theme={customTheme}>
<InputNumber
value={item.quantity}
min={1}
max={99}
onChange={(value) => handleQuantityChange(item.goodsId, Number(value))}
className="w-24"
/>
<Del className={'text-red-500'} size={16} onClick={() => handleRemoveItem(item.goodsId)}/>
</View>
</ConfigProvider>
<Del className={'text-red-500'} size={14} onClick={() => handleRemoveItem(item.goodsId)}/>
</View>
</View>
</View>