仓管端 - 入库详情

原型图 | React + Tailwind

← 返回总览 CG01 首页 CG02 入库列表 CG03 入库详情 CG04 入库确认 CG05 出库列表 CG06 出库详情 CG07 出库确认 CG08 借用出库创建 CG09 报废列表 CG10 发起报废 CG11 库存总览 CG12 设备库存列表 CG15 扫一扫 CG17 我的
9:41

场景切换

单据状态

详情结果(已完成态)

页面说明

最后更新:2026-08-06

页面定位 — PRD §5.9.3/§5.9.7/§5.9.9/§5.9.15

入库单通用详情页,按入库类型(首次/回收/归还/调拨)动态渲染内容。仓管查看资产清单后发起扫码确认;已完成详情可查看验收结果(照片/异常/无码/绑定)。

核心内容

模块说明场景差异
单号+类型标签入库单号 + 颜色标签(蓝/橙/紫/青)标签颜色按入库类型区分
状态时间线3节点:待处理→处理中→已完成,高亮当前状态所有场景通用
基本信息入库仓库 / 创建人 / 创建时间处理中状态额外显示当前操作人
场景特有信息蓝色虚线高亮框,展示该入库类型的关键字段每个场景内容不同,见下方
资产清单按类型分组卡片(设备/配件/滤芯/耗材),每组独立表格归还场景含借用数量列;回收场景含核验对比
单据状态右侧面板状态子切换:待处理 / 处理中·本人 / 处理中·他人 / 已完成所有场景通用,每场景 4 条 Mock
详情结果右侧面板结果子切换:正常 / 含异常 / 含无码资产 / 含现场照片(仅已完成态生效)所有场景通用;照片/异常/无码为 CG04 验收结果在本页的体现
底部按钮状态驱动:待处理→开始确认;处理中·本人→继续确认;处理中·他人→灰显+操作人;已完成→灰显所有场景通用

关键交互

操作 触发条件 前置校验 反馈形式 异常处理 行为
点击"开始确认"单据状态=待处理无其他仓管锁定跳转CG04入库确认锁定时按钮禁用+提示携带入库单ID+类型
点击"继续确认"处理中且操作人=本人-跳转CG04继续操作-恢复未完成的确认进度
点击来源出库单号归还/调拨场景-跳转出库详情页-携带出库单ID
场景/状态切换点击右侧面板按钮-页面内容即时刷新-切换场景×状态的Mock数据
详情结果切换点击右侧「详情结果」按钮(正常/含异常/含无码/含照片),单据状态自动切换为已完成点击即切已完成态页面即时展示对应结果区块:现场照片缩略图 / 异常明细(⚠+原因)/ 现场生成资产异常明细含编码与原因与场景组合评审;再切状态可回到待处理/处理中
点击"返回"用户点击返回箭头-跳转入库列表-返回CG02

页面状态

场景特有内容
① 首次入库无特有信息,仅通用内容(入库单号+资产清单),与 web28 一致
② 回收入库回收原因 + 原投放位置 + 关联配件核验对比(待处理不展示核验区;处理中与已完成展示)
③ 归还入库来源出库单(可跳转)+ 借用人+联系方式 + 借用天数 + 归还明细含借用中数量
④ 调拨入库调拨单号 + 源仓库 + 调拨发起人 + 关联出库单(可跳转)
状态覆盖每场景 4 条 Mock:待处理 / 处理中·本人(王五) / 处理中·他人(李四/张三) / 已完成,右侧面板可切换

跳转关系

CG03 入库详情
├─ ← 返回 → CG02 入库列表
├─ CG02 列表点击 → 本页(携带单据ID+类型+状态)
├─ CG04 提交完成 → 本页已完成态(携带单据ID+类型+状态)
├─ 开始确认 / 继续确认 → CG04 入库确认(携带单据ID+类型)
├─ 来源出库单号 → 出库详情页(归还/调拨场景)
├─ 关联出库单 → 出库详情页(调拨场景)
└─ 返回总览 → index.html
底部导航:已移除(入库详情按状态查看 + 后续操作由底部状态驱动按钮 + 顶栏返回提供出口,全局 tab 在此页面冗余)

业务规则

底部按钮状态驱动:待处理→"开始确认";处理中·本人→"继续确认";处理中·他人→灰显+操作人姓名;已完成→灰显"已完成"
编辑锁区分:处理中·本人可继续操作→"继续确认";处理中·他人→灰显+操作人姓名,仅可查看
回收入库核验区:待处理不展示关联配件核验对比;处理中与已完成均展示(已完成显示已核验徽标)
数据隔离:详情页数据按入库单ID加载,归属当前仓库
URL id 定位:CG02 已知单据直达时自动定位状态(如 IN-20260723-003→处理中·他人,IN-20260722-005→已完成)
跨页面跳转:来源出库单/关联出库单为蓝色下划线可点击链接
场景④调拨入库:出库确认前入库单号占位显示"等待出库确认后生成"
现场照片(已完成):展示本单现场照片缩略图(1~3 张占位),来源=CG04 拍照留证上传
异常明细(已完成):展示异常项(⚠+编码+原因),来源=CG04 标记异常(行内原因)
现场生成资产(已完成):展示无码资产(编码+「现场生成·已验收」标注),来源=CG04 添加无码资产
设备绑定(已完成·场景①):首次入库设备行显示「配件已绑定」绿标,来源=CG04 扫码式设备绑定
详情结果切换仅对已完成态生效;待处理/处理中态不展示照片/异常/无码结果区块
语言切换:支持下拉选择,但选择泰文后不切换页面语言(占位)
查看更新记录
2026-08-06
详情结果联动:点击「详情结果」任一张卡(正常/含异常/含无码/含照片)时,单据状态自动切换为「已完成」,结果区块立即可见;再手动切状态可回到待处理/处理中。
2026-08-06
跨页一致性修复(与 CG02/CG04 对齐):① mock 单据 ID 以 CG02 为基准统一(场景②待处理 IN-20260724-003、场景④待处理 IN-20260724-004,与 CG04 四场景单号同源);② URL 三参(id+type+status)解析,idToStatus 覆盖 CG02 全部单据;③ 新增「详情结果」切换(正常/含异常/含无码资产/含现场照片,仅已完成态生效),展示现场照片缩略图(来源 CG04 拍照留证)、异常明细(⚠+原因,来源 CG04 标记异常)、现场生成资产(来源 CG04 添加无码资产);④ 场景①已完成态设备行显示「配件已绑定」(来源 CG04 扫码绑定);⑤ 页面说明同步(定位/核心内容/关键交互/跳转关系/业务规则/更新记录)。
2026-08-03
仓管端移除摄像头核验功能:删除场景②回收入库的「摄像头状态」核验区(AssetGroup + 有/无 toggle + 系统记录对比 + 锁定态提示),一并移除仅服务该区的 cameraToggle 状态与 toggleLocked 计算;同步更新页面说明(交互表删除「摄像头toggle切换」行、场景表②与核验区规则去掉 toggle 表述)。摄像头有/无状态管理保留在 Web 后台(web02 设备详情、web18 配件管理),仓管端不再核验。
2026-07-29
状态驱动改造:右侧面板加单据状态子切换(待处理/处理中·本人/处理中·他人/已完成);Mock 重构为 4 场景×4 状态=16 条;BottomButton 4 态+跳转 CG04;提取 DetailHeader/RowBadge 共享组件;回收场景核验区按状态展示/锁定;归还场景表按状态填充;URL idToStatus 映射 CG02 已知单据。
2026-07-27
场景①「建档入库」更名为「首次入库」(新设备到货验收);移除首次入库特有信息卡片(与 web28 保持一致);场景②回收入库移除「原设备状态」字段(设备级字段,状态变更在 CG04 逐台处理);支持 CG02 URL 参数自动切换场景。
2026-08-04
去金刚导航 + 已完成场景按类型汇总差异:① 删除底部导航栏(首页/入库/出库/库存/我的),跳转关系同步去除;② 已完成(done=true)场景在 DetailHeader 与资产清单之间新增 DoneSummary 汇总卡(橙色 table):每行=类型·预期·实际·差异,差异组高亮(红字 + 浅橙底);只描述整体差异,每场景 mock 一组反映「实际入库 vs 预期入库」的差异:场景①差1台设备/1根滤芯、场景②差2根滤芯、场景③缺3根滤芯+1普通配件(借出未还)、场景④差3件高价值配件。
2026-07-24
初版页面:入库详情,含4场景切换(建档/回收/归还/调拨)、状态时间线、资产清单、页面说明。