初始化2

2026-08-28 15:06:01 +08:00
parent b34325a16f
commit a9c3fbeb41
537 changed files with 176215 additions and 17 deletions
@@ -0,0 +1,90 @@
+import { Card, Table, Tag, Typography } from '@douyinfe/semi-ui';
+import type { DashboardData } from '../types';
+
+interface MovementRow {
+  id: string;
+  time: string;
+  dir: string;
+  material: string;
+  qty: string;
+  operator: string;
+}
+
+export function WarehouseBoard({ data }: { data: DashboardData }) {
+  const { warehouse: w } = data;
+  const rows: MovementRow[] = w.movements.map((m) => ({
+    id: m.id,
+    time: m.time,
+    dir: m.type === 'in' ? '入库' : '出库',
+    material: m.material,
+    qty: `${m.qty}`,
+    operator: m.operator,
+  }));
+
+  const columns = [
+    { title: '时间', dataIndex: 'time' },
+    {
+      title: '方向',
+      dataIndex: 'dir',
+      render: (dir: string) => (
+        <Tag color={dir === '入库' ? 'green' : 'blue'}>{dir}</Tag>
+      ),
+    },
+    { title: '物料名称', dataIndex: 'material' },
+    { title: '数量', dataIndex: 'qty' },
+    { title: '操作人', dataIndex: 'operator' },
+  ];
+
+  return (
+    <div style={{ display: 'grid', gridTemplateColumns: 'repeat(4, 1fr)', gap: 16 }}>
+      <Card title="库存总量" style={{ gridColumn: 'span 2' }}>
+        <BigNumber value={w.totalStock} unit="件" color="#36a3f7" />
+      </Card>
+      <Card title="物料种类">
+        <BigNumber value={w.materialTypes} unit="种" color="#00d68f" />
+      </Card>
+      <Card title="当日出入库">
+        <div style={{ display: 'flex', gap: 24 }}>
+          <TextStat color="#00d68f" value={w.inboundToday} label="入库" />
+          <TextStat color="#36a3f7" value={w.outboundToday} label="出库" />
+        </div>
+      </Card>
+
+      <Card title="出入库动态（实时）" style={{ gridColumn: 'span 4' }}>
+        <Table
+          columns={columns}
+          dataSource={rows}
+          pagination={false}
+          rowKey="id"
+          empty={<Typography.Text type="tertiary">暂无出入库记录</Typography.Text>}
+        />
+      </Card>
+    </div>
+  );
+}
+
+function TextStat({ value, label, color }: { value: number; label: string; color: string }) {
+  return (
+    <div>
+      <div style={{ fontSize: 28, fontWeight: 600, color }}>{value}</div>
+      <div style={{ color: '#8fa3bf', fontSize: 13 }}>{label}</div>
+    </div>
+  );
+}
+
+function BigNumber({
+  value,
+  unit,
+  color,
+}: {
+  value: number;
+  unit: string;
+  color: string;
+}) {
+  return (
+    <div style={{ display: 'flex', alignItems: 'baseline', gap: 6 }}>
+      <span style={{ fontSize: 36, fontWeight: 700, color }}>{value}</span>
+      <span style={{ color: '#8fa3bf' }}>{unit}</span>
+    </div>
+  );
+}