# 装车订单页面修复说明

## 问题分析

`loadingOrder.vue` 页面目前使用错误的接口：
- **当前使用：** `orderList(params)` → 调用 `/delivery/pageDeliveryOrderList`
- **应该使用：** `orderPageQuery(params)` → 调用 `/order/list`

## 问题根源

1. **接口混用：** `orderList` 查询的是 `delivery` 装车运单表，而不是 `order` 订单表
2. **字段不匹配：** 页面显示的字段（供应商、采购商、结算方式等）应该来自 `order` 表
3. **数据结构错误：** 返回的是运单数据，而不是订单数据

## 修复方案

### 1. 修改导入的接口函数

**文件：** `loadingOrder.vue` 第83行

```javascript
// 修改前
import { orderList, orderDel, updateDeliveryStatus, clearDeviceDeliveryId } from '@/api/shipping.js';

// 修改后
import { orderPageQuery, orderDelete, orderUpdate } from '@/api/shipping.js';
import { orderList, updateDeliveryStatus, clearDeviceDeliveryId } from '@/api/shipping.js'; // 保留旧的装车订单相关接口
```

### 2. 修改列表查询接口

**文件：** `loadingOrder.vue` 第236行

```javascript
// 修改前
orderList(params)

// 修改后  
orderPageQuery(params)
```

### 3. 修改表格列字段

**文件：** `loadingOrder.vylus` 第21-50行

```vue
<!-- 修改前 -->
<el-table-column label="订单编号" prop="deliveryNumber" />
<el-table-column label="供应商" prop="supplierName" />
<el-table-column label="采购商" prop="buyerName" />
<el-table-column label="结算方式" prop="settlementMethod" />
<el-table-column label="创建人" prop="createByName" />

<!-- 修改后 -->
<el-table-column label="订单ID" prop="id" />
<el-table-column label="买方" prop="buyerName" />
<el-table-column label="卖方" prop="sellerName" />
<el-table-column label="结算方式" prop="settlementTypeDesc" />
<el-table-column label="创建人" prop="createdByName" />
```

### 4. 修改删除函数

**文件：** `loadingOrder.vue` 第388行

```javascript
// 修改前
const del = (id) => {
    ElMessageBox.confirm('请确认是否删除订单？删除后将同时清空该订单关联的所有智能设备的delivery_id和weight字段', '提示', {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning',
    }).then(() => {
        clearDeviceDeliveryId(id).then(() => {
            orderDel(id).then(() => {
                ElMessage.success('订单删除成功，相关设备的绑定和重量信息已清空');
                getDataList();
            });
        });
    });
};

// 修改后
const del = (id) => {
    ElMessageBox.confirm('请确认是否删除订单？删除后将不可恢复', '提示', {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning',
    }).then(() => {
        orderDelete(id).then((res) => {
            if (res.code === 200) {
                ElMessage.success('订单删除成功');
                getDataList();
            } else {
                ElMessage.error(res.msg || '删除订单失败');
            }
        }).catch((error) => {
            console.error('删除订单失败:', error);
            ElMessage.error('删除订单失败');
        });
    });
};
```

### 5. 简化搜索表单

**文件：** `loadingOrder.vue` 第102-132行

```javascript
// 修改搜索表单字段，只保留订单相关的搜索
const formItemList = reactive([
    {
        label: '买方',
        type: 'input',
        param: 'buyerName',
        span: 6,
        placeholder: '请输入买方',
    },
    {
        label: '卖方',
        type: 'input',
        param: 'sellerName',
        span: 6,
        placeholder: '请输入卖方',
    },
    {
        label: '创建时间',
        type: 'daterange',
        param: 'createTimeRange',
        span: 6,
        startPlaceholder: المملكة '开始日期',
        endPlaceholder: '结束日期',
    },
]);
```

### 6. 移除不需要的功能

由于 `order` 表是简化的订单管理，需要移除以下不需要的功能：
- 分配设备
- 查看设备
- 装车
- 编辑状态

```vue
<!-- 简化操作列 -->
<el-table-column label="操作" width="200">
    <template #default="scope">
        <el-button link type="primary" @click="showEditDialog(scope.row)">编辑</el-button>
        <el-button link type="primary" @click="del(scope.row.id)">删除</el-button>
    </template>
</el-table-column>
```

## 数据对比

### order 表返回的数据结构

```json
{
  "id": 1,
  "buyerId": "10,11",
  "sellerId": "5,6",
  "settlementType": 1,
  "buyerName": "张三,李四",
  "sellerName": "王五,赵六",
  "settlementTypeDesc": "上车重量",
  "createdByName": "管理员",
  "createTime": "2025-01-20 10:00:00"
}
```

### delivery 表返回的数据结构

```json
{
  "id": 89,
  "deliveryNumber": "ZC20251027161826",
  "deliveryTitle": "2222",
  "ratedQuantity": 30,
  "supplierId": "1,2",
  "buyerId": 10,
  "status": 1,
  "createByName": "管理员"
}
```

## 执行步骤

1. 修改 `loadingOrder.vue` 文件（按上述方案）
2. 删除不需要的对话框组件引用
3. 调整页面布局以适应新的数据结构
4. 测试功能确保正常

## 注意事项

1. **向后兼容：** 旧的装车订单功能（delivery表）仍然保留，只是这个页面应该展示订单表
2. **数据一致性：** 确保数据库已执行 `add_order_id_to_delivery.sql`
3. **权限设置：** 确保有 `order:list`, `order:add`, `order:edit`, `order:delete` 权限