smart-crop-ui/src/OPERATION_RECORD_DIALOG_UPDATE.md

农事执行—操作录入功能更新

更新时间

2025-10-20

更新内容

1. 操作参数自动带出

• 选择农事类型后，系统自动加载该类型对应的操作参数模板
• 根据参数类型（文本、数字、选择、日期）动态渲染不同的表单控件
• 显示参数是否必填、单位、选项等信息
• 显示参数描述，帮助用户正确填写

2. 移除智能录入工具模块

• 去掉了"智能录入工具"卡片，包括：
  • 扫描农资条码功能
  • 获取GPS定位功能
  • 拍摄现场照片按钮（已移至独立模块）
• 简化了对话框界面，使其更加清晰

3. 新增现场图片上传功能

• 新增独立的"现场图片"卡片
• 支持点击上传或拖拽上传图片
• 支持多图上传（最多10张）
• 提供图片预览功能
• 可以删除已上传的图片
• 显示图片序号便于管理

技术实现

新增状态变量

const [selectedOperationType, setSelectedOperationType] = useState<OperationTypeTemplate | null>(null);
const [uploadedPhotos, setUploadedPhotos] = useState<string[]>([]);

新增处理函数

• handleOperationTypeChange: 处理农事类型选择，自动加载参数模板
• handlePhotoUpload: 处理图片上传
• handlePhotoRemove: 删除已上传的图片

动态参数渲染

根据选择的农事类型，系统会：

1. 读取该类型的参数配置（parameters数组）
2. 遍历每个参数
3. 根据参数类型（text/number/select/date）渲染对应的表单控件
4. 显示必填标记（*）
5. 显示单位（如：kg、cm、亩等）
6. 显示参数描述

使用说明

新增操作记录流程

1. 点击"新增记录"按钮
2. 选择农事类型（如：播种、施肥、灌溉等）
3. 系统自动显示该类型对应的操作参数表单
4. 填写基本信息（地块、执行人、日期等）
5. 填写自动生成的操作参数
6. 上传现场图片（可选）
7. 填写备注（可选）
8. 点击"保存记录"

图片上传

• 点击上传区域选择文件
• 或直接拖拽图片到上传区域
• 支持JPG、PNG格式
• 可上传多张图片
• 鼠标悬停在图片上可看到删除按钮
• 点击删除按钮可移除图片

参数模板示例

播种类型参数

• 作物品种（文本，必填）
• 种子品牌（文本，必填）
• 播种量（数字，必填，单位：kg）
• 播种方式（选择，必填，选项：条播/穴播/撒播/点播）
• 行距（数字，选填，单位：cm）
• 株距（数字，选填，单位：cm）
• 播种深度（数字，必填，单位：cm）

施肥类型参数

• 肥料类型（选择，必填）
• 肥料品牌（文本，必填）
• 施肥量（数字，必填，单位：kg/亩）
• 总用量（数字，必填，单位：kg）
• 施肥方法（选择，必填）
• 施肥位置（文本，选填）

灌溉类型参数

• 灌溉方式（选择，必填）
• 灌溉时长（数字，必填，单位：小时）
• 水量（数字，必填，单位：m³）
• 水源（选择，必填）

优势

1. 自动化程度高：选择类型后自动加载参数，无需手动配置
2. 数据规范性强：使用预定义的参数模板，确保数据完整性
3. 操作更简便：界面简洁，操作流程清晰
4. 图片管理方便：独立的图片上传模块，支持预览和删除
5. 灵活性好：可以通过农事类型库自定义参数模板

文件位置

/components/operation/OperationExecution.tsx