feat(shop): 支持Dashboard订单总数点击跳转指定tab
- 修改Dashboard中订单总数和总营业额跳转链接,默认携带tab参数 - 订单总数点击跳转至/shop/shopOrder?tab=all页面 - 待发货订单跳转至/shop/shopOrder?tab=undelivered,退款申请跳转至?tab=refunded - shopOrder页面根据路由查询参数初始化激活tab,确保页面首次加载可正确显示对应订单列表 - 为无效或缺省tab参数设置默认值undelivered - 简化订单页面tab切换逻辑复用公共状态映射函数
This commit is contained in:
@@ -5,3 +5,9 @@
|
||||
- 根因:`activeKey` 默认为 `'undelivered'`,但 `datasource` 函数只设了 `where.type = 0`,没有设 `statusFilter`。`statusFilter` 只在用户点击 tab 触发 `onTabs` 时才设置。所以页面初次加载时查的是全部订单而非待发货订单。
|
||||
- 修复:提取 `getStatusFilterByTab(key)` 公共映射函数,在 `datasource` 中当 `where.statusFilter` 未设置时从 `activeKey` 自动推导。`onTabs` 也简化为复用同一函数。
|
||||
- 文件:`src/views/shop/shopOrder/index.vue`
|
||||
|
||||
## Dashboard 订单总数点击跳转支持指定 tab
|
||||
|
||||
- Dashboard 中"订单总数"/"总营业额"跳转链接改为 `/shop/shopOrder?tab=all`,"待发货订单"改为 `?tab=undelivered`,"退款申请"改为 `?tab=refunded`。
|
||||
- shopOrder 页面读取 `route.query.tab` 初始化 `activeKey`,无效值回退到 `'undelivered'`。
|
||||
- 文件:`src/views/shop/dashboard/index.vue`、`src/views/shop/shopOrder/index.vue`
|
||||
|
||||
@@ -282,8 +282,8 @@ const loading = computed(() => siteLoading.value || statisticsLoading.value);
|
||||
// 核心统计数据(使用computed确保响应式更新)
|
||||
const coreStats = computed(() => [
|
||||
{ icon: '🏸', label: '用户总数', value: userCount.value || 0, desc: '注册用户', color: 'blue', to: '/system/user' },
|
||||
{ icon: '📦', label: '订单总数', value: orderCount.value || 0, desc: '全部订单', color: 'orange', to: '/shop/shopOrder' },
|
||||
{ icon: '💰', label: '总营业额', value: totalSales.value || 0, desc: '元', color: 'purple', to: '/shop/shopOrder' },
|
||||
{ icon: '📦', label: '订单总数', value: orderCount.value || 0, desc: '全部订单', color: 'orange', to: '/shop/shopOrder?tab=all' },
|
||||
{ icon: '💰', label: '总营业额', value: totalSales.value || 0, desc: '元', color: 'purple', to: '/shop/shopOrder?tab=all' },
|
||||
{ icon: '⏱️', label: '运行天数', value: runDays.value || 0, desc: '系统运行', color: 'green', to: '' },
|
||||
]);
|
||||
|
||||
@@ -294,8 +294,8 @@ const couponUsedCount = computed(() => statisticsStore.safeCouponUsedCount);
|
||||
|
||||
// 待处理事项(使用computed确保响应式更新)
|
||||
const todoItems = computed(() => [
|
||||
{ label: '待发货订单', value: pendingShipmentCount.value, to: '/shop/shopOrder', tagColor: 'blue', dotColor: 'dot-blue', urgent: pendingShipmentCount.value > 0 },
|
||||
{ label: '退款申请', value: pendingRefundCount.value, to: '/shop/shopOrder', tagColor: 'orange', dotColor: 'dot-orange', urgent: pendingRefundCount.value > 0 },
|
||||
{ label: '待发货订单', value: pendingShipmentCount.value, to: '/shop/shopOrder?tab=undelivered', tagColor: 'blue', dotColor: 'dot-blue', urgent: pendingShipmentCount.value > 0 },
|
||||
{ label: '退款申请', value: pendingRefundCount.value, to: '/shop/shopOrder?tab=refunded', tagColor: 'orange', dotColor: 'dot-orange', urgent: pendingRefundCount.value > 0 },
|
||||
// { label: '优惠券使用', value: couponUsedCount.value, to: '/market/coupon', tagColor: 'cyan', dotColor: 'dot-cyan', urgent: false },
|
||||
]);
|
||||
|
||||
|
||||
@@ -374,6 +374,7 @@
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { createVNode, ref } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import type { EleProTable } from 'ele-admin-pro';
|
||||
import type {
|
||||
DatasourceFunction,
|
||||
@@ -428,8 +429,13 @@
|
||||
const showDelivery = ref(false);
|
||||
// 加载状态
|
||||
const loading = ref(true);
|
||||
// 激活的标签
|
||||
const activeKey = ref<string>('undelivered');
|
||||
// 激活的标签(支持从路由参数初始化,如 /shop/shopOrder?tab=all)
|
||||
const route = useRoute();
|
||||
const validTabs = ['all', 'undelivered', 'unreceived', 'completed', 'refunded', 'cancelled'];
|
||||
const tabFromQuery = route.query.tab as string;
|
||||
const activeKey = ref<string>(
|
||||
validTabs.includes(tabFromQuery) ? tabFromQuery : 'undelivered'
|
||||
);
|
||||
|
||||
// ============ 新订单提醒 ============
|
||||
const { enabled: notifyEnabled, toggle: onNotifyToggle, testNotify: onTestNotify } = useOrderNotify({
|
||||
|
||||
Reference in New Issue
Block a user