单码装箱 UI v2 — 重构布局

场景1 · 等待扫码（初始状态）

装箱编号

⇄ 单码装箱 P2

📷 请扫描执行卡二维码

排产号 — 工单 — — 件

已有 — 箱 · 最大箱号 —

此总排号已分配 0 条

扫码后显示已分配箱号记录

箱号

数量

等待扫码

v2 布局优化要点（对比原版）

AppBar 44px：标题 + 模式徽章一行，去掉原版独占区域；蓝色 Pill 明确区分单码/多码
扫码条 38px：从原版 ~52px 大卡片压缩为紧凑横条，等待/已识别两态颜色清晰
排产信息 header 约 52px：左侧三行合并（排产号+工单+ERP件数 / 进度条 / 已有箱数），右侧固定醒目的详情按钮；原版散落两块约 80px，节省 ~28px
已装入进度条：新增 3px 高度进度条直观显示已装/总量比例，不占额外空间
已分配列表每行 40px：与多码设计对齐（序号+彩色条+箱号/扫码标注+件数+操作），可滚动
全部装箱完毕仍保留明细：顶部绿色提示 + 进度条全绿 + 底栏禁用，列表继续展示已分配箱号，便于核对结果
删除确认行内 28px 条：不弹框，与多码保持一致
固定底栏：箱号输入 + 数量输入 + 确认按钮横排一行（~50px），不参与滚动
通知条 ~30px：橙/琥珀/蓝/绿四色语义，替代原版内嵌 banner，可叠加
状态栏 28px：圆点 + 简短文字，去掉原版 ~38px 的高度

状态颜色含义

蓝 — 空闲/等待/正常

橙 — 提交中/同步中

绿 — 操作成功/装完

红 — 错误/超限

琥珀 — 警告/重复/编辑中

UI 结构（v2）

┌──────────────────────────────────────────┐ 44px │ "装箱编号" [⇄ 单码装箱 P2] │ AppBar ├──────────────────────────────────────────┤ │ [通知条] 可叠加显示，每条 ~30px │ 可选 ├──────────────────────────────────────────┤ 38px │ ✓ ZP202605180001 已识别 │ 扫码条 ├──────────────────────────────────────────┤ ~52px │ PC-2605-A101 WO-2026-0882 200件 [详情]│ │ ▓▓▓▓▓▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒ 进度条 │ info-bar │ 已有 2箱 · 最大箱号 5 · 已装50/200 │ ├──────────────────────────────────────────┤ │ 此总排号已分配 2 条 │ list-header │ 1 ▌ 3号箱本次扫码 50件 ✏🗑 │ 40px/行 │ 2 ▌ 7号箱本次扫码 100件 ✏🗑 │ │ ... │ ← 可滚动区域 ├──────────────────────────────────────────┤ │ 箱号[8] 数量[50 ] [确认] │ ~50px ├──────────────────────────────────────────┤ 28px │ ● 数量已填入，请确认或修改 │ 状态栏 └──────────────────────────────────────────┘