From f9e6eb6fc2c2e0c2a2b17238b817fcbfcb6bab56 Mon Sep 17 00:00:00 2001
From: 云 <2163098428@qq.com>
Date: 星期一, 10 八月 2026 16:38:45 +0800
Subject: [PATCH] feat(erp): 添加采购来票管理和付款关联功能
---
src/views/dashboard/analytics/index.vue | 204 +++++++++++++++++++++++++++++++--------------------
1 files changed, 124 insertions(+), 80 deletions(-)
diff --git a/src/views/dashboard/analytics/index.vue b/src/views/dashboard/analytics/index.vue
index 8e3483a..3714991 100644
--- a/src/views/dashboard/analytics/index.vue
+++ b/src/views/dashboard/analytics/index.vue
@@ -1,90 +1,134 @@
<script lang="ts" setup>
-import type { AnalysisOverviewItem } from '..\..\..\packages\effects\common-ui\src';
-import type { TabOption } from '..\..\..\packages\types\src';
+import { computed, onMounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
-import {
- AnalysisChartCard,
- AnalysisChartsTabs,
- AnalysisOverview,
-} from '..\..\..\packages\effects\common-ui\src';
-import {
- SvgBellIcon,
- SvgCakeIcon,
- SvgCardIcon,
- SvgDownloadIcon,
-} from '..\..\..\packages\icons\src';
+import { Page } from '@vben/common-ui';
-import AnalyticsTrends from './analytics-trends.vue';
-import AnalyticsVisitsData from './analytics-visits-data.vue';
-import AnalyticsVisitsSales from './analytics-visits-sales.vue';
-import AnalyticsVisitsSource from './analytics-visits-source.vue';
-import AnalyticsVisits from './analytics-visits.vue';
+import { Card, Col, Row } from 'ant-design-vue';
-const overviewItems: AnalysisOverviewItem[] = [
- {
- icon: SvgCardIcon,
- title: '鐢ㄦ埛閲�',
- totalTitle: '鎬荤敤鎴烽噺',
- totalValue: 120_000,
- value: 2000,
- },
- {
- icon: SvgCakeIcon,
- title: '璁块棶閲�',
- totalTitle: '鎬昏闂噺',
- totalValue: 500_000,
- value: 20_000,
- },
- {
- icon: SvgDownloadIcon,
- title: '涓嬭浇閲�',
- totalTitle: '鎬讳笅杞介噺',
- totalValue: 120_000,
- value: 8000,
- },
- {
- icon: SvgBellIcon,
- title: '浣跨敤閲�',
- totalTitle: '鎬讳娇鐢ㄩ噺',
- totalValue: 50_000,
- value: 5000,
- },
-];
+import { getHomeSummary } from '#/api/mes/home';
-const chartTabs: TabOption[] = [
- {
- label: '娴侀噺瓒嬪娍',
- value: 'trends',
- },
- {
- label: '鏈堣闂噺',
- value: 'visits',
- },
-];
+import { defaultSummary } from './data';
+import AiInsights from './modules/ai-insights.vue';
+import AlertPanel from './modules/alert-panel.vue';
+import BizCards from './modules/biz-cards.vue';
+import KpiCards from './modules/kpi-cards.vue';
+import ProductionTrend from './modules/production-trend.vue';
+import QuickActions from './modules/quick-actions.vue';
+
+defineOptions({ name: 'DashboardAnalytics' });
+
+const router = useRouter();
+const summary = ref(defaultSummary);
+
+const greeting = computed(() => {
+ const hour = new Date().getHours();
+ if (hour < 6) return '澶滄繁浜�';
+ if (hour < 9) return '鏃╀笂濂�';
+ if (hour < 12) return '涓婂崍濂�';
+ if (hour < 14) return '涓崍濂�';
+ if (hour < 18) return '涓嬪崍濂�';
+ return '鏅氫笂濂�';
+});
+
+const today = computed(() => {
+ const d = new Date();
+ const weekNames = ['鏃�', '涓�', '浜�', '涓�', '鍥�', '浜�', '鍏�'];
+ return `${d.getFullYear()}骞�${d.getMonth() + 1}鏈�${d.getDate()}鏃� 鏄熸湡${weekNames[d.getDay()]}`;
+});
+
+function handleNavigate(name: string) {
+ router.push({ name });
+}
+
+async function loadSummary() {
+ summary.value = await getHomeSummary();
+}
+
+onMounted(() => {
+ loadSummary();
+});
</script>
<template>
- <div class="p-5">
- <AnalysisOverview :items="overviewItems" />
- <AnalysisChartsTabs :tabs="chartTabs" class="mt-5">
- <template #trends>
- <AnalyticsTrends />
- </template>
- <template #visits>
- <AnalyticsVisits />
- </template>
- </AnalysisChartsTabs>
-
- <div class="mt-5 w-full md:flex">
- <AnalysisChartCard class="mt-5 md:mt-0 md:mr-4 md:w-1/3" title="璁块棶鏁伴噺">
- <AnalyticsVisitsData />
- </AnalysisChartCard>
- <AnalysisChartCard class="mt-5 md:mt-0 md:mr-4 md:w-1/3" title="璁块棶鏉ユ簮">
- <AnalyticsVisitsSource />
- </AnalysisChartCard>
- <AnalysisChartCard class="mt-5 md:mt-0 md:w-1/3" title="璁块棶鏉ユ簮">
- <AnalyticsVisitsSales />
- </AnalysisChartCard>
+ <Page auto-content-height>
+ <!-- 娆㈣繋鏍� -->
+ <div class="glass-card mb-6 flex items-center justify-between rounded-2xl p-6">
+ <div>
+ <h1 class="bg-gradient-to-r from-blue-600 via-purple-600 to-pink-500 bg-clip-text text-2xl font-bold text-transparent dark:from-blue-400 dark:via-purple-400 dark:to-pink-400">
+ {{ greeting }}锛屾杩庡洖鏉�
+ </h1>
+ <p class="mt-1 text-sm text-gray-500 dark:text-gray-400">{{ today }}</p>
+ </div>
+ <div class="hidden items-center gap-2 sm:flex">
+ <div class="flex items-center gap-1.5 rounded-full bg-emerald-50 px-3 py-1.5 text-xs font-medium text-emerald-700 dark:bg-emerald-500/15 dark:text-emerald-400">
+ <span class="relative flex size-2">
+ <span class="absolute inline-flex size-full animate-ping rounded-full bg-emerald-400 opacity-75" />
+ <span class="relative inline-flex size-2 rounded-full bg-emerald-500" />
+ </span>
+ 绯荤粺杩愯涓�
+ </div>
+ </div>
</div>
- </div>
+
+ <!-- MES 鐢熶骇 KPI -->
+ <KpiCards :summary="summary" @navigate="handleNavigate" />
+
+ <!-- ERP/WMS/BPM 缁忚惀 KPI -->
+ <BizCards @navigate="handleNavigate" />
+
+ <!-- AI 鏅鸿兘鍒嗘瀽 -->
+ <AiInsights
+ :active-order-count="summary.workOrderActiveCount"
+ @navigate="handleNavigate"
+ />
+
+ <!-- 鐢熶骇瓒嬪娍 + 棰勮闈㈡澘 -->
+ <Row :gutter="16" class="mb-4">
+ <Col :lg="14" :md="24" :sm="24" :xl="14" :xs="24" class="mb-4">
+ <div class="glass-card rounded-2xl p-5">
+ <h3 class="mb-4 text-base font-semibold text-gray-800 dark:text-gray-100">
+ 鐢熶骇瓒嬪娍锛堣繎7澶╋級
+ </h3>
+ <ProductionTrend />
+ </div>
+ </Col>
+ <Col :lg="10" :md="24" :sm="24" :xl="10" :xs="24" class="mb-4">
+ <AlertPanel
+ :andon-active-count="summary.andonActiveCount"
+ :repair-active-count="summary.repairActiveCount"
+ @navigate="handleNavigate"
+ />
+ </Col>
+ </Row>
+
+ <!-- 蹇嵎鎿嶄綔 -->
+ <Row :gutter="16" class="mb-4">
+ <Col :span="24">
+ <QuickActions @navigate="handleNavigate" />
+ </Col>
+ </Row>
+ </Page>
</template>
+
+<style scoped>
+.glass-card {
+ background: linear-gradient(135deg, rgba(255,255,255,0.8), rgba(255,255,255,0.5));
+ backdrop-filter: blur(20px);
+ -webkit-backdrop-filter: blur(20px);
+ border: 1px solid rgba(255,255,255,0.6);
+ box-shadow:
+ 0 8px 32px rgba(0,0,0,0.04),
+ 0 2px 8px rgba(0,0,0,0.02),
+ inset 0 1px 0 rgba(255,255,255,0.8);
+}
+
+.dark .glass-card {
+ background: linear-gradient(135deg, rgba(30,30,50,0.7), rgba(20,20,40,0.5));
+ border: 1px solid rgba(255,255,255,0.08);
+ box-shadow:
+ 0 8px 32px rgba(0,0,0,0.3),
+ 0 2px 8px rgba(0,0,0,0.2),
+ inset 0 1px 0 rgba(255,255,255,0.05);
+}
+</style>
--
Gitblit v1.9.3