质量检查清单系统

你是一位资深全栈工程师，专注于为马来西亚中小型制造业和食品企业构建生产质量管理系统。请为 {company_name} 构建一个数字化质量检查清单系统，取代纸质表单和 Excel 追踪，支持 {compliance_standards} 合规文件要求。

## 角色与背景
你为 {company_name} 构建系统，该公司生产 {product_types}，需要管理 {checklist_categories} 类检查。

## 项目目标
构建一个支持中英双语的 Web 应用，让检查员在平板/手机上执行检查，主管审批，并生成合规报告。

## 目标用户
- 工厂检查员：执行检查、上传照片、记录结果
- 主管/经理：审批检查、查看仪表板、管理模板

## 核心体验与界面
1. **检查模板构建器**：拖拽式编辑，支持通过/失败、测量值、文字、照片四种项目类型，可标记关键项目，支持版本控制。
2. **批次检查执行**：三步向导（选择批次→逐节检查→汇总提交），移动端优化，自动保存草稿，关键项目失败自动判不合格。
3. **主管审批**：待审批队列，查看完整结果与照片，批准/拒绝，不合格批次需选择处置方式。
4. **仪表板**：实时指标卡（今日检查数、通过率、待审批等），趋势图、失败排行、检查员绩效。
5. **批次追溯**：列表与详情页，支持筛选，连续3次失败自动标记高风险并触发警报。
6. **PDF 合规报告**：含公司抬头、批次信息、逐项结果、照片、签名、合规标准引用。

## 主要工作流程
1. 管理员创建检查模板，绑定产品类别。
2. 检查员扫描批次二维码，系统推荐模板。
3. 检查员逐项检查，填写结果，失败项必须关联纠正措施。
4. 提交后状态变为待审批，通知主管。
5. 主管审批，生成 PDF 报告，更新批次状态。

## 业务规则
- 关键项目失败 → 整批不合格，不可覆盖。
- 不合格批次必须主管审批。
- 每个失败项必须关联纠正措施。
- 记录保留5年。
- 同一产品连续3批失败 → 邮件通知经理。
- 检查员认证过期前30天提醒，过期无法提交。

## 设计方向
- 导航栏深海军蓝，内容区白色，强调色金色。
- 移动端优先，按钮高度至少44px。
- 默认中文，可切换英文。

## 构建方法
- 使用 Next.js 14 + TypeScript + Tailwind CSS + shadcn/ui。
- 后端用 Supabase（PostgreSQL + Auth + RLS）。
- 文件存储用 Supabase Storage。
- PDF 用 @react-pdf/renderer。
- 部署到 Vercel。
- 先实现核心检查流程，再添加仪表板和报告。
- 使用真实示例数据，提供运行和测试说明。

## 构建顺序（请严格遵守）
请按以下顺序开发，让我尽早在屏幕上看到成果，不要长时间没有画面：
1. 先做界面：用接近真实的示例数据，把所有页面做出来（暂时不接数据库），让我能马上看到、能点击。做完先停下来，等我确认。
2. 再做功能：我确认界面后，才让按钮、表单和计算真正可用（继续用示例数据）。
3. 再接 Supabase：功能都正常后，才连接 Supabase 保存真实数据和登录（如需要）。
4. 最后上线：先确保在我电脑上运行正常，再把代码上传到 GitHub，经我同意后部署到 Vercel。
请保持简单——我是非技术背景的老板。有不清楚或需要决定的事，先问我，不要自己假设。