初始化2

bj_power_wms_client/frontend/src/pages/Dashboard.vue

@@ -0,0 +1,69 @@
+<script setup>
+import { onMounted, ref } from 'vue'
+import { useRouter } from 'vue-router'
+import { CircleCheck, Download, List, Monitor, Search, Upload, Box, Tickets } from '@element-plus/icons-vue'
+import request from '../utils/request'
+import { fmtNum } from '../utils/format'
+
+const router = useRouter()
+const overview = ref({})
+const loaded = ref(false)
+
+async function load() {
+  overview.value = await request.get('/display/overview')
+  loaded.value = true
+}
+
+onMounted(load)
+
+const cards = [
+  { key: 'totalQty', label: '在库总量' },
+  { key: 'lockedQty', label: '锁定量' },
+  { key: 'snInStock', label: 'SN 在库数' },
+  { key: 'semiInStock', label: '半成品在库' },
+  { key: 'packageCount', label: '包装箱数' },
+  { key: 'batchCount', label: '批次数' },
+  { key: 'inToday', label: '今日入库单' },
+  { key: 'outToday', label: '今日出库单' }
+]
+
+const entries = [
+  { path: '/inbound', title: '入库管理', icon: Download },
+  { path: '/outbound', title: '备料出库', icon: Upload },
+  { path: '/inventory', title: '库存查询', icon: Search },
+  { path: '/inspection', title: '质量检验', icon: CircleCheck },
+  { path: '/stocktake', title: '库存盘点', icon: List },
+  { path: '/semi', title: '半成品/成品', icon: Box },
+  { path: '/package', title: '包装绑定', icon: Tickets },
+  { path: '/ledger', title: '物料台账', icon: Tickets },
+  { path: '/display', title: '免登录大屏', icon: Monitor }
+]
+</script>
+
+<template>
+  <div>
+    <el-row :gutter="12">
+      <el-col v-for="c in cards" :key="c.key" :xs="12" :sm="8" :md="6" style="margin-bottom:12px">
+        <el-card shadow="hover">
+          <div class="kpi-label">{{ c.label }}</div>
+          <div class="kpi-value">{{ loaded ? fmtNum(overview[c.key]) : '—' }}</div>
+        </el-card>
+      </el-col>
+    </el-row>
+
+    <el-card shadow="never" header="快捷入口">
+      <div class="entries">
+        <el-button v-for="e in entries" :key="e.path" size="large"
+                   @click="router.push(e.path)">
+          <el-icon style="margin-right:6px"><component :is="e.icon" /></el-icon>{{ e.title }}
+        </el-button>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<style scoped>
+.kpi-label { color: #909399; font-size: 13px; }
+.kpi-value { font-size: 26px; font-weight: 700; margin-top: 4px; color: #303133; }
+.entries { display: flex; flex-wrap: wrap; gap: 10px; }
+</style>