# 采购计划确认功能使用指南

## 📋 功能概述

为采购计划列表添加了完整的二次确认机制，确保关键操作的准确性和安全性。

### 新增功能

1. **提交审批** - 草稿状态的计划可以提交到审批流程（需二次确认）
2. **批准计划** - 审批人员批准待审批的计划（需二次确认）
3. **驳回计划** - 审批人员驳回待审批的计划（需二次确认）

---

## 🎯 功能详细说明

### 一、提交审批功能 ✨

#### 功能描述
- 草稿状态的采购计划可以提交到审批流程
- 提交前需要二次确认，避免误操作
- 提交后计划状态变为"待审批"

#### 操作步骤
1. 进入 **资产管理** → **采购管理** → **采购计划** 标签页
2. 找到状态为"草稿"的采购计划
3. 点击计划卡片右上角的 **"提交审批"** 按钮（蓝色按钮，带发送图标）
4. 弹出确认对话框，显示以下信息：
   - 对话框标题："确认提交审批"
   - 计划名称（蓝色高亮显示）
   - 提示信息："提交后，计划将进入审批流程，需要相关人员审批通过后才能执行"
5. 确认信息无误后，点击 **"确认提交"** 按钮
6. 或点击 **"取消"** 按钮放弃操作
7. 提交成功后，计划状态变为"待审批"，并显示成功提示

#### 界面示例
```
┌─ 确认提交审批 ─────────────────────────────────┐
│                                                │
│ 您确定要提交以下采购计划到审批流程吗？        │
│                                                │
│ ┌────────────────────────────────────────────┐ │
│ │ 计划名称：春季水稻种植采购计划            │ │
│ └────────────────────────────────────────────┘ │
│                                                │
│ 提示：提交后，计划将进入审批流程，需要相关  │
│       人员审批通过后才能执行。                │
│                                                │
│                              [取消] [确认提交] │
└────────────────────────────────────────────────┘
```

#### 按钮样式
- **提交审批按钮**: 蓝色背景，带发送图标 📤
- **确认提交按钮**: 蓝色，强调操作
- **取消按钮**: 灰色，次要操作

---

### 二、批准计划功能 ✅

#### 功能描述
- 审批人员可以批准待审批的采购计划
- 批准前需要二次确认，确保审批的准确性
- 批准后计划状态变为"已批准"，记录审批人和审批时间

#### 操作步骤
1. 找到状态为"待审批"的采购计划
2. 点击计划卡片右上角的 **"批准"** 按钮（绿色按钮，带竖起大拇指图标）
3. 弹出确认对话框，显示以下信息：
   - 对话框标题："确认批准计划"
   - 计划名称（绿色高亮显示）
   - 提示信息："批准后，该计划可以进入执行阶段，相关采购人员可以据此创建采购订单"
4. 确认后点击 **"确认批准"** 按钮
5. 或点击 **"取消"** 按钮放弃操作
6. 批准成功后，计划状态变为"已批准"，并记录审批人和时间

#### 界面示例
```
┌─ 确认批准计划 ─────────────────────────────────┐
│                                                │
│ 您确定要批准以下采购计划吗？                  │
│                                                │
│ ┌────────────────────────────────────────────┐ │
│ │ 计划名称：春季水稻种植采购计划            │ │
│ └────────────────────────────────────────────┘ │
│                                                │
│ 提示：批准后，该计划可以进入执行阶段，相关  │
│       采购人员可以据此创建采购订单。          │
│                                                │
│                              [取消] [确认批准] │
└────────────────────────────────────────────────┘
```

#### 按钮样式
- **批准按钮**: 绿色背景，带竖起大拇指图标 👍
- **确认批准按钮**: 绿色，强调正向操作
- **取消按钮**: 灰色，次要操作

---

### 三、驳回计划功能 ❌

#### 功能描述
- 审批人员可以驳回不符合要求的采购计划
- 驳回前需要二次确认，防止误操作
- 驳回后计划状态变为"已驳回"，创建人可以重新编辑并提交

#### 操作步骤
1. 找到状态为"待审批"的采购计划
2. 点击计划卡片右上角的 **"驳回"** 按钮（边框按钮，带向下大拇指图标）
3. 弹出确认对话框，显示以下信息：
   - 对话框标题："确认驳回计划"
   - 计划名称（红色高亮显示）
   - 提示信息："驳回后，计划将返回草稿状态，创建人需要重新修改并提交审批"
4. 确认后点击 **"确认驳回"** 按钮
5. 或点击 **"取消"** 按钮放弃操作
6. 驳回成功后，计划状态变为"已驳回"

#### 界面示例
```
┌─ 确认驳回计划 ─────────────────────────────────┐
│                                                │
│ 您确定要驳回以下采购计划吗？                  │
│                                                │
│ ┌────────────────────────────────────────────┐ │
│ │ 计划名称：春季水稻种植采购计划            │ │
│ └────────────────────────────────────────────┘ │
│                                                │
│ 提示：驳回后，计划将返回草稿状态，创建人需  │
│       要重新修改并提交审批。                  │
│                                                │
│                              [取消] [确认驳回] │
└────────────────────────────────────────────────┘
```

#### 按钮样式
- **驳回按钮**: 边框样式，带向下大拇指图标 👎
- **确认驳回按钮**: 红色，强调警告操作
- **取消按钮**: 灰色，次要操作

---

## 🔄 完整操作流程

### 采购计划审批流程

```
创建计划（草稿）
    ↓
【提交审批】← 需要二次确认
    ↓
待审批状态
    ↓
审批人员审核
    ↓
┌─────────┴─────────┐
↓                   ↓
【批准】          【驳回】
需二次确认        需二次确认
↓                   ↓
已批准状态        已驳回状态
↓                   ↓
创建采购订单      返回修改 → 重新提交
```

---

## 🎨 按钮状态和显示规则

### 草稿状态
- ✅ 显示：**提交审批**（蓝色）
- ✅ 显示：**查看**（眼睛图标）
- ✅ 显示：**编辑**（铅笔图标）

### 待审批状态
- ✅ 显示：**批准**（绿色）
- ✅ 显示：**驳回**（边框）
- ✅ 显示：**查看**（眼睛图标）
- ❌ 不显示：编辑按钮

### 已批准状态
- ✅ 显示：**查看**（眼睛图标）
- ❌ 不显示：其他操作按钮

### 已驳回状态
- ✅ 显示：**查看**（眼睛图标）
- ✅ 显示：**编辑**（铅笔图标）
- ❌ 不显示：提交审批按钮（需先编辑修改）

---

## 📊 状态转换矩阵

| 当前状态 | 可执行操作 | 操作后状态 | 需要确认 |
|---------|-----------|-----------|---------|
| 草稿 | 提交审批 | 待审批 | ✅ 是 |
| 草稿 | 编辑 | 草稿 | ❌ 否 |
| 待审批 | 批准 | 已批准 | ✅ 是 |
| 待审批 | 驳回 | 已驳回 | ✅ 是 |
| 已批准 | - | - | - |
| 已驳回 | 编辑 | 已驳回 | ❌ 否 |
| 已驳回 | 提交审批 | 待审批 | ✅ 是 |

---

## 💡 使用建议

### 提交审批前
1. **仔细检查计划内容**: 确保物料清单、数量、金额等信息准确无误
2. **完善采购原因**: 填写详细的采购理由，便于审批人员理解
3. **关联种植计划**: 如有相关的种植计划，建议关联，增强可追溯性
4. **再次核对**: 提交前最后确认一遍，避免提交后发现错误

### 审批时
1. **认真审核**: 仔细查看计划详情，包括物料清单、金额、采购原因等
2. **查看市场分析**: 参考系统提供的市场行情分析，判断采购时机是否合适
3. **考虑预算**: 确认采购金额在预算范围内
4. **明确理由**: 如需驳回，建议配合消息功能告知创建人具体原因

### 驳回后
1. **了解驳回原因**: 查看消息通知，了解被驳回的具体原因
2. **针对性修改**: 根据反馈意见，有针对性地修改计划
3. **重新提交**: 修改完成后，再次提交审批

---

## ⚠️ 注意事项

### 重要提醒
1. **二次确认不可跳过**: 所有关键操作都必须通过二次确认，确保操作意图明确
2. **状态不可逆**: 某些状态变更是不可逆的，请谨慎操作
3. **已批准不可修改**: 计划一旦批准，就不能再编辑，如需修改需要创建新计划
4. **驳回可重新编辑**: 被驳回的计划可以重新编辑修改后再次提交

### 权限说明
- **创建人**: 可以创建、编辑、提交自己的计划
- **审批人**: 可以批准或驳回待审批的计划
- **所有人**: 都可以查看已批准的计划

### 操作限制
- 草稿状态：只能提交或编辑，不能直接批准
- 待审批状态：只能批准或驳回，不能编辑
- 已批准状态：不能进行任何修改
- 已驳回状态：可以重新编辑，修改后需重新提交

---

## 🔍 确认对话框设计细节

### 对话框组件特点
- **清晰的标题**: 明确说明操作类型
- **高亮显示关键信息**: 计划名称用彩色背景高亮显示
- **详细的提示说明**: 告知操作后的影响和后续流程
- **双按钮设计**: 取消和确认按钮并排，避免误操作
- **颜色区分**: 不同操作类型使用不同的颜色主题
  - 提交审批：蓝色（中性操作）
  - 批准：绿色（正向操作）
  - 驳回：红色（警告操作）

### 用户体验优化
1. **防误触**: 所有关键操作都需要额外点击确认
2. **信息透明**: 清楚告知操作后的影响
3. **操作可撤销**: 在确认前可以随时取消
4. **视觉反馈**: 不同操作有不同的颜色主题
5. **键盘友好**: 支持 ESC 键关闭对话框

---

## 📝 技术实现

### 状态管理
```typescript
const [confirmDialog, setConfirmDialog] = useState<{
  open: boolean;
  type: 'submit' | 'approve' | 'reject' | null;
  planId: string | null;
  planName: string;
}>({
  open: false,
  type: null,
  planId: null,
  planName: '',
});
```

### 操作处理
```typescript
// 打开确认对话框
handleSubmitPlan(plan)  // 提交审批
handleApprovePlan(plan) // 批准计划
handleRejectPlan(plan)  // 驳回计划

// 执行确认操作
handleConfirmAction()   // 根据 type 执行相应操作
```

### 组件使用
- **AlertDialog**: Shadcn UI 的警告对话框组件
- **AlertDialogContent**: 对话框内容容器
- **AlertDialogHeader**: 对话框头部（标题和描述）
- **AlertDialogFooter**: 对话框底部（操作按钮）
- **AlertDialogCancel**: 取消按钮
- **AlertDialogAction**: 确认按钮

---

## 🎯 测试清单

### 提交审批功能测试
- [ ] 草稿状态的计划显示"提交审批"按钮
- [ ] 点击按钮弹出确认对话框
- [ ] 对话框显示正确的计划名称
- [ ] 点击"取消"可以关闭对话框
- [ ] 点击"确认提交"成功提交
- [ ] 提交后状态变为"待审批"
- [ ] 提交后显示成功提示

### 批准功能测试
- [ ] 待审批状态的计划显示"批准"按钮
- [ ] 点击按钮弹出确认对话框
- [ ] 对话框显示正确的计划名称和提示
- [ ] 点击"取消"可以关闭对话框
- [ ] 点击"确认批准"成功批准
- [ ] 批准后状态变为"已批准"
- [ ] 批准后记录审批人和时间
- [ ] 批准后显示成功提示

### 驳回功能测试
- [ ] 待审批状态的计划显示"驳回"按钮
- [ ] 点击按钮弹出确认对话框
- [ ] 对话框显示正确的计划名称和警告提示
- [ ] 点击"取消"可以关闭对话框
- [ ] 点击"确认驳回"成功驳回
- [ ] 驳回后状态变为"已驳回"
- [ ] 驳回后显示成功提示

### 界面交互测试
- [ ] 按钮颜色和图标正确显示
- [ ] 不同状态显示正确的操作按钮
- [ ] 对话框颜色主题与操作类型匹配
- [ ] 点击对话框外部可以关闭
- [ ] ESC 键可以关闭对话框

---

## 🚀 快速开始

### 1. 测试提交审批
1. 打开采购管理 → 采购计划
2. 找到"草稿"状态的计划
3. 点击蓝色的"提交审批"按钮
4. 在确认对话框中点击"确认提交"
5. 查看状态是否变为"待审批"

### 2. 测试批准计划
1. 找到"待审批"状态的计划
2. 点击绿色的"批准"按钮
3. 在确认对话框中点击"确认批准"
4. 查看状态是否变为"已批准"
5. 查看是否记录了审批人和时间

### 3. 测试驳回计划
1. 找到"待审批"状态的计划
2. 点击"驳回"按钮
3. 在确认对话框中点击"确认驳回"
4. 查看状态是否变为"已驳回"

---

## 📈 功能优势

### 安全性提升
- ✅ 防止误操作：二次确认机制有效防止误点击
- ✅ 操作可追溯：记录审批人和审批时间
- ✅ 状态明确：每个操作都有清晰的状态反馈

### 用户体验优化
- ✅ 操作直观：按钮颜色和图标清晰表达操作意图
- ✅ 信息透明：确认对话框详细说明操作影响
- ✅ 流程清晰：完整的审批流程一目了然

### 流程规范化
- ✅ 强制审批：草稿必须提交审批后才能执行
- ✅ 权限分离：创建和审批分离，避免自我审批
- ✅ 可追溯性：完整的操作记录便于审计

---

## 📞 反馈和支持

如有问题或建议，请联系开发团队。

---

**文档版本**: v1.0  
**更新日期**: 2024-03-15  
**功能状态**: ✅ 已完成并测试  
**作者**: 智慧农业开发团队
