From 549e8258b6904bc4a79a122cb2a1274305d2bf39 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=B5=B5=E5=BF=A0=E6=9E=97?= <170083662@qq.com> Date: Wed, 15 Jul 2026 23:51:37 +0800 Subject: [PATCH] =?UTF-8?q?fix(user):=20=E4=BF=AE=E5=A4=8D=E8=AE=A2?= =?UTF-8?q?=E5=8D=95=E5=85=A5=E5=8F=A3tab=E9=94=99=E4=BD=8D=E5=B9=B6?= =?UTF-8?q?=E7=BB=9F=E4=B8=80=E8=B4=AD=E7=89=A9=E8=BD=A6=E8=A7=92=E6=A0=87?= =?UTF-8?q?=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将订单快捷入口和我的订单tab索引改为tabIndex，修正页面跳转参数使用`?tab=`传递 - 修复因状态值与tab索引不匹配导致的订单状态页错位问题 - 更新`user.tsx`和`index.tsx`中相关订单tab配置，确保键名和逻辑一致 - 购物车入口数量角标由手写样式改为Badge组件，去除白色边框样式 - 购物车角标与用户订单图标角标样式保持一致，使用绝对定位调整位置 - `navigateTo`跳转及未登录重定向均支持传递正确的tab索引参数 --- .workbuddy/memory/2026-07-15.md | 16 ++++++++++++++++ src/pages/shop/product-detail.tsx | 25 +++---------------------- src/pages/user/index.tsx | 12 ++++++------ src/pages/user/user.tsx | 20 ++++++++++---------- 4 files changed, 35 insertions(+), 38 deletions(-) diff --git a/.workbuddy/memory/2026-07-15.md b/.workbuddy/memory/2026-07-15.md index 136a9ad..ff1872f 100644 --- a/.workbuddy/memory/2026-07-15.md +++ b/.workbuddy/memory/2026-07-15.md @@ -345,3 +345,19 @@ - passport/register.tsx:88、passport/sms-login.tsx:36 - D. pages/order/list.tsx:127 注释更新（去掉"tabBar 页"描述） - 遗留（未改，预先存在）：pages/user/index.tsx:140 `switchTab(points/index)` 积分页非 tabBar，会失败 + +## product-detail 购物车角标改用 Badge 组件（2026-07-15 23:42） +- `src/pages/shop/product-detail.tsx` 底部购物车入口的数量角标，原为手写内联 View+Text（带白边框、top:-6px/right:-10px 定位），改为 `` +- 用法与 user.tsx "我的订单"图标角标（:284）完全一致；外层已有 `relative inline-flex` 容器，Badge 的 absolute 定位正常 +- 新增 import `Badge from '@/components/common/Badge'` +- 去掉了原来的白色边框，与"我的订单"角标样式统一 + +## 修复订单快捷入口 tab 错位 bug（2026-07-15 23:48） +- Bug：`pages/user/user.tsx` "我的订单"快捷入口（待付款/待发货/待收货/已完成）把"订单状态值"（0/1/3/5）写入 `order_tab` storage，navigateTo 到 order/list 后，`order/list.tsx:42` 用 `useState(Number(initTab) || 0)` 把传入值直接当 **tabIndex** 用 → 全部错位一个 tab（待付款 0→全部, 待发货 1→待付款, 待收货 3 巧合对, 已完成 5 越界→0→全部） +- `pages/user/index.tsx` 传 0/1/2/3 也全错位一个 tab +- order/list.tsx `tabList` 顺序：index 0=全部 / 1=待付款 / 2=待发货 / 3=待收货 / 4=已完成 +- 修复：调用方把字段从 `status`（订单状态）改为 `tabIndex`（1/2/3/4），navigateTo 加 `?tab=${tabIndex}`（order/list 已支持 `router.params.tab` 优先于 storage），未登录拦截的 redirect 也带 `?tab=` +- 改动： + - `src/pages/user/user.tsx`：`handleOrderTabClick` 参数 `status`→`tabIndex` + redirect/navigateTo 带 `?tab=`；menuItems 字段 `status(0/1/3/5)`→`tabIndex(1/2/3/4)`；`key={item.tabIndex}`、`onClick` 传 `item.tabIndex` + - `src/pages/user/index.tsx`：硬编码数组 `status(0/1/2/3)`→`tabIndex(1/2/3/4)`；`key={item.tabIndex}`、onClick + `?tab=${item.tabIndex}` +- 其他"全部订单"类入口（user.tsx:149 handleViewAllOrders、user/index.tsx:22/158/175）不传 `?tab=`，进默认"全部" tab，合理 diff --git a/src/pages/shop/product-detail.tsx b/src/pages/shop/product-detail.tsx index b97ca9f..0ecd3f9 100644 --- a/src/pages/shop/product-detail.tsx +++ b/src/pages/shop/product-detail.tsx @@ -11,6 +11,7 @@ import { } from '@/api/shop/shopGoodsFavorite' import type { ShopGoods, ShopGoodsSku } from '@/api/shop/shopGoods/model' import Price from '@/components/common/Price' +import Badge from '@/components/common/Badge' import SkuSelector from '@/components/business/SkuSelector' import { useCartContext } from '@/contexts/CartContext' import { useUserContext } from '@/contexts/UserContext' @@ -433,28 +434,8 @@ const ProductDetailPage: React.FC = () => { 🛒 - {totalCount > 0 && ( - - - {totalCount > 99 ? '99+' : totalCount} - - - )} + {/* 购物车数量角标：count 为 0 时组件内部不渲染 */} + 购物车 diff --git a/src/pages/user/index.tsx b/src/pages/user/index.tsx index ca05dac..005d61b 100644 --- a/src/pages/user/index.tsx +++ b/src/pages/user/index.tsx @@ -178,16 +178,16 @@ const UserPage: React.FC = () => { {[ - { icon: '💳', label: '待付款', status: 0, color: '#f093fb' }, - { icon: '📦', label: '待发货', status: 1, color: '#667eea' }, - { icon: '🚚', label: '待收货', status: 2, color: '#4facfe' }, - { icon: '✅', label: '已完成', status: 3, color: '#52c41a' }, + { icon: '💳', label: '待付款', tabIndex: 1, color: '#f093fb' }, + { icon: '📦', label: '待发货', tabIndex: 2, color: '#667eea' }, + { icon: '🚚', label: '待收货', tabIndex: 3, color: '#4facfe' }, + { icon: '✅', label: '已完成', tabIndex: 4, color: '#52c41a' }, ].map(item => ( { Taro.setStorageSync('order_tab', item.status); Taro.navigateTo({ url: '/pages/order/list' }) }} + onClick={() => { Taro.setStorageSync('order_tab', item.tabIndex); Taro.navigateTo({ url: `/pages/order/list?tab=${item.tabIndex}` }) }} > {item.icon} {item.label} diff --git a/src/pages/user/user.tsx b/src/pages/user/user.tsx index 6b8610b..f4cc24d 100644 --- a/src/pages/user/user.tsx +++ b/src/pages/user/user.tsx @@ -138,10 +138,10 @@ const UserPage: React.FC = () => { } // 订单快捷入口点击：需要登录 - const handleOrderTabClick = (status: number) => { - if (!requireLogin({ action: 'viewOrder', redirect: '/pages/order/list', content: '登录后才能查看订单，是否前往登录？' })) return - Taro.setStorageSync('order_tab', status) - Taro.navigateTo({ url: '/pages/order/list' }) + const handleOrderTabClick = (tabIndex: number) => { + if (!requireLogin({ action: 'viewOrder', redirect: `/pages/order/list?tab=${tabIndex}`, content: '登录后才能查看订单，是否前往登录？' })) return + Taro.setStorageSync('order_tab', tabIndex) + Taro.navigateTo({ url: `/pages/order/list?tab=${tabIndex}` }) } const handleViewAllOrders = () => { @@ -268,15 +268,15 @@ const UserPage: React.FC = () => { {[ // status 与 OrderListStatus 对齐：0待付款 1待发货 3待收货 5已完成 - { icon: '💳', label: '待付款', status: 0, count: orderStats?.waitPay }, - { icon: '📦', label: '待发货', status: 1, count: orderStats?.waitDeliver }, - { icon: '🚚', label: '待收货', status: 3, count: orderStats?.waitReceive }, - { icon: '✅', label: '已完成', status: 5, count: orderStats?.completed }, + { icon: '💳', label: '待付款', tabIndex: 1, count: orderStats?.waitPay }, + { icon: '📦', label: '待发货', tabIndex: 2, count: orderStats?.waitDeliver }, + { icon: '🚚', label: '待收货', tabIndex: 3, count: orderStats?.waitReceive }, + { icon: '✅', label: '已完成', tabIndex: 4, count: orderStats?.completed }, ].map(item => ( handleOrderTabClick(item.status)} + onClick={() => handleOrderTabClick(item.tabIndex)} > {item.icon} {item.label}