1、大量页面调整

2、完善运力模块
3、完善规范、需求卡

src/api/base/common-address.js

@@ -39,14 +39,3 @@ export const remove = ids => {
     },
   });
 };
-
-export const getSourceOptions = (addressType, keyword) => {
-  return request({
-    url: '/blade-transport/common-address/source-options',
-    method: 'get',
-    params: {
-      addressType,
-      keyword,
-    },
-  });
-};

src/components/image-upload-field/main.vue

@@ -0,0 +1,89 @@
+<template>
+  <el-form-item v-if="mode === 'form'" :label="label" :prop="prop">
+    <el-upload
+      :class="[`${classPrefix}-uploader`, { [`${classPrefix}-uploader--large`]: large }]"
+      action="/api/blade-resource/oss/endpoint/put-file"
+      name="file"
+      :headers="headers"
+      :show-file-list="false"
+      :disabled="readonly"
+      :before-upload="beforeUpload"
+      :on-success="handleSuccess"
+    >
+      <img v-if="value" :src="value" :class="`${classPrefix}-uploader__image`" />
+      <div v-else :class="`${classPrefix}-uploader__empty`">{{ emptyText }}</div>
+    </el-upload>
+  </el-form-item>
+  <el-form-item v-else :prop="prop" :class="`${classPrefix}-upload-item`">
+    <div :class="[`${classPrefix}-upload-card`, { [`${classPrefix}-upload-card--large`]: large }]">
+      <div v-if="label" :class="`${classPrefix}-upload-card__head`">
+        <span :class="`${classPrefix}-upload-card__label`">{{ label }}</span>
+        <span :class="`${classPrefix}-upload-card__action`">{{ actionText }}</span>
+      </div>
+      <el-upload
+        :class="`${classPrefix}-upload-card__uploader`"
+        action="/api/blade-resource/oss/endpoint/put-file"
+        name="file"
+        :headers="headers"
+        :show-file-list="false"
+        :disabled="readonly"
+        :before-upload="beforeUpload"
+        :on-success="handleSuccess"
+      >
+        <img v-if="value" :src="value" :class="`${classPrefix}-upload-card__image`" />
+        <div v-else :class="`${classPrefix}-upload-card__empty`">{{ emptyText }}</div>
+      </el-upload>
+    </div>
+  </el-form-item>
+</template>
+
+<script>
+export default {
+  name: 'ImageUploadField',
+  props: {
+    label: String,
+    prop: String,
+    value: String,
+    readonly: Boolean,
+    headers: Object,
+    large: Boolean,
+    mode: {
+      type: String,
+      default: 'form',
+    },
+    classPrefix: {
+      type: String,
+      default: 'driver',
+    },
+    emptyText: {
+      type: String,
+      default: '上传证件图片',
+    },
+    actionText: {
+      type: String,
+      default: '点击上传',
+    },
+  },
+  emits: ['success'],
+  methods: {
+    handleSuccess(res) {
+      if (res.code === 200 && res.data) {
+        this.$emit('success', res.data.link || res.data.url || res.data.domain || '');
+      } else {
+        this.$message.error(res.msg || '上传失败');
+      }
+    },
+    beforeUpload(file) {
+      const validType = ['image/jpeg', 'image/png', 'image/jpg', 'image/bmp'].includes(file.type);
+      const validSize = file.size / 1024 / 1024 < 5;
+      if (!validType) {
+        this.$message.error('仅支持 JPG、PNG、BMP 图片');
+      }
+      if (!validSize) {
+        this.$message.error('图片大小不能超过 5MB');
+      }
+      return validType && validSize;
+    },
+  },
+};
+</script>

src/main.js

@@ -78,7 +78,7 @@ app.use(Avue, {
   calcHeight: 10,
   crudOption: {
     searchIcon: true,
-    searchIndex: 8,
+    searchIndex: 4,
     searchLabelWidth: 160,
     searchMenuSpan: 24,
     searchMenuPosition: 'right',

src/option/base/cargo-type.js

@@ -34,10 +34,10 @@ export const getCargoTypeOption = ctx => ({
   saveBtnText: '提交',
   updateBtnText: '提交',
   searchShow: true,
-  searchIcon: false,
+  searchIcon: true,
   searchLabelWidth: 50,
   searchMenuSpan: 10,
-  searchIndex: 8,
+  searchIndex: 4,
   searchMenuPosition: 'right',
   border: true,
   index: true,
@@ -71,7 +71,7 @@ export const getCargoTypeOption = ctx => ({
       formslot: true,
       hide: true,
       display: false,
-      span: 24,
+      span: 12,
       rules: [{ required: true, message: '请选择上级货物类型', trigger: 'change' }],
     },
     {
@@ -85,7 +85,7 @@ export const getCargoTypeOption = ctx => ({
       minWidth: 160,
     },
     {
-      label: '上级货物类型编码',
+      label: '上级货物编码',
       prop: 'parentCargoCode',
       slot: true,
       readonly: true,
@@ -93,6 +93,7 @@ export const getCargoTypeOption = ctx => ({
       addDisplay: false,
       editDisplay: false,
       display: false,
+      span: 12,
       minWidth: 160,
       rules: [{ required: true, message: '请选择上级货物类型', trigger: 'change' }],
     },

src/option/base/common-address.js

@@ -5,15 +5,17 @@ export const addressTypeOptions = [
   { label: '空港机场', value: '空港机场' },
 ];
 
-export const createOption = ({ validateLongitude, validateLatitude }) => ({
+export const createOption = () => ({
   height: 'auto',
   calcHeight: 32,
   dialogWidth: 980,
+  labelPosition: 'right',
+  labelWidth: 'auto',
   tip: false,
   searchShow: true,
   searchMenuSpan: 24,
   searchIcon: true,
-  searchIndex: 8,
+  searchIndex: 4,
   searchMenuPosition: 'right',
   border: true,
   index: true,
@@ -27,12 +29,64 @@ export const createOption = ({ validateLongitude, validateLatitude }) => ({
   dialogClickModal: false,
   menuWidth: 180,
   column: [
+    {
+      label: '类型',
+      prop: 'addressType',
+      type: 'select',
+      formslot: true,
+      search: true,
+      span: 24,
+      dicData: addressTypeOptions,
+      rules: [{ required: true, message: '请选择类型', trigger: 'change' }],
+    },
+    {
+      label: '港口',
+      prop: 'portId',
+      formslot: true,
+      hide: true,
+      display: false,
+      span: 12,
+      rules: [{ required: true, message: '请选择港口', trigger: 'change' }],
+    },
+    {
+      label: '码头',
+      prop: 'terminalId',
+      formslot: true,
+      hide: true,
+      display: false,
+      span: 12,
+      rules: [{ required: true, message: '请选择码头', trigger: 'change' }],
+    },
+    {
+      label: '车站名称',
+      prop: 'stationId',
+      formslot: true,
+      hide: true,
+      display: false,
+      span: 24,
+      rules: [{ required: true, message: '请选择车站名称', trigger: 'change' }],
+    },
+    {
+      label: '机场标准名称',
+      prop: 'airportId',
+      formslot: true,
+      hide: true,
+      display: false,
+      span: 24,
+      rules: [{ required: true, message: '请选择机场标准名称', trigger: 'change' }],
+    },
     {
       label: '地址名称',
       prop: 'addressName',
       search: true,
+      span: 24,
       minWidth: 150,
-      rules: [{ required: true, message: '请输入地址名称', trigger: 'blur' }],
+      maxlength: 100,
+      showWordLimit: true,
+      rules: [
+        { required: true, message: '请输入地址名称', trigger: 'blur' },
+        { max: 100, message: '地址名称不能超过100个字', trigger: 'blur' },
+      ],
     },
     {
       label: '地址编号',
@@ -41,21 +95,6 @@ export const createOption = ({ validateLongitude, validateLatitude }) => ({
       addDisplay: false,
       editDisplay: false,
     },
-    {
-      label: '类型',
-      prop: 'addressType',
-      type: 'select',
-      search: true,
-      dicData: addressTypeOptions,
-      rules: [{ required: true, message: '请选择类型', trigger: 'change' }],
-    },
-    {
-      label: '来源主数据',
-      prop: 'sourceId',
-      formslot: true,
-      hide: true,
-      span: 24,
-    },
     {
       label: '站点编码',
       prop: 'siteCodeDisplay',
@@ -72,6 +111,14 @@ export const createOption = ({ validateLongitude, validateLatitude }) => ({
       addDisplay: false,
       editDisplay: false,
     },
+    {
+      label: '行政区划',
+      prop: 'regionName',
+      search: true,
+      display: false,
+      minWidth: 150,
+      rules: [{ required: true, message: '请选择行政区划', trigger: 'change' }],
+    },
     {
       label: '详细地址',
       prop: 'detailAddress',
@@ -81,28 +128,10 @@ export const createOption = ({ validateLongitude, validateLatitude }) => ({
       minRows: 3,
       span: 24,
       minWidth: 220,
-      rules: [{ required: true, message: '请输入详细地址', trigger: 'blur' }],
-    },
-    {
-      label: '经度',
-      prop: 'longitude',
-      formslot: true,
-      minWidth: 120,
-      rules: [{ validator: validateLongitude, trigger: 'blur' }],
-    },
-    {
-      label: '纬度',
-      prop: 'latitude',
-      formslot: true,
-      minWidth: 120,
-      rules: [{ validator: validateLatitude, trigger: 'blur' }],
-    },
-    {
-      label: '行政区划',
-      prop: 'regionName',
-      search: true,
-      minWidth: 150,
-      rules: [{ required: true, message: '请输入行政区划', trigger: 'blur' }],
+      rules: [
+        { required: true, message: '请输入详细地址', trigger: 'blur' },
+        { max: 255, message: '详细地址不能超过255个字', trigger: 'blur' },
+      ],
     },
     {
       label: '组织',
@@ -125,12 +154,16 @@ export const createOption = ({ validateLongitude, validateLatitude }) => ({
       prop: 'contactName',
       search: true,
       minWidth: 110,
+      maxlength: 50,
+      rules: [{ max: 50, message: '联系人不能超过50个字', trigger: 'blur' }],
     },
     {
       label: '联系方式',
       prop: 'contactPhone',
       search: true,
       minWidth: 130,
+      maxlength: 20,
+      rules: [{ max: 20, message: '联系方式不能超过20个字', trigger: 'blur' }],
     },
     {
       label: '备注',

src/option/business/common-cargo.js

@@ -1,10 +1,8 @@
 import {
   auditColumns,
   createCrudOption,
-  nonNegativeRule,
   packageOptions,
   priceUnitOptions,
-  selectRule,
   textRule,
 } from './common';
 
@@ -15,67 +13,81 @@ export const config = {
   exportName: '常用货物',
   importUrl: '/blade-transport/common-cargo/import-common-cargo',
   templateUrl: '/blade-transport/common-cargo/export-template',
-  enableAllDept: true,
+  enableAllDept: false,
 };
 
 export const option = createCrudOption([
-  {
-    label: '组织',
-    prop: 'deptName',
-    search: true,
-    minWidth: 150,
-    addDisplay: false,
-    editDisplay: false,
-  },
   {
     label: '一级货物类型',
     prop: 'firstCargoTypeName',
+    formslot: true,
     search: true,
+    searchOrder: 3,
     minWidth: 150,
     editDisabled: true,
-    rules: textRule('一级货物类型', 100, true),
+    rules: [{ required: true, message: '请选择一级货物类型', trigger: 'change' }],
   },
   {
     label: '一级货物类型编码',
     prop: 'firstCargoTypeCode',
     hide: true,
+    display: false,
+    addDisplay: false,
     editDisabled: true,
   },
   {
     label: '二级货物类型',
     prop: 'secondCargoTypeName',
+    formslot: true,
     search: true,
+    searchOrder: 4,
     minWidth: 150,
     editDisabled: true,
-    rules: textRule('二级货物类型', 100, true),
+    rules: [{ required: true, message: '请选择二级货物类型', trigger: 'change' }],
   },
   {
     label: '二级货物类型编码',
     prop: 'secondCargoTypeCode',
-    search: true,
-    minWidth: 150,
+    hide: true,
+    display: false,
+    addDisplay: false,
     editDisabled: true,
-    rules: textRule('二级货物类型编码', 20, true),
   },
   {
     label: '货物名称',
     prop: 'cargoName',
     search: true,
+    searchOrder: 1,
     minWidth: 150,
     rules: textRule('货物名称', 100, true),
   },
   {
     label: '货物编号',
     prop: 'cargoCode',
+    formslot: true,
     search: true,
+    searchOrder: 2,
     minWidth: 120,
-    editDisabled: true,
-    rules: textRule('货物编号', 20, true),
+    maxlength: 20,
+    showWordLimit: true,
+    rules: [
+      { required: true, message: '请输入货物编号', trigger: 'blur' },
+      { max: 20, message: '货物编号不能超过20个字符', trigger: 'blur' },
+    ],
+  },
+  {
+    label: '组织',
+    prop: 'deptName',
+    search: true,
+    searchOrder: 5,
+    minWidth: 150,
+    addDisplay: false,
+    editDisplay: false,
   },
   {
     label: '品牌',
     prop: 'brand',
-    search: true,
+    search: false,
     minWidth: 120,
     rules: textRule('品牌', 50),
   },
@@ -89,11 +101,32 @@ export const option = createCrudOption([
   {
     label: '货值',
     prop: 'cargoValue',
-    type: 'number',
-    precision: 2,
-    min: 0,
+    formslot: true,
+    minWidth: 120,
+    rules: [
+      {
+        validator: (rule, value, callback) => {
+          if (value === undefined || value === null || value === '') {
+            callback();
+            return;
+          }
+          if (!/^\d+(\.\d{1,2})?$/.test(String(value))) {
+            callback(new Error('货值只能输入数字，最多保留2位小数'));
+            return;
+          }
+          callback();
+        },
+        trigger: 'blur',
+      },
+    ],
+  },
+  {
+    label: '计价单位',
+    prop: 'priceUnit',
+    type: 'select',
+    dicData: priceUnitOptions,
+    display: false,
     minWidth: 120,
-    rules: [nonNegativeRule('货值')],
   },
   {
     label: '规格',
@@ -101,13 +134,6 @@ export const option = createCrudOption([
     minWidth: 120,
     rules: textRule('规格', 50),
   },
-  {
-    label: '计价单位',
-    prop: 'priceUnit',
-    type: 'select',
-    dicData: priceUnitOptions,
-    minWidth: 120,
-  },
   {
     label: '型号',
     prop: 'model',
@@ -115,22 +141,10 @@ export const option = createCrudOption([
     rules: textRule('型号', 50),
   },
   {
-    label: '说明1',
+    label: '说明',
     prop: 'descriptionOne',
     minWidth: 160,
-    rules: textRule('说明1', 100),
-  },
-  {
-    label: '尺寸',
-    prop: 'sizeText',
-    minWidth: 120,
-    rules: textRule('尺寸', 50),
-  },
-  {
-    label: '说明2',
-    prop: 'descriptionTwo',
-    minWidth: 160,
-    rules: textRule('说明2', 100),
+    rules: textRule('说明', 100),
   },
   {
     label: '数据来源',

src/option/business/common-route.js

@@ -5,44 +5,44 @@ export const config = {
   permission: 'common_route',
   exportUrl: '/blade-transport/common-route/export-common-route',
   exportName: '常用线路',
-  enableAllDept: true,
+  enableAllDept: false,
 };
 
 export const option = createCrudOption([
   {
-    label: '组织',
-    prop: 'deptName',
+    label: '线路名称',
+    prop: 'routeName',
     search: true,
+    searchOrder: 1,
+    span: 24,
     minWidth: 150,
-    addDisplay: false,
-    editDisplay: false,
+    rules: textRule('线路名称', 100, true),
   },
   {
     label: '线路编号',
     prop: 'routeCode',
     search: true,
+    searchOrder: 2,
     minWidth: 120,
     addDisplay: false,
     editDisabled: true,
   },
-  {
-    label: '线路名称',
-    prop: 'routeName',
-    search: true,
-    minWidth: 150,
-    rules: textRule('线路名称', 100, true),
-  },
   {
     label: '发货地',
     prop: 'departureName',
     search: true,
+    searchOrder: 3,
     minWidth: 140,
-    rules: textRule('发货地', 100, true),
+    addDisplay: false,
+    editDisplay: false,
   },
   {
     label: '发货地址',
     prop: 'departureAddress',
+    formslot: true,
     search: true,
+    searchOrder: 4,
+    span: 24,
     minWidth: 220,
     rules: textRule('发货地址', 255, true),
   },
@@ -78,13 +78,18 @@ export const option = createCrudOption([
     label: '收货地',
     prop: 'arrivalName',
     search: true,
+    searchOrder: 5,
     minWidth: 140,
-    rules: textRule('收货地', 100, true),
+    addDisplay: false,
+    editDisplay: false,
   },
   {
     label: '收货地址',
     prop: 'arrivalAddress',
+    formslot: true,
     search: true,
+    searchOrder: 6,
+    span: 24,
     minWidth: 220,
     rules: textRule('收货地址', 255, true),
   },
@@ -116,6 +121,15 @@ export const option = createCrudOption([
     minWidth: 140,
     rules: [phoneRule('收货联系方式'), ...textRule('收货联系方式', 50)],
   },
+  {
+    label: '组织',
+    prop: 'deptName',
+    search: true,
+    searchOrder: 7,
+    minWidth: 150,
+    addDisplay: false,
+    editDisplay: false,
+  },
   {
     label: '备注',
     prop: 'remark',

src/option/business/common.js

@@ -156,7 +156,9 @@ export const textRule = (label, max, required = false) => {
   return rules;
 };
 
-export const selectRule = label => [{ required: true, message: `请选择${label}`, trigger: 'change' }];
+export const selectRule = label => [
+  { required: true, message: `请选择${label}`, trigger: 'change' },
+];
 
 export const nonNegativeRule = label => ({
   validator: (rule, value, callback) => {
@@ -189,7 +191,7 @@ export const createCrudOption = columns => ({
   searchShow: true,
   searchMenuSpan: 24,
   searchIcon: true,
-  searchIndex: 8,
+  searchIndex: 4,
   searchMenuPosition: 'right',
   border: true,
   index: true,

src/option/business/process-config.js

@@ -1,103 +1,147 @@
-import { auditColumns, createCrudOption, nodeOptions, processStatusOptions, selectRule, textRule } from './common';
+import {
+  auditColumns,
+  createCrudOption,
+  nodeOptions,
+  processStatusOptions,
+  selectRule,
+  textRule,
+} from './common';
 
 export const config = {
   title: '过程配置',
   permission: 'process_config',
   exportUrl: '/blade-transport/process-config/export-process-config',
   exportName: '过程配置',
-  enableAllDept: true,
+  enableAllDept: false,
   actions: ['copy', 'enable', 'disable'],
   statusProp: 'status',
   statusTextProp: 'statusName',
   deleteStatus: [0, 2],
 };
 
-export const option = createCrudOption([
-  {
-    label: '配置编号',
-    prop: 'configCode',
-    search: true,
-    minWidth: 130,
-    addDisplay: false,
-    editDisabled: true,
-  },
-  {
-    label: '配置名称',
-    prop: 'configName',
-    search: true,
-    minWidth: 150,
-    rules: textRule('配置名称', 100, true),
-  },
-  {
-    label: '项目ID集合',
-    prop: 'projectIds',
-    hide: true,
-    rules: textRule('项目ID集合', 1000, true),
-  },
-  {
-    label: '项目',
-    prop: 'projectNames',
-    search: true,
-    type: 'textarea',
-    minRows: 2,
-    minWidth: 180,
-    rules: textRule('项目', 1000, true),
-  },
-  {
-    label: '包含过程节点',
-    prop: 'includedNodes',
-    search: true,
-    type: 'select',
-    multiple: true,
-    dicData: nodeOptions,
-    minWidth: 180,
-    rules: selectRule('包含过程节点'),
-  },
-  {
-    label: '默认完成运输天数',
-    prop: 'defaultFinishDays',
-    type: 'number',
-    min: 1,
-    max: 999,
-    minWidth: 150,
-  },
-  {
-    label: '状态',
-    prop: 'status',
-    type: 'select',
-    search: true,
-    dicData: processStatusOptions,
-    slot: true,
-    minWidth: 100,
-    addDisplay: false,
-    editDisplay: false,
-  },
-  {
-    label: '所属组织',
-    prop: 'deptName',
-    search: true,
-    minWidth: 150,
-    addDisplay: false,
-    editDisplay: false,
-  },
-  {
-    label: '节点配置JSON',
-    prop: 'nodeConfigJson',
-    type: 'textarea',
-    minRows: 6,
-    span: 24,
-    hide: true,
-  },
-  {
-    label: '备注',
-    prop: 'remark',
-    type: 'textarea',
-    minRows: 4,
-    span: 24,
-    hide: true,
-    maxlength: 500,
-    showWordLimit: true,
-    rules: textRule('备注', 500),
-  },
-  ...auditColumns,
-]);
+export const option = {
+  ...createCrudOption([
+    {
+      label: '',
+      prop: 'basicInfo',
+      formslot: true,
+      span: 24,
+      hide: true,
+    },
+    {
+      label: '配置编号',
+      prop: 'configCode',
+      search: true,
+      searchOrder: 4,
+      minWidth: 130,
+      addDisplay: false,
+      editDisplay: false,
+      editDisabled: true,
+    },
+    {
+      label: '配置名称',
+      prop: 'configName',
+      search: true,
+      searchOrder: 6,
+      span: 12,
+      minWidth: 150,
+      addDisplay: false,
+      editDisplay: false,
+      rules: textRule('配置名称', 100, true),
+    },
+    {
+      label: '项目ID集合',
+      prop: 'projectIds',
+      hide: true,
+      display: false,
+      addDisplay: false,
+      editDisplay: false,
+      rules: textRule('项目ID集合', 1000, true),
+    },
+    {
+      label: '项目',
+      prop: 'projectNames',
+      formslot: true,
+      search: true,
+      searchOrder: 5,
+      searchType: 'select',
+      type: 'textarea',
+      minRows: 2,
+      span: 12,
+      minWidth: 180,
+      dicData: [],
+      filterable: true,
+      addDisplay: false,
+      editDisplay: false,
+      rules: textRule('项目', 1000, true),
+    },
+    {
+      label: '包含过程节点',
+      prop: 'includedNodes',
+      search: true,
+      searchOrder: 3,
+      type: 'select',
+      multiple: true,
+      dicData: nodeOptions,
+      minWidth: 180,
+      rules: selectRule('包含过程节点'),
+    },
+    {
+      label: '默认完成运输天数',
+      prop: 'defaultFinishDays',
+      formslot: true,
+      type: 'number',
+      min: 1,
+      max: 999,
+      span: 12,
+      minWidth: 150,
+      addDisplay: false,
+      editDisplay: false,
+    },
+    {
+      label: '状态',
+      prop: 'status',
+      type: 'select',
+      search: true,
+      searchOrder: 1,
+      dicData: processStatusOptions,
+      slot: true,
+      minWidth: 100,
+      addDisplay: false,
+      editDisplay: false,
+    },
+    {
+      label: '组织',
+      prop: 'deptName',
+      search: true,
+      searchOrder: 2,
+      minWidth: 150,
+      addDisplay: false,
+      editDisplay: false,
+    },
+    {
+      label: '',
+      prop: 'nodeConfigJson',
+      formslot: true,
+      span: 24,
+      hide: true,
+    },
+    {
+      label: '备注',
+      prop: 'remark',
+      type: 'textarea',
+      minRows: 4,
+      span: 24,
+      hide: true,
+      addDisplay: false,
+      editDisplay: false,
+      maxlength: 500,
+      showWordLimit: true,
+      rules: textRule('备注', 500),
+    },
+    ...auditColumns,
+  ]),
+  dialogTop: '10px',
+  dialogWidth: '96%',
+  searchSpan: 8,
+};

src/option/transportCapacity/driver.js

@@ -5,7 +5,7 @@ export const option = {
   searchShow: true,
   searchMenuSpan: 24,
   searchIcon: true,
-  searchIndex: 8,
+  searchIndex: 4,
   searchMenuPosition: 'right',
   border: true,
   index: true,
@@ -21,76 +21,61 @@ export const option = {
       label: '姓名',
       prop: 'driverName',
       search: true,
+      searchOrder: 7,
       slot: true,
       width: 110,
     },
     {
-      label: '身份证号',
-      prop: 'idCardNo',
-      search: true,
-      width: 190,
-    },
-    {
-      label: '手机号码',
+      label: '手机号',
       prop: 'mobile',
       search: true,
+      searchOrder: 6,
       width: 130,
     },
-    {
-      label: '性别',
-      prop: 'gender',
-      width: 80,
-      align: 'center',
-    },
-    {
-      label: '司机类型',
-      prop: 'driverType',
-      search: true,
-      type: 'select',
-      dicData: [
-        {
-          label: '自有',
-          value: '自有',
-        },
-        {
-          label: '外协',
-          value: '外协',
-        },
-      ],
-      width: 100,
-      align: 'center',
-    },
-    {
-      label: '岗位',
-      prop: 'posts',
-      width: 150,
-    },
     {
       label: '准驾车型',
       prop: 'drivingType',
       search: true,
+      searchOrder: 5,
+      hide: true,
+      type: 'select',
+      dicData: [
+        {
+          label: 'A1',
+          value: 'A1',
+        },
+        {
+          label: 'A2',
+          value: 'A2',
+        },
+        {
+          label: 'A3',
+          value: 'A3',
+        },
+        {
+          label: 'B1',
+          value: 'B1',
+        },
+        {
+          label: 'B2',
+          value: 'B2',
+        },
+        {
+          label: 'C1',
+          value: 'C1',
+        },
+        {
+          label: 'C2',
+          value: 'C2',
+        },
+      ],
       width: 110,
     },
-    {
-      label: '所属组织',
-      prop: 'organizationName',
-      type: 'cascader',
-      search: true,
-      emitPath: false,
-      checkStrictly: true,
-      filterable: true,
-      dicData: [],
-      props: {
-        label: 'label',
-        value: 'value',
-        children: 'children',
-      },
-      width: 140,
-    },
     {
       label: '状态',
       prop: 'status',
       search: true,
+      searchOrder: 4,
       type: 'select',
       slot: true,
       dicData: [
@@ -106,6 +91,53 @@ export const option = {
       width: 90,
       align: 'center',
     },
+    {
+      label: '司机类型',
+      prop: 'driverType',
+      search: true,
+      searchOrder: 3,
+      type: 'select',
+      dicData: [
+        {
+          label: '自有员工',
+          value: '自有',
+        },
+        {
+          label: '外协',
+          value: '外协',
+        },
+      ],
+      width: 100,
+      align: 'center',
+    },
+    {
+      label: '身份证号',
+      prop: 'idCardNo',
+      search: true,
+      searchOrder: 2,
+      width: 190,
+    },
+    {
+      label: '所属组织',
+      prop: 'organizationName',
+      search: true,
+      searchOrder: 1,
+      type: 'select',
+      filterable: true,
+      dicData: [],
+      width: 140,
+    },
+    {
+      label: '性别',
+      prop: 'gender',
+      width: 80,
+      align: 'center',
+    },
+    {
+      label: '岗位',
+      prop: 'posts',
+      width: 150,
+    },
     {
       label: '驾驶认证',
       prop: 'drivingLicenseEndDate',

src/option/transportCapacity/transport-ship.js

@@ -5,7 +5,7 @@ export const option = {
   searchShow: true,
   searchMenuSpan: 24,
   searchIcon: true,
-  searchIndex: 8,
+  searchIndex: 4,
   searchMenuPosition: 'right',
   border: true,
   index: true,
@@ -17,29 +17,49 @@ export const option = {
   menuWidth: 210,
   dialogClickModal: false,
   column: [
-    { label: '船舶名', prop: 'shipName', search: true, slot: true, width: 130 },
-    { label: '船舶识别号', prop: 'shipIdentifierNo', search: true, width: 140 },
-    { label: '所属组织', prop: 'organizationName', search: true, width: 160 },
-    { label: '船检登记号', prop: 'shipInspectionNo', search: true, width: 130 },
+    { label: '船舶名', prop: 'shipName', search: true, searchOrder: 5, slot: true, width: 130 },
+    {
+      label: '船舶识别号',
+      prop: 'shipIdentifierNo',
+      search: true,
+      searchOrder: 4,
+      width: 140,
+    },
+    {
+      label: '船检登记号',
+      prop: 'shipInspectionNo',
+      search: true,
+      searchOrder: 3,
+      width: 130,
+    },
     {
       label: '船舶类型',
       prop: 'shipType',
       search: true,
+      searchOrder: 2,
       type: 'select',
       dicData: [
-        { label: '干货船', value: '干货船' },
-        { label: '集装箱船', value: '集装箱船' },
         { label: '散货船', value: '散货船' },
+        { label: '集装箱船', value: '集装箱船' },
+        { label: '杂货船', value: '杂货船' },
         { label: '油船', value: '油船' },
-        { label: '拖轮', value: '拖轮' },
       ],
       width: 110,
       align: 'center',
     },
+    {
+      label: '所属组织',
+      prop: 'organizationName',
+      search: true,
+      searchOrder: 1,
+      type: 'select',
+      filterable: true,
+      dicData: [],
+      width: 160,
+    },
     {
       label: '状态',
       prop: 'status',
-      search: true,
       type: 'select',
       slot: true,
       dicData: [
@@ -49,7 +69,13 @@ export const option = {
       width: 90,
       align: 'center',
     },
-    { label: '国籍证有效期至', prop: 'nationalityCertEndDate', slot: true, width: 150, align: 'center' },
+    {
+      label: '国籍证有效期至',
+      prop: 'nationalityCertEndDate',
+      slot: true,
+      width: 150,
+      align: 'center',
+    },
     {
       label: '最低安全配员证书有效期至',
       prop: 'safeManningCertEndDate',

src/option/transportCapacity/transport-vehicle.js

@@ -5,7 +5,7 @@ export const option = {
   searchShow: true,
   searchMenuSpan: 24,
   searchIcon: true,
-  searchIndex: 8,
+  searchIndex: 4,
   searchMenuPosition: 'right',
   border: true,
   index: true,
@@ -21,6 +21,7 @@ export const option = {
       label: '车牌号',
       prop: 'plateNo',
       search: true,
+      searchOrder: 5,
       slot: true,
       width: 120,
     },
@@ -28,46 +29,41 @@ export const option = {
       label: '所属组织',
       prop: 'organizationName',
       search: true,
-      width: 150,
-    },
-    {
-      label: '车辆类型',
-      prop: 'vehicleType',
-      search: true,
+      searchOrder: 1,
       type: 'select',
-      dicData: [
-        { label: '厢式', value: '厢式' },
-        { label: '高栏', value: '高栏' },
-        { label: '平板', value: '平板' },
-        { label: '仓栅', value: '仓栅' },
-        { label: '牵引车', value: '牵引车' },
-      ],
-      width: 110,
-      align: 'center',
+      filterable: true,
+      dicData: [],
+      width: 150,
     },
     {
       label: '业务关系',
       prop: 'businessRelation',
       search: true,
+      searchOrder: 4,
       type: 'select',
       dicData: [
+        { label: '全部', value: '' },
         { label: '自有', value: '自有' },
-        { label: '业务合作', value: '业务合作' },
         { label: '管理挂靠', value: '管理挂靠' },
+        { label: '业务合作', value: '业务合作' },
       ],
       width: 120,
       align: 'center',
     },
     {
-      label: '能源类型',
-      prop: 'energyType',
+      label: '车辆类型',
+      prop: 'vehicleType',
       search: true,
+      searchOrder: 3,
       type: 'select',
       dicData: [
-        { label: '柴油', value: '柴油' },
-        { label: '汽油', value: '汽油' },
-        { label: '新能源', value: '新能源' },
-        { label: '天然气', value: '天然气' },
+        { label: '全部', value: '' },
+        { label: '高栏车', value: '高栏' },
+        { label: '低栏车', value: '低栏' },
+        { label: '平板车', value: '平板' },
+        { label: '厢式车', value: '厢式' },
+        { label: '拖挂车', value: '拖挂' },
+        { label: '半挂车', value: '半挂' },
       ],
       width: 110,
       align: 'center',
@@ -79,9 +75,10 @@ export const option = {
       align: 'right',
     },
     {
-      label: '状态',
+      label: '车辆状态',
       prop: 'status',
       search: true,
+      searchOrder: 2,
       type: 'select',
       slot: true,
       dicData: [

src/option/vehicle/accident-record.js

@@ -45,7 +45,7 @@ export const option = {
   searchShow: true,
   searchMenuSpan: 24,
   searchIcon: true,
-  searchIndex: 8,
+  searchIndex: 4,
   searchMenuPosition: 'right',
   border: true,
   index: true,
@@ -211,22 +211,13 @@ export const option = {
       minWidth: 170,
     },
     {
-      label: '创建开始时间',
-      prop: 'createTimeStart',
+      label: '创建时间',
+      prop: 'createTimeRange',
       type: 'date',
-      format: 'YYYY-MM-DD 00:00:00',
-      valueFormat: 'YYYY-MM-DD 00:00:00',
-      hide: true,
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-    },
-    {
-      label: '创建结束时间',
-      prop: 'createTimeEnd',
-      type: 'date',
-      format: 'YYYY-MM-DD 23:59:59',
-      valueFormat: 'YYYY-MM-DD 23:59:59',
+      format: 'YYYY-MM-DD',
+      valueFormat: 'YYYY-MM-DD',
+      searchRange: true,
+      search: true,
       hide: true,
       addDisplay: false,
       editDisplay: false,

src/option/vehicle/annual-inspection-record.js

@@ -44,7 +44,7 @@ export const option = {
   searchShow: true,
   searchMenuSpan: 24,
   searchIcon: true,
-  searchIndex: 8,
+  searchIndex: 4,
   searchMenuPosition: 'right',
   border: true,
   index: true,
@@ -215,22 +215,11 @@ export const option = {
       minWidth: 170,
     },
     {
-      label: '创建开始时间',
-      prop: 'createTimeStart',
+      label: '创建时间',
+      prop: 'createTimeRange',
       type: 'date',
-      format: 'YYYY-MM-DD 00:00:00',
-      valueFormat: 'YYYY-MM-DD 00:00:00',
-      hide: true,
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-    },
-    {
-      label: '创建结束时间',
-      prop: 'createTimeEnd',
-      type: 'date',
-      format: 'YYYY-MM-DD 23:59:59',
-      valueFormat: 'YYYY-MM-DD 23:59:59',
+      format: 'YYYY-MM-DD',
+      valueFormat: 'YYYY-MM-DD',
       hide: true,
       addDisplay: false,
       editDisplay: false,

src/option/vehicle/etc-record.js

@@ -34,7 +34,7 @@ export const option = {
   searchShow: true,
   searchMenuSpan: 24,
   searchIcon: true,
-  searchIndex: 8,
+  searchIndex: 4,
   searchMenuPosition: 'right',
   border: true,
   index: true,

src/option/vehicle/insurance-record.js

@@ -42,7 +42,7 @@ export const option = {
   searchShow: true,
   searchMenuSpan: 24,
   searchIcon: true,
-  searchIndex: 8,
+  searchIndex: 4,
   searchMenuPosition: 'right',
   border: true,
   index: true,
@@ -182,23 +182,12 @@ export const option = {
       minWidth: 170,
     },
     {
-      label: '创建开始时间',
-      prop: 'createTimeStart',
+      label: '创建时间',
+      prop: 'createTimeRange',
       type: 'date',
-      format: 'YYYY-MM-DD 00:00:00',
-      valueFormat: 'YYYY-MM-DD 00:00:00',
-      search: true,
-      hide: true,
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-    },
-    {
-      label: '创建结束时间',
-      prop: 'createTimeEnd',
-      type: 'date',
-      format: 'YYYY-MM-DD 23:59:59',
-      valueFormat: 'YYYY-MM-DD 23:59:59',
+      format: 'YYYY-MM-DD',
+      valueFormat: 'YYYY-MM-DD',
+      searchRange: true,
       search: true,
       hide: true,
       addDisplay: false,

src/option/vehicle/mileage-record.js

@@ -30,7 +30,7 @@ export const option = {
   searchShow: true,
   searchMenuSpan: 24,
   searchIcon: true,
-  searchIndex: 8,
+  searchIndex: 4,
   searchMenuPosition: 'right',
   border: true,
   index: true,
@@ -168,23 +168,12 @@ export const option = {
       minWidth: 170,
     },
     {
-      label: '创建开始时间',
-      prop: 'createTimeStart',
+      label: '创建时间',
+      prop: 'createTimeRange',
       type: 'date',
-      format: 'YYYY-MM-DD 00:00:00',
-      valueFormat: 'YYYY-MM-DD 00:00:00',
-      search: true,
-      hide: true,
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-    },
-    {
-      label: '创建结束时间',
-      prop: 'createTimeEnd',
-      type: 'date',
-      format: 'YYYY-MM-DD 23:59:59',
-      valueFormat: 'YYYY-MM-DD 23:59:59',
+      format: 'YYYY-MM-DD',
+      valueFormat: 'YYYY-MM-DD',
+      searchRange: true,
       search: true,
       hide: true,
       addDisplay: false,

src/option/vehicle/oil-electric-record.js

@@ -31,7 +31,7 @@ export const option = {
   searchShow: true,
   searchMenuSpan: 24,
   searchIcon: true,
-  searchIndex: 8,
+  searchIndex: 4,
   searchMenuPosition: 'right',
   border: true,
   index: true,
@@ -227,22 +227,11 @@ export const option = {
       minWidth: 170,
     },
     {
-      label: '创建开始时间',
-      prop: 'createTimeStart',
+      label: '创建时间',
+      prop: 'createTimeRange',
       type: 'date',
-      format: 'YYYY-MM-DD 00:00:00',
-      valueFormat: 'YYYY-MM-DD 00:00:00',
-      hide: true,
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-    },
-    {
-      label: '创建结束时间',
-      prop: 'createTimeEnd',
-      type: 'date',
-      format: 'YYYY-MM-DD 23:59:59',
-      valueFormat: 'YYYY-MM-DD 23:59:59',
+      format: 'YYYY-MM-DD',
+      valueFormat: 'YYYY-MM-DD',
       hide: true,
       addDisplay: false,
       editDisplay: false,

src/option/vehicle/other-expense-record.js

@@ -42,7 +42,7 @@ export const option = {
   searchShow: true,
   searchMenuSpan: 24,
   searchIcon: true,
-  searchIndex: 8,
+  searchIndex: 4,
   searchMenuPosition: 'right',
   border: true,
   index: true,

src/option/vehicle/tire-replacement-record.js

@@ -35,7 +35,7 @@ export const option = {
   searchShow: true,
   searchMenuSpan: 24,
   searchIcon: true,
-  searchIndex: 8,
+  searchIndex: 4,
   searchMenuPosition: 'right',
   border: true,
   index: true,
@@ -150,23 +150,12 @@ export const option = {
       minWidth: 170,
     },
     {
-      label: '创建开始时间',
-      prop: 'createTimeStart',
+      label: '创建时间',
+      prop: 'createTimeRange',
       type: 'date',
-      format: 'YYYY-MM-DD 00:00:00',
-      valueFormat: 'YYYY-MM-DD 00:00:00',
-      search: true,
-      hide: true,
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-    },
-    {
-      label: '创建结束时间',
-      prop: 'createTimeEnd',
-      type: 'date',
-      format: 'YYYY-MM-DD 23:59:59',
-      valueFormat: 'YYYY-MM-DD 23:59:59',
+      format: 'YYYY-MM-DD',
+      valueFormat: 'YYYY-MM-DD',
+      searchRange: true,
       search: true,
       hide: true,
       addDisplay: false,

src/option/vehicle/transport-change-record.js

@@ -22,7 +22,7 @@ export const option = {
   searchShow: true,
   searchMenuSpan: 24,
   searchIcon: true,
-  searchIndex: 8,
+  searchIndex: 4,
   searchMenuPosition: 'right',
   border: true,
   index: true,
@@ -105,23 +105,12 @@ export const option = {
       minWidth: 170,
     },
     {
-      label: '创建开始时间',
-      prop: 'createTimeStart',
+      label: '创建时间',
+      prop: 'createTimeRange',
       type: 'date',
-      format: 'YYYY-MM-DD 00:00:00',
-      valueFormat: 'YYYY-MM-DD 00:00:00',
-      search: true,
-      hide: true,
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-    },
-    {
-      label: '创建结束时间',
-      prop: 'createTimeEnd',
-      type: 'date',
-      format: 'YYYY-MM-DD 23:59:59',
-      valueFormat: 'YYYY-MM-DD 23:59:59',
+      format: 'YYYY-MM-DD',
+      valueFormat: 'YYYY-MM-DD',
+      searchRange: true,
       search: true,
       hide: true,
       addDisplay: false,

src/option/vehicle/violation-record.js

@@ -53,7 +53,7 @@ export const option = {
   searchShow: true,
   searchMenuSpan: 24,
   searchIcon: true,
-  searchIndex: 8,
+  searchIndex: 4,
   searchMenuPosition: 'right',
   border: true,
   index: true,
@@ -233,23 +233,12 @@ export const option = {
       minWidth: 170,
     },
     {
-      label: '创建开始时间',
-      prop: 'createTimeStart',
+      label: '创建时间',
+      prop: 'createTimeRange',
       type: 'date',
-      format: 'YYYY-MM-DD 00:00:00',
-      valueFormat: 'YYYY-MM-DD 00:00:00',
-      search: true,
-      hide: true,
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-    },
-    {
-      label: '创建结束时间',
-      prop: 'createTimeEnd',
-      type: 'date',
-      format: 'YYYY-MM-DD 23:59:59',
-      valueFormat: 'YYYY-MM-DD 23:59:59',
+      format: 'YYYY-MM-DD',
+      valueFormat: 'YYYY-MM-DD',
+      searchRange: true,
       search: true,
       hide: true,
       addDisplay: false,

src/styles/element-ui.scss

@@ -148,9 +148,12 @@
   margin-bottom: 8px;
 }
 
+.avue-crud__search .avue-form__menu,
 .avue-crud__search .avue-form__menu--right {
   display: flex;
+  flex: 0 0 100%;
   justify-content: flex-end;
+  max-width: 100%;
   width: 100%;
 }
 

src/utils/search-range.js

@@ -0,0 +1,27 @@
+export const normalizeSearchRangeParams = (params = {}, rangeMap = {}) => {
+  const values = { ...params };
+
+  Object.entries(rangeMap).forEach(([rangeProp, mapping]) => {
+    const [startProp, endProp, startSuffix = '00:00:00', endSuffix = '23:59:59'] = Array.isArray(
+      mapping
+    )
+      ? mapping
+      : [mapping.startProp, mapping.endProp, mapping.startSuffix, mapping.endSuffix];
+
+    const range = values[rangeProp];
+    if (Array.isArray(range) && range.length === 2) {
+      values[startProp] = range[0] ? `${range[0]} ${startSuffix}` : undefined;
+      values[endProp] = range[1] ? `${range[1]} ${endSuffix}` : undefined;
+    }
+
+    delete values[rangeProp];
+  });
+
+  Object.keys(values).forEach(key => {
+    if (values[key] === undefined || values[key] === null || values[key] === '') {
+      delete values[key];
+    }
+  });
+
+  return values;
+};

src/views/base/airport-master.vue

@@ -205,7 +205,7 @@ export default {
         searchLabelWidth: 160,
         searchMenuSpan: 24,
         searchIcon: true,
-        searchIndex: 8,
+        searchIndex: 4,
         searchMenuPosition: 'right',
         border: true,
         index: true,

src/views/base/cargo-type.vue

@@ -24,35 +24,33 @@
         <el-button type="primary" v-if="permission.cargo_type_add" @click="$refs.crud.rowAdd()">
           <el-icon class="el-icon--left"><Plus /></el-icon>新增
         </el-button>
-        <el-button
-          type="primary"
-          plain
-          v-if="permission.cargo_type_import"
-          @click="handleImport"
-        ><el-icon class="el-icon--left"><Upload /></el-icon>批量导入</el-button>
+        <el-button type="primary" plain v-if="permission.cargo_type_import" @click="handleImport"
+          ><el-icon class="el-icon--left"><Upload /></el-icon>批量导入</el-button
+        >
         <el-button
           type="primary"
           plain
           v-if="permission.cargo_type_template"
           @click="handleTemplate"
-        ><el-icon class="el-icon--left"><Download /></el-icon>下载模板</el-button>
-        <el-button
-          type="primary"
-          plain
-          v-if="permission.cargo_type_export"
-          @click="handleExport"
-        ><el-icon class="el-icon--left"><Download /></el-icon>批量导出</el-button>
-        <el-button
-          type="danger"
-          plain
-          v-if="permission.cargo_type_delete"
-          @click="handleDelete"
-        ><el-icon class="el-icon--left"><Delete /></el-icon>批量删除</el-button>
+          ><el-icon class="el-icon--left"><Download /></el-icon>下载模板</el-button
+        >
+        <el-button type="primary" plain v-if="permission.cargo_type_export" @click="handleExport"
+          ><el-icon class="el-icon--left"><Download /></el-icon>批量导出</el-button
+        >
+        <el-button type="danger" plain v-if="permission.cargo_type_delete" @click="handleDelete"
+          ><el-icon class="el-icon--left"><Delete /></el-icon>批量删除</el-button
+        >
       </template>
 
+      <template #typeLevel-header>
+        <span>货物类型</span>
+      </template>
       <template #parentCargoName="{ row }">
         {{ row.typeLevel === 1 ? '/' : row.parentCargoName || '/' }}
       </template>
+      <template #parentCargoCode-header>
+        <span>上级货物类型编码</span>
+      </template>
       <template #parentCargoCode="{ row }">
         {{ row.typeLevel === 1 ? '/' : row.parentCargoCode || '/' }}
       </template>
@@ -68,7 +66,7 @@
           clearable
           :remote-method="loadParentOptions"
           :loading="parentLoading"
-          :disabled="dialogType !== 'add' || form.typeLevel !== 2"
+          :disabled="dialogType === 'view' || form.typeLevel !== 2"
           placeholder="请输入名称或编码搜索"
           style="width: 100%"
           @change="handleParentChange"
@@ -99,12 +97,7 @@
         >
           编辑
         </el-button>
-        <el-button
-          type="primary"
-          text
-          v-if="permission.cargo_type_delete"
-          @click="rowDel(row)"
-        >
+        <el-button type="primary" text v-if="permission.cargo_type_delete" @click="rowDel(row)">
           删除
         </el-button>
       </template>
@@ -130,13 +123,7 @@
 </template>
 
 <script>
-import {
-  getList,
-  getNextCode,
-  getParentOptions,
-  remove,
-  submit,
-} from '@/api/base/cargo-type';
+import { getList, getNextCode, getParentOptions, remove, submit } from '@/api/base/cargo-type';
 import { getCargoTypeOption } from '@/option/base/cargo-type';
 import { exportBlob } from '@/api/common';
 import { mapGetters } from 'vuex';
@@ -169,8 +156,8 @@ const CARGO_TYPE_FAIL_COL_WIDTH = {
   '上级货物类型编码（如为一级则不需填写）': 26,
   '*货物类型': 18,
   '*货物类型编码': 18,
-  '备注': 24,
-  '导入失败原因': 70,
+  备注: 24,
+  导入失败原因: 70,
 };
 
 /**
@@ -223,7 +210,9 @@ export const decorateCargoTypeFailDetail = async workbook => {
     // 兜底：失败行的备注列超长（>200字）时，补充备注超长提示
     const remarkCol = colMap['备注'];
     if (remarkCol) {
-      const remarkVal = String(row.getCell(remarkCol).value == null ? '' : row.getCell(remarkCol).value).trim();
+      const remarkVal = String(
+        row.getCell(remarkCol).value == null ? '' : row.getCell(remarkCol).value
+      ).trim();
       if (remarkVal.length > 200 && !decorated.some(d => d.includes('备注不能超过200字'))) {
         decorated.push(`${String.fromCharCode(65 + decorated.length)}.备注不能超过200字`);
       }
@@ -362,12 +351,16 @@ export default {
     handleParentChange(value) {
       const parent = this.parentOptions.find(item => String(item.id) === String(value));
       this.form.parentCargoName = parent ? parent.cargoName : '';
-      this.form.parentCargoCode = parent ? parent.cargoCode : '';
+      this.form.parentCargoCode = parent ? parent.cargoCode || parent.code || '' : '';
       if (!parent) {
         this.form.cargoCode = '';
         return;
       }
-      getNextCode(parent.cargoCode).then(res => {
+      if (!this.form.parentCargoCode) {
+        this.form.cargoCode = '';
+        return;
+      }
+      getNextCode(this.form.parentCargoCode).then(res => {
         this.form.cargoCode = res.data.data;
       });
     },

src/views/base/currency.vue

@@ -164,7 +164,7 @@ export default {
         searchShow: true,
         searchMenuSpan: 24,
         searchIcon: true,
-        searchIndex: 8,
+        searchIndex: 4,
         searchMenuPosition: 'right',
         border: true,
         index: true,

src/views/base/customer-type.vue

@@ -95,7 +95,7 @@ export default {
         searchShow: true,
         searchMenuSpan: 24,
         searchIcon: true,
-        searchIndex: 8,
+        searchIndex: 4,
         searchMenuPosition: 'right',
         border: true,
         index: true,

src/views/base/fee-item.vue

@@ -85,7 +85,7 @@ export default {
         searchShow: true,
         searchMenuSpan: 24,
         searchIcon: true,
-        searchIndex: 8,
+        searchIndex: 4,
         searchMenuPosition: 'right',
         border: true,
         index: true,

src/views/base/port-terminal.vue

@@ -302,7 +302,7 @@ export default {
         searchShow: true,
         searchLabelWidth: 160,
         searchIcon: true,
-        searchIndex: 8,
+        searchIndex: 4,
         searchMenuSpan: 24,
         searchMenuPosition: 'right',
         border: true,

src/views/base/railway-station.vue

@@ -204,7 +204,7 @@ export default {
         searchShow: true,
         searchMenuSpan: 24,
         searchIcon: true,
-        searchIndex: 8,
+        searchIndex: 4,
         searchMenuPosition: 'right',
         border: true,
         index: true,

src/views/business/common-cargo.vue

@@ -1,21 +1,647 @@
 <template>
-  <business-crud-page :api="api" :config="config" :crud-option="option" :crud-excel-option="excelOption" />
+  <basic-container class="common-cargo-page">
+    <avue-crud
+      :option="option"
+      :table-loading="loading"
+      :data="data"
+      v-model:page="page"
+      v-model="form"
+      ref="crud"
+      :permission="permissionList"
+      :before-open="beforeOpen"
+      @row-save="rowSave"
+      @row-update="rowUpdate"
+      @row-del="rowDel"
+      @search-change="searchChange"
+      @search-reset="searchReset"
+      @selection-change="selectionChange"
+      @current-change="currentChange"
+      @size-change="sizeChange"
+      @refresh-change="refreshChange"
+      @on-load="onLoad"
+    >
+      <template #menu-left>
+        <el-button
+          type="primary"
+          icon="el-icon-plus"
+          plain
+          v-if="hasPermission('common_cargo_add')"
+          @click="$refs.crud.rowAdd()"
+          >新增
+        </el-button>
+        <el-button
+          type="primary"
+          icon="el-icon-upload"
+          plain
+          v-if="config.importUrl && hasPermission('common_cargo_import')"
+          @click="handleImport"
+          >批量导入
+        </el-button>
+        <el-button
+          type="primary"
+          icon="el-icon-download"
+          plain
+          v-if="config.templateUrl && hasPermission('common_cargo_template')"
+          @click="handleTemplate"
+          >下载模板
+        </el-button>
+        <el-button
+          type="primary"
+          icon="el-icon-download"
+          plain
+          v-if="config.exportUrl && hasPermission('common_cargo_export')"
+          @click="handleExport"
+          >批量导出
+        </el-button>
+        <el-button
+          type="danger"
+          icon="el-icon-delete"
+          plain
+          v-if="hasPermission('common_cargo_delete')"
+          @click="handleDelete"
+          >批量删除
+        </el-button>
+      </template>
+
+      <template #firstCargoTypeName-form>
+        <el-select
+          v-model="form.firstCargoTypeCode"
+          clearable
+          filterable
+          remote
+          :remote-method="loadFirstCargoTypeOptions"
+          :loading="firstCargoTypeLoading"
+          :disabled="dialogReadonly || dialogType === 'edit'"
+          placeholder="请选择一级货物类型"
+          style="width: 100%"
+          @change="handleFirstCargoTypeChange"
+        >
+          <el-option
+            v-for="item in firstCargoTypeOptions"
+            :key="item.cargoCode"
+            :label="item.cargoName"
+            :value="item.cargoCode"
+          />
+        </el-select>
+      </template>
+
+      <template #secondCargoTypeName-form>
+        <el-select
+          v-model="form.secondCargoTypeCode"
+          clearable
+          filterable
+          remote
+          :remote-method="loadSecondCargoTypeOptions"
+          :loading="secondCargoTypeLoading"
+          :disabled="dialogReadonly || dialogType === 'edit' || !form.firstCargoTypeCode"
+          :placeholder="form.firstCargoTypeCode ? '请选择二级货物类型' : '请先选择一级货物类型'"
+          style="width: 100%"
+          @change="handleSecondCargoTypeChange"
+        >
+          <el-option
+            v-for="item in secondCargoTypeOptions"
+            :key="item.cargoCode"
+            :label="item.cargoName"
+            :value="item.cargoCode"
+          />
+        </el-select>
+      </template>
+
+      <template #cargoCode-form>
+        <el-input
+          v-model="form.cargoCode"
+          clearable
+          maxlength="20"
+          show-word-limit
+          placeholder="请输入货物编号"
+          :disabled="dialogReadonly || dialogType === 'edit'"
+          @input="handleCargoCodeInput"
+        />
+      </template>
+
+      <template #cargoValue-form>
+        <div class="common-cargo-page__value-unit">
+          <el-input
+            v-model="form.cargoValue"
+            clearable
+            placeholder="请输入"
+            :disabled="dialogReadonly"
+            @input="handleCargoValueInput"
+          />
+          <el-select
+            v-model="form.priceUnit"
+            clearable
+            :disabled="dialogReadonly"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in priceUnitOptions"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+        </div>
+      </template>
+
+      <template #menu="{ row, index }">
+        <el-button
+          type="primary"
+          text
+          icon="el-icon-view"
+          v-if="hasPermission('common_cargo_view')"
+          @click="$refs.crud.rowView(row, index)"
+        >
+          查看
+        </el-button>
+        <el-button
+          type="primary"
+          text
+          icon="el-icon-edit"
+          v-if="hasPermission('common_cargo_edit') && !row.readonly"
+          @click="$refs.crud.rowEdit(row, index)"
+        >
+          编辑
+        </el-button>
+        <el-button
+          type="primary"
+          text
+          icon="el-icon-delete"
+          v-if="hasPermission('common_cargo_delete') && !row.readonly"
+          @click="rowDel(row)"
+        >
+          删除
+        </el-button>
+      </template>
+    </avue-crud>
+
+    <empty-pagination
+      :page="page"
+      @size-change="sizeChange"
+      @current-change="currentChange"
+      @load="onLoad(page, query)"
+    />
+
+    <el-dialog :title="`${config.title}导入`" append-to-body v-model="excelBox" width="555px">
+      <avue-form :option="excelOptionConfig" v-model="excelForm">
+        <template #excelTemplate>
+          <el-button type="primary" @click="handleTemplate">
+            点击下载<i class="el-icon-download el-icon--right"></i>
+          </el-button>
+        </template>
+      </avue-form>
+    </el-dialog>
+  </basic-container>
 </template>
 
 <script>
-import BusinessCrudPage from './components/business-crud-page.vue';
 import * as api from '@/api/business/common-cargo';
+import { getList as getCargoTypeList } from '@/api/base/cargo-type';
+import { exportBlob } from '@/api/common';
 import { config, excelOption, option } from '@/option/business/common-cargo';
+import { priceUnitOptions } from '@/option/business/common';
+import { getToken } from '@/utils/auth';
+import { openImportDialog } from '@/utils/import-excel';
+import { downloadXls } from '@/utils/util';
+import { mapGetters } from 'vuex';
+import NProgress from 'nprogress';
+import 'nprogress/nprogress.css';
 
 export default {
-  components: { BusinessCrudPage },
   data() {
     return {
       api,
       config,
       option,
-      excelOption,
+      priceUnitOptions,
+      form: {},
+      query: {},
+      loading: true,
+      data: [],
+      dialogReadonly: false,
+      dialogType: 'add',
+      excelBox: false,
+      excelForm: {},
+      excelOptionConfig: excelOption,
+      firstCargoTypeLoading: false,
+      secondCargoTypeLoading: false,
+      firstCargoTypeOptions: [],
+      secondCargoTypeOptions: [],
+      page: {
+        pageSize: 10,
+        pageSizes: [10, 20, 50, 100],
+        currentPage: 1,
+        total: 0,
+      },
+      selectionList: [],
     };
   },
+  computed: {
+    ...mapGetters(['permission', 'userInfo']),
+    permissionList() {
+      return {
+        addBtn: this.hasPermission('common_cargo_add'),
+      };
+    },
+    isAdmin() {
+      const authority = this.userInfo && this.userInfo.authority;
+      return Array.isArray(authority)
+        ? authority.includes('admin')
+        : String(authority || '').includes('admin');
+    },
+    ids() {
+      return this.selectionList.map(item => item.id).join(',');
+    },
+  },
+  methods: {
+    hasPermission(code) {
+      return this.isAdmin || this.validData(this.permission && this.permission[code], false);
+    },
+    getRecords(res) {
+      const data = res && res.data && res.data.data;
+      if (Array.isArray(data)) return data;
+      return (data && data.records) || [];
+    },
+    normalizeCargoTypeOptions(list = []) {
+      return list
+        .map(item => ({
+          ...item,
+          cargoCode: String(item.cargoCode || ''),
+          cargoName: item.cargoName || '',
+        }))
+        .filter(item => item.cargoCode && item.cargoName);
+    },
+    ensureCargoTypeOption(listName, optionItem) {
+      if (!optionItem || !optionItem.cargoCode) return;
+      const exists = this[listName].some(item => item.cargoCode === optionItem.cargoCode);
+      if (!exists) {
+        this[listName] = [optionItem, ...this[listName]];
+      }
+    },
+    loadFirstCargoTypeOptions(keyword = '') {
+      this.firstCargoTypeLoading = true;
+      getCargoTypeList(1, 30, {
+        typeLevel: 1,
+        cargoName: String(keyword || '').trim(),
+      })
+        .then(res => {
+          this.firstCargoTypeOptions = this.normalizeCargoTypeOptions(this.getRecords(res));
+        })
+        .finally(() => {
+          this.firstCargoTypeLoading = false;
+        });
+    },
+    loadSecondCargoTypeOptions(keyword = '') {
+      if (!this.form.firstCargoTypeCode) {
+        this.secondCargoTypeOptions = [];
+        return;
+      }
+      this.secondCargoTypeLoading = true;
+      getCargoTypeList(1, 30, {
+        typeLevel: 2,
+        parentCargoCode: this.form.firstCargoTypeCode,
+        cargoName: String(keyword || '').trim(),
+      })
+        .then(res => {
+          this.secondCargoTypeOptions = this.normalizeCargoTypeOptions(this.getRecords(res));
+        })
+        .finally(() => {
+          this.secondCargoTypeLoading = false;
+        });
+    },
+    handleFirstCargoTypeChange(value) {
+      const first = this.firstCargoTypeOptions.find(item => item.cargoCode === value);
+      this.form.firstCargoTypeName = first ? first.cargoName : '';
+      this.form.firstCargoTypeCode = first ? first.cargoCode : '';
+      this.form.secondCargoTypeName = '';
+      this.form.secondCargoTypeCode = '';
+      this.secondCargoTypeOptions = [];
+      this.syncCargoCodePrefix();
+      if (first) {
+        this.loadSecondCargoTypeOptions();
+      }
+    },
+    handleSecondCargoTypeChange(value) {
+      const second = this.secondCargoTypeOptions.find(item => item.cargoCode === value);
+      this.form.secondCargoTypeName = second ? second.cargoName : '';
+      this.form.secondCargoTypeCode = second ? second.cargoCode : '';
+      this.syncCargoCodePrefix();
+    },
+    getCargoCodePrefix() {
+      return this.form.secondCargoTypeCode && this.form.firstCargoTypeCode
+        ? this.form.firstCargoTypeCode
+        : '';
+    },
+    syncCargoCodePrefix() {
+      const prefix = this.getCargoCodePrefix();
+      const current = String(this.form.cargoCode || '').replace(/\D/g, '');
+      if (!prefix) {
+        this.form.cargoCode = current;
+        return;
+      }
+      const suffix = current.startsWith(prefix) ? current.slice(prefix.length) : current;
+      this.form.cargoCode = `${prefix}${suffix}`.slice(0, 20);
+    },
+    handleCargoCodeInput(value) {
+      const prefix = this.getCargoCodePrefix();
+      const input = String(value || '').replace(/\D/g, '');
+      if (!prefix) {
+        this.form.cargoCode = input.slice(0, 20);
+        return;
+      }
+      const suffix = input.startsWith(prefix) ? input.slice(prefix.length) : input;
+      this.form.cargoCode = `${prefix}${suffix}`.slice(0, 20);
+    },
+    handleCargoValueInput(value) {
+      const raw = String(value || '').replace(/[^\d.]/g, '');
+      const parts = raw.split('.');
+      const integer = parts[0] || '';
+      const decimal = parts.slice(1).join('').slice(0, 2);
+      this.form.cargoValue = parts.length > 1 ? `${integer}.${decimal}` : integer;
+    },
+    normalizeRow(row) {
+      const submitRow = { ...row };
+      Object.keys(submitRow).forEach(key => {
+        if (typeof submitRow[key] === 'string') {
+          submitRow[key] = submitRow[key].trim();
+        }
+      });
+      if (submitRow.cargoValue !== undefined && submitRow.cargoValue !== null) {
+        submitRow.cargoValue = String(submitRow.cargoValue).trim();
+      }
+      return submitRow;
+    },
+    validateRow(row) {
+      if (!row.firstCargoTypeName || !row.firstCargoTypeCode) {
+        this.$message.warning('请选择一级货物类型');
+        return false;
+      }
+      if (!row.secondCargoTypeName || !row.secondCargoTypeCode) {
+        this.$message.warning('请选择二级货物类型');
+        return false;
+      }
+      if (!row.cargoName) {
+        this.$message.warning('请输入货物名称');
+        return false;
+      }
+      if (row.cargoName.length > 100) {
+        this.$message.warning('货物名称不能超过100个字符');
+        return false;
+      }
+      const cargoCode = String(row.cargoCode || '');
+      const prefix = row.firstCargoTypeCode;
+      if (!cargoCode || cargoCode === prefix) {
+        this.$message.warning('请输入货物编号');
+        return false;
+      }
+      if (!cargoCode.startsWith(prefix)) {
+        this.$message.warning('货物编号需拼接一级货物类型编号在前面');
+        return false;
+      }
+      if (cargoCode.length > 20) {
+        this.$message.warning('货物编号不能超过20个字符');
+        return false;
+      }
+      if (row.cargoValue && !/^\d+(\.\d{1,2})?$/.test(String(row.cargoValue))) {
+        this.$message.warning('货值只能输入数字，最多保留2位小数');
+        return false;
+      }
+      if (row.remark && row.remark.length > 200) {
+        this.$message.warning('备注不能超过200个字符');
+        return false;
+      }
+      return true;
+    },
+    stopSubmitLoading(loading) {
+      if (typeof loading === 'function') {
+        loading();
+      }
+    },
+    rowSave(row, done, loading) {
+      const submitRow = this.normalizeRow(row);
+      if (!this.validateRow(submitRow)) {
+        this.stopSubmitLoading(loading);
+        return;
+      }
+      api.submit(submitRow).then(
+        () => {
+          this.onLoad(this.page);
+          this.$message({ type: 'success', message: '操作成功!' });
+          done();
+        },
+        error => {
+          window.console.log(error);
+          this.stopSubmitLoading(loading);
+        }
+      );
+    },
+    rowUpdate(row, index, done, loading) {
+      const submitRow = this.normalizeRow(row);
+      if (!this.validateRow(submitRow)) {
+        this.stopSubmitLoading(loading);
+        return;
+      }
+      api.submit(submitRow).then(
+        () => {
+          this.onLoad(this.page);
+          this.$message({ type: 'success', message: '操作成功!' });
+          done();
+        },
+        error => {
+          window.console.log(error);
+          this.stopSubmitLoading(loading);
+        }
+      );
+    },
+    rowDel(row) {
+      this.$confirm('确定将选择数据删除?', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => api.remove(row.id))
+        .then(res => {
+          this.afterRemove(res.data.data);
+        });
+    },
+    handleDelete() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning('请选择至少一条数据');
+        return;
+      }
+      const selection = this.selectionList.filter(item => !item.readonly);
+      if (!selection.length) {
+        this.$message.warning('所选数据均为只读数据');
+        return;
+      }
+      this.$confirm('确定将选择数据删除?', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => api.remove(selection.map(item => item.id).join(',')))
+        .then(res => {
+          this.afterRemove(res.data.data);
+        });
+    },
+    afterRemove(result = {}) {
+      this.onLoad(this.page);
+      const successCount = result.successCount || 0;
+      const skippedCount = result.skippedCount || 0;
+      if (skippedCount) {
+        this.$message.warning(`成功删除${successCount}条，因业务引用跳过${skippedCount}条`);
+      } else {
+        this.$message({ type: 'success', message: '删除成功!' });
+      }
+      this.selectionClear();
+    },
+    beforeOpen(done, type) {
+      this.dialogReadonly = type === 'view';
+      this.dialogType = type || 'add';
+      if (type === 'add') {
+        this.form = {
+          priceUnit: '元/吨',
+          ...this.form,
+        };
+        this.loadFirstCargoTypeOptions();
+        done();
+        return;
+      }
+      if (['edit', 'view'].includes(type)) {
+        api.getDetail(this.form.id).then(res => {
+          this.form = res.data.data || {};
+          this.ensureCargoTypeOption('firstCargoTypeOptions', {
+            cargoName: this.form.firstCargoTypeName,
+            cargoCode: this.form.firstCargoTypeCode,
+          });
+          this.ensureCargoTypeOption('secondCargoTypeOptions', {
+            cargoName: this.form.secondCargoTypeName,
+            cargoCode: this.form.secondCargoTypeCode,
+          });
+          if (this.form.firstCargoTypeCode) {
+            this.loadSecondCargoTypeOptions();
+          }
+          done();
+        });
+        return;
+      }
+      done();
+    },
+    searchReset() {
+      this.query = {};
+      this.page.currentPage = 1;
+      this.onLoad(this.page);
+    },
+    searchChange(params, done) {
+      this.query = params;
+      this.page.currentPage = 1;
+      this.onLoad(this.page, params);
+      done();
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      if (this.$refs.crud) {
+        this.$refs.crud.toggleSelection();
+      }
+    },
+    currentChange(currentPage) {
+      this.page.currentPage = currentPage;
+    },
+    sizeChange(pageSize) {
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
+    onLoad(page, params = {}) {
+      this.loading = true;
+      api
+        .getList(page.currentPage, page.pageSize, { ...params, ...this.query, allDept: 0 })
+        .then(res => {
+          const result = res.data.data;
+          this.page.total = result.total;
+          this.data = result.records;
+          this.selectionClear();
+        })
+        .finally(() => {
+          this.loading = false;
+        });
+    },
+    buildExportParams() {
+      return {
+        ...this.query,
+        allDept: 0,
+        ids: this.ids,
+        [this.website.tokenHeader]: getToken(),
+      };
+    },
+    handleExport() {
+      this.$confirm(`是否导出${config.exportName}?`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      }).then(() => {
+        NProgress.start();
+        exportBlob(config.exportUrl, this.buildExportParams())
+          .then(res => {
+            downloadXls(
+              res.data,
+              `${config.exportName}${this.$dayjs().format('YYYY-MM-DD HH:mm:ss')}.xlsx`
+            );
+          })
+          .finally(() => {
+            NProgress.done();
+          });
+      });
+    },
+    handleTemplate() {
+      NProgress.start();
+      exportBlob(config.templateUrl, {
+        [this.website.tokenHeader]: getToken(),
+      })
+        .then(res => {
+          downloadXls(res.data, `${config.title}模板.xlsx`);
+        })
+        .finally(() => {
+          NProgress.done();
+        });
+    },
+    handleImport() {
+      const column = this.excelOptionConfig.column.find(item => item.prop === 'excelFile');
+      column.action = config.importUrl;
+      openImportDialog(this, config.title, () => this.onLoad(this.page, this.query));
+    },
+  },
 };
 </script>
+
+<style lang="scss" scoped>
+.common-cargo-page {
+  &__value-unit {
+    display: flex;
+    align-items: center;
+    width: 100%;
+
+    .el-input {
+      flex: 1;
+      min-width: 0;
+    }
+
+    .el-select {
+      flex: 0 0 112px;
+      margin-left: -1px;
+    }
+
+    :deep(.el-input__wrapper) {
+      border-radius: 4px 0 0 4px;
+    }
+
+    .el-select :deep(.el-input__wrapper) {
+      border-radius: 0 4px 4px 0;
+    }
+  }
+}
+</style>

src/views/business/common-route.vue

@@ -1,20 +1,669 @@
 <template>
-  <business-crud-page :api="api" :config="config" :crud-option="option" />
+  <basic-container class="common-route-page">
+    <avue-crud
+      :option="option"
+      :table-loading="loading"
+      :data="data"
+      v-model:page="page"
+      v-model="form"
+      ref="crud"
+      :permission="permissionList"
+      :before-open="beforeOpen"
+      @row-save="rowSave"
+      @row-update="rowUpdate"
+      @row-del="rowDel"
+      @search-change="searchChange"
+      @search-reset="searchReset"
+      @selection-change="selectionChange"
+      @current-change="currentChange"
+      @size-change="sizeChange"
+      @refresh-change="refreshChange"
+      @on-load="onLoad"
+    >
+      <template #menu-left>
+        <el-button
+          type="primary"
+          icon="el-icon-plus"
+          plain
+          v-if="hasPermission('common_route_add')"
+          @click="$refs.crud.rowAdd()"
+          >新增
+        </el-button>
+        <el-button
+          type="primary"
+          icon="el-icon-download"
+          plain
+          v-if="config.exportUrl && hasPermission('common_route_export')"
+          @click="handleExport"
+          >批量导出
+        </el-button>
+        <el-button
+          type="danger"
+          icon="el-icon-delete"
+          plain
+          v-if="hasPermission('common_route_delete')"
+          @click="handleDelete"
+          >批量删除
+        </el-button>
+      </template>
+
+      <template #departureAddress-form>
+        <div class="common-route-page__route-address">
+          <el-input
+            v-model="form.departureName"
+            readonly
+            placeholder="自动带出"
+            :disabled="dialogReadonly"
+          />
+          <el-input
+            v-model="form.departureAddress"
+            readonly
+            placeholder="请输入并选择地址"
+            suffix-icon="el-icon-location"
+            :disabled="dialogReadonly"
+          />
+          <el-tooltip content="选择常用地址" placement="top">
+            <el-button
+              type="primary"
+              :icon="List"
+              link
+              :disabled="dialogReadonly"
+              @click="openAddressDialog('departure')"
+            />
+          </el-tooltip>
+        </div>
+      </template>
+
+      <template #arrivalAddress-form>
+        <div class="common-route-page__route-address">
+          <el-input
+            v-model="form.arrivalName"
+            readonly
+            placeholder="自动带出"
+            :disabled="dialogReadonly"
+          />
+          <el-input
+            v-model="form.arrivalAddress"
+            readonly
+            placeholder="请输入并选择地址"
+            suffix-icon="el-icon-location"
+            :disabled="dialogReadonly"
+          />
+          <el-tooltip content="选择常用地址" placement="top">
+            <el-button
+              type="primary"
+              :icon="List"
+              link
+              :disabled="dialogReadonly"
+              @click="openAddressDialog('arrival')"
+            />
+          </el-tooltip>
+        </div>
+      </template>
+
+      <template #menu="{ row, index }">
+        <el-button
+          type="primary"
+          text
+          icon="el-icon-view"
+          v-if="hasPermission('common_route_view')"
+          @click="$refs.crud.rowView(row, index)"
+        >
+          查看
+        </el-button>
+        <el-button
+          type="primary"
+          text
+          icon="el-icon-edit"
+          v-if="hasPermission('common_route_edit') && !row.readonly"
+          @click="$refs.crud.rowEdit(row, index)"
+        >
+          编辑
+        </el-button>
+        <el-button
+          type="primary"
+          text
+          icon="el-icon-delete"
+          v-if="hasPermission('common_route_delete') && !row.readonly"
+          @click="rowDel(row)"
+        >
+          删除
+        </el-button>
+      </template>
+    </avue-crud>
+
+    <empty-pagination
+      :page="page"
+      @size-change="sizeChange"
+      @current-change="currentChange"
+      @load="onLoad(page, query)"
+    />
+
+    <el-dialog
+      title="选择常用地址"
+      append-to-body
+      v-model="addressDialogVisible"
+      width="1080px"
+      class="common-route-page__address-dialog"
+      @opened="loadAddressList"
+    >
+      <div class="common-route-page__address-search">
+        <el-form :model="addressQuery" label-position="right" label-width="86px">
+          <el-row :gutter="16">
+            <el-col :span="6">
+              <el-form-item label="地址名称">
+                <el-input v-model="addressQuery.addressName" clearable placeholder="请输入" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="6">
+              <el-form-item label="地址类型">
+                <el-select
+                  v-model="addressQuery.addressType"
+                  clearable
+                  placeholder="请选择"
+                  style="width: 100%"
+                >
+                  <el-option
+                    v-for="item in addressTypeOptions"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  />
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="6">
+              <el-form-item label="详细地址">
+                <el-input v-model="addressQuery.detailAddress" clearable placeholder="请输入" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="6" class="common-route-page__address-search-actions">
+              <el-button type="primary" @click="handleAddressSearch">查询</el-button>
+              <el-button @click="handleAddressReset">重置</el-button>
+            </el-col>
+            <el-col :span="6">
+              <el-form-item label="组织">
+                <el-select
+                  v-model="addressQuery.deptId"
+                  clearable
+                  filterable
+                  placeholder="请选择"
+                  style="width: 100%"
+                >
+                  <el-option
+                    v-for="item in deptOptions"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  />
+                </el-select>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-form>
+      </div>
+
+      <el-table
+        border
+        :data="addressData"
+        v-loading="addressLoading"
+        height="310"
+        highlight-current-row
+        @row-click="selectAddressRow"
+      >
+        <el-table-column type="index" label="序号" width="80" align="center" />
+        <el-table-column prop="addressName" label="地址名称" min-width="150" />
+        <el-table-column prop="addressCode" label="地址编号" min-width="150" />
+        <el-table-column prop="addressType" label="类型" min-width="150" />
+        <el-table-column label="站点编码" min-width="170">
+          <template #default="{ row }">
+            {{ row.addressType === '常规地址' ? '/' : row.siteCodeDisplay || row.siteCode || '' }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="detailAddress" label="详细地址" min-width="220" />
+        <el-table-column label="操作" width="120" fixed="right">
+          <template #default="{ row }">
+            <el-button type="primary" text @click.stop="selectAddressRow(row)">选择</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <div class="common-route-page__address-pagination">
+        <el-pagination
+          v-model:current-page="addressPage.currentPage"
+          v-model:page-size="addressPage.pageSize"
+          :page-sizes="[10, 20, 50, 100]"
+          layout="total, prev, pager, next, sizes"
+          :total="addressPage.total"
+          @size-change="handleAddressSizeChange"
+          @current-change="handleAddressCurrentChange"
+        />
+      </div>
+
+      <template #footer>
+        <el-button @click="addressDialogVisible = false">关闭</el-button>
+        <el-button type="primary" @click="confirmAddressPick">确认</el-button>
+      </template>
+    </el-dialog>
+  </basic-container>
 </template>
 
 <script>
-import BusinessCrudPage from './components/business-crud-page.vue';
 import * as api from '@/api/business/common-route';
+import { getList as getCommonAddressList } from '@/api/base/common-address';
+import { exportBlob } from '@/api/common';
+import { getDeptTree } from '@/api/system/dept';
+import { addressTypeOptions } from '@/option/base/common-address';
 import { config, option } from '@/option/business/common-route';
+import { getToken } from '@/utils/auth';
+import { downloadXls } from '@/utils/util';
+import { List } from '@element-plus/icons-vue';
+import { mapGetters } from 'vuex';
+import NProgress from 'nprogress';
+import 'nprogress/nprogress.css';
 
 export default {
-  components: { BusinessCrudPage },
   data() {
     return {
-      api,
+      List,
       config,
       option,
+      form: {},
+      query: {},
+      loading: true,
+      data: [],
+      dialogReadonly: false,
+      addressTypeOptions,
+      addressDialogVisible: false,
+      addressTarget: '',
+      addressQuery: {},
+      addressData: [],
+      addressLoading: false,
+      addressSelected: null,
+      deptOptions: [],
+      page: {
+        pageSize: 10,
+        pageSizes: [10, 20, 50, 100],
+        currentPage: 1,
+        total: 0,
+      },
+      addressPage: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0,
+      },
+      selectionList: [],
     };
   },
+  computed: {
+    ...mapGetters(['permission', 'userInfo']),
+    permissionList() {
+      return {
+        addBtn: this.hasPermission('common_route_add'),
+      };
+    },
+    isAdmin() {
+      const authority = this.userInfo && this.userInfo.authority;
+      return Array.isArray(authority)
+        ? authority.includes('admin')
+        : String(authority || '').includes('admin');
+    },
+    ids() {
+      return this.selectionList.map(item => item.id).join(',');
+    },
+  },
+  created() {
+    this.initDeptTree();
+  },
+  methods: {
+    hasPermission(code) {
+      return this.isAdmin || this.validData(this.permission && this.permission[code], false);
+    },
+    initDeptTree() {
+      getDeptTree(this.userInfo.tenantId).then(res => {
+        this.deptOptions = this.flattenDept(res.data.data || []);
+      });
+    },
+    flattenDept(tree, level = 0) {
+      const result = [];
+      tree.forEach(item => {
+        result.push({
+          label: `${'　'.repeat(level)}${item.title || item.deptName || item.name}`,
+          value: item.id,
+        });
+        if (item.children && item.children.length) {
+          result.push(...this.flattenDept(item.children, level + 1));
+        }
+      });
+      return result;
+    },
+    defaultDeptId() {
+      return (this.userInfo && (this.userInfo.deptId || this.userInfo.dept_id)) || '';
+    },
+    resetAddressQuery() {
+      this.addressQuery = {
+        addressName: '',
+        addressType: '',
+        detailAddress: '',
+        deptId: this.defaultDeptId(),
+      };
+    },
+    openAddressDialog(target) {
+      if (this.dialogReadonly) return;
+      this.addressTarget = target;
+      this.addressSelected = null;
+      this.addressPage.currentPage = 1;
+      this.resetAddressQuery();
+      this.addressDialogVisible = true;
+    },
+    handleAddressSearch() {
+      this.addressPage.currentPage = 1;
+      this.loadAddressList();
+    },
+    handleAddressReset() {
+      this.addressPage.currentPage = 1;
+      this.resetAddressQuery();
+      this.loadAddressList();
+    },
+    handleAddressSizeChange(pageSize) {
+      this.addressPage.pageSize = pageSize;
+      this.addressPage.currentPage = 1;
+      this.loadAddressList();
+    },
+    handleAddressCurrentChange(currentPage) {
+      this.addressPage.currentPage = currentPage;
+      this.loadAddressList();
+    },
+    loadAddressList() {
+      this.addressLoading = true;
+      getCommonAddressList(this.addressPage.currentPage, this.addressPage.pageSize, {
+        ...this.addressQuery,
+        allDept: 0,
+      })
+        .then(res => {
+          const data = res.data.data || {};
+          this.addressPage.total = data.total || 0;
+          this.addressData = data.records || [];
+        })
+        .finally(() => {
+          this.addressLoading = false;
+        });
+    },
+    selectAddressRow(row) {
+      this.addressSelected = row;
+    },
+    confirmAddressPick() {
+      if (!this.addressSelected) {
+        this.$message.warning('请选择常用地址');
+        return;
+      }
+      this.applyAddress(this.addressTarget, this.addressSelected);
+      this.addressDialogVisible = false;
+    },
+    applyAddress(target, address) {
+      if (!target || !address) return;
+      const prefix = target === 'departure' ? 'departure' : 'arrival';
+      this.form[`${prefix}Name`] = address.addressName || '';
+      this.form[`${prefix}Address`] = address.detailAddress || '';
+      this.form[`${prefix}AddressCode`] = address.addressCode || '';
+      this.form[`${prefix}SiteCode`] =
+        address.addressType === '常规地址'
+          ? '/'
+          : address.siteCodeDisplay || address.siteCode || '';
+      this.form[`${prefix}Longitude`] = address.longitude || '';
+      this.form[`${prefix}Latitude`] = address.latitude || '';
+      this.form[`${prefix}Contact`] = address.contactName || this.form[`${prefix}Contact`] || '';
+      this.form[`${prefix}Phone`] = address.contactPhone || this.form[`${prefix}Phone`] || '';
+    },
+    normalizeRow(row) {
+      const submitRow = { ...row };
+      Object.keys(submitRow).forEach(key => {
+        if (typeof submitRow[key] === 'string') {
+          submitRow[key] = submitRow[key].trim();
+        }
+      });
+      return submitRow;
+    },
+    validateRow(row) {
+      if (!row.routeName) {
+        this.$message.warning('请输入线路名称');
+        return false;
+      }
+      if (row.routeName.length > 100) {
+        this.$message.warning('线路名称不能超过100个字符');
+        return false;
+      }
+      if (!row.departureName || !row.departureAddress) {
+        this.$message.warning('请选择发货地址');
+        return false;
+      }
+      if (!row.arrivalName || !row.arrivalAddress) {
+        this.$message.warning('请选择收货地址');
+        return false;
+      }
+      if (row.departureAddress.length > 255) {
+        this.$message.warning('发货地址不能超过255个字符');
+        return false;
+      }
+      if (row.arrivalAddress.length > 255) {
+        this.$message.warning('收货地址不能超过255个字符');
+        return false;
+      }
+      if (row.remark && row.remark.length > 500) {
+        this.$message.warning('备注不能超过500个字符');
+        return false;
+      }
+      return true;
+    },
+    stopSubmitLoading(loading) {
+      if (typeof loading === 'function') {
+        loading();
+      }
+    },
+    rowSave(row, done, loading) {
+      const submitRow = this.normalizeRow(row);
+      if (!this.validateRow(submitRow)) {
+        this.stopSubmitLoading(loading);
+        return;
+      }
+      api.submit(submitRow).then(
+        () => {
+          this.onLoad(this.page);
+          this.$message({ type: 'success', message: '操作成功!' });
+          done();
+        },
+        error => {
+          window.console.log(error);
+          this.stopSubmitLoading(loading);
+        }
+      );
+    },
+    rowUpdate(row, index, done, loading) {
+      const submitRow = this.normalizeRow(row);
+      if (!this.validateRow(submitRow)) {
+        this.stopSubmitLoading(loading);
+        return;
+      }
+      api.submit(submitRow).then(
+        () => {
+          this.onLoad(this.page);
+          this.$message({ type: 'success', message: '操作成功!' });
+          done();
+        },
+        error => {
+          window.console.log(error);
+          this.stopSubmitLoading(loading);
+        }
+      );
+    },
+    rowDel(row) {
+      this.$confirm('确定将选择数据删除?', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => api.remove(row.id))
+        .then(res => {
+          this.afterRemove(res.data.data);
+        });
+    },
+    handleDelete() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning('请选择至少一条数据');
+        return;
+      }
+      const selection = this.selectionList.filter(item => !item.readonly);
+      if (!selection.length) {
+        this.$message.warning('所选数据均为只读数据');
+        return;
+      }
+      this.$confirm('确定将选择数据删除?', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => api.remove(selection.map(item => item.id).join(',')))
+        .then(res => {
+          this.afterRemove(res.data.data);
+        });
+    },
+    afterRemove(result = {}) {
+      this.onLoad(this.page);
+      const successCount = result.successCount || 0;
+      const skippedCount = result.skippedCount || 0;
+      if (skippedCount) {
+        this.$message.warning(`成功删除${successCount}条，因业务引用跳过${skippedCount}条`);
+      } else {
+        this.$message({ type: 'success', message: '删除成功!' });
+      }
+      this.selectionClear();
+    },
+    beforeOpen(done, type) {
+      this.dialogReadonly = type === 'view';
+      if (type === 'add') {
+        this.form = {};
+        done();
+        return;
+      }
+      if (['edit', 'view'].includes(type)) {
+        api.getDetail(this.form.id).then(res => {
+          this.form = res.data.data || {};
+          done();
+        });
+        return;
+      }
+      done();
+    },
+    searchReset() {
+      this.query = {};
+      this.page.currentPage = 1;
+      this.onLoad(this.page);
+    },
+    searchChange(params, done) {
+      this.query = params;
+      this.page.currentPage = 1;
+      this.onLoad(this.page, params);
+      done();
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      if (this.$refs.crud) {
+        this.$refs.crud.toggleSelection();
+      }
+    },
+    currentChange(currentPage) {
+      this.page.currentPage = currentPage;
+    },
+    sizeChange(pageSize) {
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
+    onLoad(page, params = {}) {
+      this.loading = true;
+      api
+        .getList(page.currentPage, page.pageSize, { ...params, ...this.query, allDept: 0 })
+        .then(res => {
+          const result = res.data.data;
+          this.page.total = result.total;
+          this.data = result.records;
+          this.selectionClear();
+        })
+        .finally(() => {
+          this.loading = false;
+        });
+    },
+    buildExportParams() {
+      return {
+        ...this.query,
+        allDept: 0,
+        ids: this.ids,
+        [this.website.tokenHeader]: getToken(),
+      };
+    },
+    handleExport() {
+      this.$confirm(`是否导出${config.exportName}?`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      }).then(() => {
+        NProgress.start();
+        exportBlob(config.exportUrl, this.buildExportParams())
+          .then(res => {
+            downloadXls(
+              res.data,
+              `${config.exportName}${this.$dayjs().format('YYYY-MM-DD HH:mm:ss')}.xlsx`
+            );
+          })
+          .finally(() => {
+            NProgress.done();
+          });
+      });
+    },
+  },
 };
 </script>
+
+<style lang="scss" scoped>
+.common-route-page {
+  &__route-address {
+    display: flex;
+    gap: 10px;
+    align-items: center;
+
+    .el-input {
+      flex: 1;
+      min-width: 0;
+    }
+
+    .el-input:first-child {
+      flex: 0 0 34%;
+    }
+
+    .el-button {
+      flex: 0 0 40px;
+      font-size: 30px;
+    }
+  }
+
+  &__address-search {
+    padding: 4px 8px 10px;
+  }
+
+  &__address-search-actions {
+    display: flex;
+    align-items: flex-start;
+    justify-content: flex-end;
+  }
+
+  &__address-pagination {
+    display: flex;
+    justify-content: flex-end;
+    margin-top: 14px;
+  }
+}
+</style>

src/views/transportCapacity/driver.vue

@@ -1,7 +1,22 @@
 <template>
   <basic-container class="driver-page">
-    <div class="driver-toolbar">
-      <div class="driver-toolbar__actions">
+    <avue-crud
+      :option="option"
+      :table-loading="loading"
+      :data="data"
+      v-model:page="page"
+      v-model="form"
+      ref="crud"
+      :permission="permissionList"
+      @search-change="searchChange"
+      @search-reset="searchReset"
+      @selection-change="selectionChange"
+      @current-change="currentChange"
+      @size-change="sizeChange"
+      @refresh-change="refreshChange"
+      @on-load="onLoad"
+    >
+      <template #menu-left>
         <el-button
           type="primary"
           icon="el-icon-plus"
@@ -26,30 +41,20 @@
           @click="handleDelete"
           >批量删除
         </el-button>
-      </div>
-      <el-radio-group v-model="query.expireStatus" class="driver-stat" @change="handleExpireChange">
-        <el-radio-button label="">全部（{{ expiryStat.total }}）</el-radio-button>
-        <el-radio-button label="within30">30天内到期（{{ expiryStat.within30 }}）</el-radio-button>
-        <el-radio-button label="expired">已到期（{{ expiryStat.expired }}）</el-radio-button>
-      </el-radio-group>
-    </div>
-
-    <avue-crud
-      :option="option"
-      :table-loading="loading"
-      :data="data"
-      v-model:page="page"
-      v-model="form"
-      ref="crud"
-      :permission="permissionList"
-      @search-change="searchChange"
-      @search-reset="searchReset"
-      @selection-change="selectionChange"
-      @current-change="currentChange"
-      @size-change="sizeChange"
-      @refresh-change="refreshChange"
-      @on-load="onLoad"
-    >
+      </template>
+      <template #menu-right>
+        <el-radio-group
+          v-model="query.expireStatus"
+          class="driver-stat"
+          @change="handleExpireChange"
+        >
+          <el-radio-button label="">全部（{{ expiryStat.total }}）</el-radio-button>
+          <el-radio-button label="within30"
+            >30天内到期（{{ expiryStat.within30 }}）</el-radio-button
+          >
+          <el-radio-button label="expired">已到期（{{ expiryStat.expired }}）</el-radio-button>
+        </el-radio-group>
+      </template>
       <template #driverName="{ row }">
         <el-button type="primary" link @click="openDriver(row, true)">
           {{ row.driverName }}
@@ -61,12 +66,28 @@
         </el-tag>
       </template>
       <template #drivingLicenseEndDate="{ row }">
-        <span :class="getDateClass(row, 'drivingLicenseEndDate', 'drivingLicenseLongTerm')">
+        <span
+          :class="{
+            'driver-page__date-expiring': isDateExpiring(
+              row,
+              'drivingLicenseEndDate',
+              'drivingLicenseLongTerm'
+            ),
+          }"
+        >
           {{ formatEndDate(row.drivingLicenseEndDate, row.drivingLicenseLongTerm) }}
         </span>
       </template>
       <template #qualificationEndDate="{ row }">
-        <span :class="getDateClass(row, 'qualificationEndDate', 'qualificationLongTerm')">
+        <span
+          :class="{
+            'driver-page__date-expiring': isDateExpiring(
+              row,
+              'qualificationEndDate',
+              'qualificationLongTerm'
+            ),
+          }"
+        >
           {{ formatEndDate(row.qualificationEndDate, row.qualificationLongTerm) }}
         </span>
       </template>
@@ -120,12 +141,12 @@
       >
         <div class="section-title">基础身份信息</div>
         <el-row :gutter="18">
-          <el-col :span="6">
+          <el-col :span="8">
             <el-form-item label="司机姓名" prop="driverName">
               <el-input v-model="driverForm.driverName" maxlength="20" show-word-limit />
             </el-form-item>
           </el-col>
-          <el-col :span="6">
+          <el-col :span="8">
             <el-form-item label="身份证号" prop="idCardNo">
               <el-input
                 v-model="driverForm.idCardNo"
@@ -135,12 +156,14 @@
               />
             </el-form-item>
           </el-col>
-          <el-col :span="4">
+          <el-col :span="8">
             <el-form-item label="出生年月" prop="birthday">
               <el-date-picker v-model="driverForm.birthday" type="date" value-format="YYYY-MM-DD" />
             </el-form-item>
           </el-col>
-          <el-col :span="4">
+        </el-row>
+        <el-row :gutter="18">
+          <el-col :span="8">
             <el-form-item label="性别" prop="gender">
               <el-select v-model="driverForm.gender" clearable>
                 <el-option label="男" value="男" />
@@ -148,12 +171,14 @@
               </el-select>
             </el-form-item>
           </el-col>
-          <el-col :span="4">
+          <el-col :span="8">
             <el-form-item label="民族" prop="nation">
-              <el-input v-model="driverForm.nation" maxlength="20" />
+              <el-select v-model="driverForm.nation" clearable filterable>
+                <el-option v-for="item in nationOptions" :key="item" :label="item" :value="item" />
+              </el-select>
             </el-form-item>
           </el-col>
-          <el-col :span="4">
+          <el-col :span="8">
             <el-form-item label="学历" prop="education">
               <el-select v-model="driverForm.education" clearable filterable>
                 <el-option
@@ -165,6 +190,8 @@
               </el-select>
             </el-form-item>
           </el-col>
+        </el-row>
+        <el-row :gutter="18">
           <el-col :span="8">
             <el-form-item label="住址" prop="addressRegion">
               <el-input
@@ -179,15 +206,7 @@
               <el-input v-model="driverForm.address" maxlength="200" show-word-limit />
             </el-form-item>
           </el-col>
-          <el-col :span="4">
-            <el-form-item label="状态" prop="status">
-              <el-select v-model="driverForm.status">
-                <el-option label="启用" :value="1" />
-                <el-option label="停用" :value="2" />
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="24">
+          <el-col :span="8">
             <el-form-item label="岗位" prop="postList">
               <el-checkbox-group v-model="driverForm.postList">
                 <el-checkbox label="司机" />
@@ -196,6 +215,8 @@
               </el-checkbox-group>
             </el-form-item>
           </el-col>
+        </el-row>
+        <el-row :gutter="18">
           <el-col :span="8">
             <image-upload-field
               label="身份证正面照"
@@ -203,6 +224,7 @@
               :value="driverForm.idCardFront"
               :readonly="readonly"
               :headers="uploadHeaders"
+              large
               @success="url => setImage('idCardFront', url)"
             />
           </el-col>
@@ -213,6 +235,7 @@
               :value="driverForm.idCardBack"
               :readonly="readonly"
               :headers="uploadHeaders"
+              large
               @success="url => setImage('idCardBack', url)"
             />
           </el-col>
@@ -223,6 +246,7 @@
               :value="driverForm.headPhoto"
               :readonly="readonly"
               :headers="uploadHeaders"
+              large
               @success="url => setImage('headPhoto', url)"
             />
           </el-col>
@@ -253,7 +277,7 @@
               <el-input v-model="driverForm.drivingLicenseNo" maxlength="50" />
             </el-form-item>
           </el-col>
-          <el-col :span="8">
+          <el-col :span="6">
             <el-form-item label="有效期" prop="drivingLicenseEndDate">
               <div class="date-range">
                 <el-date-picker
@@ -261,6 +285,7 @@
                   type="date"
                   value-format="YYYY-MM-DD"
                   placeholder="起"
+                  @change="validateFormField('drivingLicenseEndDate')"
                 />
                 <el-date-picker
                   v-model="driverForm.drivingLicenseEndDate"
@@ -268,21 +293,25 @@
                   value-format="YYYY-MM-DD"
                   placeholder="止"
                   :disabled="driverForm.drivingLicenseLongTerm === 1"
+                  @change="validateFormField('drivingLicenseEndDate')"
                 />
               </div>
             </el-form-item>
           </el-col>
-          <el-col :span="4">
+          <el-col :span="6">
             <el-form-item label="长期有效" prop="drivingLicenseLongTerm">
               <el-checkbox
                 v-model="driverForm.drivingLicenseLongTerm"
                 :true-label="1"
                 :false-label="0"
+                @change="validateFormField('drivingLicenseEndDate')"
               >
                 是
               </el-checkbox>
             </el-form-item>
           </el-col>
+        </el-row>
+        <el-row :gutter="18">
           <el-col :span="12">
             <image-upload-field
               label="驾驶证主页"
@@ -310,7 +339,7 @@
         <div class="section-title">从业资格证信息</div>
         <el-row :gutter="18">
           <el-col :span="6">
-            <el-form-item label="从业资格证类型" prop="qualificationType">
+            <el-form-item label="从业资格认证类型" prop="qualificationType">
               <el-select
                 v-model="driverForm.qualificationType"
                 clearable
@@ -318,8 +347,12 @@
                 allow-create
                 default-first-option
               >
-                <el-option label="道路运输从业资格证" value="道路运输从业资格证" />
-                <el-option label="危险货物运输从业资格证" value="危险货物运输从业资格证" />
+                <el-option
+                  v-for="item in qualificationTypeOptions"
+                  :key="item"
+                  :label="item"
+                  :value="item"
+                />
               </el-select>
             </el-form-item>
           </el-col>
@@ -339,20 +372,24 @@
                 type="date"
                 value-format="YYYY-MM-DD"
                 :disabled="driverForm.qualificationLongTerm === 1"
+                @change="validateFormField('qualificationEndDate')"
               />
             </el-form-item>
           </el-col>
-          <el-col :span="4">
+          <el-col :span="6">
             <el-form-item label="长期有效" prop="qualificationLongTerm">
               <el-checkbox
                 v-model="driverForm.qualificationLongTerm"
                 :true-label="1"
                 :false-label="0"
+                @change="validateFormField('qualificationEndDate')"
               >
                 是
               </el-checkbox>
             </el-form-item>
           </el-col>
+        </el-row>
+        <el-row :gutter="18">
           <el-col :span="12">
             <image-upload-field
               label="封面页"
@@ -379,30 +416,32 @@
 
         <div class="section-title">司机联系信息</div>
         <el-row :gutter="18">
-          <el-col :span="6">
+          <el-col :span="8">
             <el-form-item label="司机类型" prop="driverType">
-              <el-select v-model="driverForm.driverType">
+              <el-select v-model="driverForm.driverType" filterable>
                 <el-option label="自有" value="自有" />
                 <el-option label="外协" value="外协" />
               </el-select>
             </el-form-item>
           </el-col>
-          <el-col :span="6">
+          <el-col :span="8">
             <el-form-item label="手机号" prop="mobile">
               <el-input v-model="driverForm.mobile" maxlength="20" />
             </el-form-item>
           </el-col>
-          <el-col :span="6">
+          <el-col :span="8">
             <el-form-item label="紧急联系人姓名" prop="emergencyContactName">
               <el-input v-model="driverForm.emergencyContactName" maxlength="20" />
             </el-form-item>
           </el-col>
-          <el-col :span="6">
+        </el-row>
+        <el-row :gutter="18">
+          <el-col :span="8">
             <el-form-item label="紧急联系人手机号" prop="emergencyContactMobile">
               <el-input v-model="driverForm.emergencyContactMobile" maxlength="20" />
             </el-form-item>
           </el-col>
-          <el-col :span="6">
+          <el-col :span="8">
             <el-form-item label="与联系人关系" prop="contactRelation">
               <el-select
                 v-model="driverForm.contactRelation"
@@ -420,26 +459,16 @@
               </el-select>
             </el-form-item>
           </el-col>
-          <el-col :span="6">
+          <el-col :span="8">
             <el-form-item label="所属组织" prop="organizationName">
-              <el-cascader
-                v-model="driverForm.organizationName"
-                :options="deptCascaderOptions"
-                :props="deptCascaderProps"
-                clearable
-                filterable
-                style="width: 100%"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="备注" prop="remark">
-              <el-input
-                v-model="driverForm.remark"
-                type="textarea"
-                maxlength="200"
-                show-word-limit
-              />
+              <el-select v-model="driverForm.organizationName" clearable filterable>
+                <el-option
+                  v-for="item in organizationOptions"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                />
+              </el-select>
             </el-form-item>
           </el-col>
         </el-row>
@@ -470,6 +499,7 @@ import { getDeptTree } from '@/api/system/dept';
 import { exportBlob } from '@/api/common';
 import { getToken } from '@/utils/auth';
 import { downloadXls } from '@/utils/util';
+import ImageUploadField from '@/components/image-upload-field/main.vue';
 
 const emptyForm = () => ({
   id: '',
@@ -505,64 +535,12 @@ const emptyForm = () => ({
   organizationName: '',
   emergencyContactName: '',
   emergencyContactMobile: '',
-  remark: '',
   status: 1,
 });
 
-const imageUploadField = {
-  name: 'ImageUploadField',
-  props: {
-    label: String,
-    prop: String,
-    value: String,
-    readonly: Boolean,
-    headers: Object,
-    large: Boolean,
-  },
-  emits: ['success'],
-  methods: {
-    handleSuccess(res) {
-      if (res.code === 200 && res.data) {
-        this.$emit('success', res.data.link || res.data.url || res.data.domain || '');
-      } else {
-        this.$message.error(res.msg || '上传失败');
-      }
-    },
-    beforeUpload(file) {
-      const validType = ['image/jpeg', 'image/png', 'image/jpg', 'image/bmp'].includes(file.type);
-      const validSize = file.size / 1024 / 1024 < 5;
-      if (!validType) {
-        this.$message.error('仅支持 JPG、PNG、BMP 图片');
-      }
-      if (!validSize) {
-        this.$message.error('图片大小不能超过 5MB');
-      }
-      return validType && validSize;
-    },
-  },
-  template: `
-    <el-form-item :label="label" :prop="prop">
-      <el-upload
-        class="driver-uploader"
-        :class="{ 'driver-uploader--large': large }"
-        action="/api/blade-resource/oss/endpoint/put-file"
-        name="file"
-        :headers="headers"
-        :show-file-list="false"
-        :disabled="readonly"
-        :before-upload="beforeUpload"
-        :on-success="handleSuccess"
-      >
-        <img v-if="value" :src="value" class="driver-uploader__image" />
-        <div v-else class="driver-uploader__empty">上传证件图片</div>
-      </el-upload>
-    </el-form-item>
-  `,
-};
-
 export default {
   components: {
-    ImageUploadField: imageUploadField,
+    ImageUploadField,
   },
   data() {
     return {
@@ -594,24 +572,108 @@ export default {
         'Blade-Auth': `bearer ${getToken()}`,
         'Blade-Requested-With': 'BladeHttpRequest',
       },
+      nationOptions: [
+        '汉族',
+        '蒙古族',
+        '回族',
+        '藏族',
+        '维吾尔族',
+        '苗族',
+        '彝族',
+        '壮族',
+        '布依族',
+        '朝鲜族',
+        '满族',
+        '侗族',
+        '瑶族',
+        '白族',
+        '土家族',
+        '哈尼族',
+        '哈萨克族',
+        '傣族',
+        '黎族',
+        '傈僳族',
+        '佤族',
+        '畲族',
+        '高山族',
+        '拉祜族',
+        '水族',
+        '东乡族',
+        '纳西族',
+        '景颇族',
+        '柯尔克孜族',
+        '土族',
+        '达斡尔族',
+        '仫佬族',
+        '羌族',
+        '布朗族',
+        '撒拉族',
+        '毛南族',
+        '仡佬族',
+        '锡伯族',
+        '阿昌族',
+        '普米族',
+        '塔吉克族',
+        '怒族',
+        '乌孜别克族',
+        '俄罗斯族',
+        '鄂温克族',
+        '德昂族',
+        '保安族',
+        '裕固族',
+        '京族',
+        '塔塔尔族',
+        '独龙族',
+        '鄂伦春族',
+        '赫哲族',
+        '门巴族',
+        '珞巴族',
+        '基诺族',
+      ],
       educationOptions: ['初中', '高中', '中专', '大专', '本科', '硕士及以上'],
       drivingTypeOptions: ['A1', 'A2', 'A3', 'B1', 'B2', 'C1', 'C2'],
+      qualificationTypeOptions: [
+        '放射品押运员',
+        '道路运输从业资格证',
+        '危险货物运输从业资格证',
+        'A1',
+        'A2',
+        'B1',
+        'B2',
+        'C1',
+        'C2',
+      ],
       relationOptions: ['父母', '配偶', '子女', '兄弟姐妹', '朋友', '同事'],
-      deptCascaderOptions: [],
-      deptCascaderProps: {
-        label: 'label',
-        value: 'value',
-        children: 'children',
-        checkStrictly: true,
-        emitPath: false,
-      },
+      organizationOptions: [],
       formRules: {
         driverName: [{ required: true, message: '请输入司机姓名', trigger: 'blur' }],
         idCardNo: [{ required: true, message: '请输入身份证号', trigger: 'blur' }],
+        gender: [{ required: true, message: '请选择性别', trigger: 'change' }],
+        postList: [
+          {
+            type: 'array',
+            required: true,
+            min: 1,
+            message: '请至少选择一个岗位',
+            trigger: 'change',
+          },
+        ],
         drivingType: [{ required: true, message: '请选择准驾车型', trigger: 'change' }],
+        drivingLicenseNo: [{ required: true, message: '请输入档案编号', trigger: 'blur' }],
         drivingLicenseEndDate: [
           { validator: this.validateDrivingLicenseEndDate, trigger: 'change' },
         ],
+        drivingLicenseLongTerm: [
+          { required: true, message: '请选择驾驶证是否长期有效', trigger: 'change' },
+        ],
+        qualificationType: [
+          { required: true, message: '请选择从业资格认证类型', trigger: 'change' },
+        ],
+        qualificationNo: [{ required: true, message: '请输入资格证号', trigger: 'blur' }],
+        qualificationEndDate: [{ validator: this.validateQualificationEndDate, trigger: 'change' }],
+        qualificationLongTerm: [
+          { required: true, message: '请选择从业资格证是否长期有效', trigger: 'change' },
+        ],
         driverType: [{ required: true, message: '请选择司机类型', trigger: 'change' }],
         mobile: [{ required: true, message: '请输入手机号', trigger: 'blur' }],
         emergencyContactName: [
@@ -625,7 +687,6 @@ export default {
         idCardBack: [{ required: true, message: '请上传身份证反面照', trigger: 'change' }],
         drivingLicenseFront: [{ required: true, message: '请上传驾驶证主页', trigger: 'change' }],
         drivingLicenseBack: [{ required: true, message: '请上传驾驶证副页', trigger: 'change' }],
-        remark: [{ max: 200, message: '备注最多200字', trigger: 'blur' }],
       },
     };
   },
@@ -659,31 +720,43 @@ export default {
     },
     initDeptTree() {
       getDeptTree(this.userInfo.tenantId).then(res => {
-        this.deptCascaderOptions = this.formatDeptCascaderOptions(res.data.data || []);
+        this.organizationOptions = this.formatDeptOptions(res.data.data || []);
         const column = this.findColumn(this.option.column, 'organizationName');
-        column.dicData = this.deptCascaderOptions;
+        column.dicData = this.organizationOptions;
       });
     },
-    formatDeptCascaderOptions(tree = []) {
-      return tree.map(item => {
+    formatDeptOptions(tree = [], level = 0) {
+      const result = [];
+      tree.forEach(item => {
         const label = item.title || item.deptName || item.name;
-        const option = {
-          label,
+        result.push({
+          label: `${'　'.repeat(level)}${label}`,
           value: label,
-        };
+        });
         if (item.children && item.children.length) {
-          option.children = this.formatDeptCascaderOptions(item.children);
+          result.push(...this.formatDeptOptions(item.children, level + 1));
         }
-        return option;
       });
+      return result;
     },
     validateDrivingLicenseEndDate(rule, value, callback) {
+      if (!this.driverForm.drivingLicenseStartDate) {
+        callback(new Error('请选择驾驶证有效期起'));
+        return;
+      }
       if (this.driverForm.drivingLicenseLongTerm !== 1 && !value) {
         callback(new Error('请选择驾驶证有效期止'));
         return;
       }
       callback();
     },
+    validateQualificationEndDate(rule, value, callback) {
+      if (this.driverForm.qualificationLongTerm !== 1 && !value) {
+        callback(new Error('请选择从业资格证有效期'));
+        return;
+      }
+      callback();
+    },
     openDriver(row, readonly = false) {
       this.readonly = readonly;
       if (!row?.id) {
@@ -711,6 +784,9 @@ export default {
       this.driverForm[prop] = url;
       this.$refs.driverForm?.validateField(prop);
     },
+    validateFormField(prop) {
+      this.$refs.driverForm?.validateField(prop);
+    },
     handleSubmit() {
       this.$refs.driverForm.validate(valid => {
         if (!valid) {
@@ -863,19 +939,13 @@ export default {
       }
       return date || '-';
     },
-    getDateClass(row, dateProp, longTermProp) {
+    isDateExpiring(row, dateProp, longTermProp) {
       if (row[longTermProp] === 1 || !row[dateProp]) {
-        return '';
+        return false;
       }
       const today = this.$dayjs();
       const endDate = this.$dayjs(row[dateProp]);
-      if (endDate.isBefore(today, 'day')) {
-        return 'date-danger';
-      }
-      if (endDate.diff(today, 'day') <= 30) {
-        return 'date-warning';
-      }
-      return '';
+      return endDate.isValid() && endDate.diff(today, 'day') <= 30;
     },
   },
 };
@@ -883,24 +953,22 @@ export default {
 
 <style lang="scss" scoped>
 .driver-page {
-  .driver-toolbar {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: 16px;
-    margin-bottom: 12px;
-  }
-
-  .driver-toolbar__actions {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-  }
-
   .driver-stat {
     flex-shrink: 0;
   }
 
+  :deep(.avue-crud__search .avue-form__menu),
+  :deep(.avue-crud__search .avue-form__menu--right) {
+    flex: 0 0 auto;
+    width: auto;
+    max-width: none;
+  }
+
+  :deep(.avue-crud__search .avue-form__menu--right) {
+    margin-left: 12px;
+    justify-content: flex-end;
+  }
+
   :deep(.el-table th .cell),
   :deep(.el-table td .cell) {
     white-space: nowrap;
@@ -935,7 +1003,16 @@ export default {
   }
 }
 
-:deep(.driver-uploader .el-upload) {
+:deep(.driver-uploader) {
+  display: block;
+  width: 100%;
+}
+
+:deep(.driver-uploader .el-upload),
+:deep(.driver-uploader.el-upload) {
+  display: flex;
+  align-items: center;
+  justify-content: center;
   width: 100%;
   height: 170px;
   border: 1px dashed #c0c4cc;
@@ -943,7 +1020,8 @@ export default {
   overflow: hidden;
 }
 
-:deep(.driver-uploader--large .el-upload) {
+:deep(.driver-uploader--large .el-upload),
+:deep(.driver-uploader--large.el-upload) {
   height: 260px;
 }
 
@@ -963,21 +1041,23 @@ export default {
   color: #606266;
 }
 
-.date-warning {
-  color: #f56c6c;
-  font-weight: 600;
+.driver-dialog {
+  :deep(.el-dialog__body) {
+    max-height: 72vh;
+    overflow: auto;
+  }
 }
 
-.date-danger {
+.driver-page__date-expiring {
   color: #d40000;
   font-weight: 600;
 }
 
 @media (max-width: 1200px) {
   .driver-page {
-    .driver-toolbar {
-      align-items: flex-start;
-      flex-direction: column;
+    .driver-stat {
+      display: flex;
+      flex-wrap: wrap;
     }
   }
 }

src/views/transportCapacity/vehicle.vue

@@ -1,7 +1,22 @@
 <template>
   <basic-container class="transport-vehicle-page">
-    <div class="vehicle-toolbar">
-      <div class="vehicle-toolbar__actions">
+    <avue-crud
+      :option="option"
+      :table-loading="loading"
+      :data="data"
+      v-model:page="page"
+      v-model="form"
+      ref="crud"
+      :permission="permissionList"
+      @search-change="searchChange"
+      @search-reset="searchReset"
+      @selection-change="selectionChange"
+      @current-change="currentChange"
+      @size-change="sizeChange"
+      @refresh-change="refreshChange"
+      @on-load="onLoad"
+    >
+      <template #menu-left>
         <el-button
           type="primary"
           icon="el-icon-plus"
@@ -26,34 +41,18 @@
           @click="handleDelete"
           >批量删除
         </el-button>
-      </div>
-      <el-radio-group
-        v-model="query.expireStatus"
-        class="vehicle-stat"
-        @change="handleExpireChange"
-      >
-        <el-radio-button label="">全部（{{ expiryStat.total }}）</el-radio-button>
-        <el-radio-button label="within30">30天内到期（{{ expiryStat.within30 }}）</el-radio-button>
-        <el-radio-button label="expired">已到期（{{ expiryStat.expired }}）</el-radio-button>
-      </el-radio-group>
-    </div>
-
-    <avue-crud
-      :option="option"
-      :table-loading="loading"
-      :data="data"
-      v-model:page="page"
-      v-model="form"
-      ref="crud"
-      :permission="permissionList"
-      @search-change="searchChange"
-      @search-reset="searchReset"
-      @selection-change="selectionChange"
-      @current-change="currentChange"
-      @size-change="sizeChange"
-      @refresh-change="refreshChange"
-      @on-load="onLoad"
-    >
+      </template>
+      <template #menu-right>
+        <el-radio-group
+          v-model="query.expireStatus"
+          class="vehicle-stat"
+          @change="handleExpireChange"
+        >
+          <el-radio-button label="">全部（{{ expiryStat.total }}）</el-radio-button>
+          <el-radio-button label="within30">30天内到期（{{ expiryStat.within30 }}）</el-radio-button>
+          <el-radio-button label="expired">已到期（{{ expiryStat.expired }}）</el-radio-button>
+        </el-radio-group>
+      </template>
       <template #plateNo="{ row }">
         <el-button type="primary" link @click="openVehicle(row, true)">
           {{ row.plateNo }}
@@ -129,19 +128,60 @@
       >
         <div class="section-title">基础车辆信息</div>
         <el-row :gutter="18">
-          <el-col :span="6">
-            <el-form-item label="所属组织" prop="organizationName">
-              <el-input v-model="vehicleForm.organizationName" maxlength="50" />
+          <el-col :span="24">
+            <el-form-item label="所有组织" prop="organizationName">
+              <el-select
+                v-model="vehicleForm.organizationName"
+                filterable
+                clearable
+                placeholder="请选择"
+              >
+                <el-option
+                  v-for="item in organizationOptions"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                />
+              </el-select>
             </el-form-item>
           </el-col>
-          <el-col :span="6">
+        </el-row>
+        <el-row :gutter="18">
+          <el-col :span="10">
             <el-form-item label="车牌号" prop="plateNo">
-              <el-input
-                v-model="vehicleForm.plateNo"
-                maxlength="16"
-                show-word-limit
-                @input="vehicleForm.plateNo = String(vehicleForm.plateNo || '').toUpperCase()"
-              />
+              <div class="plate-group">
+                <el-select
+                  v-model="vehicleForm.plateProvince"
+                  placeholder="请选择"
+                  filterable
+                  @change="syncPlateNo(false)"
+                >
+                  <el-option
+                    v-for="item in plateProvinceOptions"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  />
+                </el-select>
+                <el-input
+                  v-model="vehicleForm.plateNoBody"
+                  maxlength="7"
+                  show-word-limit
+                  @input="handlePlateBodyInput"
+                />
+                <el-select
+                  v-model="vehicleForm.plateColor"
+                  placeholder="请选择"
+                  @change="syncPlateNo(false)"
+                >
+                  <el-option
+                    v-for="item in plateColorOptions"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  />
+                </el-select>
+              </div>
             </el-form-item>
           </el-col>
           <el-col :span="6">
@@ -154,14 +194,69 @@
               >
                 <el-option
                   v-for="item in vehicleTypeOptions"
-                  :key="item"
-                  :label="item"
-                  :value="item"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
                 />
               </el-select>
             </el-form-item>
           </el-col>
-          <el-col :span="6">
+          <el-col :span="8">
+            <el-form-item label="外廓尺寸(毫米)">
+              <div class="dimension-group">
+                <div class="dimension-group__item">
+                  <span class="dimension-group__label">长</span>
+                  <el-input-number
+                    v-model="vehicleForm.outerLength"
+                    :min="0"
+                    :precision="0"
+                    controls-position="right"
+                  />
+                </div>
+                <div class="dimension-group__item">
+                  <span class="dimension-group__label">宽</span>
+                  <el-input-number
+                    v-model="vehicleForm.outerWidth"
+                    :min="0"
+                    :precision="0"
+                    controls-position="right"
+                  />
+                </div>
+                <div class="dimension-group__item">
+                  <span class="dimension-group__label">高</span>
+                  <el-input-number
+                    v-model="vehicleForm.outerHeight"
+                    :min="0"
+                    :precision="0"
+                    controls-position="right"
+                  />
+                </div>
+              </div>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="18">
+          <el-col :span="8">
+            <el-form-item label="核定载质量(KG)" prop="approvedLoadKg">
+              <el-input-number
+                v-model="vehicleForm.approvedLoadKg"
+                :min="0"
+                :precision="0"
+                controls-position="right"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="准牵引总质量(KG)" prop="tractionMassKg">
+              <el-input-number
+                v-model="vehicleForm.tractionMassKg"
+                :min="0"
+                :precision="0"
+                controls-position="right"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
             <el-form-item label="业务关系" prop="businessRelation">
               <el-select v-model="vehicleForm.businessRelation">
                 <el-option
@@ -173,7 +268,9 @@
               </el-select>
             </el-form-item>
           </el-col>
-          <el-col :span="6">
+        </el-row>
+        <el-row :gutter="18">
+          <el-col :span="8">
             <el-form-item label="能源类型" prop="energyType">
               <el-select
                 v-model="vehicleForm.energyType"
@@ -190,221 +287,109 @@
               </el-select>
             </el-form-item>
           </el-col>
-          <el-col :span="6">
-            <el-form-item label="核定载质量(KG)" prop="approvedLoadKg">
-              <el-input-number
-                v-model="vehicleForm.approvedLoadKg"
-                :min="0"
-                :precision="0"
-                controls-position="right"
-              />
+          <el-col :span="8">
+            <el-form-item label="强制报废日期" prop="compulsoryScrapDate">
+              <div class="date-with-flag">
+                <el-date-picker
+                  v-model="vehicleForm.compulsoryScrapDate"
+                  type="date"
+                  value-format="YYYY-MM-DD"
+                  :disabled="vehicleForm.compulsoryScrapLongTerm === 1"
+                />
+                <el-checkbox
+                  v-model="vehicleForm.compulsoryScrapLongTerm"
+                  :true-label="1"
+                  :false-label="0"
+                >
+                  长期有效
+                </el-checkbox>
+              </div>
             </el-form-item>
           </el-col>
-          <el-col :span="6">
-            <el-form-item label="准牵引总质量(KG)" prop="tractionMassKg">
-              <el-input-number
-                v-model="vehicleForm.tractionMassKg"
-                :min="0"
-                :precision="0"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="6">
-            <el-form-item label="状态" prop="status">
-              <el-select v-model="vehicleForm.status">
-                <el-option label="启用" :value="1" />
-                <el-option label="停用" :value="2" />
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="6">
-            <el-form-item label="外廓长度(mm)" prop="outerLength">
-              <el-input-number
-                v-model="vehicleForm.outerLength"
-                :min="0"
-                :precision="0"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="6">
-            <el-form-item label="外廓宽度(mm)" prop="outerWidth">
-              <el-input-number
-                v-model="vehicleForm.outerWidth"
-                :min="0"
-                :precision="0"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="6">
-            <el-form-item label="外廓高度(mm)" prop="outerHeight">
-              <el-input-number
-                v-model="vehicleForm.outerHeight"
-                :min="0"
-                :precision="0"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="6">
+          <el-col :span="8">
             <el-form-item label="海关备案号" prop="customsRecordNo">
               <el-input v-model="vehicleForm.customsRecordNo" maxlength="50" />
             </el-form-item>
           </el-col>
-          <el-col :span="8">
-            <el-form-item label="强制报废日期" prop="compulsoryScrapDate">
-              <el-date-picker
-                v-model="vehicleForm.compulsoryScrapDate"
-                type="date"
-                value-format="YYYY-MM-DD"
-                :disabled="vehicleForm.compulsoryScrapLongTerm === 1"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="4">
-            <el-form-item label="长期有效" prop="compulsoryScrapLongTerm">
-              <el-checkbox
-                v-model="vehicleForm.compulsoryScrapLongTerm"
-                :true-label="1"
-                :false-label="0"
-              >
-                是
-              </el-checkbox>
-            </el-form-item>
-          </el-col>
         </el-row>
 
-        <div class="section-title">行驶证信息</div>
+        <div class="section-title">车辆资质图片</div>
         <el-row :gutter="18">
           <el-col :span="6">
             <el-form-item label="行驶证档案编号" prop="drivingLicenseNo">
               <el-input v-model="vehicleForm.drivingLicenseNo" maxlength="50" />
             </el-form-item>
           </el-col>
-          <el-col :span="10">
+          <el-col :span="8">
             <el-form-item label="行驶证有效期" prop="drivingLicenseEndDate">
-              <div class="date-range">
-                <el-date-picker
-                  v-model="vehicleForm.drivingLicenseStartDate"
-                  type="date"
-                  value-format="YYYY-MM-DD"
-                  placeholder="起"
-                />
+              <div class="date-with-flag">
                 <el-date-picker
                   v-model="vehicleForm.drivingLicenseEndDate"
                   type="date"
                   value-format="YYYY-MM-DD"
-                  placeholder="止"
-                  :disabled="vehicleForm.drivingLicenseLongTerm === 1"
                 />
+                <el-checkbox
+                  v-model="vehicleForm.drivingLicenseLongTerm"
+                  :true-label="1"
+                  :false-label="0"
+                >
+                  长期有效
+                </el-checkbox>
               </div>
             </el-form-item>
           </el-col>
-          <el-col :span="4">
-            <el-form-item label="长期有效" prop="drivingLicenseLongTerm">
-              <el-checkbox
-                v-model="vehicleForm.drivingLicenseLongTerm"
-                :true-label="1"
-                :false-label="0"
-              >
-                是
-              </el-checkbox>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <image-upload-field
-              label="行驶证图片"
-              prop="drivingLicenseImage"
-              :value="vehicleForm.drivingLicenseImage"
-              :readonly="readonly"
-              :headers="uploadHeaders"
-              large
-              @success="url => setImage('drivingLicenseImage', url)"
-            />
-          </el-col>
-        </el-row>
-
-        <div class="section-title">道路运输证信息</div>
-        <el-row :gutter="18">
-          <el-col :span="6">
+          <el-col :span="10">
             <el-form-item label="道路运输证号" prop="roadTransportCertNo">
               <el-input v-model="vehicleForm.roadTransportCertNo" maxlength="50" />
             </el-form-item>
           </el-col>
-          <el-col :span="10">
+        </el-row>
+        <el-row :gutter="18">
+          <el-col :span="8">
             <el-form-item label="道路运输证有效期" prop="roadTransportCertEndDate">
-              <div class="date-range">
-                <el-date-picker
-                  v-model="vehicleForm.roadTransportCertStartDate"
-                  type="date"
-                  value-format="YYYY-MM-DD"
-                  placeholder="起"
-                />
+              <div class="date-with-flag">
                 <el-date-picker
                   v-model="vehicleForm.roadTransportCertEndDate"
                   type="date"
                   value-format="YYYY-MM-DD"
-                  placeholder="止"
-                  :disabled="vehicleForm.roadTransportCertLongTerm === 1"
                 />
+                <el-checkbox
+                  v-model="vehicleForm.roadTransportCertLongTerm"
+                  :true-label="1"
+                  :false-label="0"
+                >
+                  长期有效
+                </el-checkbox>
               </div>
             </el-form-item>
           </el-col>
-          <el-col :span="4">
-            <el-form-item label="长期有效" prop="roadTransportCertLongTerm">
-              <el-checkbox
-                v-model="vehicleForm.roadTransportCertLongTerm"
-                :true-label="1"
-                :false-label="0"
-              >
-                是
-              </el-checkbox>
-            </el-form-item>
-          </el-col>
           <el-col :span="8">
             <el-form-item label="道路运输年审有效期" prop="annualReviewEndDate">
-              <el-date-picker
-                v-model="vehicleForm.annualReviewEndDate"
-                type="date"
-                value-format="YYYY-MM-DD"
-                :disabled="vehicleForm.annualReviewLongTerm === 1"
-              />
+              <div class="date-with-flag">
+                <el-date-picker
+                  v-model="vehicleForm.annualReviewEndDate"
+                  type="date"
+                  value-format="YYYY-MM-DD"
+                  :disabled="vehicleForm.annualReviewLongTerm === 1"
+                />
+                <el-checkbox
+                  v-model="vehicleForm.annualReviewLongTerm"
+                  :true-label="1"
+                  :false-label="0"
+                >
+                  长期有效
+                </el-checkbox>
+              </div>
             </el-form-item>
           </el-col>
-          <el-col :span="4">
-            <el-form-item label="年审长期有效" prop="annualReviewLongTerm">
-              <el-checkbox
-                v-model="vehicleForm.annualReviewLongTerm"
-                :true-label="1"
-                :false-label="0"
-              >
-                是
-              </el-checkbox>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <image-upload-field
-              label="道路运输证图片"
-              prop="roadTransportCertImage"
-              :value="vehicleForm.roadTransportCertImage"
-              :readonly="readonly"
-              :headers="uploadHeaders"
-              large
-              @success="url => setImage('roadTransportCertImage', url)"
-            />
-          </el-col>
         </el-row>
-
-        <div class="section-title">机动车登记本信息</div>
         <el-row :gutter="18">
-          <el-col :span="6">
+          <el-col :span="8">
             <el-form-item label="机动车登记编号" prop="registrationNo">
               <el-input v-model="vehicleForm.registrationNo" maxlength="50" />
             </el-form-item>
           </el-col>
-          <el-col :span="6">
+          <el-col :span="8">
             <el-form-item label="机动车登记日期" prop="registrationDate">
               <el-date-picker
                 v-model="vehicleForm.registrationDate"
@@ -413,24 +398,79 @@
               />
             </el-form-item>
           </el-col>
-          <el-col :span="12">
-            <el-form-item label="备注" prop="remark">
-              <el-input
-                v-model="vehicleForm.remark"
-                type="textarea"
-                maxlength="200"
-                show-word-limit
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
+        </el-row>
+        <el-row :gutter="18">
+          <el-col :span="8">
             <image-upload-field
-              label="机动车登记本图片"
+              label="行驶证主页正面"
+              prop="drivingLicenseImage"
+              :value="vehicleForm.drivingLicenseImage"
+              :readonly="readonly"
+              :headers="uploadHeaders"
+              large
+              class-prefix="vehicle"
+              @success="url => setImage('drivingLicenseImage', url)"
+            />
+          </el-col>
+          <el-col :span="8">
+            <image-upload-field
+              label="行驶证主页反面"
+              prop="drivingLicenseMainBack"
+              :value="vehicleForm.drivingLicenseMainBack"
+              :readonly="readonly"
+              :headers="uploadHeaders"
+              large
+              class-prefix="vehicle"
+              @success="url => setImage('drivingLicenseMainBack', url)"
+            />
+          </el-col>
+          <el-col :span="8">
+            <image-upload-field
+              label="行驶证副页正面"
+              prop="drivingLicenseViceFront"
+              :value="vehicleForm.drivingLicenseViceFront"
+              :readonly="readonly"
+              :headers="uploadHeaders"
+              large
+              class-prefix="vehicle"
+              @success="url => setImage('drivingLicenseViceFront', url)"
+            />
+          </el-col>
+        </el-row>
+        <el-row :gutter="18">
+          <el-col :span="8">
+            <image-upload-field
+              label="行驶证副页反面"
+              prop="drivingLicenseViceBack"
+              :value="vehicleForm.drivingLicenseViceBack"
+              :readonly="readonly"
+              :headers="uploadHeaders"
+              large
+              class-prefix="vehicle"
+              @success="url => setImage('drivingLicenseViceBack', url)"
+            />
+          </el-col>
+          <el-col :span="8">
+            <image-upload-field
+              label="道路运输证图片"
+              prop="roadTransportCertImage"
+              :value="vehicleForm.roadTransportCertImage"
+              :readonly="readonly"
+              :headers="uploadHeaders"
+              large
+              class-prefix="vehicle"
+              @success="url => setImage('roadTransportCertImage', url)"
+            />
+          </el-col>
+          <el-col :span="8">
+            <image-upload-field
+              label="机动车登记本"
               prop="registrationImage"
               :value="vehicleForm.registrationImage"
               :readonly="readonly"
               :headers="uploadHeaders"
               large
+              class-prefix="vehicle"
               @success="url => setImage('registrationImage', url)"
             />
           </el-col>
@@ -458,14 +498,19 @@ import {
   changeStatus,
   getExpiryStat,
 } from '@/api/transportCapacity/transport-vehicle';
+import { getDeptTree } from '@/api/system/dept';
 import { exportBlob } from '@/api/common';
 import { getToken } from '@/utils/auth';
 import { downloadXls } from '@/utils/util';
+import ImageUploadField from '@/components/image-upload-field/main.vue';
 
 const emptyForm = () => ({
   id: '',
   organizationName: '',
+  plateProvince: '',
+  plateNoBody: '',
   plateNo: '',
+  plateColor: '',
   vehicleType: '',
   outerLength: undefined,
   outerWidth: undefined,
@@ -482,6 +527,9 @@ const emptyForm = () => ({
   drivingLicenseEndDate: '',
   drivingLicenseLongTerm: 0,
   drivingLicenseImage: '',
+  drivingLicenseMainBack: '',
+  drivingLicenseViceFront: '',
+  drivingLicenseViceBack: '',
   roadTransportCertNo: '',
   roadTransportCertStartDate: '',
   roadTransportCertEndDate: '',
@@ -492,64 +540,50 @@ const emptyForm = () => ({
   registrationNo: '',
   registrationDate: '',
   registrationImage: '',
-  remark: '',
   status: 1,
 });
 
-const imageUploadField = {
-  name: 'ImageUploadField',
-  props: {
-    label: String,
-    prop: String,
-    value: String,
-    readonly: Boolean,
-    headers: Object,
-    large: Boolean,
-  },
-  emits: ['success'],
-  methods: {
-    handleSuccess(res) {
-      if (res.code === 200 && res.data) {
-        this.$emit('success', res.data.link || res.data.url || res.data.domain || '');
-      } else {
-        this.$message.error(res.msg || '上传失败');
-      }
-    },
-    beforeUpload(file) {
-      const validType = ['image/jpeg', 'image/png', 'image/jpg', 'image/bmp'].includes(file.type);
-      const validSize = file.size / 1024 / 1024 < 5;
-      if (!validType) {
-        this.$message.error('仅支持 JPG、PNG、BMP 图片');
-      }
-      if (!validSize) {
-        this.$message.error('图片大小不能超过 5MB');
-      }
-      return validType && validSize;
-    },
-  },
-  template: `
-    <el-form-item :label="label" :prop="prop">
-      <el-upload
-        class="vehicle-uploader"
-        :class="{ 'vehicle-uploader--large': large }"
-        action="/api/blade-resource/oss/endpoint/put-file"
-        name="file"
-        :headers="headers"
-        :show-file-list="false"
-        :disabled="readonly"
-        :before-upload="beforeUpload"
-        :on-success="handleSuccess"
-      >
-        <img v-if="value" :src="value" class="vehicle-uploader__image" />
-        <div v-else class="vehicle-uploader__empty">上传证件图片</div>
-      </el-upload>
-    </el-form-item>
-  `,
-};
+const plateProvinceOptions = [
+  '京',
+  '津',
+  '沪',
+  '渝',
+  '冀',
+  '豫',
+  '云',
+  '辽',
+  '黑',
+  '湘',
+  '皖',
+  '鲁',
+  '新',
+  '苏',
+  '浙',
+  '赣',
+  '鄂',
+  '桂',
+  '甘',
+  '晋',
+  '蒙',
+  '陕',
+  '吉',
+  '闽',
+  '贵',
+  '粤',
+  '青',
+  '藏',
+  '川',
+  '宁',
+  '琼',
+  '港',
+  '澳',
+].map(item => ({ label: item, value: item }));
+
+const plateColorOptions = ['黄牌', '蓝牌', '绿牌'].map(item => ({ label: item, value: item }));
 
 export default {
   components: {
-    ImageUploadField: imageUploadField,
+    ImageUploadField,
   },
   data() {
     return {
@@ -581,34 +615,34 @@ export default {
         'Blade-Auth': `bearer ${getToken()}`,
         'Blade-Requested-With': 'BladeHttpRequest',
       },
-      vehicleTypeOptions: ['厢式', '高栏', '平板', '仓栅', '牵引车', '冷藏车'],
-      businessRelationOptions: ['自有', '业务合作', '管理挂靠'],
+      organizationOptions: [],
+      plateProvinceOptions,
+      plateColorOptions,
+      vehicleTypeOptions: [
+        { label: '高栏车', value: '高栏' },
+        { label: '低栏车', value: '低栏' },
+        { label: '平板车', value: '平板' },
+        { label: '厢式车', value: '厢式' },
+        { label: '拖挂车', value: '拖挂' },
+        { label: '半挂车', value: '半挂' },
+      ],
+      businessRelationOptions: ['自有', '管理挂靠', '业务合作'],
       energyTypeOptions: ['柴油', '汽油', '新能源', '天然气'],
       formRules: {
-        organizationName: [{ required: true, message: '请输入所属组织', trigger: 'blur' }],
-        plateNo: [
-          { required: true, message: '请输入车牌号', trigger: 'blur' },
-          {
-            pattern: /^[\u4e00-\u9fa5][A-Z][A-Z0-9挂学警港澳]{5,6}$/,
-            message: '请输入标准车牌号',
-            trigger: 'blur',
-          },
-        ],
+        organizationName: [{ required: true, message: '请选择所属组织', trigger: 'change' }],
+        plateNo: [{ validator: this.validatePlateNo, trigger: 'change' }],
         vehicleType: [{ required: true, message: '请选择车辆类型', trigger: 'change' }],
         approvedLoadKg: [{ required: true, message: '请输入核定载质量', trigger: 'blur' }],
         businessRelation: [{ required: true, message: '请选择业务关系', trigger: 'change' }],
         energyType: [{ required: true, message: '请选择能源类型', trigger: 'change' }],
         drivingLicenseNo: [{ required: true, message: '请输入行驶证档案编号', trigger: 'blur' }],
-        drivingLicenseEndDate: [
-          { validator: this.validateDrivingLicenseEndDate, trigger: 'change' },
-        ],
+        drivingLicenseEndDate: [{ required: true, message: '请选择行驶证有效期', trigger: 'change' }],
         roadTransportCertNo: [{ required: true, message: '请输入道路运输证号', trigger: 'blur' }],
         roadTransportCertEndDate: [
-          { validator: this.validateRoadTransportCertEndDate, trigger: 'change' },
+          { required: true, message: '请选择道路运输证有效期', trigger: 'change' },
         ],
         annualReviewEndDate: [{ validator: this.validateAnnualReviewEndDate, trigger: 'change' }],
         registrationNo: [{ required: true, message: '请输入机动车登记编号', trigger: 'blur' }],
-        remark: [{ max: 200, message: '备注最多200字', trigger: 'blur' }],
       },
     };
   },
@@ -633,20 +667,44 @@ export default {
       return this.vehicleForm.id ? '修改车辆' : '新增车辆';
     },
   },
+  created() {
+    this.initDeptTree();
+  },
   methods: {
     hasPermission(code) {
       return this.isAdmin || this.permission?.[code] === true;
     },
-    validateDrivingLicenseEndDate(rule, value, callback) {
-      if (this.vehicleForm.drivingLicenseLongTerm !== 1 && !value) {
-        callback(new Error('请选择行驶证有效期止'));
+    initDeptTree() {
+      getDeptTree(this.userInfo.tenantId).then(res => {
+        this.organizationOptions = this.flattenDeptOptions(res.data.data || []);
+        const column = this.findColumn(this.option.column, 'organizationName');
+        column.dicData = this.organizationOptions;
+      });
+    },
+    flattenDeptOptions(tree = [], level = 0) {
+      const result = [];
+      tree.forEach(item => {
+        const label = item.title || item.deptName || item.name;
+        result.push({
+          label: `${'　'.repeat(level)}${label}`,
+          value: label,
+        });
+        if (item.children && item.children.length) {
+          result.push(...this.flattenDeptOptions(item.children, level + 1));
+        }
+      });
+      return result;
+    },
+    validatePlateNo(rule, value, callback) {
+      const plateProvince = String(this.vehicleForm.plateProvince || '').trim();
+      const plateNoBody = String(this.vehicleForm.plateNoBody || '').trim().toUpperCase();
+      const plateColor = String(this.vehicleForm.plateColor || '').trim();
+      if (!plateProvince || !plateNoBody || !plateColor) {
+        callback(new Error('请完整填写车牌号'));
         return;
       }
-      callback();
-    },
-    validateRoadTransportCertEndDate(rule, value, callback) {
-      if (this.vehicleForm.roadTransportCertLongTerm !== 1 && !value) {
-        callback(new Error('请选择道路运输证有效期止'));
+      if (!/^[A-Z][A-Z0-9挂学警港澳]{5,6}$/.test(plateNoBody)) {
+        callback(new Error('请输入标准车牌号'));
         return;
       }
       callback();
@@ -662,6 +720,7 @@ export default {
       this.readonly = readonly;
       if (!row?.id) {
         this.vehicleForm = emptyForm();
+        this.syncPlateNo(false);
         this.vehicleBox = true;
         return;
       }
@@ -670,6 +729,8 @@ export default {
           ...emptyForm(),
           ...(res.data.data || {}),
         };
+        this.splitPlateNo();
+        this.syncPlateNo(false);
         this.vehicleBox = true;
       });
     },
@@ -683,7 +744,33 @@ export default {
       this.vehicleForm[prop] = url;
       this.$refs.vehicleForm?.validateField(prop);
     },
+    handlePlateBodyInput(value) {
+      this.vehicleForm.plateNoBody = String(value || '').toUpperCase();
+      this.syncPlateNo();
+    },
+    syncPlateNo(validate = true) {
+      const plateProvince = String(this.vehicleForm.plateProvince || '').trim();
+      const plateNoBody = String(this.vehicleForm.plateNoBody || '').trim().toUpperCase();
+      const plateColor = String(this.vehicleForm.plateColor || '').trim();
+      this.vehicleForm.plateNoBody = plateNoBody;
+      this.vehicleForm.plateNo = plateProvince && plateNoBody ? `${plateProvince}${plateNoBody}` : '';
+      this.vehicleForm.plateColor = plateColor;
+      if (validate) {
+        this.$refs.vehicleForm?.validateField('plateNo');
+      }
+    },
+    splitPlateNo() {
+      const plateNo = String(this.vehicleForm.plateNo || '').trim();
+      if (!plateNo) {
+        this.vehicleForm.plateProvince = '';
+        this.vehicleForm.plateNoBody = '';
+        return;
+      }
+      this.vehicleForm.plateProvince = plateNo.slice(0, 1);
+      this.vehicleForm.plateNoBody = plateNo.slice(1).toUpperCase();
+    },
     handleSubmit() {
+      this.syncPlateNo();
       this.$refs.vehicleForm.validate(valid => {
         if (!valid) {
           return;
@@ -850,20 +937,6 @@ export default {
 
 <style lang="scss" scoped>
 .transport-vehicle-page {
-  .vehicle-toolbar {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: 16px;
-    margin-bottom: 12px;
-  }
-
-  .vehicle-toolbar__actions {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-  }
-
   .vehicle-stat {
     flex-shrink: 0;
   }
@@ -896,14 +969,74 @@ export default {
     width: 100%;
   }
 
+  .plate-group {
+    display: grid;
+    grid-template-columns: 112px minmax(0, 1fr) 112px;
+    gap: 8px;
+    align-items: center;
+  }
+
+  .dimension-group {
+    display: grid;
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+    gap: 8px;
+    align-items: center;
+  }
+
+  .dimension-group__item {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    min-width: 0;
+  }
+
+  .dimension-group__label {
+    flex-shrink: 0;
+    color: #303133;
+    font-weight: 500;
+  }
+
+  .date-with-flag {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+  }
+
+  .date-with-flag :deep(.el-date-editor) {
+    flex: 1;
+    min-width: 0;
+  }
+
+  .date-with-flag :deep(.el-checkbox) {
+    flex-shrink: 0;
+    margin-right: 0;
+  }
+
+  .date-with-flag :deep(.el-checkbox__label) {
+    padding-left: 4px;
+  }
+
   .date-range {
     display: grid;
     grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
     gap: 8px;
   }
+
+  :deep(.el-form-item__label) {
+    white-space: nowrap;
+  }
 }
 
-:deep(.vehicle-uploader .el-upload) {
+:deep(.vehicle-uploader) {
+  display: block;
+  width: 100%;
+}
+
+:deep(.vehicle-uploader .el-upload),
+:deep(.vehicle-uploader.el-upload) {
+  display: flex;
+  align-items: center;
+  justify-content: center;
   width: 100%;
   height: 170px;
   border: 1px dashed #c0c4cc;
@@ -911,7 +1044,8 @@ export default {
   overflow: hidden;
 }
 
-:deep(.vehicle-uploader--large .el-upload) {
+:deep(.vehicle-uploader--large .el-upload),
+:deep(.vehicle-uploader--large.el-upload) {
   height: 260px;
 }
 
@@ -940,13 +1074,4 @@ export default {
   color: #d40000;
   font-weight: 600;
 }
-
-@media (max-width: 1200px) {
-  .transport-vehicle-page {
-    .vehicle-toolbar {
-      align-items: flex-start;
-      flex-direction: column;
-    }
-  }
-}
 </style>

src/views/vehicle/accident-record.vue

@@ -119,11 +119,16 @@ import { exportBlob } from '@/api/common';
 import { downloadXls } from '@/utils/util';
 import { openImportDialog } from '@/utils/import-excel';
 import { getToken } from '@/utils/auth';
+import { normalizeSearchRangeParams } from '@/utils/search-range';
 import { mapGetters } from 'vuex';
 import { excelOption, option } from '@/option/vehicle/accident-record';
 import NProgress from 'nprogress';
 import 'nprogress/nprogress.css';
 
+const createTimeRangeMap = {
+  createTimeRange: ['createTimeStart', 'createTimeEnd'],
+};
+
 export default {
   data() {
     return {
@@ -388,9 +393,9 @@ export default {
       this.onLoad(this.page);
     },
     searchChange(params, done) {
-      this.query = params;
+      this.query = this.buildQuery(params);
       this.page.currentPage = 1;
-      this.onLoad(this.page, params);
+      this.onLoad(this.page);
       done();
     },
     selectionChange(list) {
@@ -411,7 +416,7 @@ export default {
     },
     onLoad(page, params = {}) {
       this.loading = true;
-      getList(page.currentPage, page.pageSize, { ...params, ...this.query })
+      getList(page.currentPage, page.pageSize, this.buildQuery(params))
         .then(res => {
           const data = res.data.data;
           this.page.total = data.total;
@@ -446,11 +451,14 @@ export default {
     },
     buildExportParams() {
       return {
-        ...this.query,
+        ...this.buildQuery(),
         ids: this.ids,
         [this.website.tokenHeader]: getToken(),
       };
     },
+    buildQuery(params = {}) {
+      return normalizeSearchRangeParams({ ...params, ...this.query }, createTimeRangeMap);
+    },
     handleTemplate() {
       exportBlob(
         `/blade-transport/accident-record/export-template?${this.website.tokenHeader}=${getToken()}`

src/views/vehicle/credit-score-quantification.vue

@@ -361,10 +361,15 @@ import { exportBlob } from '@/api/common';
 import { downloadXls } from '@/utils/util';
 import { openImportDialog } from '@/utils/import-excel';
 import { getToken } from '@/utils/auth';
+import { normalizeSearchRangeParams } from '@/utils/search-range';
 import { mapGetters } from 'vuex';
 import NProgress from 'nprogress';
 import 'nprogress/nprogress.css';
 
+const createTimeRangeMap = {
+  createTimeRange: ['createTimeStart', 'createTimeEnd'],
+};
+
 export default {
   data() {
     return {
@@ -409,7 +414,7 @@ export default {
         searchShow: true,
         searchMenuSpan: 24,
         searchIcon: true,
-        searchIndex: 8,
+        searchIndex: 4,
         searchMenuPosition: 'right',
         border: true,
         index: true,
@@ -459,20 +464,12 @@ export default {
             minWidth: 160,
           },
           {
-            label: '创建开始时间',
-            prop: 'createTimeStart',
+            label: '创建时间',
+            prop: 'createTimeRange',
             type: 'date',
-            format: 'YYYY-MM-DD 00:00:00',
-            valueFormat: 'YYYY-MM-DD 00:00:00',
-            hide: true,
-            display: false,
-          },
-          {
-            label: '创建结束时间',
-            prop: 'createTimeEnd',
-            type: 'date',
-            format: 'YYYY-MM-DD 23:59:59',
-            valueFormat: 'YYYY-MM-DD 23:59:59',
+            format: 'YYYY-MM-DD',
+            valueFormat: 'YYYY-MM-DD',
+            searchRange: true,
             hide: true,
             display: false,
           },
@@ -795,9 +792,9 @@ export default {
       this.onLoad(this.page);
     },
     searchChange(params, done) {
-      this.query = params;
+      this.query = this.buildQuery(params);
       this.page.currentPage = 1;
-      this.onLoad(this.page, params);
+      this.onLoad(this.page);
       done();
     },
     selectionChange(list) {
@@ -814,7 +811,7 @@ export default {
     },
     onLoad(page, params = {}) {
       this.loading = true;
-      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+      getList(page.currentPage, page.pageSize, this.buildQuery(params)).then(res => {
         const data = res.data.data;
         this.page.total = data.total;
         this.data = data.records;
@@ -845,11 +842,14 @@ export default {
     },
     buildExportParams() {
       return {
-        ...this.query,
+        ...this.buildQuery(),
         ids: this.ids,
         [this.website.tokenHeader]: getToken(),
       };
     },
+    buildQuery(params = {}) {
+      return normalizeSearchRangeParams({ ...params, ...this.query }, createTimeRangeMap);
+    },
     handleTemplate() {
       exportBlob(
         `/blade-transport/credit-score-quantification/export-template?${

src/views/vehicle/customer-archive.vue

@@ -600,10 +600,15 @@ import { getDeptTree } from '@/api/system/dept';
 import { exportBlob } from '@/api/common';
 import { downloadXls } from '@/utils/util';
 import { getToken } from '@/utils/auth';
+import { normalizeSearchRangeParams } from '@/utils/search-range';
 import { mapGetters } from 'vuex';
 import NProgress from 'nprogress';
 import 'nprogress/nprogress.css';
 
+const createTimeRangeMap = {
+  createTimeRange: ['createTimeStart', 'createTimeEnd'],
+};
+
 const EditableTable = {
   props: {
     data: {
@@ -788,7 +793,7 @@ export default {
         searchShow: true,
         searchMenuSpan: 24,
         searchIcon: true,
-        searchIndex: 8,
+        searchIndex: 4,
         searchMenuPosition: 'right',
         border: true,
         index: true,
@@ -869,21 +874,12 @@ export default {
             clearable: true,
           },
           {
-            label: '创建开始时间',
-            prop: 'createTimeStart',
+            label: '创建时间',
+            prop: 'createTimeRange',
             type: 'date',
-            format: 'YYYY-MM-DD 00:00:00',
-            valueFormat: 'YYYY-MM-DD 00:00:00',
-            search: true,
-            hide: true,
-            display: false,
-          },
-          {
-            label: '创建结束时间',
-            prop: 'createTimeEnd',
-            type: 'date',
-            format: 'YYYY-MM-DD 23:59:59',
-            valueFormat: 'YYYY-MM-DD 23:59:59',
+            format: 'YYYY-MM-DD',
+            valueFormat: 'YYYY-MM-DD',
+            searchRange: true,
             search: true,
             hide: true,
             display: false,
@@ -1377,9 +1373,9 @@ export default {
       this.onLoad(this.page);
     },
     searchChange(params, done) {
-      this.query = params;
+      this.query = this.buildQuery(params);
       this.page.currentPage = 1;
-      this.onLoad(this.page, params);
+      this.onLoad(this.page);
       done();
     },
     selectionChange(list) {
@@ -1400,7 +1396,7 @@ export default {
     },
     onLoad(page, params = {}) {
       this.loading = true;
-      getList(page.currentPage, page.pageSize, { ...params, ...this.query })
+      getList(page.currentPage, page.pageSize, this.buildQuery(params))
         .then(res => {
           const pageData = res.data.data;
           this.page.total = pageData.total;
@@ -1432,11 +1428,14 @@ export default {
     },
     buildExportParams() {
       return {
-        ...this.query,
+        ...this.buildQuery(),
         ids: this.ids,
         [this.website.tokenHeader]: getToken(),
       };
     },
+    buildQuery(params = {}) {
+      return normalizeSearchRangeParams({ ...params, ...this.query }, createTimeRangeMap);
+    },
   },
 };
 </script>

src/views/vehicle/insurance-record.vue

@@ -157,11 +157,16 @@ import { exportBlob } from '@/api/common';
 import { downloadXls } from '@/utils/util';
 import { openImportDialog } from '@/utils/import-excel';
 import { getToken } from '@/utils/auth';
+import { normalizeSearchRangeParams } from '@/utils/search-range';
 import { mapGetters } from 'vuex';
 import { excelOption, option } from '@/option/vehicle/insurance-record';
 import NProgress from 'nprogress';
 import 'nprogress/nprogress.css';
 
+const createTimeRangeMap = {
+  createTimeRange: ['createTimeStart', 'createTimeEnd'],
+};
+
 export default {
   data() {
     return {
@@ -281,6 +286,9 @@ export default {
       }
       return values;
     },
+    buildQuery(params = {}) {
+      return normalizeSearchRangeParams({ ...params, ...this.query }, createTimeRangeMap);
+    },
     validateRow(row) {
       if (row.startDate && row.endDate && row.endDate < row.startDate) {
         this.$message.warning('结束日期不能早于开始日期');
@@ -386,9 +394,9 @@ export default {
       this.onLoad(this.page);
     },
     searchChange(params, done) {
-      this.query = params;
+      this.query = this.buildQuery(params);
       this.page.currentPage = 1;
-      this.onLoad(this.page, params);
+      this.onLoad(this.page);
       done();
     },
     selectionChange(list) {
@@ -409,7 +417,8 @@ export default {
     },
     onLoad(page, params = {}) {
       this.loading = true;
-      getList(page.currentPage, page.pageSize, { ...params, ...this.query })
+      const query = this.buildQuery(params);
+      getList(page.currentPage, page.pageSize, query)
         .then(res => {
           const data = res.data.data;
           this.page.total = data.total;
@@ -444,7 +453,7 @@ export default {
     },
     buildExportParams() {
       return {
-        ...this.query,
+        ...this.buildQuery(),
         ids: this.ids,
         [this.website.tokenHeader]: getToken(),
       };
@@ -493,10 +502,10 @@ export default {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  min-height: 116px;
-  padding: 26px 46px 26px 32px;
-  border: 2px dashed #8b8b8b;
-  border-radius: 12px;
+  min-height: 88px;
+  padding: 16px 28px 16px 22px;
+  border: 1px dashed #8b8b8b;
+  border-radius: 8px;
   background: #fff;
 }
 
@@ -511,34 +520,34 @@ export default {
   display: flex;
   align-items: center;
   justify-content: center;
-  width: 56px;
-  height: 56px;
-  margin-right: 30px;
+  width: 42px;
+  height: 42px;
+  margin-right: 18px;
   color: #707070;
 }
 
 :global(.insurance-record-page__upload-icon::before),
 :global(.insurance-record-page__upload-icon::after) {
   position: absolute;
-  width: 14px;
-  height: 14px;
+  width: 11px;
+  height: 11px;
   content: '';
 }
 
 :global(.insurance-record-page__upload-icon::before) {
   top: 0;
   left: 0;
-  border-top: 4px solid currentColor;
-  border-left: 4px solid currentColor;
-  border-radius: 4px 0 0;
+  border-top: 3px solid currentColor;
+  border-left: 3px solid currentColor;
+  border-radius: 3px 0 0;
 }
 
 :global(.insurance-record-page__upload-icon::after) {
   right: 0;
   bottom: 0;
-  border-right: 4px solid currentColor;
-  border-bottom: 4px solid currentColor;
-  border-radius: 0 0 4px;
+  border-right: 3px solid currentColor;
+  border-bottom: 3px solid currentColor;
+  border-radius: 0 0 3px;
 }
 
 :global(.insurance-record-page__upload-card) {
@@ -546,10 +555,10 @@ export default {
   display: flex;
   align-items: center;
   justify-content: center;
-  width: 36px;
-  height: 28px;
-  border: 4px solid currentColor;
-  border-radius: 4px;
+  width: 28px;
+  height: 22px;
+  border: 3px solid currentColor;
+  border-radius: 3px;
 }
 
 :global(.insurance-record-page__upload-card::before),
@@ -559,38 +568,38 @@ export default {
 }
 
 :global(.insurance-record-page__upload-card::before) {
-  top: 7px;
-  left: 9px;
-  width: 8px;
-  height: 8px;
-  border: 3px solid currentColor;
+  top: 5px;
+  left: 7px;
+  width: 6px;
+  height: 6px;
+  border: 2px solid currentColor;
   border-radius: 2px;
 }
 
 :global(.insurance-record-page__upload-card::after) {
-  top: 8px;
-  right: 7px;
-  width: 8px;
-  height: 3px;
+  top: 6px;
+  right: 5px;
+  width: 6px;
+  height: 2px;
   background: currentColor;
-  box-shadow: 0 8px 0 currentColor;
+  box-shadow: 0 6px 0 currentColor;
 }
 
 :global(.insurance-record-page__upload-card span) {
   position: absolute;
-  right: 7px;
-  bottom: 5px;
-  width: 10px;
-  height: 3px;
+  right: 5px;
+  bottom: 4px;
+  width: 8px;
+  height: 2px;
   background: currentColor;
 }
 
 :global(.insurance-record-page__upload-text) {
   display: flex;
   flex-direction: column;
-  gap: 8px;
+  gap: 4px;
   color: #303133;
-  font-size: 20px;
+  font-size: 16px;
   line-height: 1.25;
 }
 
@@ -605,7 +614,7 @@ export default {
 
 :global(.insurance-record-page__upload-action) {
   flex: 0 0 auto;
-  margin-left: 24px;
+  margin-left: 18px;
 }
 
 :global(.insurance-record-page__upload-action .el-upload) {
@@ -613,10 +622,10 @@ export default {
 }
 
 :global(.insurance-record-page__upload-button) {
-  min-width: 156px;
-  height: 58px;
-  border-radius: 8px;
-  font-size: 20px;
+  min-width: 112px;
+  height: 40px;
+  border-radius: 6px;
+  font-size: 14px;
   font-weight: 500;
 }
 
@@ -624,8 +633,8 @@ export default {
   :global(.insurance-record-page__upload) {
     align-items: stretch;
     flex-direction: column;
-    gap: 18px;
-    padding: 22px;
+    gap: 12px;
+    padding: 16px;
   }
 
   :global(.insurance-record-page__upload-action) {

src/views/vehicle/maintenance-plan.vue

@@ -120,10 +120,15 @@ import { downloadXls } from '@/utils/util';
 import { openImportDialog } from '@/utils/import-excel';
 import { formatUpdateUserName } from '@/utils/audit';
 import { getToken } from '@/utils/auth';
+import { normalizeSearchRangeParams } from '@/utils/search-range';
 import { mapGetters } from 'vuex';
 import NProgress from 'nprogress';
 import 'nprogress/nprogress.css';
 
+const createTimeRangeMap = {
+  createTimeRange: ['createTimeStart', 'createTimeEnd'],
+};
+
 export default {
   data() {
     const validateNonNegative = (rule, value, callback) => {
@@ -160,7 +165,7 @@ export default {
         searchShow: true,
         searchMenuSpan: 24,
         searchIcon: true,
-        searchIndex: 8,
+        searchIndex: 4,
         searchMenuPosition: 'right',
         border: true,
         index: true,
@@ -337,23 +342,12 @@ export default {
             minWidth: 170,
           },
           {
-            label: '创建开始时间',
-            prop: 'createTimeStart',
+            label: '创建时间',
+            prop: 'createTimeRange',
             type: 'date',
-            format: 'YYYY-MM-DD 00:00:00',
-            valueFormat: 'YYYY-MM-DD 00:00:00',
-            search: true,
-            hide: true,
-            addDisplay: false,
-            editDisplay: false,
-            viewDisplay: false,
-          },
-          {
-            label: '创建结束时间',
-            prop: 'createTimeEnd',
-            type: 'date',
-            format: 'YYYY-MM-DD 23:59:59',
-            valueFormat: 'YYYY-MM-DD 23:59:59',
+            format: 'YYYY-MM-DD',
+            valueFormat: 'YYYY-MM-DD',
+            searchRange: true,
             search: true,
             hide: true,
             addDisplay: false,
@@ -652,9 +646,9 @@ export default {
       this.onLoad(this.page);
     },
     searchChange(params, done) {
-      this.query = params;
+      this.query = this.buildQuery(params);
       this.page.currentPage = 1;
-      this.onLoad(this.page, params);
+      this.onLoad(this.page);
       done();
     },
     selectionChange(list) {
@@ -675,7 +669,7 @@ export default {
     },
     onLoad(page, params = {}) {
       this.loading = true;
-      getList(page.currentPage, page.pageSize, { ...params, ...this.query })
+      getList(page.currentPage, page.pageSize, this.buildQuery(params))
         .then(res => {
           const data = res.data.data;
           this.page.total = data.total;
@@ -710,11 +704,14 @@ export default {
     },
     buildExportParams() {
       return {
-        ...this.query,
+        ...this.buildQuery(),
         ids: this.ids,
         [this.website.tokenHeader]: getToken(),
       };
     },
+    buildQuery(params = {}) {
+      return normalizeSearchRangeParams({ ...params, ...this.query }, createTimeRangeMap);
+    },
     handleTemplate() {
       exportBlob(
         `/blade-transport/maintenance-plan/export-template?${

src/views/vehicle/maintenance-record.vue

@@ -117,10 +117,15 @@ import { downloadXls } from '@/utils/util';
 import { openImportDialog } from '@/utils/import-excel';
 import { formatUpdateUserName } from '@/utils/audit';
 import { getToken } from '@/utils/auth';
+import { normalizeSearchRangeParams } from '@/utils/search-range';
 import { mapGetters } from 'vuex';
 import NProgress from 'nprogress';
 import 'nprogress/nprogress.css';
 
+const createTimeRangeMap = {
+  createTimeRange: ['createTimeStart', 'createTimeEnd'],
+};
+
 export default {
   data() {
     const validateNonNegative = (rule, value, callback) => {
@@ -158,7 +163,7 @@ export default {
         searchShow: true,
         searchMenuSpan: 24,
         searchIcon: true,
-        searchIndex: 8,
+        searchIndex: 4,
         searchMenuPosition: 'right',
         border: true,
         index: true,
@@ -333,23 +338,12 @@ export default {
             minWidth: 170,
           },
           {
-            label: '创建开始时间',
-            prop: 'createTimeStart',
+            label: '创建时间',
+            prop: 'createTimeRange',
             type: 'date',
-            format: 'YYYY-MM-DD 00:00:00',
-            valueFormat: 'YYYY-MM-DD 00:00:00',
-            search: true,
-            hide: true,
-            addDisplay: false,
-            editDisplay: false,
-            viewDisplay: false,
-          },
-          {
-            label: '创建结束时间',
-            prop: 'createTimeEnd',
-            type: 'date',
-            format: 'YYYY-MM-DD 23:59:59',
-            valueFormat: 'YYYY-MM-DD 23:59:59',
+            format: 'YYYY-MM-DD',
+            valueFormat: 'YYYY-MM-DD',
+            searchRange: true,
             search: true,
             hide: true,
             addDisplay: false,
@@ -637,9 +631,9 @@ export default {
       this.onLoad(this.page);
     },
     searchChange(params, done) {
-      this.query = params;
+      this.query = this.buildQuery(params);
       this.page.currentPage = 1;
-      this.onLoad(this.page, params);
+      this.onLoad(this.page);
       done();
     },
     selectionChange(list) {
@@ -660,7 +654,7 @@ export default {
     },
     onLoad(page, params = {}) {
       this.loading = true;
-      getList(page.currentPage, page.pageSize, { ...params, ...this.query })
+      getList(page.currentPage, page.pageSize, this.buildQuery(params))
         .then(res => {
           const data = res.data.data;
           this.page.total = data.total;
@@ -695,11 +689,14 @@ export default {
     },
     buildExportParams() {
       return {
-        ...this.query,
+        ...this.buildQuery(),
         ids: this.ids,
         [this.website.tokenHeader]: getToken(),
       };
     },
+    buildQuery(params = {}) {
+      return normalizeSearchRangeParams({ ...params, ...this.query }, createTimeRangeMap);
+    },
     handleTemplate() {
       exportBlob(
         `/blade-transport/maintenance-record/export-template?${

src/views/vehicle/mileage-record.vue

@@ -138,11 +138,16 @@ import { exportBlob } from '@/api/common';
 import { downloadXls } from '@/utils/util';
 import { openImportDialog } from '@/utils/import-excel';
 import { getToken } from '@/utils/auth';
+import { normalizeSearchRangeParams } from '@/utils/search-range';
 import { mapGetters } from 'vuex';
 import { excelOption, option } from '@/option/vehicle/mileage-record';
 import NProgress from 'nprogress';
 import 'nprogress/nprogress.css';
 
+const createTimeRangeMap = {
+  createTimeRange: ['createTimeStart', 'createTimeEnd'],
+};
+
 export default {
   data() {
     return {
@@ -464,15 +469,16 @@ export default {
     searchReset() {
       this.query = {};
       if (this.$refs.crud?.search) {
+        this.$refs.crud.search.createTimeRange = undefined;
         this.$refs.crud.search.totalMileageStart = undefined;
         this.$refs.crud.search.totalMileageEnd = undefined;
       }
       this.onLoad(this.page);
     },
     searchChange(params, done) {
-      this.query = params;
+      this.query = this.buildQuery(params);
       this.page.currentPage = 1;
-      this.onLoad(this.page, params);
+      this.onLoad(this.page);
       done();
     },
     selectionChange(list) {
@@ -493,7 +499,7 @@ export default {
     },
     onLoad(page, params = {}) {
       this.loading = true;
-      getList(page.currentPage, page.pageSize, { ...params, ...this.query })
+      getList(page.currentPage, page.pageSize, this.buildQuery(params))
         .then(res => {
           const data = res.data.data;
           this.page.total = data.total;
@@ -528,11 +534,14 @@ export default {
     },
     buildExportParams() {
       return {
-        ...this.query,
+        ...this.buildQuery(),
         ids: this.ids,
         [this.website.tokenHeader]: getToken(),
       };
     },
+    buildQuery(params = {}) {
+      return normalizeSearchRangeParams({ ...params, ...this.query }, createTimeRangeMap);
+    },
     handleTemplate() {
       exportBlob(
         `/blade-transport/mileage-record/export-template?${this.website.tokenHeader}=${getToken()}`

src/views/vehicle/tire-replacement-record.vue

@@ -118,11 +118,16 @@ import { exportBlob } from '@/api/common';
 import { downloadXls } from '@/utils/util';
 import { openImportDialog } from '@/utils/import-excel';
 import { getToken } from '@/utils/auth';
+import { normalizeSearchRangeParams } from '@/utils/search-range';
 import { mapGetters } from 'vuex';
 import { excelOption, option } from '@/option/vehicle/tire-replacement-record';
 import NProgress from 'nprogress';
 import 'nprogress/nprogress.css';
 
+const createTimeRangeMap = {
+  createTimeRange: ['createTimeStart', 'createTimeEnd'],
+};
+
 export default {
   data() {
     return {
@@ -328,9 +333,9 @@ export default {
       this.onLoad(this.page);
     },
     searchChange(params, done) {
-      this.query = params;
+      this.query = this.buildQuery(params);
       this.page.currentPage = 1;
-      this.onLoad(this.page, params);
+      this.onLoad(this.page);
       done();
     },
     selectionChange(list) {
@@ -351,7 +356,7 @@ export default {
     },
     onLoad(page, params = {}) {
       this.loading = true;
-      getList(page.currentPage, page.pageSize, { ...params, ...this.query })
+      getList(page.currentPage, page.pageSize, this.buildQuery(params))
         .then(res => {
           const data = res.data.data;
           this.page.total = data.total;
@@ -386,11 +391,14 @@ export default {
     },
     buildExportParams() {
       return {
-        ...this.query,
+        ...this.buildQuery(),
         ids: this.ids,
         [this.website.tokenHeader]: getToken(),
       };
     },
+    buildQuery(params = {}) {
+      return normalizeSearchRangeParams({ ...params, ...this.query }, createTimeRangeMap);
+    },
     handleTemplate() {
       exportBlob(
         `/blade-transport/tire-replacement-record/export-template?${

src/views/vehicle/transport-change-record.vue

@@ -101,11 +101,16 @@ import { exportBlob } from '@/api/common';
 import { downloadXls } from '@/utils/util';
 import { openImportDialog } from '@/utils/import-excel';
 import { getToken } from '@/utils/auth';
+import { normalizeSearchRangeParams } from '@/utils/search-range';
 import { mapGetters } from 'vuex';
 import { excelOption, option } from '@/option/vehicle/transport-change-record';
 import NProgress from 'nprogress';
 import 'nprogress/nprogress.css';
 
+const createTimeRangeMap = {
+  createTimeRange: ['createTimeStart', 'createTimeEnd'],
+};
+
 export default {
   data() {
     return {
@@ -346,9 +351,9 @@ export default {
       this.onLoad(this.page);
     },
     searchChange(params, done) {
-      this.query = params;
+      this.query = this.buildQuery(params);
       this.page.currentPage = 1;
-      this.onLoad(this.page, params);
+      this.onLoad(this.page);
       done();
     },
     selectionChange(list) {
@@ -369,7 +374,7 @@ export default {
     },
     onLoad(page, params = {}) {
       this.loading = true;
-      getList(page.currentPage, page.pageSize, { ...params, ...this.query })
+      getList(page.currentPage, page.pageSize, this.buildQuery(params))
         .then(res => {
           const data = res.data.data;
           this.page.total = data.total;
@@ -404,11 +409,14 @@ export default {
     },
     buildExportParams() {
       return {
-        ...this.query,
+        ...this.buildQuery(),
         ids: this.ids,
         [this.website.tokenHeader]: getToken(),
       };
     },
+    buildQuery(params = {}) {
+      return normalizeSearchRangeParams({ ...params, ...this.query }, createTimeRangeMap);
+    },
     handleTemplate() {
       exportBlob(
         `/blade-transport/transport-change-record/export-template?${

src/views/vehicle/violation-record.vue

@@ -145,11 +145,16 @@ import { exportBlob } from '@/api/common';
 import { downloadXls } from '@/utils/util';
 import { openImportDialog } from '@/utils/import-excel';
 import { getToken } from '@/utils/auth';
+import { normalizeSearchRangeParams } from '@/utils/search-range';
 import { mapGetters } from 'vuex';
 import { excelOption, option } from '@/option/vehicle/violation-record';
 import NProgress from 'nprogress';
 import 'nprogress/nprogress.css';
 
+const createTimeRangeMap = {
+  createTimeRange: ['createTimeStart', 'createTimeEnd'],
+};
+
 export default {
   data() {
     return {
@@ -454,9 +459,9 @@ export default {
       this.onLoad(this.page);
     },
     searchChange(params, done) {
-      this.query = params;
+      this.query = this.buildQuery(params);
       this.page.currentPage = 1;
-      this.onLoad(this.page, params);
+      this.onLoad(this.page);
       done();
     },
     selectionChange(list) {
@@ -477,7 +482,7 @@ export default {
     },
     onLoad(page, params = {}) {
       this.loading = true;
-      getList(page.currentPage, page.pageSize, { ...params, ...this.query })
+      getList(page.currentPage, page.pageSize, this.buildQuery(params))
         .then(res => {
           const data = res.data.data;
           this.page.total = data.total;
@@ -512,11 +517,14 @@ export default {
     },
     buildExportParams() {
       return {
-        ...this.query,
+        ...this.buildQuery(),
         ids: this.ids,
         [this.website.tokenHeader]: getToken(),
       };
     },
+    buildQuery(params = {}) {
+      return normalizeSearchRangeParams({ ...params, ...this.query }, createTimeRangeMap);
+    },
     handleTemplate() {
       exportBlob(
         `/blade-transport/violation-record/export-template?${