1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
| {
| "nodes": [
| {
| "id": "a1b2c3d4e5f60001",
| "type": "text",
| "x": 0,
| "y": 0,
| "width": 1200,
| "height": 70,
| "text": "# MOM 制造运营平台 — 首页仪表盘\n**技术栈**: Vue 3 + Ant Design Vue 4 + Tailwind CSS + ECharts | **风格**: Industrial Bento Grid + 玻璃态卡片 | **配色**: 工业蓝 #2563eb"
| },
| {
| "id": "a1b2c3d4e5f60002",
| "type": "group",
| "x": 0,
| "y": 90,
| "width": 1200,
| "height": 100,
| "label": "Row 0: 欢迎栏 — 日期 + 问候语 + 系统状态",
| "color": "5"
| },
| {
| "id": "a1b2c3d4e5f60003",
| "type": "text",
| "x": 20,
| "y": 120,
| "width": 1160,
| "height": 50,
| "text": "`<WelcomeBar />` — 左侧: 日期 + \"早上好/下午好/晚上好\" 根据时间动态切换 | 右侧: 系统运行状态指示器 + 刷新按钮"
| },
| {
| "id": "a1b2c3d4e5f60004",
| "type": "group",
| "x": 0,
| "y": 210,
| "width": 1200,
| "height": 150,
| "label": "Row 1: 4 个 KPI 核心指标卡片 (Bento Grid)",
| "color": "4"
| },
| {
| "id": "a1b2c3d4e5f60005",
| "type": "text",
| "x": 20,
| "y": 240,
| "width": 270,
| "height": 100,
| "text": "## 生产订单\n**进行中**: CountTo 动画\n待排产 / 已完成\n\n🎨 蓝色渐变 `#2563eb → #60a5fa`\n🔗 点击跳转 → 生产工单列表"
| },
| {
| "id": "a1b2c3d4e5f60006",
| "type": "text",
| "x": 310,
| "y": 240,
| "width": 270,
| "height": 100,
| "text": "## 今日产量\n**产量**: CountTo 动画\n昨日产量对比\n\n🎨 绿色渐变 `#16a34a → #4ade80`\n🔗 点击跳转 → 生产报工"
| },
| {
| "id": "a1b2c3d4e5f60007",
| "type": "text",
| "x": 600,
| "y": 240,
| "width": 270,
| "height": 100,
| "text": "## 质量合格率\n**合格率%**: CountTo 动画\n合格品 / 不良品\n\n🎨 橙色渐变 `#ea580c → #fb923c`\n🔗 点击跳转 → 质检记录"
| },
| {
| "id": "a1b2c3d4e5f60008",
| "type": "text",
| "x": 890,
| "y": 240,
| "width": 270,
| "height": 100,
| "text": "## 设备运行率\n**运行中 / 总数**: CountTo 动画\n停机 / 维护中\n\n🎨 紫色渐变 `#7c3aed → #a78bfa`\n🔗 点击跳转 → 设备管理"
| },
| {
| "id": "a1b2c3d4e5f60009",
| "type": "group",
| "x": 0,
| "y": 380,
| "width": 1200,
| "height": 300,
| "label": "Row 2: 图表区 — 生产趋势 + 预警面板",
| "color": "1"
| },
| {
| "id": "a1b2c3d4e5f60010",
| "type": "text",
| "x": 20,
| "y": 410,
| "width": 700,
| "height": 250,
| "text": "## 生产趋势图 (`ProductionTrend`)\n**类型**: ECharts 折线 + 柱状混合图\n**数据**: 近 7 天产量 / 合格品 / 不良品\n\n- X 轴: 日期 (月-日)\n- Y 轴: 数量\n- 蓝色柱: 产量\n- 绿色线: 合格品\n- 红色线: 不良品\n\n`getProductionTrend(days=7)`\n\n📐 占宽: 14/24 栅格 (58%)"
| },
| {
| "id": "a1b2c3d4e5f60011",
| "type": "text",
| "x": 740,
| "y": 410,
| "width": 440,
| "height": 250,
| "text": "## 预警与待办 (`AlertPanel`)\n\n### 安灯呼叫\n未处置呼叫数 + 跳转链接\n\n### 维修工单\n待处理维修单数 + 跳转链接\n\n### 工单状态分布\n环形饼图 `getWorkOrderStatusDistribution()`\n\n📐 占宽: 10/24 栅格 (42%)"
| },
| {
| "id": "a1b2c3d4e5f60012",
| "type": "group",
| "x": 0,
| "y": 700,
| "width": 1200,
| "height": 150,
| "label": "Row 3: 快捷入口 + 动态信息",
| "color": "6"
| },
| {
| "id": "a1b2c3d4e5f60013",
| "type": "text",
| "x": 20,
| "y": 730,
| "width": 540,
| "height": 100,
| "text": "## 快捷操作 (`QuickActions`)\n9 宫格快捷入口:\n生产工单 | 生产报工 | 质检管理\n设备点检 | 生产排程 | 安灯呼叫\n物料库存 | 工艺路线 | 数据报表\n\n🎨 图标 + 标签 卡片样式"
| },
| {
| "id": "a1b2c3d4e5f60014",
| "type": "text",
| "x": 580,
| "y": 730,
| "width": 560,
| "height": 100,
| "text": "## 最近动态 (`RecentActivity`)\n最近更新的工单 / 报工记录\n时间线 Timeline 组件\n\n示例:\n- 10:30 工单 WO-2024-089 完成生产\n- 09:45 质检通过 批次 B-0128\n- 08:00 设备 DEV-003 开始维护"
| }
| ],
| "edges": []
| }
|
|
