装车订单页面修复说明

问题分析

loadingOrder.vue 页面目前使用错误的接口：

当前使用： orderList(params) → 调用 /delivery/pageDeliveryOrderList
应该使用： orderPageQuery(params) → 调用 /order/list

问题根源

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

修复方案

1. 修改导入的接口函数

文件： loadingOrder.vue 第83行

// 修改前
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行

// 修改前
orderList(params)

// 修改后  
orderPageQuery(params)

3. 修改表格列字段

文件： loadingOrder.vylus 第21-50行

<!-- 修改前 -->
<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行

// 修改前
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行

// 修改搜索表单字段，只保留订单相关的搜索
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 表是简化的订单管理，需要移除以下不需要的功能：

分配设备
查看设备
装车
编辑状态

<!-- 简化操作列 -->
<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 表返回的数据结构

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

delivery 表返回的数据结构

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

执行步骤

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

注意事项

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

5.4 KiB Raw Blame History Unescape Escape