原型图 | React + Tailwind
出库确认页是仓管核心操作页面。仓管打开出库单后，通过逐条扫码（一物一码资产）或输入数量（数量管理资产）完成出库验收。页面按出库类型动态切换资产分组和校验逻辑。3个场景：①投放出库 ②调拨出库 ③借用出库。单据状态四态（待处理/处理中·本人/处理中·他人/已出库），右侧面板可切换评审，并配有「模拟扫码结果」9 张结果卡。所有场景支持「拍照留证」（最多 5 张，非必填）。出库确认页与CG04入库确认共享组件与异常/绑定/拍照能力口径（对齐 2026-08-06 CG04 迭代），但移除了「添加无码资产」功能（出库不涉及系统生成SN）。
| 模块 | 说明 | 场景差异 |
|---|---|---|
| 出库单信息卡片 | 展示出库单号、出库类型标签（颜色随场景变化）、出库仓库、创建人、创建时间 | ①额外展示投放位置+关联工单号 ②调拨单号+目标仓库+发起人 ③借用人+联系方式+借用原因+关联工单 |
| 资产行状态标记 | 每行资产显示扫码态：已确认（绿✓）/ 异常（红⚠）/ 待扫码（灰）；支持扫码高亮闪烁 | 所有场景共用；场景①异常项额外红标 |
| 资产分组列表 | 按资产类型分组（设备→高价值配件→滤芯→配件与耗材），每组显示进度和操作 | ①②完整交互（逐条点击模拟扫码）+场景①含设备绑定阻断+扫码不一致+配件缺失+数量差异4类异常弹窗 ②提示"随设备调拨的配件不在此核验" ③仅滤芯+配件与耗材两组 |
| 特殊模块 | 按场景展示特有UI模块 | ①设备绑定+异常弹窗集 ②独立调拨配件提示 ③仅数量行（无设备/高价值分区） |
| 拍照+提交 | 吸底上方：拍照留证（点「拍照/从相册选择」模拟上传，最多 5 张、缩略图可删除、非必填）+ 提交阻塞提示条（不可提交时列出卡点，点击跳转分区）；吸底栏：扫码出库 + 提交出库 | ①异常项拍照建议、提交时显示X项正常Y项异常 ②③无异常项时拍照非必填；阻塞提示条三场景一致（①额外含设备未绑定项） |
| 异常原因 | 资产标记异常后行内显示「异常原因（必填）」，点「修改/填写」弹窗输入（文本框为主 + 常用原因快捷选项 + 补充说明）；提交确认弹窗逐条列出异常项（编码+原因），每条须填原因才可确认。数量不符按「差异」处理，仅弹窗提示、不强制写原因、不计入异常项（对齐 CG04） | 所有场景一致；不在当前分区的异常项通过阻塞提示条跳转补填 |
| 操作 | 触发条件 | 前置校验 | 反馈形式 | 异常处理 | 行为 |
|---|---|---|---|---|---|
| 扫码出库（底部按钮） | 点击吸底栏"扫码出库"→弹出模拟扫码选择器，选择预期资产编码 | 编码前缀自动匹配资产组（SN-G设备 / SN-P·S·A高价值配件 / SN-L滤芯） | 弹"识别结果"窗→确认出库后自动切到对应分区并高亮该行（flash），汇总+1 | 未识别/失败→重扫 / 报异常 / 进待处理区 | 全部完成后底部"提交出库"激活 |
| 扫设备码→绑定 | 扫完设备SN-G后（仅场景①） | 投放出库前置校验：设备必须已完成高价值配件绑定才可投放 | 该设备行显示行内提示"请绑定此设备的高价值配件" | 配件缺失→标记异常，需指明缺失哪个配件 | 可扫其他类型不阻断；扫第二台设备或提交时阻断 |
| 扫码码不一致 | 实际码≠出库单预期码 | - | 标黄提示，弹出差异填写面板 | 强制填写差异原因+上传照片，不允许修改出库单编码清单 | 所有出库类型通用，填写后可继续后续操作 |
| 数量差异 | 输入数量≠预期数量 | - | 标黄提示 | 弹窗提示差异，不强制写原因、不阻断提交 | - |
| 提交出库 | 全部资产确认后（或有异常项时） | 每台设备「绑定核验完整」或「已标记异常」（场景①）；异常项逐条已填原因 | 弹「确认出库」二次弹窗：资产摘要 + 异常项逐条列表（编码+原因，缺任一原因禁用确认） | 有异常时按钮文案显示X项正常Y项异常 | 确认后跳转 CG06 出库详情·已出库态（异常数据穿透到 Web 端出库单详情） |
| 拍照留证 | 点击「拍照留证」按钮（异常时文案变「异常建议」） | 非必填；异常时建议留证 | 弹出底部操作面板（拍照/从相册选择/取消），点选后模拟上传占位缩略图，最多 5 张、×可删除、满 5 隐藏添加入口 | - | 提交后照片随单据保存，出库详情可见 |
| 提交出库（门槛） | 资产全部扫完 + 数量项已填 + 每个异常项已填异常原因 + 设备绑定核验完成（①） | 异常不阻断提交，仅原因缺失阻断；不可提交时吸底栏上方显示阻塞提示条列出卡点（未扫码/数量未填/未填原因/设备未绑定/滤芯桶差异） | 弹「确认出库」二次弹窗，异常项逐条必填原因 | 有异常时按钮文案显示X项正常Y项异常 | 异常数据穿透到Web端出库单详情 |
| 模拟扫码结果（控制面板） | 点击右侧「模拟扫码结果」卡片（全部成功/部分成功/识别箱码/识别失败/扫码不一致/配件缺失/数量差异/全部成功含异常，投放场景另有「绑定核验未通过」） | 无（整页重置为对应出库结果） | 整页重置：已扫态/异常标记/绑定态/数量/差异弹窗按结果注入；当前卡高亮、不可用置灰 | 异常卡注入具体原因，提交弹窗逐条展示 | ①全 9 张；②③部分卡置灰（如绑定核验未通过仅投放）；与单据状态正交（切卡不改状态） |
| 单据状态切换（控制面板） | 点击右侧「单据状态」四态按钮（待处理/处理中·本人/处理中·他人/已出库） | - | 页面切换为对应状态；已出库态只读展示（资产全绿标+异常/照片区块+灰显不可操作） | - | 与模拟卡正交；提交成功后跳 CG06 已出库态 |
| 场景 | 展示内容 |
|---|---|
| ①投放出库（蓝色） | 出库信息卡片（含投放位置/关联工单）+4组资产（设备2+高价值配件6（含异常编码行 SN-P-099）+滤芯4桶+配件与耗材1）+设备绑定核验（SN-G-001/002，与 CG04 首次入库编码同源）+异常弹窗集+拍照+提交；四态可切换，已出库态只读 |
| ②调拨出库（青色） | 出库信息卡片（含调拨单号/目标仓库/发起人）+宽松桶资产（设备2+独立调拨配件+滤芯+耗材，编码扫码时绑定）+提示"随设备调拨的配件不在此核验"+拍照+提交；设备缺失配件不阻断；四态可切换 |
| ③借用出库（琥珀色） | 出库信息卡片（含借用人/联系方式/借用原因/关联工单）+滤芯宽松桶+数量管理耗材，无设备和高价值配件+拍照+提交；四态可切换 |
CG06 出库详情 → CG07 出库确认（携带出库单ID+出库类型+状态→决定场景与单据状态） ├── 完成 → 跳转 CG06 出库详情（status=outbound 已出库态） └── 返回 → 跳转 CG06 出库详情 参数传递：出库单ID、出库类型（决定默认场景）、状态（四态，可省略） 底部导航：已移除（出库确认为单任务页，全局 tab 冗余；导航出口由顶栏「返回总览」+ 语言切换提供）