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
| <script lang="ts" setup>
| import { useRouter } from 'vue-router';
|
| import { IconifyIcon } from '@vben/icons';
|
| import { Card, Col, Row, message } from 'ant-design-vue';
|
| defineOptions({ name: 'BagCodeHomeShortcuts' });
|
| const router = useRouter();
|
| interface Shortcut {
| icon: string;
| name: string;
| routeName: string;
| }
|
| interface ShortcutGroup {
| title: string;
| items: Shortcut[];
| }
|
| /** 按业务域分组的快捷入口 */
| const groups: ShortcutGroup[] = [
| {
| title: '基础数据',
| items: [
| { icon: 'lucide:package', name: '品种管理', routeName: 'MdmItem' },
| { icon: 'lucide:folder-tree', name: '品种分类', routeName: 'MesMdItemType' },
| { icon: 'lucide:ruler', name: '计量单位', routeName: 'MdmUnit' },
| ],
| },
| {
| title: '一袋一码生产',
| items: [
| { icon: 'lucide:factory', name: '产线维护', routeName: 'MesProLine' },
| { icon: 'lucide:layers', name: '批次生产', routeName: 'MesProBatch' },
| { icon: 'lucide:scan-barcode', name: '赋码管理', routeName: 'MesProBagCode' },
| { icon: 'lucide:grid-2x2', name: '托盘码', routeName: 'MesProPallet' },
| { icon: 'lucide:scan-line', name: '扫码入库', routeName: 'MesProScanIn' },
| ],
| },
| {
| title: '出库流通',
| items: [
| { icon: 'lucide:send', name: '发货通知', routeName: 'MesWmSalesNotice' },
| { icon: 'lucide:truck', name: '销售出库', routeName: 'MesWmProductSales' },
| { icon: 'lucide:rotate-ccw', name: '销售退货', routeName: 'MesWmReturnSales' },
| ],
| },
| {
| title: '防伪防窜货',
| items: [
| { icon: 'lucide:shield-alert', name: '窜货预警', routeName: 'MesTraceCrossRegion' },
| { icon: 'lucide:map-pin', name: '扫码地理分布', routeName: 'MesConsumerScanDistribution' },
| { icon: 'lucide:database-check', name: '完整性校验', routeName: 'MesTraceIntegrity' },
| ],
| },
| {
| title: '溯源分析',
| items: [{ icon: 'lucide:scan-line', name: '消费者扫码统计', routeName: 'MesConsumerScanStatistics' }],
| },
| {
| title: '仓储物流',
| items: [
| { icon: 'lucide:warehouse', name: '仓库设置', routeName: 'MesWmWarehouse' },
| { icon: 'lucide:boxes', name: '库存现有量', routeName: 'MesWmMaterialStock' },
| { icon: 'lucide:bell-alert', name: '库存预警', routeName: 'MesWmStockWarning' },
| { icon: 'lucide:move-right', name: '转移调拨', routeName: 'MesWmTransfer' },
| ],
| },
| {
| title: '质量管理',
| items: [
| { icon: 'lucide:list-tree', name: '批次追溯', routeName: 'BatchTrace' },
| { icon: 'lucide:shield-x', name: '不合格品', routeName: 'MesQcNcr' },
| { icon: 'lucide:bean', name: '种子质检', routeName: 'MesQcSeedQuality' },
| ],
| },
| ];
|
| /** 跳转到目标页面（按路由 name，未加载时提示） */
| async function handleNavigate(routeName: string) {
| try {
| await router.push({ name: routeName });
| } catch {
| message.warning('当前菜单尚未加载，请从左侧菜单进入对应页面');
| }
| }
| </script>
|
| <template>
| <Card title="快捷入口" class="h-full">
| <Row :gutter="16">
| <Col v-for="group in groups" :key="group.title" :lg="8" :md="12" :sm="24" :xs="24" class="mb-4">
| <div class="rounded-xl border border-[rgba(16,185,129,0.16)] bg-[rgba(255,255,255,0.55)] p-3 backdrop-blur">
| <div class="text-muted-foreground mb-2 text-xs font-medium">{{ group.title }}</div>
| <div class="flex flex-wrap gap-2">
| <div
| v-for="item in group.items"
| :key="item.name"
| class="flex cursor-pointer items-center gap-1.5 rounded-lg border border-[rgba(16,185,129,0.22)] px-2 py-1.5 text-sm transition-colors hover:bg-[rgba(16,185,129,0.12)]"
| @click="handleNavigate(item.routeName)"
| >
| <IconifyIcon class="size-4 text-[#0d9488]" :icon="item.icon" />
| <span>{{ item.name }}</span>
| </div>
| </div>
| </div>
| </Col>
| </Row>
| </Card>
| </template>
|
|
