在各分店之间调拨库存，含申请流程、在途追踪与到货确认
你是一位资深零售运营专家与全栈工程师。
为 {company_name}（{branch_count} 家分店）构建一个多店铺库存调拨系统。
## 角色与背景
你是一位资深零售运营专家与全栈工程师，擅长构建多店铺库存管理应用。
## 项目目标
构建一个多店铺库存调拨系统，支持分店间发起调拨申请、审批、发货、收货确认及历史查询。
## 目标用户
{company_name} 的仓库管理员、分店经理和物流人员。
## 核心功能
- 调拨申请：选择调入产品与数量，系统自动建议来源店（基于距离与库存）。
- 来源店审批：批准、部分批准或拒绝申请，批准后自动预留库存。
- 发货登记：输入实际发货数量，上传发货单照片，系统自动扣减来源店库存并增加在途库存，生成二维码供收货店扫描。
- 收货确认：扫描二维码或输入单号，输入实际收到数量，处理差异（损坏、短缺、多收），确认后更新库存。
- 历史查询：按店铺、产品、日期、状态筛选，显示异常报告（差异大于0的调拨）、平均处理时间和运输时间。
- 库存总览：所有店铺所有产品的库存矩阵，高亮低于再订购水平（红色）和高库存（绿色），提供一键自动调拨建议。
## 主要工作流程
1. 分店发起调拨申请 → 2. 来源店审批 → 3. 发货登记 → 4. 收货确认 → 5. 库存更新。
## 业务规则
- 库存三态：实际可用（on_hand）、已预留（reserved）、在途（in_transit）。总可用 = on_hand - reserved。
- 差异处理：损坏记录到损耗表，短缺触发争议流程。
- 自动调拨建议：当 (on_hand + in_transit) < 再订购水平时，自动从最近高库存店发起调拨申请。
## 设计方向
简洁专业的后台管理界面，使用 Tailwind CSS 和 shadcn/ui 组件库，支持响应式布局。
## 构建方式
使用 Next.js 16 + TypeScript，Supabase 作为后端（含行级安全策略），Tailwind CSS + shadcn/ui 构建 UI。请先生成一个简短的实现计划，优先实现调拨申请与审批流程，使用合理的示例数据，并说明如何运行和测试。
## 构建顺序（请严格遵守）
请按以下顺序开发，让我尽早在屏幕上看到成果，不要长时间没有画面：
1. 先做界面：用接近真实的示例数据，把所有页面做出来（暂时不接数据库），让我能马上看到、能点击。做完先停下来，等我确认。
2. 再做功能：我确认界面后，才让按钮、表单和计算真正可用（继续用示例数据）。
3. 再接 Supabase：功能都正常后，才连接 Supabase 保存真实数据和登录（如需要）。
4. 最后上线：先确保在我电脑上运行正常，再把代码上传到 GitHub，经我同意后部署到 Vercel。
请保持简单——我是非技术背景的老板。有不清楚或需要决定的事，先问我，不要自己假设。