仓管端 - 库存总览

原型图 | React + Tailwind

← 返回总览 CG01 首页 CG02 入库列表 CG03 入库详情 CG04 入库确认 CG05 出库列表 CG06 出库详情 CG07 出库确认 CG08 借用出库创建 CG09 报废列表 CG10 发起报废 CG11 库存总览 CG12 资产库存列表 CG13 盘点列表 CG14 发起盘点 CG15 扫一扫 CG16 盘点执行 CG17 我的 CG18 消息中心 CG19 消息详情
9:41

场景切换

页面说明

最后更新:2026-09-13

页面定位 — PRD §6.7

库存 Tab 落地页,仓管查看当前仓库资产全貌:高价值配件 / 滤芯按状态分布展示在库数,普通配件与耗材按型号汇总。设备不计库存(设备不入库、恒「使用中」),不在本视图展示。与首页(CG01)3 行精简摘要分工,本页为完整状态分布视图。

核心内容

模块说明场景差异
高价值配件卡在库数 + 状态分布(同高价值配件 3 桶,不含使用中/运输中/已借出),点击钻入 CG12 高价值配件 Tab所有场景
滤芯卡在库数 + 状态分布 4 桶(可投放/故障/已借出/已报废,不含使用中/运输中),点击钻入 CG12 滤芯 Tab所有场景
普通配件+耗材卡普通配件段 / 耗材段,按型号逐行汇总数量,在卡内展示不跳转;低库存型号整行标红并显示「库存不足」所有场景
报废记录入口虚线边框+灰色背景,与数据卡视觉区分:查看报废申请单列表(CG09,单据维度);按当前仓库筛选所有场景
发起盘点按钮绿色主色全宽按钮,库存场景直接发起盘点:跳 CG14 发起盘点并预选当前仓库(?wh=当前仓)所有场景
仓库 Tab切换当前仓库,二卡整组替换为选中仓数据;同一时刻仅展示当前选中仓仅多仓(场景②)

关键交互

操作 触发条件 前置校验 反馈形式 异常处理 行为
点击状态分布桶任意非 0 状态桶(可投放/故障/已借出/已报废)-跳转对应列表页并预置筛选CG12 对应 Tab 已建,正常展示预置筛选结果带 status 参数跳转(如 cg12.html?status=fault)
点击卡片标题区点击 icon + 卡名-跳转对应列表页-不带参跳转(如 cg12.html)
查看型号行/段标题普通配件+耗材卡内-卡内直接展示数量汇总低库存型号整行标红并显示「库存不足」不跳转(普通配件/耗材段无独立列表页,卡内汇总)
切换仓库 Tab场景② 多仓-二卡整组替换为选中仓数据-同一时刻仅展示当前选中仓
切换场景(控制面板)控制面板场景卡-手机壳标题/仓库 Tab 联动-①单仓 ②多仓
点击报废记录入口页底独立入口(单据维度)-跳转 CG09 报废列表,按当前仓库筛选-./cg09.html(与状态桶「已报废」跳 CG12 的资产维度区分)

跳转关系

高价值配件卡 → CG12 高价值配件 Tab(cg12.html?type=part + 桶带 status 参数)
滤芯卡 → CG12 滤芯 Tab(cg12.html?type=filter + 桶带 status 参数)
普通配件段 → 卡内汇总展示,不跳转;低库存整行标红
耗材段 → 卡内汇总展示,不跳转;低库存整行标红
报废记录入口(页底独立入口,单据维度)→ CG09 报废列表,按当前仓库筛选
底部导航:首页(CG01) / 入库(CG02) / 出库(CG05) / 库存(CG11 当前) / 我的(CG17)
首页(CG01) 库存概览行 → CG11 库存总览(本页面)→ CG12 资产库存列表 / CG13 配件列表 / CG14 耗材列表

页面状态

状态触发条件表现
场景① 单仓仓管控制面板场景① / 默认标题显示仓库名「曼谷1号仓」,无仓库 Tab,二卡为曼谷数据
场景② 多仓仓管控制面板场景②标题显示「仓管」,仓库 Tab 切换(曼谷1号仓/清迈1号仓),二卡跟随

业务规则

· 二张状态卡 header 统一显示「在库 X」= 可投放 + 故障;分布桶列全量状态(含已借出/已报废),桶之和不等于在库数为正常
· 使用中、运输中(含即将入库)状态不展示(2026-08-07 最终确认)——使用中安装于现场点位、运输中在途(含出库/入库方向),均不归属本仓;在途信息由线下流程处理,本页聚焦仓库实际库存(二卡)与待处理入库任务(CG02)
· 数量为 0 的状态桶不展示(隐藏)
· 高价值配件不参与借用,无「已借出」桶;滤芯参与借用,含「已借出」桶
· 多仓模式下同一时刻仅展示当前选中仓数据,切换 Tab 整组替换
· 数据实时查询后端(原型为 mock 常量表 WH_DATA),非本地缓存
· 钻取参数规范:status=available/fault/borrowed/scrapped;type=filter/part/consumable(CG12 二 Tab 按此实现)
· CG12 两 Tab(高价值配件/滤芯)已建,钻取直接进入对应 Tab 并预置筛选
· 普通配件/耗材安全库存预警:型号库存低于阈值(SAFETY_STOCK)时整行标红(bg-red-50 + 红字「库存不足」);高价值配件/滤芯暂不设阈值
· 报废两个维度区分:状态桶「已报废」= 资产维度,点击跳 CG12 查看报废后的资产本身(带 status=scrapped);页底「报废记录」入口 = 单据维度(虚线边框+灰底,视觉与数据卡区分),跳 CG09 查看报废申请单列表。两者不混淆(2026-08-11 方案A)
更新记录
2026-09-13
去库存:删除设备卡与设备桶(含 i18n),资产分布收敛为高价值配件/滤芯二卡;钻取改「资产库存列表」(CG12 二 Tab);页面定位补充「设备不计库存」。页面说明同步。
2026-08-19
新增「发起盘点」按钮(绿色主色全宽,位于报废记录入口下方):库存场景直接发起盘点,跳 CG14 发起盘点并预选当前仓库(?wh=当前仓,单仓固定 / 多仓随 Tab);同步核心内容表新增一行。
2026-08-14(续5)
UI 简化:① 去掉顶部全局汇总条(蓝色背景的「608 总资产 + 1 型号低库存」卡片,已与 CG01 顶部待办区域功能冗余);② 设备卡与高价值配件卡改为全宽独立卡片(去除 grid-cols-2 并排),与滤芯卡结构一致;三张状态卡自上而下排列。同步更新核心内容表格(删「全局汇总条」行)、关键交互(仓库 Tab 描述改「二卡」)、业务规则(删「全局汇总条口径」一条;其余「三张状态卡」「三 Tab」等措辞同步)。
2026-08-07
钻取调整:配件/耗材独立库存页取消,高价值配件卡改钻 CG12 高价值配件 Tab(cg12.html?type=part)、滤芯卡改钻 CG12 滤芯 Tab(cg12.html?type=filter),顶部导航移除配件/耗材独立页入口;普通配件/耗材段改为卡内汇总展示、不跳转;新增安全库存标红(低于阈值整行 bg-red-50 + 「库存不足」红字)。
2026-08-07
视觉重设计为堆叠条仪表盘(状态分布改为横向按比例色段 + 彩色标签,卡片更紧凑);移除「使用中」「运输中」状态展示(两者均不归属本仓,在途业务入口在首页待办与出入库列表)。
2026-08-07
视觉重设计为堆叠条仪表盘(状态分布改为横向按比例色段 + 彩色标签,卡片更紧凑);移除「使用中」「运输中」状态展示(两者均不归属本仓,在途业务入口在首页待办与出入库列表)。
2026-08-14
UI 优化:① 新增全局汇总条(蓝色背景,展示仓库总资产数+低库存型号警告);② 设备/高价值配件卡改为 2 列并排网格(grid-cols-2),滤芯卡全宽;③ 报废记录入口改为虚线边框+灰底(bg-gray-50 border-dashed),与数据卡视觉区分;④ CDN 修复(cdn.tailwindcss.com → cdnjs.cloudflare.com);⑤ 更新记录 HTML 嵌套错误修复。
2026-08-14
修正跳转关系:首页概览行钻取目标从「直接钻 CG12」改为「CG11 库存总览(本页)→ CG12」;钻取参数移除 transport/in_use,与页面清单 §5.1 对齐。
2026-08-11
报废两维度区分(方案A):保留状态桶「已报废」跳 CG12(资产维度),新增页底独立「报废记录」入口跳 CG09(单据维度),概念不混淆;同步更新核心内容/关键交互/跳转关系/业务规则。
2026-08-06
初版页面说明,基于设计文档 docs/superpowers/specs/2026-08-06-cg11-inventory-overview-design.md 与仓管端页面清单 §5.1(四卡结构、在库口径、0 值桶隐藏、带参钻取、两场景)。