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

2025-10-23 10:57:14 +08:00
parent 83523dad64
commit 28229ce795
354 changed files with 147599 additions and 7892 deletions
--- a/src/CONFIRM_DIALOG_MIGRATION.md
+++ b/src/CONFIRM_DIALOG_MIGRATION.md
@@ -0,0 +1,102 @@
+# 删除确认弹窗迁移文档
+
+## 已完成修改的文件
+
+1. ✅ `/components/machinery/driver/DriverList.tsx` - 驾驶员列表删除
+2. ✅ `/components/machinery/MachineryList.tsx` - 农机列表删除
+3. ✅ `/components/machinery/TagManagement.tsx` - 标签管理删除
+
+## 待修改的文件列表
+
+### 农机管理模块
+4. `/components/machinery/scheduling/TaskAssignment.tsx` - 任务删除
+5. `/components/machinery/security/GeoFence.tsx` - 围栏删除
+6. `/components/machinery/load/LoadDevice.tsx` - 设备拆卸
+7. `/components/machinery/load/LoadType.tsx` - 设备类型删除
+8. `/components/machinery/MaintenanceRecords.tsx` - 维护记录删除
+9. `/components/machinery/ChangeHistoryExamples.tsx` - 变更历史清除
+
+### 配置管理模块
+10. `/components/config/MenuManagement.tsx` - 菜单删除
+11. `/components/config/RoleManagement.tsx` - 角色删除
+12. `/components/config/EmployeeManagement.tsx` - 员工删除和密码重置
+13. `/components/config/UserManagement.tsx` - 用户删除和密码重置
+14. `/components/config/PermissionManagement.tsx` - 权限删除
+15. `/components/config/MessageSend.tsx` - 消息取消和删除
+
+### 地块管理模块
+16. `/components/field/FieldList.tsx` - 地块删除
+
+## 修改模式
+
+### 1. 导入 AlertDialog 组件
+```typescript
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+} from '../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. 替换 confirm 调用
+```typescript
+// 旧代码
+if (confirm('确定要删除吗？')) {
+  onDelete(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. 确保导入路径正确（`../ui/alert-dialog` 或 `../../ui/alert-dialog`）
+2. 对于需要传递额外参数的删除操作，使用 state 保存
+3. 对于有多个删除操作的页面，可能需要多个 state 或使用对象/类型区分
+4. 确保 AlertDialog 放在正确的位置（通常在主容器的末尾）