生产管理系统前端 - 更新瓦力提交的产品原型到参考目录

2025-10-23 10:57:14 +08:00
parent 83523dad64
commit 28229ce795
354 changed files with 147599 additions and 7892 deletions
--- a/src/ALERT_DIALOG_UPDATE_SUMMARY.md
+++ b/src/ALERT_DIALOG_UPDATE_SUMMARY.md
@@ -0,0 +1,204 @@
+# 删除确认弹窗更新总结
+
+## ✅ 已完成更新的文件（共6个）
+
+### 1. `/components/machinery/driver/DriverList.tsx`
+- **修改内容**: 驾驶员列表删除确认
+- **状态**: ✅ 完成
+- **更改**: 将 `confirm()` 替换为 AlertDialog 组件
+
+### 2. `/components/machinery/MachineryList.tsx`
+- **修改内容**: 农机列表删除确认
+- **状态**: ✅ 完成
+- **更改**: 将 `confirm()` 替换为 AlertDialog 组件
+
+### 3. `/components/machinery/TagManagement.tsx`
+- **修改内容**: 标签管理删除确认
+- **状态**: ✅ 完成
+- **更改**: 将 `confirm()` 替换为 AlertDialog 组件
+
+### 4. `/components/field/FieldList.tsx`
+- **修改内容**: 地块列表删除确认
+- **状态**: ✅ 完成
+- **更改**: 将 `confirm()` 替换为 AlertDialog 组件
+
+### 5. `/components/machinery/driver/DriverTask.tsx` 🆕
+- **修改内容**: 驾驶员任务管理操作确认（接收/取消/完成/终止）
+- **状态**: ✅ 完成
+- **更改**: 
+  - 接收任务：从无确认 → AlertDialog 确认（绿色）
+  - 取消任务：从 `confirm()` → AlertDialog 确认（红色）
+  - 完成任务：从无确认 → AlertDialog 确认（紫色）
+  - 终止任务：从无确认 → AlertDialog 确认（橙色）🆕
+  - 新增"已终止"任务状态 🆕
+  - 添加任务列表分页功能 🆕
+- **详细说明**: `/TASK_ALERT_DIALOG_UPDATE.md` 和 `/TASK_TERMINATE_UPDATE.md`
+
+## ⚠️ 待更新的文件（共11个）
+
+由于文件数量较多，建议分批处理。以下是剩余需要更新的文件列表：
+
+### 农机管理模块（5个）
+1. `/components/machinery/scheduling/TaskAssignment.tsx`
+   - 行号: 132
+   - 内容: `if (confirm('确定要删除此任务吗？'))`
+
+2. `/components/machinery/security/GeoFence.tsx`
+   - 行号: 136
+   - 内容: `if (confirm('确定要删除此围栏吗？'))`
+
+3. `/components/machinery/load/LoadDevice.tsx`
+   - 行号: 267
+   - 内容: `if (confirm('确定要拆卸此设备吗？'))`
+
+4. `/components/machinery/load/LoadType.tsx`
+   - 行号: 257
+   - 内容: `if (confirm('确定要删除此设备类型吗？'))`
+
+5. `/components/machinery/MaintenanceRecords.tsx`
+   - 行号: 115
+   - 内容: `if (confirm('确定要删除这条维护记录吗？'))`
+
+6. `/components/machinery/ChangeHistoryExamples.tsx`
+   - 行号: 48
+   - 内容: `if (confirm('确定要清除所有变更历史示例数据吗？'))`
+
+### 配置管理模块（6个）
+7. `/components/config/MenuManagement.tsx`
+   - 行号: 414
+   - 内容: `if (!confirm(\`确定要删除菜单"${menu.name}"吗？\`))`
+
+8. `/components/config/RoleManagement.tsx`
+   - 行号: 494
+   - 内容: `if (!confirm('确定要删除该角色吗？'))`
+
+9. `/components/config/EmployeeManagement.tsx`
+   - 行号: 184, 205
+   - 内容: 
+     - `if (!confirm('确定要删除该员工吗？'))`
+     - `if (!confirm(\`确定要重置 ${employee.name} 的密码吗？\`))`
+
+10. `/components/config/UserManagement.tsx`
+    - 行号: 189, 210
+    - 内容:
+      - `if (!confirm('确定要删除该用户吗？'))`
+      - `if (!confirm(\`确定要重置 ${user.name} 的密码吗？\`))`
+
+11. `/components/config/PermissionManagement.tsx`
+    - 行号: 337
+    - 内容: `if (!confirm("确定要删除该权限吗？"))`
+
+12. `/components/config/MessageSend.tsx`
+    - 行号: 274, 284
+    - 内容:
+      - `if (!confirm('确定要取消该定时消息吗？'))`
+      - `if (!confirm('确定要删除该发送记录吗？'))`
+
+## 📝 更新模板
+
+每个文件需要进行以下4个步骤的修改：
+
+### 步骤1: 导入 AlertDialog 组件
+```typescript
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+} from '../ui/alert-dialog'; // 或 '../../ui/alert-dialog'
+```
+
+### 步骤2: 添加状态管理
+```typescript
+const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);
+const [deletingId, setDeletingId] = useState<string>('');
+
+const handleDeleteClick = (id: string) => {
+  setDeletingId(id);
+  setDeleteDialogOpen(true);
+};
+
+const confirmDelete = () => {
+  // 原来的删除逻辑
+  onDelete(deletingId);
+  setDeleteDialogOpen(false);
+  setDeletingId('');
+};
+```
+
+### 步骤3: 替换 onClick 事件
+```typescript
+// 旧代码
+onClick={() => {
+  if (confirm('确定要删除吗？')) {
+    handleDelete(id);
+  }
+}}
+
+// 新代码
+onClick={() => handleDeleteClick(id)}
+```
+
+### 步骤4: 添加 AlertDialog 组件
+```tsx
+<AlertDialog open={deleteDialogOpen} onOpenChange={setDeleteDialogOpen}>
+  <AlertDialogContent>
+    <AlertDialogHeader>
+      <AlertDialogTitle>确认删除</AlertDialogTitle>
+      <AlertDialogDescription>
+        确定要删除这条记录吗？此操作无法撤销。
+      </AlertDialogDescription>
+    </AlertDialogHeader>
+    <AlertDialogFooter>
+      <AlertDialogCancel>取消</AlertDialogCancel>
+      <AlertDialogAction
+        className="bg-red-600 hover:bg-red-700"
+        onClick={confirmDelete}
+      >
+        删除
+      </AlertDialogAction>
+    </AlertDialogFooter>
+  </AlertDialogContent>
+</AlertDialog>
+```
+
+## 🎯 下一步操作建议
+
+1. **优先级1（用户交互频繁）**:
+   - TaskAssignment.tsx
+   - LoadDevice.tsx
+   - MaintenanceRecords.tsx
+
+2. **优先级2（管理功能）**:
+   - RoleManagement.tsx
+   - UserManagement.tsx
+   - EmployeeManagement.tsx
+
+3. **优先级3（其他）**:
+   - 剩余文件
+
+## 🔍 验证清单
+
+更新完成后，请验证：
+- [ ] AlertDialog 样式显示正常
+- [ ] 取消按钮功能正常
+- [ ] 删除按钮功能正常
+- [ ] 删除操作执行成功
+- [ ] Toast 提示显示正常
+- [ ] 没有控制台错误
+
+## 💡 注意事项
+
+1. **多操作场景**: 有些文件（如 EmployeeManagement、UserManagement、MessageSend）有多个 confirm 操作，需要：
+   - 区分不同操作类型（删除、重置密码、取消等）
+   - 可以使用不同的状态变量或操作类型标识
+
+2. **特殊提示语**: 保持原有的个性化提示信息（如包含名称、数量等动态内容）
+
+3. **样式一致性**: 所有删除类操作使用红色按钮（`bg-red-600 hover:bg-red-700`）
+
+4. **对话框位置**: AlertDialog 组件通常放在主容器的末尾，return 语句的最后部分