wujianwei
2026-01-14 4feb321e6fa88e86991da3610b2bdfcf5a2d87a7
ui/admin-ui3/src/views/tms/tmsConsignor/index.vue
@@ -60,12 +60,13 @@
  updateTmsConsignor
} from "@/api/tms/tmsConsignor";
import useCurrentInstance from "@/utils/useCurrentInstance";
import {computed, reactive, ref, toRefs,watch,onMounted} from "vue";
import {computed, reactive, ref, toRefs,watch,nextTick} from "vue";
import {PagesInterface, PageQueryInterface} from "@/utils/globalInterface";
import {usePagePlus} from "@/hooks/usePagePlus";
import {hasPermission} from "@/utils/permissionUtils";
import {getTmsCustomerInfo, listTmsCustomerInfo} from "@/api/tms/tmsCustomerInfo";
import {getArea, getCity, getProvince, getStreet} from "@/api/tms/tmsRegion";
import {getArea, getCity, getProvince, getStreet,getAddressCode} from "@/api/tms/tmsRegion";
import {mapRegeo} from "@/api/common";
const {proxy} = useCurrentInstance();
const crudRef = ref();
@@ -95,35 +96,435 @@
  rowKey: 'id',
  labelWidth: 150,
  searchLabelWidth: 120,
  group: [
    {
      label: '基础信息',
      prop: 'jcxx',
      column:{
        consignorCode: {
          label: '装卸货点编码',minWidth: 150,
          addDisplay: false, disabled: true,
          editDisplay: true,
          viewDisplay: true,
          hide: false,
          search: true,
          rules: [
            {
              required: true,
              message: "装卸货点编码不能为空", trigger: "blur"
            }
          ],
        },
        consignorName: {
          label: '装卸货点名称',minWidth: 150,
          addDisplay: true,
          editDisplay: true,
          viewDisplay: true,
          hide: false,
          search: true,
          rules: [
            {
              required: true,
              message: "装卸货点名称不能为空", trigger: "blur"
            }
          ],
        },
        customerName:{
          label: '所属客户',minWidth: 150,
          display: false,
          hide: false,
          search: false,
        },
        customerId: {
          label: '所属客户',minWidth: 150,
          addDisplay: true,
          editDisplay: true,suffixIcon:'search',
          viewDisplay: true,
          hide: true,
          search: true,
          rules: [
            {
              required: true,
              message: "所属客户不能为空", trigger: "change"
            }
          ],
          type: 'table',dataType: 'string',
          children:{
            border: true,
            searchMenuSpan: 5,
            column:{
              customerType: {
                label: '客户类型', minWidth: 120,
                type: 'select', dataType: 'string', dicUrl: '/system/dict/data/type/customer_type',
                search: true,
              },
              customerShortName: {
                label: '客户简称', minWidth: 130,
                search: true,
              },
              customerCode: {
                label: '客户编号',minWidth: 120,
                search: true,
              },
              contactName: {
                label: '联系人姓名',minWidth: 120,
              },
              signCompanyName: {
                label: '签约公司', minWidth: 150,
              },
            },
          },
          props:{
            label: 'customerShortName',
            value: 'id'
          },
          onLoad: ({ page, value, data }: { page: any, value: any, data: any }, callback:any) => {
            if (value){
              let id = value;
              if (Array.isArray(value)){
                id = value[0]
              }
              getTmsCustomerInfo(id).then(res=>{
                return callback(res.data||{})
              })
            }else{
              listTmsCustomerInfo({pageSize:page.pageSize,pageNum:page.currentPage,...data}).then(res=>{
                return callback({
                  total: res.total,
                  data: res.rows||[],
                })
              })
            }
          },
          change: (val: any) => {
            const table = crudRef.value?.getPropRef?.('customerId')?.$refs?.temp;
            if (!table) return;
            let active = table.active;
            if (Array.isArray(active)) active = active[0];
            if (active) {
              Object.assign(form.value, {
                customerId: active.id,
                customerSysCode: active.customerCode,
                customerName: active.customerShortName,
              });
            }
          },
        },
        customerSysCode: {
          label: '客户编码',minWidth: 150,
          addDisplay: true,
          editDisplay: true,
          viewDisplay: true,
          hide: false,
          search: true,
          disabled: true,
          rules: [
            {
              required: true,
              message: "客户编码不能为空", trigger: "blur"
            }
          ],
        },
        consignorType: {
          label: '装卸货点类型',minWidth: 150,
          type: 'select', dataType: 'string', dicUrl: '/system/dict/data/type/consignor_type',
          addDisplay: true,
          editDisplay: true,
          viewDisplay: true,
          hide: false,
          search: true,
          rules: [
            {
              required: true,
              message: "装卸货点类型不能为空", trigger: "change"
            }
          ],
        },
      }
    },
    {
      label: '联系人信息',
      prop: 'lxrxx',
      column:{
        contactName: {
          label: '联系人姓名',minWidth: 150,
          addDisplay: true,
          editDisplay: true,
          viewDisplay: true,
          hide: false,
          search: true,
          rules: [
            {
              required: true,
              message: "联系人姓名不能为空", trigger: "blur"
            }
          ],
        },
        contactPhone: {
          label: '联系人电话',minWidth: 150,
          addDisplay: true,
          editDisplay: true,
          viewDisplay: true,
          hide: true,
          search: false,
        },
        contactEmail: {
          label: '联系人邮箱',minWidth: 150,
          addDisplay: true,
          editDisplay: true,
          viewDisplay: true,
          hide: true,
          search: false,
        },
      }
    },
    {
      label: '地址信息',
      prop: 'dzxx',
      column:{
        mapLocationDetail: {
          label: '地图位置',minWidth: 150,
          addDisplay: true,
          editDisplay: true,span:24,
          viewDisplay: true,
          hide: true,
          search: false,
          type: 'map',
          // mapChange: async (params:any)=>{
          //   if (params.info === "OK") {
          //     console.log( params)
          //     let { province, city, district, township } = params.regeocode.addressComponent || {};
          //
          //     const res = await getAddressCode({province, city, district, township});
          //     const {provinceCode, cityCode, districtCode, townshipCode} = res.data || {};
          //
          //     form.value.regionLabel = province + " / " + city + " / " + district + " / " + township;
          //
          //     form.value.region = [provinceCode, cityCode, districtCode, townshipCode];
          //     form.value.provinceId = provinceCode;
          //     form.value.cityId = cityCode;
          //     form.value.districtId = districtCode;
          //     form.value.streetId = townshipCode;
          //
          //     form.value.dispatchTransportArea = params.regeocode.formattedAddress;
          //
          //   }
          // }
          change: async ({value}:any)=>{
            if (Array.isArray(value) && value.length === 3){
              mapRegeo(value[1], value[0]).then(async res => {
                let params = res.data || {};
                if (params.info === "OK") {
                  let {province, city, district, township} = params.regeocode.addressComponent || {};
                  const res = await getAddressCode({province, city, district, township});
                  const {provinceCode, cityCode, districtCode, townshipCode} = res.data || {};
                  form.value.regionLabel = province + " / " + city + " / " + district + " / " + township;
                  form.value.provinceId = provinceCode;
                  form.value.cityId = cityCode;
                  form.value.districtId = districtCode;
                  form.value.streetId = townshipCode;
                  form.value.dispatchTransportArea = params.regeocode.formatted_address || params.regeocode.formattedAddress;
                }
              });
            }
          },
        },
        dispatchTransportArea: {
          label: '调度单运输地',
          addDisplay: true,minWidth: 150,
          editDisplay: true,
          viewDisplay: true,
          hide: false,
          search: true,
          rules: [
            {
              required: true,
              message: "调度单运输地不能为空", trigger: "blur"
            }
          ],
        },
        electronicFenceRange: {
          label: '电子围栏范围',
          addDisplay: true,minWidth: 150,
          editDisplay: true,
          viewDisplay: true,append:'米',
          hide: false,
          search: true,
          rules: [
            {
              required: true,
              message: "电子围栏范围不能为空", trigger: "blur"
            }
          ],
        },
        // region: {
        //   label: '行政区域',minWidth: 150,type:'cascader',
        //   addDisplay: true,
        //   editDisplay: true,checkStrictly:true,
        //   viewDisplay: true,span: 24,checkOnClickNode:true,
        //   hide: true,
        //   search: false,
        //   lazy: true,
        //   props: {
        //     label: 'name',
        //     value: 'code'
        //   },
        //   rules: [
        //     {
        //       required: true,
        //       message: "行政区域不能为空", trigger: "blur"
        //     }
        //   ],
        //   change:({value=[]}:{value:any})=>{
        //     if (value && value.length>0){
        //       console.log( value)
        //       form.value.provinceId = value[0];
        //       form.value.cityId = value[1];
        //       form.value.districtId = value[2];
        //       form.value.streetId = value[3];
        //       const cascader = crudRef.value?.getPropRef?.('region')?.$refs?.temp;
        //       console.log('cascader.getCheckedNodes()',cascader)
        //       nextTick(()=>{
        //         crudRef.value.getPropRef('region').$refs.temp.$forceUpdate()
        //       })
        //       if (cascader.getCheckedNodes() && cascader.getCheckedNodes().length >0){
        //         form.value.regionLabel= cascader.getCheckedNodes()[0].text!;
        //       }
        //     }
        //   },
        //   lazyLoad (node:any, resolve:any) {
        //     const stopLevel = 3;
        //     const level = node.level;
        //     const data = node.data || {};
        //     const code = data.code;
        //     let list:any = [];
        //     const callback = () => {
        //
        //       resolve((list || []).map((ele:any) => ({
        //         ...ele,
        //         leaf: level >= stopLevel
        //       })));
        //     };
        //     console.log( level)
        //     if (level === 0) {
        //       getProvince().then(res => {
        //         list = res.data || [];
        //         callback();
        //       });
        //     } else if (level === 1) {
        //       getCity(code).then(res => {
        //         list = res.data ||[];
        //         callback();
        //       });
        //     } else if (level === 2) {
        //       getArea(code).then(res => {
        //         list = res.data ||  [];
        //         callback();
        //       });
        //     }else if (level === 3) {
        //       getStreet(code).then(res => {
        //         list = res.data || [];
        //         callback();
        //       });
        //     } else {
        //       callback();
        //     }
        //   }
        // },
      }
    },
    {
      label: '其他信息',
      prop: 'qtyxx',
      column:{
        status: {
          label: '状态',
          type: 'radio', dicUrl: '/system/dict/data/type/sys_normal_disable',dataType: 'string',
          addDisplay: false,
          editDisplay: false,
          viewDisplay: true,minWidth: 150,
          hide: false,
          search: true,
          rules: [
            {
              required: true,
              message: "状态不能为空", trigger: "blur"
            }
          ],
        },
        createBy: {
          label: '创建人',
          addDisplay: false,
          editDisplay: false,minWidth: 150,
          viewDisplay: true,
          hide: true,
          search: false,
        },
        createTime: {
          label: '创建时间',
          addDisplay: false,
          editDisplay: false,minWidth: 150,
          viewDisplay: true,
          hide: true,
          search: false,
          rules: [
            {
              required: true,
              message: "创建时间不能为空", trigger: "blur"
            }
          ],
        },
        updateBy: {
          label: '更新人',
          addDisplay: false,
          editDisplay: false,
          viewDisplay: true,minWidth: 150,
          hide: false,
          search: true,
        },
        updateTime: {
          label: '更新时间',
          addDisplay: false,
          editDisplay: false,minWidth: 180,
          viewDisplay: true,
          hide: false,
          search: true,
          rules: [
            {
              required: true,
              message: "更新时间不能为空", trigger: "blur"
            }
          ],
        },
        remark: {
          label: '备注',minWidth: 150,
          type: 'textarea', minRows: 3, maxRows: 5,
          addDisplay: true,
          editDisplay: true,span:24,
          viewDisplay: true,
          hide: true,
          search: false,
        },
      }
    }
  ],
  column: {
    consignorCode: {
      label: '收发货人编码',minWidth: 150,
      addDisplay: true,
      editDisplay: true,
      viewDisplay: true,
      label: '装卸货点编码',minWidth: 150,
      display: false,
      hide: false,
      search: true,
      rules: [
        {
          required: true,
          message: "收发货人编码不能为空", trigger: "blur"
        }
      ],
    },
    consignorName: {
      label: '收发货人名称',minWidth: 150,
      addDisplay: true,
      editDisplay: true,
      viewDisplay: true,
      label: '装卸货点名称',minWidth: 150,
      display: false,
      hide: false,
      search: true,
      rules: [
        {
          required: true,
          message: "收发货人名称不能为空", trigger: "blur"
        }
      ],
    },
    customerName:{
      label: '所属客户',minWidth: 150,
@@ -131,364 +532,48 @@
      hide: false,
      search: false,
    },
    customerId: {
      label: '所属客户',minWidth: 150,
      addDisplay: true,
      editDisplay: true,suffixIcon:'search',
      viewDisplay: true,
      hide: true,
      search: true,
      rules: [
        {
          required: true,
          message: "所属客户不能为空", trigger: "change"
        }
      ],
      type: 'table',
      children:{
        border: true,
        searchMenuSpan: 5,
        column:{
          customerType: {
            label: '客户类型', minWidth: 120,
            type: 'select', dataType: 'string', dicUrl: '/system/dict/data/type/customer_type',
            search: true,
          },
          customerShortName: {
            label: '客户简称', minWidth: 130,
            search: true,
          },
          customerCode: {
            label: '客户编号',minWidth: 120,
            search: true,
          },
          contactName: {
            label: '联系人姓名',minWidth: 120,
          },
          signCompany: {
            label: '签约公司', minWidth: 150,
          },
        },
      },
      props:{
        label: 'customerShortName',
        value: 'id'
      },
      onLoad: ({ page, value, data }: { page: any, value: any, data: any }, callback:any) => {
        if (value){
          let id = value;
          if (Array.isArray(value)){
            id = value[0]
          }
          getTmsCustomerInfo(id).then(res=>{
            return callback(res.data||{})
          })
        }else{
          listTmsCustomerInfo({pageSize:page.pageSize,pageNum:page.currentPage,...data}).then(res=>{
            return callback({
              total: res.total,
              data: res.rows||[],
            })
          })
        }
      }
    },
    customerSysCode: {
      label: '客户编码',minWidth: 150,
      addDisplay: true,
      editDisplay: true,
      viewDisplay: true,
      display: false,
      hide: false,
      search: true,
      disabled: true,
      rules: [
        {
          required: true,
          message: "客户编码不能为空", trigger: "blur"
        }
      ],
    },
    consignorType: {
      label: '收发货人类型',minWidth: 150,
      label: '装卸货点类型',minWidth: 150,
      type: 'select', dataType: 'string', dicUrl: '/system/dict/data/type/consignor_type',
      addDisplay: true,
      editDisplay: true,
      viewDisplay: true,
      display: false,
      hide: false,
      search: true,
      rules: [
        {
          required: true,
          message: "收发货人类型不能为空", trigger: "change"
        }
      ],
    },
    contactName: {
      label: '联系人姓名',minWidth: 150,
      addDisplay: true,
      editDisplay: true,
      viewDisplay: true,
      display: false,
      hide: false,
      search: true,
      rules: [
        {
          required: true,
          message: "联系人姓名不能为空", trigger: "blur"
        }
      ],
    },
    contactPhone: {
      label: '联系人电话',minWidth: 150,
      addDisplay: true,
      editDisplay: true,
      viewDisplay: true,
      hide: true,
      search: false,
    },
    contactEmail: {
      label: '联系人邮箱',minWidth: 150,
      addDisplay: true,
      editDisplay: true,
      viewDisplay: true,
      hide: true,
      search: false,
    },
    // countryId: {
    //   label: '国家',minWidth: 150,type:'select',
    //   addDisplay: true,
    //   editDisplay: true,
    //   viewDisplay: false,
    //   hide: true,
    //   search: false,
    //   rules: [
    //     {
    //       required: true,
    //       message: "国家不能为空", trigger: "blur"
    //     }
    //   ],
    // },
    region: {
      label: '行政区域',minWidth: 150,type:'cascader',
      addDisplay: true,
      editDisplay: true,
      viewDisplay: true,span: 24,
      hide: true,
      search: false,
      lazy: true,
      props: {
        label: 'name',
        value: 'code'
      },
      rules: [
        {
          required: true,
          message: "省份不能为空", trigger: "blur"
        }
      ],
      change:({value=[]}:{value:any})=>{
        if (value && value.length>0){
          form.value.provinceId = value[0];
          form.value.cityId = value[1];
          form.value.districtId = value[2];
          form.value.streetId = value[3];
        }
      },
      lazyLoad (node:any, resolve:any) {
        const stopLevel = 3;
        const level = node.level;
        const data = node.data || {};
        const code = data.code;
        let list:any = [];
        const callback = () => {
          resolve((list || []).map((ele:any) => ({
            ...ele,
            leaf: level >= stopLevel
          })));
        };
        if (level === 0) {
          getProvince().then(res => {
            list = res.data || [];
            callback();
          });
        } else if (level === 1) {
          getCity(code).then(res => {
            list = res.data ||[];
            callback();
          });
        } else if (level === 2) {
          getArea(code).then(res => {
            list = res.data ||  [];
            callback();
          });
        }else if (level === 3) {
          getStreet(code).then(res => {
            list = res.data || [];
            callback();
          });
        } else {
          callback();
        }
      }
    },
    // provinceId: {
    //   label: '省份',minWidth: 150,type:'select',
    //   addDisplay: true,
    //   editDisplay: true,
    //   viewDisplay: false,
    //   hide: true,
    //   search: false,
    //   rules: [
    //     {
    //       required: true,
    //       message: "省份不能为空", trigger: "blur"
    //     }
    //   ],
    // },
    // cityId: {
    //   label: '市',minWidth: 150,type:'select',
    //   addDisplay: true,
    //   editDisplay: true,
    //   viewDisplay: false,
    //   hide: true,
    //   search: false,
    //   rules: [
    //     {
    //       required: true,
    //       message: "市不能为空", trigger: "blur"
    //     }
    //   ],
    // },
    // districtId: {
    //   label: '区',minWidth: 150,type:'select',
    //   addDisplay: true,
    //   editDisplay: true,
    //   viewDisplay: false,
    //   hide: true,
    //   search: false,
    //   rules: [
    //     {
    //       required: true,
    //       message: "区不能为空", trigger: "blur"
    //     }
    //   ],
    // },
    // streetId: {
    //   label: '街道',minWidth: 150,type:'select',
    //   addDisplay: true,
    //   editDisplay: true,
    //   viewDisplay: false,
    //   hide: true,
    //   search: false,
    //   rules: [
    //     {
    //       required: true,
    //       message: "街道不能为空", trigger: "blur"
    //     }
    //   ],
    // },
    // addressDetail: {
    //   label: '详细地址',minWidth: 150,
    //   type: 'textarea', minRows: 3, maxRows: 5,
    //   addDisplay: true,span:24,
    //   editDisplay: true,
    //   viewDisplay: false,
    //   hide: true,
    //   search: false,
    // },
    mapLocationDetail: {
      label: '地图位置',minWidth: 150,
      addDisplay: true,
      editDisplay: true,span:24,
      viewDisplay: true,
      hide: true,
      search: false,
      type: 'map',
    },
    dispatchTransportArea: {
      label: '调度单运输地',
      addDisplay: true,minWidth: 150,
      editDisplay: true,
      viewDisplay: true,
      label: '调度单运输地',   display: false,minWidth: 150,
      hide: false,
      search: true,
      rules: [
        {
          required: true,
          message: "调度单运输地不能为空", trigger: "blur"
        }
      ],
    },
    status: {
      label: '状态',
      type: 'radio', dicUrl: '/system/dict/data/type/sys_normal_disable',dataType: 'string',
      addDisplay: false,
      editDisplay: false,
      viewDisplay: true,minWidth: 150,
      display: false,minWidth: 150,
      hide: false,
      search: true,
      rules: [
        {
          required: true,
          message: "状态不能为空", trigger: "blur"
        }
      ],
    },
    createBy: {
      label: '创建人',
      addDisplay: false,
      editDisplay: false,minWidth: 150,
      viewDisplay: true,
      hide: true,
      search: false,
    },
    createTime: {
      label: '创建时间',
      addDisplay: false,
      editDisplay: false,minWidth: 150,
      viewDisplay: true,
      hide: true,
      search: false,
      rules: [
        {
          required: true,
          message: "创建时间不能为空", trigger: "blur"
        }
      ],
    },
    updateBy: {
      label: '更新人',
      addDisplay: false,
      editDisplay: false,
      viewDisplay: true,minWidth: 150,
      label: '更新人', display: false,minWidth: 150,
      hide: false,
      search: true,
    },
    updateTime: {
      label: '更新时间',
      addDisplay: false,
      editDisplay: false,minWidth: 180,
      viewDisplay: true,
      display: false,minWidth: 180,
      hide: false,
      search: true,
      rules: [
        {
          required: true,
          message: "更新时间不能为空", trigger: "blur"
        }
      ],
    },
    remark: {
      label: '备注',minWidth: 150,
      type: 'textarea', minRows: 3, maxRows: 5,
      addDisplay: true,
      editDisplay: true,span:24,
      viewDisplay: true,
      hide: true,
      search: false,
    },
  }
})
@@ -530,22 +615,29 @@
  },
  rowSaveBegin:(row:any)=>{
    if (row.mapLocationDetail){
      row.mapLocation = row.mapLocationDetail[1]+','+row.mapLocationDetail[0];
      row.mapLocation = row.mapLocationDetail[0]+','+row.mapLocationDetail[1];
      row.addressDetail = row.mapLocationDetail[2]
    }
  },
  rowUpdateBegin:(row:any)=>{
    if (row.mapLocationDetail){
      row.mapLocation = row.mapLocationDetail[1]+','+row.mapLocationDetail[0];
      row.mapLocation = row.mapLocationDetail[0]+','+row.mapLocationDetail[1];
      row.addressDetail = row.mapLocationDetail[2]
    }
  },
  handleEndOpenFunc:()=>{
    form.value.region = [form.value.provinceId, form.value.cityId,
      form.value.districtId, form.value.streetId];
    if (form.value.mapLocation && form.value.addressDetail){
      form.value.mapLocationDetail = [...form.value.mapLocation.split(','), form.value.addressDetail];
  handleEndOpenFunc:  ()=>{
    if (form.value.mapLocation && form.value.addressDetail) {
      form.value.mapLocationDetail = [...form.value.mapLocation.split(',').map(item=> Number(item)), form.value.addressDetail];
      crudRef.value.getPropRef('mapLocationDetail').$refs.temp.text = form.value.mapLocationDetail;
    }
    // nextTick(()=>{
    //   crudRef.value.getPropRef('region').$refs.temp.$forceUpdate()
    // })
    console.log( )
     // crudRef.value.getPropRef('region').$refs.temp.setCheckedKeys(form.value.region);
  },
  handleBeforeOpenFunc:(type:string)=>{
    if (type=='add'){
@@ -553,27 +645,6 @@
    }
  }
})
onMounted(() => {
  watch(() => form.value.customerId, () => {
      if (!form.value.customerId){
        return;
      }
      const table = crudRef.value?.getPropRef?.('customerId')?.$refs?.temp;
      if (!table) return;
      let active = table.active;
      if (Array.isArray(active)) active = active[0];
      if (active) {
        Object.assign(form.value, {
          customerId: active.id,
          customerSysCode: active.customerCode,
          customerName: active.customerShortName,
        });
      }
  });
});
</script>