原型图 | React + Tailwind
资产库存页（设备 / 高价值配件 / 滤芯三 tab）：设备 tab 按设备查看本仓实际库存（可投放/故障/已报废），支持状态/型号/关键字筛选与单台操作（标记故障、维修、申请报废）；高价值配件 / 滤芯 tab 查看一物一码明细。承接 CG11 设备卡状态桶钻取、高价值配件卡与滤芯卡跳转。
| 模块 | 说明 | 场景差异 |
|---|---|---|
| 三 Tab 栏 | 设备 / 高价值配件 / 滤芯 三 tab 切换；各 tab 状态 chips 带数量（设备与配件：全部/可投放/故障/已报废四枚；滤芯：五枚含已借出），与 CG11 数字呼应 | 所有场景，跟随仓库 |
| 筛选栏 | 设备 tab：状态 chips 带数量（全部/可投放/故障/已报废）+ 型号下拉（S6/S8/S10，与 web 端一致）+ 关键字搜索 | 所有场景 |
| 设备列表 | 行 = 三行布局：首行编号 + 状态标签 / 次行名称 / 第三行已绑定配件概要（名称空格分隔，无 ✓）；型号不展示在行内；报废审批中的设备在状态标签左侧额外显示蓝色「报废审批中」小标签 | 所有场景 |
| 设备详情面板 | 底部弹起，双 Tab：①设备详情（状态、已绑定配件/关联滤芯逐行 名称+编码）②流转记录（时间线：类型/状态变更/操作人/关联单号/备注，倒序）；操作按钮固定面板底部、不随 Tab 切换；标记故障 / 维修完成 / 申请报废均经二次确认弹层 | 所有场景 |
| 配件/滤芯详情面板 | 底部弹起（双 Tab：①详情 ②流转记录，与设备同构）：详情只读展示 型号/仓库/状态/故障原因/绑定设备(或借用人)；流转记录为六字段时间线（与设备一致）；底部操作：可投放态「标记故障」、故障态「维修完成」+「发起报废」（均经二次确认）；其余状态无操作；滤芯故障态同样支持维修完成+发起报废 | 所有场景 |
| 仓库下拉单选 | 标题栏显示当前仓库名 + 下拉箭头，点击弹出下拉单选（对齐 CG01 场景②）；切换后列表整组替换，同一时刻仅展示当前选中仓 | 仅多仓（场景②） |
| 操作 | 触发条件 | 前置校验 | 反馈形式 | 行为 |
|---|---|---|---|---|
| 切换资产 Tab | 三 Tab 栏（设备/高价值配件/滤芯） | - | 切换对应 tab 列表 | URL type=part/filter 参数预置对应 tab（如 cg12.html?type=part 预置高价值配件）；可叠加 status 参数预置筛选 |
| 点击状态 chip | 各 tab 筛选栏任意 chip（带数量） | - | 列表过滤为对应状态 | 全部/可投放/故障/已报废（滤芯另含已借出）；URL 携带 status 参数时预置对应筛选 |
| 型号/关键字筛选 | 设备 tab：型号下拉（S6/S8/S10）/ 搜索框输入 | - | 列表按型号或编码/名称过滤 | 型号枚举与 web 端一致（S6/S8/S10）；关键字匹配编码或名称 |
| 点击设备行 | 任意列表行 | - | 详情面板底部弹起（双 Tab：设备详情 / 流转记录） | 操作按钮固定面板底部，不随 Tab 切换 |
| 点击高价值配件行 | 高价值配件 tab 任意卡片 | - | 详情面板底部弹起（双 Tab：详情 / 流转记录） | 故障态显示「维修完成」+「发起报废」；可投放态显示「标记故障」；均经二次确认；其余状态无操作 |
| 点击滤芯行 | 滤芯 tab 任意卡片 | - | 详情面板底部弹起（双 Tab：详情 / 流转记录） | 故障态显示「维修完成」+「发起报废」（含滤芯）；可投放态显示「标记故障」；已借出/已报废无操作；均经二次确认 |
| 标记故障（二次确认） | 设备/配件/滤芯详情面板「标记故障」 | 仅可投放态 | 弹二次确认框，确认后状态→故障，列表与 status chips 数量即时刷新 | 设备 tab 原直执行已同步改为二次确认 |
| 发起报废（二次确认） | 设备/配件/滤芯详情面板「发起报废」（仅故障态） | 仅故障态 | 弹二次确认框，确认后跳转 CG10（code/type/wh） | 设备 tab 申请报废原直执行已同步改为二次确认；CG10 按 code 预填资产（SN 编码未命中 mockAssets 时需手动选择，同设备 tab 现状） |
| 切换详情 Tab | 详情面板 Tab 栏 | - | Tab1 设备详情（状态/配件/滤芯）；Tab2 流转记录时间线（类型标签/状态变更/操作人/关联单号/备注，最新在上） | 切换 Tab 时滚动位置重置到顶部；流转记录空态显示「暂无流转记录」 |
| 标记故障 | 仅库存中·可投放 | - | 设备状态 → 库存中·故障，列表与状态 chips 数量即时刷新 | mock 即时变更（可投放 -1 / 故障 +1），并追加「标记故障」流转记录（橙色标签，时间为当前时刻） |
| 维修完成（二次确认） | 设备/高价值配件/滤芯 详情面板「维修完成」（仅故障态，非报废审批中） | 仅故障态 | 弹二次确认框，确认后状态 → 可投放，列表与状态 chips 数量即时刷新 | 设备/配件/滤芯通用；mock 即时变更（故障 -1 / 可投放 +1），并追加「维修完成」流转记录（时间为当前时刻）；含滤芯 |
| 申请报废 | 仅库存中·故障（非报废审批中） | - | 跳转 CG10 发起报废页 | cg10.html?code=SN-G-xxx（CG10 未建时为空白页，属预期） |
| 报废审批中设备 | 设备已发起报废申请（SN-G-002） | - | 详情面板显示蓝色提示条，无操作按钮 | 列表行仍显示「故障」标签；审批进度由 CG09 报废列表承载 |
| 切换仓库（下拉单选） | 场景② 多仓，点击标题栏仓库名 | - | 下拉展开，单选后标题与列表整组替换 | 对齐 CG01 场景②；点击外部关闭下拉；同一时刻仅展示当前选中仓 |
| 切换场景（控制面板） | 控制面板场景卡 | - | 手机壳标题/仓库 Tab 联动 | ①单仓 ②多仓 |
CG11 设备卡标题区 → CG12（不带参） CG11 设备卡状态桶 → CG12（桶带 status 参数，如 cg12.html?status=fault，预置筛选） CG11 高价值配件卡 → CG12（type=part，如 cg12.html?type=part，预置高价值配件 tab） CG11 滤芯卡 → CG12（type=filter，如 cg12.html?type=filter，预置滤芯 tab） 申请报废 → CG10 发起报废（cg10.html?code=SN-G-xxx） 底部导航：首页(CG01) / 入库(CG02) / 出库(CG05) / 库存(CG11) / 我的(CG17)
| 状态 | 触发条件 | 表现 |
|---|---|---|
| 场景① 单仓仓管 | 控制面板场景① / 默认 | 标题显示仓库名「曼谷1号仓」，无仓库 Tab，列表为曼谷数据 |
| 场景② 多仓仓管 | 控制面板场景② | 标题栏显示当前仓库名 + 下拉单选（曼谷1号仓/清迈1号仓，对齐 CG01 场景②），列表跟随 |