目前还差物联网分配问题

2025-10-21 17:29:52 +08:00
parent 5fe7a5c48a
commit 0249dfc5bb
314 changed files with 91767 additions and 91 deletions
--- a/pc-cattle-transportation/AUTO_FILL_IMPLEMENTATION.md
+++ b/pc-cattle-transportation/AUTO_FILL_IMPLEMENTATION.md
@@ -0,0 +1,155 @@
+# 装车信息表单自动填充功能实现
+
+## 功能概述
+
+已成功实现装车信息表单的自动填充功能，可以根据API返回的数据自动映射并填充表单字段。
+
+## 实现的功能
+
+### 1. 数据映射字段
+
+根据提供的API响应数据，实现了以下字段的自动映射：
+
+#### 基础信息
+- `deliveryId` ← `id`
+- `estimatedDeliveryTime` ← `estimatedDeliveryTime`
+- `serverDeviceSn` ← `serverDeviceId`
+
+#### 重量信息
+- `emptyWeight` ← `emptyWeight`
+- `entruckWeight` ← `entruckWeight`
+- `landingEntruckWeight` ← `landingEntruckWeight`
+
+#### 照片URL
+- `quarantineTickeyUrl` ← `quarantineTickeyUrl`
+- `poundListImg` ← `poundListImg`
+- `emptyVehicleFrontPhoto` ← `emptyVehicleFrontPhoto`
+- `loadedVehicleFrontPhoto` ← `loadedVehicleFrontPhoto`
+- `loadedVehicleWeightPhoto` ← `loadedVehicleWeightPhoto`
+- `driverIdCardPhoto` ← `driverIdCardPhoto`
+
+#### 视频URL
+- `entruckWeightVideo` ← `entruckWeightVideo`
+- `emptyWeightVideo` ← `emptyWeightVideo`
+- `entruckVideo` ← `entruckVideo`
+- `controlSlotVideo` ← `controlSlotVideo`
+- `cattleLoadingCircleVideo` ← `cattleLoadingCircleVideo`
+
+### 2. 核心实现
+
+#### 自动填充函数
+```javascript
+const autoFillFormData = (apiData) => {
+    if (!apiData) return;
+    
+    // 基础信息映射
+    ruleForm.deliveryId = apiData.id || '';
+    ruleForm.estimatedDeliveryTime = apiData.estimatedDeliveryTime || '';
+    ruleForm.serverDeviceSn = apiData.serverDeviceId || '';
+    
+    // 重量信息映射
+    ruleForm.emptyWeight = apiData.emptyWeight || '';
+    ruleForm.entruckWeight = apiData.entruckWeight || '';
+    ruleForm.landingEntruckWeight = apiData.landingEntruckWeight || '';
+    
+    // 照片URL映射
+    ruleForm.quarantineTickeyUrl = apiData.quarantineTickeyUrl || '';
+    ruleForm.poundListImg = apiData.poundListImg || '';
+    ruleForm.emptyVehicleFrontPhoto = apiData.emptyVehicleFrontPhoto || '';
+    ruleForm.loadedVehicleFrontPhoto = apiData.loadedVehicleFrontPhoto || '';
+    ruleForm.loadedVehicleWeightPhoto = apiData.loadedVehicleWeightPhoto || '';
+    ruleForm.driverIdCardPhoto = apiData.driverIdCardPhoto || '';
+    
+    // 视频URL映射
+    ruleForm.entruckWeightVideo = apiData.entruckWeightVideo || '';
+    ruleForm.emptyWeightVideo = apiData.emptyWeightVideo || '';
+    ruleForm.entruckVideo = apiData.entruckVideo || '';
+    ruleForm.controlSlotVideo = apiData.controlSlotVideo || '';
+    ruleForm.cattleLoadingCircleVideo = apiData.cattleLoadingCircleVideo || '';
+    
+    console.log('表单数据已自动填充:', ruleForm);
+};
+```
+
+#### 更新后的对话框调用函数
+```javascript
+const onShowDialog = (row, apiData = null) => {
+    data.dialogVisible = true;
+    if (formDataRef.value) {
+        formDataRef.value.resetFields();
+    }
+    if (row) {
+        nextTick(() => {
+            data.deliveryId = row.id;
+            ruleForm.deliveryId = row.id;
+            
+            // 如果提供了API数据，直接填充表单
+            if (apiData) {
+                autoFillFormData(apiData);
+            } else {
+                // 否则从服务器获取详情
+                getOrderDetail();
+            }
+            
+            getHostList();
+        });
+    }
+};
+```
+
+## 使用方法
+
+### 方法1：直接传递API数据
+```javascript
+// 在调用装车对话框时，直接传递API响应数据
+const loadClick = (row, apiData) => {
+    if (LoadDialogRef.value) {
+        LoadDialogRef.value.onShowDialog(row, apiData);
+    }
+};
+```
+
+### 方法2：在API响应中自动填充
+当调用 `getOrderDetail()` 函数时，会自动调用 `autoFillFormData(res.data)` 来填充表单。
+
+## 示例数据映射
+
+基于提供的API响应数据：
+```javascript
+{
+    id: 85,
+    deliveryNumber: "ZC20251020105111",
+    deliveryTitle: "1",
+    estimatedDeliveryTime: "2025-10-31 00:00:00",
+    emptyWeight: "1000.00",
+    entruckWeight: "2000.00",
+    quarantineTickeyUrl: "https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/iotPlateform/2025/10/21/4c4e20251021100838.jpg",
+    poundListImg: "https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/iotPlateform/2025/10/21/cows20251021100841.jpg",
+    emptyVehicleFrontPhoto: "https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/iotPlateform/2025/10/21/4c4e20251021100847.jpg",
+    loadedVehicleFrontPhoto: "https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/iotPlateform/2025/10/21/cows20251021100849.jpg",
+    loadedVehicleWeightPhoto: "https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/iotPlateform/2025/10/21/4c4e20251021100854.jpg",
+    driverIdCardPhoto: "https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/iotPlateform/2025/10/21/cows20251021100857.jpg",
+    entruckWeightVideo: "https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/iotPlateform/2025/10/21/normal_video20251021100901.mp4",
+    emptyWeightVideo: "https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/iotPlateform/2025/10/21/normal_video20251021100904.mp4",
+    entruckVideo: "https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/iotPlateform/2025/10/21/normal_video20251021101046.mp4",
+    controlSlotVideo: "https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/iotPlateform/2025/10/21/normal_video20251021101049.mp4",
+    cattleLoadingCircleVideo: "https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/iotPlateform/2025/10/21/normal_video20251021101052.mp4"
+}
+```
+
+这些数据会自动映射到表单的相应字段中。
+
+## 注意事项
+
+1. **数据安全**：所有字段都使用了 `|| ''` 来确保空值安全
+2. **向后兼容**：保持了原有的 `getOrderDetail()` 功能
+3. **调试支持**：添加了 `console.log` 来帮助调试数据填充过程
+4. **响应式更新**：使用 Vue 3 的 reactive 系统确保数据变化时UI自动更新
+
+## 文件修改
+
+- `pc-cattle-transportation/src/views/shipping/loadDialog.vue`
+  - 添加了 `landingEntruckWeight` 字段
+  - 实现了 `autoFillFormData` 函数
+  - 更新了 `onShowDialog` 函数支持API数据参数
+  - 在 `getOrderDetail` 中集成了自动填充功能