feat(mes): 迁移 home 首页（优化代码）

apps/web-antd/src/views/mes/home/data.ts

@@ -26,64 +26,3 @@ export const WORK_ORDER_STATUS_COLOR_MAP: Record<number, string> = {
   [MesProWorkOrderStatusEnum.FINISHED]: '#67C23A', // 已完成
   [MesProWorkOrderStatusEnum.CANCELED]: '#F56C6C', // 已取消
 };
-
-/** 生产趋势折线图配置 */
-export function getProductionTrendChartOptions(
-  dates: string[],
-  quantities: number[],
-  qualified: number[],
-  unqualified: number[],
-): any {
-  return {
-    grid: { bottom: 40, left: 50, right: 20, top: 20 },
-    legend: { bottom: 0, data: ['产量', '合格品', '不良品'] },
-    series: [
-      {
-        areaStyle: { color: 'rgba(64,158,255,0.15)' },
-        data: quantities,
-        itemStyle: { color: '#409EFF' },
-        name: '产量',
-        smooth: true,
-        type: 'line',
-      },
-      {
-        data: qualified,
-        itemStyle: { color: '#67C23A' },
-        name: '合格品',
-        smooth: true,
-        type: 'line',
-      },
-      {
-        data: unqualified,
-        itemStyle: { color: '#F56C6C' },
-        name: '不良品',
-        smooth: true,
-        type: 'line',
-      },
-    ],
-    tooltip: { axisPointer: { type: 'cross' }, trigger: 'axis' },
-    xAxis: { boundaryGap: false, data: dates, type: 'category' },
-    yAxis: { minInterval: 1, type: 'value' },
-  };
-}
-
-/** 工单状态分布饼图配置 */
-export function getWorkOrderStatusChartOptions(
-  data: Array<{ itemStyle: { color: string }; name: string; value: number }>,
-): any {
-  return {
-    legend: { bottom: 0, type: 'scroll' },
-    series: [
-      {
-        avoidLabelOverlap: true,
-        data,
-        emphasis: { label: { fontSize: 14, fontWeight: 'bold', show: true } },
-        itemStyle: { borderColor: '#fff', borderRadius: 6, borderWidth: 2 },
-        label: { formatter: '{b}\n{c}', show: true },
-        radius: ['40%', '70%'],
-        type: 'pie',
-      },
-    ],
-    tooltip: { formatter: '{b}: {c} ({d}%)', trigger: 'item' },
-  };
-}

apps/web-antd/src/views/mes/home/modules/production-trend.vue

@@ -9,7 +9,7 @@ import { Card, RadioButton, RadioGroup } from 'ant-design-vue';
 
 import { getProductionTrend } from '#/api/mes/home';
 
-import { getProductionTrendChartOptions } from '../data';
+import { getProductionTrendChartOptions } from '../chart-options';
 
 defineOptions({ name: 'MesHomeProductionTrend' });
 

apps/web-antd/src/views/mes/home/modules/work-order-chart.vue

@@ -9,7 +9,8 @@ import { Card } from 'ant-design-vue';
 
 import { getWorkOrderStatusDistribution } from '#/api/mes/home';
 
-import { getWorkOrderStatusChartOptions, WORK_ORDER_STATUS_COLOR_MAP } from '../data';
+import { getWorkOrderStatusChartOptions } from '../chart-options';
+import { WORK_ORDER_STATUS_COLOR_MAP } from '../data';
 
 defineOptions({ name: 'MesHomeWorkOrderChart' });
 

apps/web-ele/src/views/mes/home/data.ts

@@ -26,64 +26,3 @@ export const WORK_ORDER_STATUS_COLOR_MAP: Record<number, string> = {
   [MesProWorkOrderStatusEnum.FINISHED]: '#67C23A', // 已完成
   [MesProWorkOrderStatusEnum.CANCELED]: '#F56C6C', // 已取消
 };
-
-/** 生产趋势折线图配置 */
-export function getProductionTrendChartOptions(
-  dates: string[],
-  quantities: number[],
-  qualified: number[],
-  unqualified: number[],
-): any {
-  return {
-    grid: { bottom: 40, left: 50, right: 20, top: 20 },
-    legend: { bottom: 0, data: ['产量', '合格品', '不良品'] },
-    series: [
-      {
-        areaStyle: { color: 'rgba(64,158,255,0.15)' },
-        data: quantities,
-        itemStyle: { color: '#409EFF' },
-        name: '产量',
-        smooth: true,
-        type: 'line',
-      },
-      {
-        data: qualified,
-        itemStyle: { color: '#67C23A' },
-        name: '合格品',
-        smooth: true,
-        type: 'line',
-      },
-      {
-        data: unqualified,
-        itemStyle: { color: '#F56C6C' },
-        name: '不良品',
-        smooth: true,
-        type: 'line',
-      },
-    ],
-    tooltip: { axisPointer: { type: 'cross' }, trigger: 'axis' },
-    xAxis: { boundaryGap: false, data: dates, type: 'category' },
-    yAxis: { minInterval: 1, type: 'value' },
-  };
-}
-
-/** 工单状态分布饼图配置 */
-export function getWorkOrderStatusChartOptions(
-  data: Array<{ itemStyle: { color: string }; name: string; value: number }>,
-): any {
-  return {
-    legend: { bottom: 0, type: 'scroll' },
-    series: [
-      {
-        avoidLabelOverlap: true,
-        data,
-        emphasis: { label: { fontSize: 14, fontWeight: 'bold', show: true } },
-        itemStyle: { borderColor: '#fff', borderRadius: 6, borderWidth: 2 },
-        label: { formatter: '{b}\n{c}', show: true },
-        radius: ['40%', '70%'],
-        type: 'pie',
-      },
-    ],
-    tooltip: { formatter: '{b}: {c} ({d}%)', trigger: 'item' },
-  };
-}

apps/web-ele/src/views/mes/home/modules/production-trend.vue

@@ -9,7 +9,7 @@ import { ElCard, ElRadioButton, ElRadioGroup } from 'element-plus';
 
 import { getProductionTrend } from '#/api/mes/home';
 
-import { getProductionTrendChartOptions } from '../data';
+import { getProductionTrendChartOptions } from '../chart-options';
 
 defineOptions({ name: 'MesHomeProductionTrend' });
 

apps/web-ele/src/views/mes/home/modules/work-order-chart.vue

@@ -9,7 +9,8 @@ import { ElCard } from 'element-plus';
 
 import { getWorkOrderStatusDistribution } from '#/api/mes/home';
 
-import { getWorkOrderStatusChartOptions, WORK_ORDER_STATUS_COLOR_MAP } from '../data';
+import { getWorkOrderStatusChartOptions } from '../chart-options';
+import { WORK_ORDER_STATUS_COLOR_MAP } from '../data';
 
 defineOptions({ name: 'MesHomeWorkOrderChart' });