原型图 | React + Tailwind
展示所有与当前仓库相关的出库单，仓管查看和管理待处理任务。支持按出库类型筛选，可快速定位单据并新建借用出库。
| 模块 | 说明 | 场景差异 |
|---|---|---|
| 仓库切换 | 标题栏下拉选择仓库，所有数据跟随刷新 | 仅多仓时展示下拉箭头 |
| 筛选栏 | 出库类型下拉 + 新建借用出库按钮 | 所有场景 |
| 状态 Tab | 待处理(3) / 处理中(1) / 已出库，已出库不计数 | 所有场景 |
| 单据卡片 | 状态标签+部分提交角标(橙色)+出库类型标签+出库单号（同行）+ 资产摘要 + 目标信息 + 创建人+时间 | 所有场景 |
| 编辑锁 | 单据被其他仓管编辑时，状态标签展示"处理中 · 其他仓管"，可查看不可编辑 | 所有场景 |
| 操作 | 触发条件 | 前置校验 | 反馈形式 | 异常处理 | 行为 |
|---|---|---|---|---|---|
| 切换状态Tab | 用户点击Tab | - | 列表刷新 | - | 展示对应状态的单据 |
| 点击单据卡片 | 用户点击卡片 | 单据未被锁定 | 跳出库详情 | 锁定时提示"XXX正在操作" | 跳转 CG06 出库详情 |
| 点击新建借用出库 | 用户点击按钮 | - | 跳转创建表单 | - | 跳转 CG08 借用出库创建 |
| 筛选出库类型 | 用户选择类型 | - | 列表过滤 | - | 仅展示选定类型的单据 |
| 切换仓库下拉 | 用户选择仓库 | 多仓仓管 | 全部数据刷新 | - | 单据列表+Tab计数跟随仓库切换 |
| 场景 | 展示内容 |
|---|---|
| 场景① 单仓仓管 | 标题显示仓库名（如"曼谷1号仓"）+ 筛选栏 + 状态Tab(带计数) + 单据卡片列表 |
| 场景② 多仓仓管 | 标题显示"仓管 ▼"（可下拉切换仓库）+ 筛选栏 + 状态Tab(带计数) + 单据卡片列表（跟随仓库刷新） |
CG05 出库列表 ├─ 仓库下拉 → 切换仓库，刷新全部数据 ├─ 出库类型筛选 → 过滤列表 ├─ 状态Tab切换 → 展示对应状态单据 ├─ 单击单据卡片 → CG06 出库详情（携带出库单ID+类型+状态） ├─ +新建借用出库 → CG08 借用出库创建 ├─ 底部导航 → 首页(CG01) / 入库(CG02) / 出库(CG05) / 库存(CG11) / 我的(CG17) └─ 返回总览 → index.html