更新若干功能

apps/web-antd/src/views/dashboard/workspace/index.vue

@@ -1,236 +1,151 @@
 <script lang="ts" setup>
+/**
+ * 工作台：用订单/清单/用户真实统计替换 Vben 示例数据。
+ */
 import type {
   WorkbenchProjectItem,
   WorkbenchQuickNavItem,
   WorkbenchTodoItem,
-  WorkbenchTrendItem,
 } from '@vben/common-ui';
 
-import { ref } from 'vue';
+import { onMounted, ref } from 'vue';
 import { useRouter } from 'vue-router';
 
 import {
-  AnalysisChartCard,
   WorkbenchHeader,
   WorkbenchProject,
   WorkbenchQuickNav,
   WorkbenchTodo,
-  WorkbenchTrends,
 } from '@vben/common-ui';
 import { preferences } from '@vben/preferences';
 import { useUserStore } from '@vben/stores';
-import { openWindow } from '@vben/utils';
 
-import AnalyticsVisitsSource from '../analytics/analytics-visits-source.vue';
+import { getOrderStat } from '#/views/customer/order/api';
 
 const userStore = useUserStore();
+const router = useRouter();
 
-// 这是一个示例数据，实际项目中需要根据实际情况进行调整
-// url 也可以是内部路由，在 navTo 方法中识别处理，进行内部跳转
-// 例如：url: /dashboard/workspace
-const projectItems: WorkbenchProjectItem[] = [
-  {
-    color: '',
-    content: '不要等待机会，而要创造机会。',
-    date: '2021-04-01',
-    group: '开源组',
-    icon: 'carbon:logo-github',
-    title: 'Github',
-    url: 'https://github.com',
-  },
-  {
-    color: '#3fb27f',
-    content: '现在的你决定将来的你。',
-    date: '2021-04-01',
-    group: '算法组',
-    icon: 'ion:logo-vue',
-    title: 'Vue',
-    url: 'https://vuejs.org',
-  },
-  {
-    color: '#e18525',
-    content: '没有什么才能比努力更重要。',
-    date: '2021-04-01',
-    group: '上班摸鱼',
-    icon: 'ion:logo-html5',
-    title: 'Html5',
-    url: 'https://developer.mozilla.org/zh-CN/docs/Web/HTML',
-  },
-  {
-    color: '#bf0c2c',
-    content: '热情和欲望可以突破一切难关。',
-    date: '2021-04-01',
-    group: 'UI',
-    icon: 'ion:logo-angular',
-    title: 'Angular',
-    url: 'https://angular.io',
-  },
-  {
-    color: '#00d8ff',
-    content: '健康的身体是实现目标的基石。',
-    date: '2021-04-01',
-    group: '技术牛',
-    icon: 'bx:bxl-react',
-    title: 'React',
-    url: 'https://reactjs.org',
-  },
-  {
-    color: '#EBD94E',
-    content: '路是走出来的，而不是空想出来的。',
-    date: '2021-04-01',
-    group: '架构组',
-    icon: 'ion:logo-javascript',
-    title: 'Js',
-    url: 'https://developer.mozilla.org/zh-CN/docs/Web/JavaScript',
-  },
-];
+const stat = ref<Record<string, any>>({});
+
+const projectItems = ref<WorkbenchProjectItem[]>([]);
+const todoItems = ref<WorkbenchTodoItem[]>([]);
 
-// 同样，这里的 url 也可以使用以 http 开头的外部链接
 const quickNavItems: WorkbenchQuickNavItem[] = [
   {
     color: '#1fdaca',
-    icon: 'ion:home-outline',
-    title: '首页',
-    url: '/',
-  },
-  {
-    color: '#bf0c2c',
-    icon: 'ion:grid-outline',
-    title: '仪表盘',
-    url: '/dashboard',
+    icon: 'ion:cube-outline',
+    title: '商品图册',
+    url: '/goods/catalogue',
   },
   {
     color: '#e18525',
     icon: 'ion:layers-outline',
-    title: '组件',
-    url: '/demos/features/icons',
+    title: '套餐搭配',
+    url: '/goods/package',
   },
   {
     color: '#3fb27f',
-    icon: 'ion:settings-outline',
-    title: '系统管理',
-    url: '/demos/features/login-expired', // 这里的 URL 是示例，实际项目中需要根据实际情况进行调整
+    icon: 'ion:list-outline',
+    title: '清单管理',
+    url: '/customer/list',
+  },
+  {
+    color: '#bf0c2c',
+    icon: 'ion:receipt-outline',
+    title: '订单管理',
+    url: '/customer/order',
   },
   {
     color: '#4daf1bc9',
-    icon: 'ion:key-outline',
-    title: '权限管理',
-    url: '/demos/access/page-control',
+    icon: 'ion:people-outline',
+    title: '微信用户',
+    url: '/customer/wx-user',
   },
   {
     color: '#00d8ff',
-    icon: 'ion:bar-chart-outline',
-    title: '图表',
-    url: '/analytics',
+    icon: 'ion:chatbubble-outline',
+    title: '用户反馈',
+    url: '/customer/feedback',
+  },
+  {
+    color: '#8b5cf6',
+    icon: 'ion:return-down-back-outline',
+    title: '售后管理',
+    url: '/customer/after-sale',
   },
 ];
 
-const todoItems = ref<WorkbenchTodoItem[]>([
-  {
-    completed: false,
-    content: `审查最近提交到Git仓库的前端代码，确保代码质量和规范。`,
-    date: '2024-07-30 11:00:00',
-    title: '审查前端代码提交',
-  },
-  {
-    completed: true,
-    content: `检查并优化系统性能，降低CPU使用率。`,
-    date: '2024-07-30 11:00:00',
-    title: '系统性能优化',
-  },
-  {
-    completed: false,
-    content: `进行系统安全检查，确保没有安全漏洞或未授权的访问。 `,
-    date: '2024-07-30 11:00:00',
-    title: '安全检查',
-  },
-  {
-    completed: false,
-    content: `更新项目中的所有npm依赖包，确保使用最新版本。`,
-    date: '2024-07-30 11:00:00',
-    title: '更新项目依赖',
-  },
-  {
-    completed: false,
-    content: `修复用户报告的页面UI显示问题，确保在不同浏览器中显示一致。 `,
-    date: '2024-07-30 11:00:00',
-    title: '修复UI显示问题',
-  },
-]);
-const trendItems: WorkbenchTrendItem[] = [
-  {
-    avatar: 'svg:avatar-1',
-    content: `在 <a>开源组</a> 创建了项目 <a>Vue</a>`,
-    date: '刚刚',
-    title: '威廉',
-  },
-  {
-    avatar: 'svg:avatar-2',
-    content: `关注了 <a>威廉</a> `,
-    date: '1个小时前',
-    title: '艾文',
-  },
-  {
-    avatar: 'svg:avatar-3',
-    content: `发布了 <a>个人动态</a> `,
-    date: '1天前',
-    title: '克里斯',
-  },
-  {
-    avatar: 'svg:avatar-4',
-    content: `发表文章 <a>如何编写一个Vite插件</a> `,
-    date: '2天前',
-    title: 'Vben',
-  },
-  {
-    avatar: 'svg:avatar-1',
-    content: `回复了 <a>杰克</a> 的问题 <a>如何进行项目优化？</a>`,
-    date: '3天前',
-    title: '皮特',
-  },
-  {
-    avatar: 'svg:avatar-2',
-    content: `关闭了问题 <a>如何运行项目</a> `,
-    date: '1周前',
-    title: '杰克',
-  },
-  {
-    avatar: 'svg:avatar-3',
-    content: `发布了 <a>个人动态</a> `,
-    date: '1周前',
-    title: '威廉',
-  },
-  {
-    avatar: 'svg:avatar-4',
-    content: `推送了代码到 <a>Github</a>`,
-    date: '2021-04-01 20:00',
-    title: '威廉',
-  },
-  {
-    avatar: 'svg:avatar-4',
-    content: `发表文章 <a>如何编写使用 Admin Vben</a> `,
-    date: '2021-03-01 20:00',
-    title: 'Vben',
-  },
-];
-
-const router = useRouter();
-
-// 这是一个示例方法，实际项目中需要根据实际情况进行调整
-// This is a sample method, adjust according to the actual project requirements
 function navTo(nav: WorkbenchProjectItem | WorkbenchQuickNavItem) {
-  if (nav.url?.startsWith('http')) {
-    openWindow(nav.url);
-    return;
-  }
   if (nav.url?.startsWith('/')) {
-    router.push(nav.url).catch((error) => {
-      console.error('Navigation failed:', error);
-    });
-  } else {
-    console.warn(`Unknown URL for navigation item: ${nav.title} -> ${nav.url}`);
+    router.push(nav.url).catch(() => undefined);
   }
 }
+
+/** 把订单概览铺到工作台卡片和待办 */
+async function loadStat() {
+  const data = (await getOrderStat()) ?? {};
+  stat.value = data;
+  projectItems.value = [
+    {
+      color: '#3fb27f',
+      content: `待付款 ${data.unpaid ?? 0} 单`,
+      date: '',
+      group: '订单',
+      icon: 'ion:card-outline',
+      title: `订单 ${data.total ?? 0} 笔`,
+      url: '/customer/order',
+    },
+    {
+      color: '#e18525',
+      content: `待审凭证 ${data.auditing ?? 0} 笔`,
+      date: '',
+      group: '收款',
+      icon: 'ion:cash-outline',
+      title: `成交 ¥${data.amount_text ?? '0'}`,
+      url: '/customer/order',
+    },
+    {
+      color: '#1fdaca',
+      content: '客户选品清单',
+      date: '',
+      group: '清单',
+      icon: 'ion:list-outline',
+      title: `清单 ${data.list_count ?? 0} 份`,
+      url: '/customer/list',
+    },
+    {
+      color: '#00d8ff',
+      content: '小程序授权用户',
+      date: '',
+      group: '客户',
+      icon: 'ion:people-outline',
+      title: `用户 ${data.wx_user_count ?? 0} 人`,
+      url: '/customer/wx-user',
+    },
+  ];
+  todoItems.value = [
+    {
+      completed: (data.auditing ?? 0) === 0,
+      content: '转账凭证待审核，通过后订单会记为已付款。',
+      date: '',
+      title: `待审凭证 ${data.auditing ?? 0} 笔`,
+    },
+    {
+      completed: (data.unpaid ?? 0) === 0,
+      content: '未付款订单，可跟进客户或后台代客确认。',
+      date: '',
+      title: `待付款 ${data.unpaid ?? 0} 单`,
+    },
+    {
+      completed: (data.paid ?? 0) === 0,
+      content: '已付款待发货，请及时填写物流或自提点。',
+      date: '',
+      title: `待发货 ${data.paid ?? 0} 单`,
+    },
+  ];
+}
+
+onMounted(loadStat);
 </script>
 
 <template>
@@ -239,15 +154,21 @@ function navTo(nav: WorkbenchProjectItem | WorkbenchQuickNavItem) {
       :avatar="userStore.userInfo?.avatar || preferences.app.defaultAvatar"
     >
       <template #title>
-        早安, {{ userStore.userInfo?.realName }}, 开始您一天的工作吧！
+        {{ userStore.userInfo?.realName || '管理员' }}，开始处理业务吧
+      </template>
+      <template #description>
+        成交 ¥{{ stat.amount_text || '0' }} · 待审 {{ stat.auditing || 0 }} ·
+        用户 {{ stat.wx_user_count || 0 }}
       </template>
-      <template #description> 今日晴，20℃ - 32℃！ </template>
     </WorkbenchHeader>
 
     <div class="flex flex-col lg:flex-row">
       <div class="mr-4 w-full lg:w-3/5">
-        <WorkbenchProject :items="projectItems" title="项目" @click="navTo" />
-        <WorkbenchTrends :items="trendItems" class="mt-5" title="最新动态" />
+        <WorkbenchProject
+          :items="projectItems"
+          title="业务概览"
+          @click="navTo"
+        />
       </div>
       <div class="w-full lg:w-2/5">
         <WorkbenchQuickNav
@@ -256,10 +177,7 @@ function navTo(nav: WorkbenchProjectItem | WorkbenchQuickNavItem) {
           title="快捷导航"
           @click="navTo"
         />
-        <WorkbenchTodo :items="todoItems" class="mt-5" title="待办事项" />
-        <AnalysisChartCard class="mt-5" title="访问来源">
-          <AnalyticsVisitsSource />
-        </AnalysisChartCard>
+        <WorkbenchTodo :items="todoItems" class="mt-5" title="待办" />
       </div>
     </div>
   </div>