<template>
  <basic-container class="business-crud-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="actionButtonLikeSearch ? undefined : 'el-icon-plus'"
          :plain="!actionButtonLikeSearch"
          v-if="canCreate"
          @click="$refs.crud.rowAdd()"
          >{{ config.createText || '新增' }}
        </el-button>
        <el-button
          type="primary"
          icon="el-icon-upload"
          plain
          v-if="
            (config.importUrl || config.enableTransportPlanImport) &&
            hasPermission(`${config.permission}_import`) &&
            !readonlyScope
          "
          @click="handleImport"
          >{{ config.importText || '批量导入' }}
        </el-button>
        <el-button
          type="primary"
          icon="el-icon-download"
          plain
          v-if="config.templateUrl && hasPermission(`${config.permission}_template`)"
          @click="handleTemplate"
          >下载模板
        </el-button>
        <el-button
          type="primary"
          icon="el-icon-download"
          plain
          v-if="config.exportUrl && hasPermission(`${config.permission}_export`)"
          @click="handleExport"
          >批量导出
        </el-button>
        <el-button
          type="success"
          icon="el-icon-check"
          plain
          v-if="canBatchComplete"
          @click="handleBatchComplete"
          >批量完成
        </el-button>
        <el-button
          type="primary"
          :plain="!actionButtonLikeSearch"
          v-if="canRoadLoading"
          @click="handleRoadLoading"
          >{{ config.roadLoadingText || '公路配载' }}
        </el-button>
        <el-button
          type="danger"
          icon="el-icon-delete"
          plain
          v-if="
            config.batchDelete !== false &&
            hasPermission(`${config.permission}_delete`) &&
            !readonlyScope
          "
          @click="handleDelete"
          >批量删除
        </el-button>
      </template>

      <template #status="{ row }">
        <el-tag :type="statusTagType(row.status)">
          {{ displayStatus(row, 'status') }}
        </el-tag>
      </template>

      <template #businessStatus="{ row }">
        <el-tag :type="statusTagType(row.businessStatus)">
          {{ displayStatus(row, 'businessStatus') }}
        </el-tag>
      </template>

      <template #approvalStatus="{ row }">
        <el-tag :type="statusTagType(row.approvalStatus)">
          {{ displayStatus(row, 'approvalStatus') }}
        </el-tag>
      </template>

      <template #basicInfoTitle-form>
        <div class="dialog-section-title">基本信息</div>
      </template>

      <template #templateInfoTitle-form>
        <div class="dialog-section-title">模板信息</div>
      </template>

      <template #contractCategory-label>合同类型</template>

      <template #projectName-form>
        <el-select
          v-model="selectedProjectId"
          class="business-crud-page__field"
          placeholder="请选择项目名称"
          filterable
          clearable
          :loading="projectLoading"
          :disabled="dialogReadonly"
          @visible-change="visible => visible && loadProjectOptions()"
          @change="handleProjectChange"
        >
          <el-option
            v-for="item in projectOptions"
            :key="item.id"
            :label="item.projectName"
            :value="item.id"
          />
        </el-select>
      </template>

      <template #contractName-form>
        <el-select
          v-if="contractSelectEnabled"
          v-model="form.contractId"
          class="business-crud-page__field"
          placeholder="请选择客户合同"
          filterable
          clearable
          :loading="contractLoading"
          :disabled="dialogReadonly || !form.projectId"
          @visible-change="visible => visible && loadContractOptionsForProject()"
          @change="handleContractChange"
        >
          <el-option
            v-for="item in contractOptions"
            :key="item.id"
            :label="item.contractName"
            :value="item.id"
          />
        </el-select>
        <el-input
          v-else
          v-model="form.contractName"
          class="business-crud-page__field"
          placeholder="请输入合同名称"
          clearable
          maxlength="100"
          show-word-limit
          :disabled="dialogReadonly"
        />
      </template>

      <template #planName-form>
        <el-select
          v-if="shippingPlanSelectEnabled"
          v-model="form.planName"
          class="business-crud-page__field"
          placeholder="请选择发货计划"
          filterable
          clearable
          :loading="shippingPlanLoading"
          :disabled="dialogReadonly"
          @visible-change="visible => visible && loadShippingPlanOptions()"
          @change="handleShippingPlanChange"
        >
          <el-option
            v-for="item in shippingPlanOptions"
            :key="item.id || item.planName"
            :label="item.planName"
            :value="item.planName"
          />
        </el-select>
        <el-input
          v-else
          v-model="form.planName"
          class="business-crud-page__field"
          placeholder="请输入计划名称"
          clearable
          maxlength="50"
          show-word-limit
          :disabled="dialogReadonly"
        />
      </template>

      <template #shippingInfoTitle-form>
        <div
          class="dialog-section-title dialog-section-title--action business-crud-page__shipping-title"
        >
          <span>收发货信息</span>
          <el-link
            v-if="!dialogReadonly"
            type="primary"
            :disabled="transportAddressSelectDisabled"
            @click="openTransportRouteDialog"
          >
            选择线路
          </el-link>
        </div>
      </template>

      <template #departureAddress-form>
        <div class="business-crud-page__route-address-row">
          <el-input
            v-model="form.departureName"
            readonly
            :placeholder="transportStationNamePlaceholder"
            :suffix-icon="transportStationMode ? Search : undefined"
            :disabled="transportAddressSelectDisabled"
            @click="openTransportPrimaryAddressPicker('departure')"
          />
          <el-input
            v-model="form.departureAddress"
            readonly
            :placeholder="transportAddressDetailPlaceholder"
            :suffix-icon="transportStationMode ? undefined : Location"
            :disabled="transportAddressSelectDisabled"
            @click="openTransportSecondaryAddressPicker('departure')"
          />
          <el-tooltip content="选择常用地址" placement="top">
            <el-button
              type="primary"
              :icon="List"
              link
              :disabled="transportAddressSelectDisabled"
              @click="openTransportAddressDialog('departure')"
            />
          </el-tooltip>
          <span class="business-crud-page__route-label">联系人</span>
          <el-input
            v-model="form.departureContact"
            placeholder="请输入"
            :disabled="dialogReadonly"
          />
          <span class="business-crud-page__route-label">联系方式</span>
          <el-input v-model="form.departurePhone" placeholder="请输入" :disabled="dialogReadonly" />
        </div>
      </template>

      <template #arrivalAddress-form>
        <div class="business-crud-page__route-address-row">
          <el-input
            v-model="form.arrivalName"
            readonly
            :placeholder="transportStationNamePlaceholder"
            :suffix-icon="transportStationMode ? Search : undefined"
            :disabled="transportAddressSelectDisabled"
            @click="openTransportPrimaryAddressPicker('arrival')"
          />
          <el-input
            v-model="form.arrivalAddress"
            readonly
            :placeholder="transportAddressDetailPlaceholder"
            :suffix-icon="transportStationMode ? undefined : Location"
            :disabled="transportAddressSelectDisabled"
            @click="openTransportSecondaryAddressPicker('arrival')"
          />
          <el-tooltip content="选择常用地址" placement="top">
            <el-button
              type="primary"
              :icon="List"
              link
              :disabled="transportAddressSelectDisabled"
              @click="openTransportAddressDialog('arrival')"
            />
          </el-tooltip>
          <span class="business-crud-page__route-label">联系人</span>
          <el-input v-model="form.arrivalContact" placeholder="请输入" :disabled="dialogReadonly" />
          <span class="business-crud-page__route-label">联系方式</span>
          <el-input v-model="form.arrivalPhone" placeholder="请输入" :disabled="dialogReadonly" />
        </div>
      </template>

      <template #taskInfoTitle-form>
        <div class="dialog-section-title">任务信息</div>
      </template>

      <template #taskInfoForm-form>
        <div class="business-crud-page__task">
          <div class="business-crud-page__task-toolbar">
            <el-segmented
              v-model="form.taskEntryMode"
              :options="taskEntryModeOptions"
              :disabled="dialogReadonly"
              @change="handleTaskEntryModeChange"
            />
          </div>
          <div v-if="isTaskFullMode" class="business-crud-page__task-full">
            <div class="business-crud-page__subsection">
              <div
                class="dialog-section-title dialog-section-title--action business-crud-page__goods-title"
              >
                <span>货物信息</span>
                <div v-if="!dialogReadonly" class="business-crud-page__section-actions">
                  <el-link type="primary" @click="cargoImportBox = true">导入货物</el-link>
                  <el-link type="primary" @click="openCommonCargoDialog">常用货物</el-link>
                </div>
              </div>
              <div class="business-crud-page__cargo-wrap">
                <el-table
                  :data="transportCargoRows"
                  border
                  class="business-crud-page__cargo-table business-crud-page__cargo-table--task"
                  empty-text="暂无货物信息"
                >
                  <el-table-column
                    type="index"
                    label="序号"
                    width="70"
                    align="center"
                    fixed="left"
                  />
                  <el-table-column min-width="240" align="center">
                    <template #header>
                      <span class="business-crud-page__required-column">货物名称</span>
                    </template>
                    <template #default="{ row }">
                      <el-select
                        v-model="row.cargoName"
                        placeholder="请输入"
                        filterable
                        allow-create
                        default-first-option
                        clearable
                        :disabled="dialogReadonly"
                        :loading="isTaskCargoOptionsLoading(row.cargoTypePath)"
                        @visible-change="
                          visible => visible && loadTaskCargoOptionsByPath(row.cargoTypePath)
                        "
                        @change="value => handleTaskCargoRowNameChange(row, value)"
                      >
                        <el-option
                          v-for="item in getTaskCargoRowOptions(row)"
                          :key="item.id || item.cargoCode || item.cargoName"
                          :label="formatBillingCargoTypeLabel(item)"
                          :value="formatBillingCargoTypeLabel(item)"
                        />
                      </el-select>
                    </template>
                  </el-table-column>
                  <el-table-column min-width="220" align="center">
                    <template #header>
                      <span class="business-crud-page__required-column">货物类型</span>
                    </template>
                    <template #default="{ row }">
                      <el-cascader
                        v-model="row.cargoTypePath"
                        :options="transportCargoTypeOptions"
                        :props="transportCargoTypeCascaderProps"
                        placeholder="从货物类型获取"
                        clearable
                        filterable
                        :disabled="dialogReadonly"
                        :filter-method="filterBillingCargoType"
                        @visible-change="visible => visible && ensureBillingCargoTypeOptions()"
                        @change="value => handleTransportCargoTypeChange(row, value)"
                      />
                    </template>
                  </el-table-column>
                  <el-table-column label="包装" min-width="130" align="center">
                    <template #default="{ row }">
                      <el-select v-model="row.packageType" clearable :disabled="dialogReadonly">
                        <el-option
                          v-for="item in packageOptions"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        />
                      </el-select>
                    </template>
                  </el-table-column>
                  <el-table-column min-width="130" align="center">
                    <template #header>
                      <span class="business-crud-page__required-column">数量</span>
                    </template>
                    <template #default="{ row }">
                      <el-input
                        v-model="row.quantity"
                        placeholder="请输入"
                        :disabled="dialogReadonly"
                        @input="value => handleTransportCargoQuantityInput(row, value)"
                      />
                    </template>
                  </el-table-column>
                  <el-table-column min-width="140" align="center">
                    <template #header>
                      <span class="business-crud-page__required-column">数量单位</span>
                    </template>
                    <template #default="{ row }">
                      <el-select
                        v-model="row.quantityUnit"
                        clearable
                        :disabled="dialogReadonly"
                        @visible-change="visible => visible && loadTaskQuantityUnitOptions()"
                      >
                        <el-option
                          v-for="item in taskQuantityUnitOptions"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        />
                      </el-select>
                    </template>
                  </el-table-column>
                  <el-table-column label="品牌" min-width="130" align="center">
                    <template #default="{ row }">
                      <el-input
                        v-model="row.brand"
                        placeholder="请输入"
                        :disabled="dialogReadonly"
                      />
                    </template>
                  </el-table-column>
                  <el-table-column label="规格" min-width="130" align="center">
                    <template #default="{ row }">
                      <el-input
                        v-model="row.specification"
                        placeholder="请输入"
                        :disabled="dialogReadonly"
                      />
                    </template>
                  </el-table-column>
                  <el-table-column label="型号" min-width="130" align="center">
                    <template #default="{ row }">
                      <el-input
                        v-model="row.model"
                        placeholder="请输入"
                        :disabled="dialogReadonly"
                      />
                    </template>
                  </el-table-column>
                  <el-table-column label="物料编码" min-width="150" align="center">
                    <template #default="{ row }">
                      <el-input
                        v-model="row.materialCode"
                        placeholder="请输入"
                        :disabled="dialogReadonly"
                      />
                    </template>
                  </el-table-column>
                  <el-table-column label="设备编码" min-width="150" align="center">
                    <template #default="{ row }">
                      <el-input
                        v-model="row.deviceCode"
                        placeholder="请输入"
                        :disabled="dialogReadonly"
                      />
                    </template>
                  </el-table-column>
                  <el-table-column label="备注" min-width="180" align="center">
                    <template #default="{ row }">
                      <el-input
                        v-model="row.remark"
                        placeholder="请输入"
                        :disabled="dialogReadonly"
                      />
                    </template>
                  </el-table-column>
                  <el-table-column label="操作" width="140" align="center" fixed="right">
                    <template #default="{ $index }">
                      <div class="business-crud-page__cargo-actions">
                        <el-link
                          v-if="!dialogReadonly && $index === transportCargoRows.length - 1"
                          type="primary"
                          @click="addTransportCargoRow($index)"
                        >
                  新增
                </el-link>
                        <el-link
                          v-if="!dialogReadonly"
                          type="primary"
                          @click="removeTransportCargoRow($index)"
                        >
                  删除
                </el-link>
                      </div>
                    </template>
                  </el-table-column>
                </el-table>
              </div>
            </div>
            <el-form
              :model="form"
              label-position="right"
              label-width="auto"
              class="business-crud-page__task-form business-crud-page__task-form--full"
            >
              <div class="business-crud-page__task-row">
                <el-form-item
                  label="承运类型"
                  required
                  class="business-crud-page__task-carrier-type business-crud-page__task-span-4"
                >
                  <el-radio-group
                    v-model="form.carrierType"
                    :disabled="dialogReadonly"
                    @change="handleTaskCarrierTypeChange"
                  >
                    <el-radio-button
                      v-for="item in taskCarrierTypes"
                      :key="item"
                      :label="item"
                      :value="item"
                    />
                  </el-radio-group>
                </el-form-item>
              </div>
              <div
                v-if="isCarrierMode"
                class="business-crud-page__subsection business-crud-page__carrier-section"
              >
                <div class="business-crud-page__subsection-head">
                  <span>承运信息</span>
                </div>
                <div class="business-crud-page__task-row">
                  <el-form-item label="承运商" required class="business-crud-page__task-span-1">
                    <el-select
                      v-model="form.carrierName"
                      placeholder="请输入"
                      filterable
                      clearable
                      :suffix-icon="Search"
                      :loading="taskCarrierLoading"
                      :disabled="dialogReadonly"
                      @visible-change="visible => visible && loadTaskCarrierOptions()"
                      @change="handleTaskCarrierChange"
                    >
                      <el-option
                        v-for="item in taskCarrierOptions"
                        :key="
                          item.id ||
                          item.customerName ||
                          item.carrierName ||
                          item.fullName ||
                          item.name ||
                          item.customerCode
                        "
                        :label="item.customerName || item.carrierName || item.fullName || item.name"
                        :value="item.customerName || item.carrierName || item.fullName || item.name"
                      />
                    </el-select>
                  </el-form-item>
                  <el-form-item label="司机" class="business-crud-page__task-span-1">
                    <el-select
                      v-model="form.driverName"
                      placeholder="请输入"
                      filterable
                      clearable
                      allow-create
                      default-first-option
                      :suffix-icon="Search"
                      :loading="taskDriverLoading"
                      :disabled="dialogReadonly"
                      @visible-change="visible => visible && loadTaskDriverOptions()"
                      @change="handleTaskDriverChange"
                    >
                      <el-option
                        v-for="item in taskDriverOptions"
                        :key="item.id || item.driverName || item.mobile"
                        :label="item.driverName || item.name"
                        :value="item.driverName || item.name"
                      />
                    </el-select>
                  </el-form-item>
                  <el-form-item label="手机号" class="business-crud-page__task-span-1">
                    <el-input
                      v-model="form.driverPhone"
                      placeholder="请输入"
                      clearable
                      :disabled="dialogReadonly"
                    />
                  </el-form-item>
                  <el-form-item label="车牌号" required class="business-crud-page__task-span-1">
                    <el-input
                      v-model="form.vehicleNo"
                      placeholder="请输入"
                      clearable
                      :disabled="dialogReadonly"
                    />
                  </el-form-item>
                </div>
                <div class="business-crud-page__task-row">
                  <el-form-item label="里程(km)" class="business-crud-page__task-span-1">
                    <el-input
                      v-model="form.mileage"
                      placeholder="请输入"
                      clearable
                      :disabled="dialogReadonly"
                      @input="value => handleTaskNumberInput('mileage', value)"
                    />
                  </el-form-item>
                  <el-form-item label="预计发货日期" class="business-crud-page__task-span-1">
                    <el-date-picker
                      v-model="form.estimatedStartTime"
                      type="date"
                      placeholder="默认填充当天"
                      format="YYYY-MM-DD"
                      value-format="YYYY-MM-DD"
                      :disabled="dialogReadonly"
                    />
                  </el-form-item>
                  <el-form-item label="预计完成日期" class="business-crud-page__task-span-1">
                    <el-date-picker
                      v-model="form.estimatedEndTime"
                      type="date"
                      placeholder="请输入"
                      format="YYYY-MM-DD"
                      value-format="YYYY-MM-DD"
                      :disabled="dialogReadonly"
                    />
                  </el-form-item>
                </div>
                <div class="business-crud-page__task-row">
                  <el-form-item
                    label="备注"
                    class="business-crud-page__task-note business-crud-page__task-span-4"
                  >
                    <el-input
                      v-model="form.taskRemark"
                      placeholder="请输入，200字以内"
                      clearable
                      maxlength="200"
                      show-word-limit
                      :disabled="dialogReadonly"
                    />
                  </el-form-item>
                </div>
              </div>
              <template v-else>
                <div class="business-crud-page__task-row">
                  <el-form-item label="司机" class="business-crud-page__task-span-1">
                    <el-select
                      v-model="form.driverName"
                      placeholder="请输入"
                      filterable
                      clearable
                      allow-create
                      default-first-option
                      :suffix-icon="Search"
                      :loading="taskDriverLoading"
                      :disabled="dialogReadonly"
                      @visible-change="visible => visible && loadTaskDriverOptions()"
                      @change="handleTaskDriverChange"
                    >
                      <el-option
                        v-for="item in taskDriverOptions"
                        :key="item.id || item.driverName || item.mobile"
                        :label="item.driverName || item.name"
                        :value="item.driverName || item.name"
                      />
                    </el-select>
                  </el-form-item>
                  <el-form-item label="司机手机号" required class="business-crud-page__task-span-1">
                    <el-input
                      v-model="form.driverPhone"
                      placeholder="请输入"
                      clearable
                      :disabled="dialogReadonly"
                    />
                  </el-form-item>
                  <el-form-item label="车牌号" required class="business-crud-page__task-span-1">
                    <el-input
                      v-model="form.vehicleNo"
                      placeholder="请输入"
                      clearable
                      :disabled="dialogReadonly"
                    />
                  </el-form-item>
                  <el-form-item label="挂车车牌号" class="business-crud-page__task-span-1">
                    <el-input
                      v-model="form.trailerVehicleNo"
                      placeholder="请输入"
                      clearable
                      :disabled="dialogReadonly"
                    />
                  </el-form-item>
                </div>
                <div class="business-crud-page__task-row">
                  <el-form-item label="押运人" class="business-crud-page__task-span-1">
                    <el-input
                      v-model="form.escortName"
                      placeholder="请输入"
                      clearable
                      :disabled="dialogReadonly"
                    />
                  </el-form-item>
                  <el-form-item label="押运人手机号" class="business-crud-page__task-span-1">
                    <el-input
                      v-model="form.escortPhone"
                      placeholder="请输入"
                      clearable
                      :disabled="dialogReadonly"
                    />
                  </el-form-item>
                  <el-form-item label="里程(km)" class="business-crud-page__task-span-1">
                    <el-input
                      v-model="form.mileage"
                      placeholder="请输入"
                      clearable
                      :disabled="dialogReadonly"
                      @input="value => handleTaskNumberInput('mileage', value)"
                    />
                  </el-form-item>
                </div>
                <div class="business-crud-page__task-row">
                  <el-form-item label="预计发货日期" class="business-crud-page__task-span-1">
                    <el-date-picker
                      v-model="form.estimatedStartTime"
                      type="date"
                      placeholder="默认填充当天"
                      format="YYYY-MM-DD"
                      value-format="YYYY-MM-DD"
                      :disabled="dialogReadonly"
                    />
                  </el-form-item>
                  <el-form-item label="预计完成日期" class="business-crud-page__task-span-1">
                    <el-date-picker
                      v-model="form.estimatedEndTime"
                      type="date"
                      placeholder="请输入"
                      format="YYYY-MM-DD"
                      value-format="YYYY-MM-DD"
                      :disabled="dialogReadonly"
                    />
                  </el-form-item>
                </div>
                <div class="business-crud-page__task-row">
                  <el-form-item
                    label="备注"
                    class="business-crud-page__task-note business-crud-page__task-span-4"
                  >
                    <el-input
                      v-model="form.taskRemark"
                      placeholder="请输入，200字以内"
                      clearable
                      maxlength="200"
                      show-word-limit
                      :disabled="dialogReadonly"
                    />
                  </el-form-item>
                </div>
              </template>
            </el-form>
            <div class="business-crud-page__subsection">
              <div class="business-crud-page__subsection-head">
                <span>运费信息</span>
              </div>
              <el-form
                :model="form"
                label-position="right"
                label-width="auto"
                class="business-crud-page__freight-form"
              >
                <el-form-item label="单价">
                  <el-input
                    v-model="form.unitPrice"
                    placeholder="请输入"
                    clearable
                    :disabled="dialogReadonly"
                    @input="value => handleTaskNumberInput('unitPrice', value)"
                  >
                    <template #append>
                      <el-select
                        v-model="form.priceUnit"
                        class="business-crud-page__append-select"
                        placeholder="元/吨"
                        :disabled="dialogReadonly"
                        @visible-change="visible => visible && loadTaskFeeUnitOptions()"
                      >
                        <el-option
                          v-for="item in taskFeeUnitOptions"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        />
                      </el-select>
                    </template>
                  </el-input>
                </el-form-item>
                <el-form-item label="数量合计">
                  <el-input
                    :model-value="taskCargoQuantityTotal"
                    disabled
                    placeholder="自动汇总货物数量"
                  >
                    <template #append>
                      <el-select
                        v-model="form.quantityUnit"
                        class="business-crud-page__append-select"
                        disabled
                        placeholder="吨"
                      >
                        <el-option
                          v-for="item in taskQuantityUnitOptions"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        />
                      </el-select>
                    </template>
                  </el-input>
                </el-form-item>
                <el-form-item label="运费">
                  <el-input :model-value="taskFreightAmount" disabled placeholder="自动计算">
                    <template #append>元</template>
                  </el-input>
                </el-form-item>
                <el-form-item label="其他运费合计">
                  <el-input
                    v-model="form.otherFeeTotal"
                    placeholder="请输入"
                    clearable
                    :disabled="dialogReadonly"
                    @input="value => handleTaskNumberInput('otherFeeTotal', value)"
                  >
                    <template #append>元</template>
                  </el-input>
                </el-form-item>
              </el-form>
            </div>
          </div>
          <el-form
            v-else
            :model="form"
            label-position="right"
            label-width="auto"
            class="business-crud-page__task-form"
          >
            <el-form-item
              label="承运类型"
              required
              class="business-crud-page__task-carrier-type business-crud-page__task-span-4"
            >
              <el-radio-group
                v-model="form.carrierType"
                :disabled="dialogReadonly"
                @change="handleTaskCarrierTypeChange"
              >
                <el-radio-button
                  v-for="item in taskCarrierTypes"
                  :key="item"
                  :label="item"
                  :value="item"
                />
              </el-radio-group>
            </el-form-item>
            <el-form-item v-if="isCarrierMode" label="承运商" required>
              <el-select
                v-model="form.carrierName"
                placeholder="请选择承运商"
                filterable
                clearable
                :loading="taskCarrierLoading"
                :disabled="dialogReadonly || form.carrierType !== '承运商'"
                @visible-change="visible => visible && loadTaskCarrierOptions()"
                @change="handleTaskCarrierChange"
              >
                <el-option
                  v-for="item in taskCarrierOptions"
                  :key="
                    item.id ||
                    item.customerName ||
                    item.carrierName ||
                    item.fullName ||
                    item.name ||
                    item.customerCode
                  "
                  :label="item.customerName || item.carrierName || item.fullName || item.name"
                  :value="item.customerName || item.carrierName || item.fullName || item.name"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="司机">
              <el-select
                v-model="form.driverName"
                placeholder="请选择或输入司机"
                filterable
                clearable
                allow-create
                default-first-option
                :loading="taskDriverLoading"
                :disabled="dialogReadonly"
                @visible-change="visible => visible && loadTaskDriverOptions()"
                @change="handleTaskDriverChange"
              >
                <el-option
                  v-for="item in taskDriverOptions"
                  :key="item.id || item.driverName || item.mobile"
                  :label="item.driverName || item.name"
                  :value="item.driverName || item.name"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="手机号" :required="form.carrierType === '自运'">
              <el-input
                v-model="form.driverPhone"
                placeholder="请输入手机号"
                clearable
                :disabled="dialogReadonly"
              />
            </el-form-item>
            <el-form-item label="车牌号" required>
              <el-input
                v-model="form.vehicleNo"
                placeholder="请输入车牌号"
                clearable
                :disabled="dialogReadonly"
              />
            </el-form-item>
            <el-form-item label="货物类型" required>
              <el-cascader
                v-model="form.cargoTypePath"
                :options="transportCargoTypeOptions"
                :props="transportCargoTypeCascaderProps"
                placeholder="请选择到二级"
                clearable
                filterable
                :disabled="dialogReadonly"
                :filter-method="filterBillingCargoType"
                @visible-change="visible => visible && ensureBillingCargoTypeOptions()"
                @change="handleTaskCargoTypeChange"
              />
            </el-form-item>
            <el-form-item label="货物名称">
              <el-select
                v-model="form.cargoName"
                placeholder="请选择货物"
                filterable
                clearable
                :disabled="dialogReadonly || !form.cargoType"
                :loading="taskCargoLoading"
                @visible-change="visible => visible && loadTaskCargoOptionsForForm()"
                @change="handleTaskCargoChange"
              >
                <el-option
                  v-for="item in taskCargoOptions"
                  :key="item.id || item.cargoCode || item.cargoName"
                  :label="formatBillingCargoTypeLabel(item)"
                  :value="formatBillingCargoTypeLabel(item)"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="规格">
              <el-input
                v-model="form.specification"
                placeholder="选择货物自动回填"
                clearable
                :disabled="dialogReadonly"
              />
            </el-form-item>
            <el-form-item label="型号">
              <el-input
                v-model="form.model"
                placeholder="选择货物自动回填"
                clearable
                :disabled="dialogReadonly"
              />
            </el-form-item>
            <el-form-item label="数量">
              <el-input
                v-model="form.quantity"
                placeholder="请输入数量"
                clearable
                :disabled="dialogReadonly"
                @input="value => handleTaskNumberInput('quantity', value)"
              >
                <template #suffix>
                  <el-select
                    v-model="form.quantityUnit"
                    class="business-crud-page__suffix-select"
                    placeholder="单位"
                    :disabled="dialogReadonly"
                    @visible-change="visible => visible && loadTaskQuantityUnitOptions()"
                  >
                    <el-option
                      v-for="item in taskQuantityUnitOptions"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    />
                  </el-select>
                </template>
              </el-input>
            </el-form-item>
            <el-form-item label="里程（公里）">
              <el-input
                v-model="form.mileage"
                placeholder="请输入里程"
                clearable
                :disabled="dialogReadonly"
                @input="value => handleTaskNumberInput('mileage', value)"
              />
            </el-form-item>
            <el-form-item label="预计发货日期">
              <el-date-picker
                v-model="form.estimatedStartTime"
                type="date"
                placeholder="请选择预计发货日期"
                format="YYYY-MM-DD"
                value-format="YYYY-MM-DD"
                :disabled="dialogReadonly"
              />
            </el-form-item>
            <el-form-item label="预计完成日期">
              <el-date-picker
                v-model="form.estimatedEndTime"
                type="date"
                placeholder="请选择预计完成日期"
                format="YYYY-MM-DD"
                value-format="YYYY-MM-DD"
                :disabled="dialogReadonly"
              />
            </el-form-item>
            <el-form-item label="单价">
              <el-input
                v-model="form.unitPrice"
                placeholder="请输入单价"
                clearable
                :disabled="dialogReadonly"
                @input="value => handleTaskNumberInput('unitPrice', value)"
              >
                <template #suffix>
                  <el-select
                    v-model="form.priceUnit"
                    class="business-crud-page__suffix-select business-crud-page__suffix-select--wide"
                    placeholder="单位"
                    :disabled="dialogReadonly"
                    @visible-change="visible => visible && loadTaskFeeUnitOptions()"
                  >
                    <el-option
                      v-for="item in taskFeeUnitOptions"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    />
                  </el-select>
                </template>
              </el-input>
            </el-form-item>
            <el-form-item label="备注" class="business-crud-page__task-remark">
              <el-input
                v-model="form.taskRemark"
                type="textarea"
                :rows="2"
                maxlength="200"
                show-word-limit
                placeholder="请输入备注，200字以内"
                :disabled="dialogReadonly"
              />
            </el-form-item>
          </el-form>
        </div>
      </template>

      <template #goodsInfoTitle-form>
        <div
          v-if="config.enableTransportPlanForm"
          class="dialog-section-title dialog-section-title--action business-crud-page__goods-title"
        >
          <span>货物信息</span>
          <div v-if="!dialogReadonly" class="business-crud-page__section-actions">
            <el-link type="primary" @click="cargoImportBox = true">导入货物</el-link>
            <el-link type="primary" @click="openCommonCargoDialog">常用货物</el-link>
          </div>
        </div>
      </template>

      <template #goodsJson-form>
        <div v-if="config.enableTransportPlanForm" class="business-crud-page__cargo-wrap">
          <el-table
            :data="transportCargoRows"
            border
            class="business-crud-page__cargo-table"
            empty-text="暂无货物信息"
          >
            <el-table-column type="index" label="序号" width="70" align="center" fixed="left" />
            <el-table-column label="货物名称" min-width="150" align="center">
              <template #default="{ row }">
                <el-input v-model="row.cargoName" placeholder="请输入" :disabled="dialogReadonly" />
              </template>
            </el-table-column>
            <el-table-column min-width="220" align="center">
              <template #header>
                <span class="business-crud-page__required-column">货物类型</span>
              </template>
              <template #default="{ row }">
                <el-cascader
                  v-model="row.cargoTypePath"
                  :options="transportCargoTypeOptions"
                  :props="transportCargoTypeCascaderProps"
                  :placeholder="row.cargoType || '请选择'"
                  clearable
                  filterable
                  :disabled="dialogReadonly"
                  :filter-method="filterBillingCargoType"
                  @visible-change="visible => visible && ensureBillingCargoTypeOptions()"
                  @change="value => handleTransportCargoTypeChange(row, value)"
                />
              </template>
            </el-table-column>
            <el-table-column label="数量" min-width="120" align="center">
              <template #default="{ row }">
                <el-input
                  v-model="row.quantity"
                  placeholder="请输入"
                  :disabled="dialogReadonly"
                  @input="value => handleTransportCargoQuantityInput(row, value)"
                />
              </template>
            </el-table-column>
            <el-table-column label="数量单位" min-width="120" align="center">
              <template #default="{ row }">
                <el-select v-model="row.quantityUnit" clearable :disabled="dialogReadonly">
                  <el-option
                    v-for="item in quantityUnitOptions"
                    :key="item"
                    :label="item"
                    :value="item"
                  />
                </el-select>
              </template>
            </el-table-column>
            <el-table-column label="包装" min-width="120" align="center">
              <template #default="{ row }">
                <el-select v-model="row.packageType" clearable :disabled="dialogReadonly">
                  <el-option
                    v-for="item in packageOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </template>
            </el-table-column>
            <el-table-column label="品牌" min-width="130" align="center">
              <template #default="{ row }">
                <el-input v-model="row.brand" placeholder="请输入" :disabled="dialogReadonly" />
              </template>
            </el-table-column>
            <el-table-column label="规格" min-width="130" align="center">
              <template #default="{ row }">
                <el-input
                  v-model="row.specification"
                  placeholder="请输入"
                  :disabled="dialogReadonly"
                />
              </template>
            </el-table-column>
            <el-table-column label="型号" min-width="130" align="center">
              <template #default="{ row }">
                <el-input v-model="row.model" placeholder="请输入" :disabled="dialogReadonly" />
              </template>
            </el-table-column>
            <el-table-column label="物料编码" min-width="150" align="center">
              <template #default="{ row }">
                <el-input
                  v-model="row.materialCode"
                  placeholder="请输入"
                  :disabled="dialogReadonly"
                />
              </template>
            </el-table-column>
            <el-table-column label="设备编码" min-width="150" align="center">
              <template #default="{ row }">
                <el-input
                  v-model="row.deviceCode"
                  placeholder="请输入"
                  :disabled="dialogReadonly"
                />
              </template>
            </el-table-column>
            <el-table-column label="备注" min-width="180" align="center">
              <template #default="{ row }">
                <el-input v-model="row.remark" placeholder="请输入" :disabled="dialogReadonly" />
              </template>
            </el-table-column>
            <el-table-column label="操作" width="140" align="center" fixed="right">
              <template #default="{ $index }">
                <div class="business-crud-page__cargo-actions">
                  <el-link
                    v-if="!dialogReadonly"
                    type="primary"
                    @click="addTransportCargoRow($index)"
                  >
                  新增
                </el-link>
                  <el-link
                    v-if="!dialogReadonly"
                    type="primary"
                    @click="removeTransportCargoRow($index)"
                  >
                  删除
                </el-link>
                </div>
              </template>
            </el-table-column>
          </el-table>
          <div class="business-crud-page__cargo-total">
            运输数量合计：{{ transportCargoQuantityTotal }}
          </div>
        </div>
      </template>

      <template #organizationName-form>
        <el-cascader
          v-model="selectedOrganizationId"
          class="business-crud-page__field"
          placeholder="请选择所属组织"
          :options="organizationOptions"
          :props="organizationCascaderProps"
          clearable
          filterable
          :show-all-levels="false"
          :disabled="dialogReadonly"
          @visible-change="visible => visible && loadOrganizationOptions()"
          @change="handleOrganizationChange"
        />
      </template>

      <template #applyLimit-form>
        <el-input
          v-model="form.applyLimit"
          class="business-crud-page__field"
          placeholder="请输入申请临时额度"
          :disabled="dialogReadonly"
          @input="value => handleAmountInput('applyLimit', value)"
        />
      </template>

      <template #contractPeriod-form>
        <div class="business-crud-page__date-range">
          <el-date-picker
            v-model="form.startDate"
            class="business-crud-page__date"
            type="date"
            placeholder="YYYY-MM-DD"
            format="YYYY-MM-DD"
            value-format="YYYY-MM-DD"
            :disabled="dialogReadonly"
            @change="handleContractDateChange"
          />
          <span class="business-crud-page__date-separator">至</span>
          <el-date-picker
            v-model="form.endDate"
            class="business-crud-page__date"
            type="date"
            placeholder="YYYY-MM-DD"
            format="YYYY-MM-DD"
            value-format="YYYY-MM-DD"
            :disabled="dialogReadonly"
            @change="handleContractDateChange"
          />
        </div>
      </template>

      <template #copyCount-form>
        <div class="business-crud-page__inline-number">
          <el-input
            v-model="form.copyCount"
            placeholder="请输入"
            :disabled="dialogReadonly"
            @input="value => handleIntegerInput('copyCount', value)"
          />
          <span>份</span>
        </div>
      </template>

      <template #paymentDays-form>
        <div class="business-crud-page__inline-number">
          <el-input
            v-model="form.paymentDays"
            placeholder="请输入"
            :disabled="dialogReadonly"
            @input="value => handleIntegerInput('paymentDays', value)"
          />
          <span>天</span>
        </div>
      </template>

      <template #contractFileTitle-form>
        <div class="dialog-section-title">合同文件</div>
      </template>

      <template #contractFileJson-form>
        <div class="business-crud-page__attachment">
          <div class="business-crud-page__attachment-head">
            <vehicle-attachment-upload
              v-model="contractFileRows"
              :readonly="dialogReadonly"
              :file-types="attachmentFileTypes"
              :max-size="500"
              :show-tip="false"
              :show-file-list="false"
              button-text="上传附件"
              @change="handleContractFileChange"
            />
          </div>
          <el-table :data="contractFileRows" border class="business-crud-page__attachment-table">
            <el-table-column type="index" label="序号" width="70" align="center" />
            <el-table-column label="文件名" min-width="240" align="center" show-overflow-tooltip>
              <template #default="{ row }">{{ row.originalName || row.name }}</template>
            </el-table-column>
            <el-table-column label="文件大小" width="120" align="center">
              <template #default="{ row }">{{ formatFileSize(row.size) }}</template>
            </el-table-column>
            <el-table-column prop="uploadUserName" label="上传人" width="140" align="center" />
            <el-table-column prop="uploadTime" label="上传时间" width="170" align="center" />
            <el-table-column label="操作" width="120" align="center">
              <template #default="{ row, $index }">
                <el-link
                  v-if="!dialogReadonly"
                  type="primary"
                  @click="removeContractFile($index)"
                >
                  删除
                </el-link>
                <el-link v-else type="primary" @click="downloadAttachment(row)">
                  下载
                </el-link>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </template>

      <template #billingInfoTitle-form>
        <div class="dialog-section-title">计费信息</div>
      </template>

      <template #billingPlanJson-form>
        <div class="business-crud-page__billing">
          <div class="business-crud-page__billing-head">
            <div class="business-crud-page__billing-switch">
              <span>自动生成费用明细</span>
              <el-radio-group v-model="form.billingEnabled" :disabled="dialogReadonly">
                <el-radio :label="1">开启</el-radio>
                <el-radio :label="0">关闭</el-radio>
              </el-radio-group>
            </div>
            <el-button v-if="!dialogReadonly" type="primary" @click="openBillingPlan()">
              添加
            </el-button>
          </div>
          <el-table :data="billingPlanRows" border class="business-crud-page__billing-table">
            <el-table-column type="index" label="序号" width="80" align="center" />
            <el-table-column prop="planName" label="方案名称" min-width="220" align="center" />
            <el-table-column label="默认方案" width="140" align="center">
              <template #default="{ row }">{{ row.defaultPlan ? '是' : '' }}</template>
            </el-table-column>
            <el-table-column
              prop="remark"
              label="备注"
              min-width="260"
              align="center"
              show-overflow-tooltip
            />
            <el-table-column label="操作" width="180" align="center">
              <template #default="{ row, $index }">
                <el-link type="primary" @click="openBillingPlan(row, $index)">
                  编辑
                </el-link>
                <el-link
                  v-if="!dialogReadonly"
                  type="primary"
                  @click="removeBillingPlan($index)"
                >
                  删除
                </el-link>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </template>

      <template #settlementRuleTitle-form>
        <div class="dialog-section-title">结算生成规则</div>
      </template>

      <template #settlementRuleJson-form>
        <div class="business-crud-page__settlement-rule">
          <div class="business-crud-page__settlement-switch">
            <span>自动生成结算单</span>
            <el-radio-group v-model="settlementRuleForm.autoGenerate" :disabled="dialogReadonly">
              <el-radio :label="1">开启</el-radio>
              <el-radio :label="0">关闭</el-radio>
            </el-radio-group>
          </div>
          <el-form
            :model="settlementRuleForm"
            label-position="right"
            label-width="auto"
            class="business-crud-page__module-form business-crud-page__module-form--three"
          >
            <el-form-item label="账单起始日期" required>
              <el-date-picker
                v-model="settlementRuleForm.billStartDate"
                type="date"
                placeholder="请选择账单起始日期"
                format="YYYY-MM-DD"
                value-format="YYYY-MM-DD"
                :disabled="dialogReadonly"
              />
            </el-form-item>
            <el-form-item label="结算类型" required>
              <el-select
                v-model="settlementRuleForm.settlementType"
                placeholder="请选择结算类型"
                :disabled="dialogReadonly"
                @change="handleSettlementTypeChange"
              >
                <el-option
                  v-for="item in settlementTypeOptions"
                  :key="item"
                  :label="item"
                  :value="item"
                />
              </el-select>
            </el-form-item>
            <el-form-item v-if="showSettlementBillCycleType" label="账单周期类型" required>
              <el-select
                v-model="settlementRuleForm.billCycleType"
                placeholder="请选择账单周期类型"
                :disabled="dialogReadonly"
                @change="handleSettlementBillCycleTypeChange"
              >
                <el-option
                  v-for="item in billCycleTypeOptions"
                  :key="item"
                  :label="item"
                  :value="item"
                />
              </el-select>
            </el-form-item>
            <el-form-item v-if="showSettlementBillCutoffDay" label="账单截单日">
              <el-select
                v-model="settlementRuleForm.billCutoffDay"
                placeholder="请选择账单截单日"
                :disabled="dialogReadonly"
              >
                <el-option
                  v-for="item in billCutoffDayOptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
            <el-form-item v-if="showSettlementCycleDays" label="周期天数" required>
              <el-select
                v-model="settlementRuleForm.cycleDays"
                placeholder="请选择周期天数"
                :disabled="dialogReadonly"
              >
                <el-option
                  v-for="item in cycleDayOptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-form>
        </div>
      </template>

      <template #reconciliationTitle-form>
        <div class="dialog-section-title">对账配置</div>
      </template>

      <template #reconciliationJson-form>
        <el-form
          :model="reconciliationForm"
          label-position="right"
          label-width="auto"
          class="business-crud-page__module-form business-crud-page__module-form--two"
        >
          <el-form-item label="是否跳过对账" required>
            <el-select
              v-model="reconciliationForm.skipReconciliation"
              placeholder="请选择是否跳过对账"
              :disabled="dialogReadonly"
            >
              <el-option label="是" :value="1" />
              <el-option label="否" :value="0" />
            </el-select>
          </el-form-item>
          <el-form-item label="对账模式" required>
            <el-select
              v-model="reconciliationForm.reconciliationMode"
              placeholder="请选择对账模式"
              :disabled="dialogReadonly"
            >
              <el-option
                v-for="item in reconciliationModeOptions"
                :key="item"
                :label="item"
                :value="item"
              />
            </el-select>
          </el-form-item>
        </el-form>
      </template>

      <template #attachmentTitle-form>
        <div class="dialog-section-title">{{ config.attachmentTitle || '其它附件' }}</div>
      </template>

      <template #attachmentsJson-form>
        <div class="business-crud-page__attachment">
          <div class="business-crud-page__attachment-head">
            <vehicle-attachment-upload
              v-model="attachmentRows"
              :readonly="dialogReadonly"
              :file-types="attachmentFileTypes"
              :max-size="500"
              :show-tip="false"
              :show-file-list="false"
              button-text="上传附件"
              @change="handleAttachmentChange"
            />
            <el-button
              type="primary"
              :disabled="!attachmentRows.length"
              @click="handleBatchDownload"
            >
              批量下载
            </el-button>
          </div>
          <el-table :data="attachmentRows" border class="business-crud-page__attachment-table">
            <el-table-column type="index" label="序号" width="70" align="center" />
            <el-table-column label="文件名" min-width="200" align="center" show-overflow-tooltip>
              <template #default="{ row }">{{ row.originalName || row.name }}</template>
            </el-table-column>
            <el-table-column label="附件描述" min-width="220" align="center">
              <template #default="{ row }">
                <el-input
                  v-model="row.description"
                  placeholder="请输入附件描述"
                  :disabled="dialogReadonly"
                />
              </template>
            </el-table-column>
            <el-table-column label="文件大小" width="110" align="center">
              <template #default="{ row }">{{ formatFileSize(row.size) }}</template>
            </el-table-column>
            <el-table-column prop="uploadUserName" label="上传人" width="140" align="center" />
            <el-table-column prop="uploadTime" label="上传时间" width="160" align="center" />
            <el-table-column label="操作" width="100" align="center">
              <template #default="{ row, $index }">
                <el-link
                  v-if="!dialogReadonly"
                  type="primary"
                  @click="removeAttachment($index)"
                >
                  删除
                </el-link>
                <el-link v-else type="primary" @click="downloadAttachment(row)">
                  下载
                </el-link>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </template>

      <template #changeRecordTitle-form>
        <div class="dialog-section-title">变更记录</div>
      </template>

      <template #changeRecordJson-form>
        <el-table :data="changeRecordRows" border class="business-crud-page__change-table">
          <el-table-column type="index" label="序号" width="70" align="center" />
          <el-table-column prop="changeDate" label="变更日期" min-width="150" align="center" />
          <el-table-column prop="handlerUserName" label="经办人" min-width="140" align="center" />
          <el-table-column prop="changeType" label="变更类型" min-width="160" align="center" />
          <el-table-column
            prop="changeReason"
            label="变更原因"
            min-width="240"
            align="center"
            show-overflow-tooltip
          />
          <el-table-column prop="statusName" label="状态" min-width="140" align="center" />
          <el-table-column label="操作" width="120" align="center">
            <template #default="{ row }">
              <el-link type="primary" @click="handleChangeRecordFlow(row)"> 流程 </el-link>
            </template>
          </el-table-column>
        </el-table>
      </template>

      <template #menu-form-before>
        <el-button
          v-if="config.enableDraftSave && !dialogReadonly"
          type="primary"
          plain
          :loading="draftSaveLoading"
          @click="handleDraftSave"
        >
          保存
        </el-button>
      </template>

      <template #menu-form>
        <div v-if="showTransportPlanCreateActions" class="business-crud-page__create-actions">
          <el-button :disabled="Boolean(transportPlanCreateActionLoading)" @click="closeCrudDialog">
            关闭
          </el-button>
          <el-button
            type="primary"
            plain
            :loading="transportPlanCreateActionLoading === 'draft'"
            :disabled="Boolean(transportPlanCreateActionLoading)"
            @click="handleTransportPlanCreateAction('draft')"
          >
            暂存
          </el-button>
          <el-button
            type="primary"
            :loading="transportPlanCreateActionLoading === 'create'"
            :disabled="Boolean(transportPlanCreateActionLoading)"
            @click="handleTransportPlanCreateAction('create')"
          >
            确认创建
          </el-button>
        </div>
        <div v-if="showContractCreateActions" class="business-crud-page__contract-actions">
          <el-button
            type="primary"
            plain
            :loading="contractCreateActionLoading === 'draft'"
            :disabled="Boolean(contractCreateActionLoading)"
            @click="handleContractCreateAction('draft')"
          >
            保存
          </el-button>
          <el-button
            type="primary"
            :loading="contractCreateActionLoading === 'temporary'"
            :disabled="Boolean(contractCreateActionLoading)"
            @click="handleContractCreateAction('temporary')"
          >
            提交临时合同
          </el-button>
          <el-button
            type="primary"
            :loading="contractCreateActionLoading === 'formal'"
            :disabled="Boolean(contractCreateActionLoading)"
            @click="handleContractCreateAction('formal')"
          >
            提交正式合同
          </el-button>
        </div>
      </template>

      <template #contractStage="{ row }">
        <el-tag :type="stageTagType(row.contractStage)">
          {{ displayStatus(row, 'contractStage') }}
        </el-tag>
      </template>

      <template #menu="{ row, index }">
        <template v-if="config.customMenuActions">
          <el-link
            v-for="action in menuActions(row)"
            :key="action.key"
            :type="action.type || 'primary'"
            @click="handleMenuAction(action, row, index)"
          >
            {{ action.label }}
          </el-link>
        </template>
        <template v-else>
          <el-link type="primary" v-if="showDetailButton(row)" @click="openDetail(row)">详情</el-link>
          <el-link
            type="primary"
            v-if="hasPermission(`${config.permission}_view`) && !showDetailButton(row)"
            @click="$refs.crud.rowView(row, index)"
          >
            查看
          </el-link>
          <el-link
            type="primary"
            v-if="canEdit(row)"
            @click="$refs.crud.rowEdit(row, index)"
          >
            编辑
          </el-link>
          <el-link type="primary" v-if="canCopy(row)" @click="handleCopy(row)">
            复制
          </el-link>
          <el-link type="primary" v-if="canEnable(row)" @click="handleAction('enable', row)">
            启用
          </el-link>
          <el-link
            type="primary"
            v-if="canDisable(row)"
            @click="handleAction('disable', row)"
          >
            停用
          </el-link>
          <el-link
            type="primary"
            v-if="canReassign(row)"
            @click="handleAction('reassign', row)"
          >
            重新派单
          </el-link>
          <el-link type="primary" v-if="canCancel(row)" @click="handleAction('cancel', row)">
            取消
          </el-link>
          <el-link
            type="primary"
            v-if="canComplete(row)"
            @click="handleAction('complete', row)"
          >
            完成
          </el-link>
          <el-link
            v-for="operation in customOperations(row)"
            :key="operation.action"
            :type="operation.type || 'primary'"
            @click="handleCustomOperation(operation, row)"
          >
            {{ operation.label }}
          </el-link>
          <el-link type="primary" v-if="canDelete(row)" @click="rowDel(row)">
            删除
          </el-link>
        </template>
      </template>
    </avue-crud>

    <empty-pagination
      :page="page"
      @size-change="sizeChange"
      @current-change="currentChange"
      @load="onLoad(page, query)"
    />

    <el-dialog
      v-model="detailBox"
      :title="`${config.title}详情`"
      append-to-body
      width="96%"
      class="business-crud-page__detail-dialog"
    >
      <div v-loading="detailLoading">
        <section
          v-for="section in detailSections"
          :key="section.title"
          class="business-crud-page__detail-section"
        >
          <div class="dialog-section-title">{{ section.title }}</div>
          <el-descriptions :column="2" border>
            <el-descriptions-item
              v-for="field in section.fields"
              :key="field[0]"
              :label="field[1]"
              :span="field[2] || 1"
            >
              {{ formatDetailValue(detailRow, field[0]) }}
            </el-descriptions-item>
          </el-descriptions>
        </section>
        <section v-if="config.enableTransportPlanForm" class="business-crud-page__detail-section">
          <div class="dialog-section-title">货物信息</div>
          <el-table :data="transportCargoRows" border empty-text="暂无货物信息">
            <el-table-column type="index" label="序号" width="70" align="center" />
            <el-table-column prop="cargoName" label="货物名称" min-width="180" />
            <el-table-column prop="cargoType" label="货物类型" min-width="150" />
            <el-table-column prop="quantity" label="数量" min-width="100" />
            <el-table-column prop="quantityUnit" label="数量单位" min-width="110" />
            <el-table-column prop="packageType" label="包装" min-width="110" />
            <el-table-column prop="brand" label="品牌" min-width="120" />
            <el-table-column prop="specification" label="规格" min-width="120" />
            <el-table-column prop="model" label="型号" min-width="120" />
            <el-table-column prop="materialCode" label="物料编码" min-width="140" />
            <el-table-column prop="deviceCode" label="设备编码" min-width="140" />
            <el-table-column prop="remark" label="备注" min-width="160" />
          </el-table>
        </section>
        <section v-if="config.enableAttachmentTable" class="business-crud-page__detail-section">
          <div class="dialog-section-title">{{ config.attachmentTitle || '附件' }}</div>
          <el-table :data="attachmentRows" border empty-text="暂无附件">
            <el-table-column type="index" label="序号" width="70" align="center" />
            <el-table-column label="文件名" min-width="260">
              <template #default="{ row }">{{ row.originalName || row.name || '-' }}</template>
            </el-table-column>
            <el-table-column prop="description" label="附件描述" min-width="220" />
            <el-table-column label="文件大小" width="110">
              <template #default="{ row }">{{ formatFileSize(row.size) }}</template>
            </el-table-column>
            <el-table-column prop="uploadUserName" label="上传人" width="140" />
            <el-table-column prop="uploadTime" label="上传时间" width="180" />
          </el-table>
        </section>
      </div>
      <template #footer>
        <el-button type="primary" @click="detailBox = false">关闭</el-button>
      </template>
    </el-dialog>

    <el-dialog
      v-if="config.enableTransportPlanImport"
      v-model="transportPlanImportBox"
      :title="config.transportPlanImportTitle || `导入${config.title}`"
      append-to-body
      width="96%"
      class="business-crud-page__transport-plan-import-dialog"
      @closed="resetTransportPlanImport"
    >
      <el-form
        ref="transportPlanImportFormRef"
        :model="transportPlanImportForm"
        :rules="transportPlanImportRules"
        label-position="right"
        label-width="auto"
        class="business-crud-page__transport-plan-import-form"
      >
        <el-row :gutter="24">
          <el-col :span="8">
            <el-form-item label="项目" prop="projectId" required>
              <el-select
                v-model="transportPlanImportForm.projectId"
                placeholder="模糊查询后选择"
                filterable
                clearable
                :loading="projectLoading"
                @visible-change="visible => visible && loadProjectOptions()"
                @change="handleTransportPlanImportProjectChange"
              >
                <el-option
                  v-for="item in projectOptions"
                  :key="item.id"
                  :label="item.projectName"
                  :value="item.id"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="客户" prop="customerName" required>
              <el-input
                v-model="transportPlanImportForm.customerName"
                disabled
                placeholder="选择项目后带出"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="客户合同" prop="contractId" required>
              <el-select
                v-model="transportPlanImportForm.contractId"
                placeholder="选择项目后选择"
                filterable
                clearable
                :loading="transportPlanImportContractLoading"
                :disabled="!transportPlanImportForm.projectId"
                @change="handleTransportPlanImportContractChange"
              >
                <el-option
                  v-for="item in transportPlanImportContractOptions"
                  :key="item.id"
                  :label="item.contractName"
                  :value="item.id"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item
          label="计划明细表"
          prop="file"
          required
          class="business-crud-page__import-file-item"
        >
          <el-upload
            action="#"
            accept=".xls,.xlsx"
            :auto-upload="false"
            :limit="1"
            :file-list="transportPlanImportFiles"
            :on-change="handleTransportPlanImportFileChange"
            :on-remove="handleTransportPlanImportFileRemove"
          >
            <el-button type="primary">添加附件</el-button>
          </el-upload>
          <span class="business-crud-page__import-file-tip"
            >请上传计划明细表，仅支持 Excel 格式</span
          >
          <el-link type="primary" @click="handleTransportPlanTemplate">下载模板</el-link>
        </el-form-item>
      </el-form>
      <section v-if="transportPlanImportRows.length" class="business-crud-page__import-preview">
        <div class="business-crud-page__import-preview-head">
          <div class="dialog-section-title">数据明细</div>
          <el-button
            type="danger"
            plain
            :disabled="!transportPlanImportSelection.length"
            @click="removeSelectedTransportPlanImportRows"
          >
            批量删除
          </el-button>
        </div>
        <el-tabs v-model="transportPlanImportTab" class="business-crud-page__import-preview-tabs">
          <el-tab-pane :label="`计划单数（${transportPlanImportRows.length}）`" name="all" />
          <el-tab-pane
            :label="`疑似重复(${transportPlanImportDuplicateCount})`"
            name="duplicate"
          />
        </el-tabs>
        <div class="business-crud-page__import-preview-table">
          <el-table
            :data="transportPlanImportVisibleRows"
            border
            row-key="_key"
            empty-text="暂无明细数据"
            @selection-change="handleTransportPlanImportSelectionChange"
          >
            <el-table-column type="selection" width="52" fixed="left" />
            <el-table-column type="index" label="序号" width="70" fixed="left" />
            <el-table-column label="计划单号" min-width="150">
              <template #default>待生成</template>
            </el-table-column>
            <el-table-column label="计划名称" min-width="180">
              <template #default="{ row }">
                <el-input v-if="isEditingTransportPlanImportRow(row)" v-model="row.planName" />
                <span v-else>{{ row.planName || '-' }}</span>
              </template>
            </el-table-column>
            <el-table-column label="运输类型" min-width="160">
              <template #default="{ row }">
                <el-input v-if="isEditingTransportPlanImportRow(row)" v-model="row.transportType" />
                <span v-else>{{ row.transportType || '-' }}</span>
              </template>
            </el-table-column>
            <el-table-column label="货物名称" min-width="160">
              <template #default="{ row }">
                <el-input v-if="isEditingTransportPlanImportRow(row)" v-model="row.cargoName" />
                <span v-else>{{ row.cargoName || '-' }}</span>
              </template>
            </el-table-column>
            <el-table-column label="货物类型" min-width="160">
              <template #default="{ row }">
                <el-input v-if="isEditingTransportPlanImportRow(row)" v-model="row.cargoType" />
                <span v-else>{{ row.cargoType || '-' }}</span>
              </template>
            </el-table-column>
            <el-table-column label="数量" min-width="120">
              <template #default="{ row }">
                <el-input v-if="isEditingTransportPlanImportRow(row)" v-model="row.quantity" />
                <span v-else>{{ row.quantity || '-' }}</span>
              </template>
            </el-table-column>
            <el-table-column label="计量单位" min-width="130">
              <template #default="{ row }">
                <el-select v-if="isEditingTransportPlanImportRow(row)" v-model="row.quantityUnit">
                  <el-option
                    v-for="item in quantityUnitOptions"
                    :key="item"
                    :label="item"
                    :value="item"
                  />
                </el-select>
                <span v-else>{{ row.quantityUnit || '-' }}</span>
              </template>
            </el-table-column>
            <el-table-column label="发货地址" min-width="260">
              <template #default="{ row }">
                <el-input
                  v-if="isEditingTransportPlanImportRow(row)"
                  v-model="row.departureAddress"
                />
                <span v-else>{{ row.departureAddress || '-' }}</span>
              </template>
            </el-table-column>
            <el-table-column label="操作" width="150" fixed="right">
              <template #default="{ row }">
                <template v-if="isEditingTransportPlanImportRow(row)">
                  <el-link type="primary" @click="saveTransportPlanImportRow(row)">保存</el-link>
                  <el-link type="primary" @click="cancelTransportPlanImportRow(row)">取消</el-link>
                </template>
                <template v-else>
                  <el-link type="primary" @click="editTransportPlanImportRow(row)">编辑</el-link>
                  <el-link type="danger" @click="removeTransportPlanImportRow(row)">删除</el-link>
                </template>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </section>
      <template #footer>
        <el-button type="primary" :loading="transportPlanImportLoading" @click="submitTransportPlanImport">提交</el-button>
        <el-button @click="transportPlanImportBox = false">返回</el-button>
      </template>
    </el-dialog>

    <waybill-import-dialog v-if="config.enableWaybillImport" v-model="waybillImportBox" />

    <flow-design
      v-if="website.design.designMode"
      is-dialog
      v-model:is-display="flowBox"
      :process-instance-id="processInstanceId"
    />
    <el-dialog v-else title="流程图" append-to-body v-model="flowBox" :fullscreen="true">
      <iframe
        :src="flowUrl"
        width="100%"
        height="700"
        title="流程图"
        frameBorder="no"
        border="0"
        marginWidth="0"
        marginHeight="0"
        scrolling="no"
        allowTransparency="yes"
      />
      <template #footer>
        <el-button @click="flowBox = false">关闭</el-button>
      </template>
    </el-dialog>

    <el-dialog
      :title="dispatchDialogTitle"
      append-to-body
      v-model="dispatchBox"
      width="calc(100vw - 32px)"
      top="16px"
      class="business-crud-page__dispatch-dialog"
      @closed="resetDispatchDialog"
    >
      <div v-loading="dispatchLoading" class="business-crud-page__dispatch-shell">
        <div class="business-crud-page__dispatch-top">
          <div class="business-crud-page__dispatch-heading">
            <div class="business-crud-page__dispatch-heading-title">
              <span class="business-crud-page__dispatch-heading-name">
                {{ dispatchDialogTitle }}
              </span>
              <span class="business-crud-page__dispatch-heading-split">|</span>
              <span class="business-crud-page__dispatch-heading-no">
                {{ dispatchDialogNo || '-' }}
              </span>
              <el-tag :type="statusTagType(dispatchRow.businessStatus)" effect="light">
                {{ dispatchDialogStatusText }}
              </el-tag>
              <el-tag type="primary" effect="light">
                {{ dispatchRow.transportType || '公路整车' }}
              </el-tag>
            </div>
          </div>
          <div class="business-crud-page__dispatch-summary">
            <div class="business-crud-page__dispatch-summary-left">
              <div class="business-crud-page__dispatch-summary-grid">
                <div class="business-crud-page__dispatch-summary-item">
                  <div class="business-crud-page__dispatch-summary-label">客户</div>
                  <div class="business-crud-page__dispatch-summary-value">
                    {{ dispatchRow.customerName || '-' }}
                  </div>
                </div>
                <div class="business-crud-page__dispatch-summary-item">
                  <div class="business-crud-page__dispatch-summary-label">项目</div>
                  <div class="business-crud-page__dispatch-summary-value">
                    {{ dispatchRow.projectName || '-' }}
                  </div>
                </div>
                <div class="business-crud-page__dispatch-summary-item">
                  <div class="business-crud-page__dispatch-summary-label">合同编号</div>
                  <div class="business-crud-page__dispatch-summary-value">
                    {{ dispatchRow.contractName || dispatchRow.contractNo || '-' }}
                  </div>
                </div>
                <div class="business-crud-page__dispatch-summary-item">
                  <div class="business-crud-page__dispatch-summary-label">货物信息</div>
                  <div class="business-crud-page__dispatch-summary-value">
                    {{ dispatchPlanCargoInfo || '-' }}
                  </div>
                </div>
                <div class="business-crud-page__dispatch-summary-item">
                  <div class="business-crud-page__dispatch-summary-label">计划执行时间</div>
                  <div class="business-crud-page__dispatch-summary-value">
                    {{
                      [dispatchRow.planStartDate, dispatchRow.planEndDate]
                        .filter(Boolean)
                        .join('-') || '-'
                    }}
                  </div>
                </div>
                <div
                  class="business-crud-page__dispatch-summary-item business-crud-page__dispatch-summary-item--attachments"
                >
                  <div class="business-crud-page__dispatch-summary-label">附件</div>
                  <div class="business-crud-page__dispatch-summary-value">
                    <el-link
                      v-for="(item, index) in dispatchAttachmentRows"
                      :key="dispatchAttachmentLabel(item) + index"
                      type="primary"
                      :href="dispatchAttachmentUrl(item) || undefined"
                      :underline="false"
                      target="_blank"
                      class="business-crud-page__dispatch-attachment-link"
                    >
                      {{ dispatchAttachmentLabel(item) }}
                    </el-link>
                    <span v-if="!dispatchAttachmentRows.length">-</span>
                  </div>
                </div>
              </div>
            </div>
            <div class="business-crud-page__dispatch-route">
              <div class="business-crud-page__dispatch-route-item">
                <span class="business-crud-page__dispatch-route-badge is-start">起</span>
                <div class="business-crud-page__dispatch-route-body">
                  <div class="business-crud-page__dispatch-route-title">
                    {{ parseDispatchRoutePoint(dispatchRow, 'start').name || '-' }}
                  </div>
                  <div class="business-crud-page__dispatch-route-address">
                    {{ parseDispatchRoutePoint(dispatchRow, 'start').address || '-' }}
                  </div>
                  <div class="business-crud-page__dispatch-route-contact">
                    {{ parseDispatchRoutePoint(dispatchRow, 'start').contact || '-' }}
                  </div>
                </div>
              </div>
              <div class="business-crud-page__dispatch-route-line" />
              <div class="business-crud-page__dispatch-route-item">
                <span class="business-crud-page__dispatch-route-badge is-end">终</span>
                <div class="business-crud-page__dispatch-route-body">
                  <div class="business-crud-page__dispatch-route-title">
                    {{ parseDispatchRoutePoint(dispatchRow, 'end').name || '-' }}
                  </div>
                  <div class="business-crud-page__dispatch-route-address">
                    {{ parseDispatchRoutePoint(dispatchRow, 'end').address || '-' }}
                  </div>
                  <div class="business-crud-page__dispatch-route-contact">
                    {{ parseDispatchRoutePoint(dispatchRow, 'end').contact || '-' }}
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>

        <div class="business-crud-page__dispatch-list">
          <div class="business-crud-page__dispatch-list-head">
            <div class="business-crud-page__dispatch-list-title">待调度列表</div>
            <el-button
              type="primary"
              :disabled="dispatchSummaryRemainingQuantity <= 0"
              @click="handleDispatchAddRow"
            >
              新增
            </el-button>
            <div class="business-crud-page__dispatch-list-summary">
              {{ dispatchSummaryText }}
            </div>
          </div>
          <el-table
            :data="dispatchRows"
            border
            height="260"
            row-key="_key"
            class="business-crud-page__dispatch-table"
          >
            <el-table-column type="index" label="序号" width="70" align="center" fixed="left" />
            <el-table-column
              prop="transportType"
              label="运输方式"
              min-width="180"
              align="center"
              show-overflow-tooltip
            />
            <el-table-column
              prop="carrierType"
              label="承运类型"
              min-width="150"
              align="center"
              show-overflow-tooltip
            />
            <el-table-column
              prop="carrierName"
              label="承运商"
              min-width="150"
              align="center"
              show-overflow-tooltip
            />
            <el-table-column
              prop="driverName"
              label="司机(联系方式)"
              min-width="220"
              align="center"
              show-overflow-tooltip
            >
              <template #default="{ row }">
                <div>
                  <div>{{ row.driverName || '-' }}</div>
                  <div>{{ row.driverPhone || '-' }}</div>
                </div>
              </template>
            </el-table-column>
            <el-table-column
              prop="vehicleNo"
              label="车牌号/航班号/船号/班列号"
              min-width="200"
              align="center"
              show-overflow-tooltip
            />
            <el-table-column
              prop="cargoType"
              label="货物类型"
              min-width="170"
              align="center"
              show-overflow-tooltip
            />
            <el-table-column
              prop="cargoInfo"
              label="货物信息"
              min-width="280"
              align="center"
              show-overflow-tooltip
            />
            <el-table-column
              prop="departureAddress"
              label="发货地址"
              min-width="220"
              align="center"
              show-overflow-tooltip
            />
            <el-table-column
              prop="arrivalAddress"
              label="收货地址"
              min-width="220"
              align="center"
              show-overflow-tooltip
            />
            <el-table-column
              prop="dispatchUserName"
              label="调度人"
              min-width="140"
              align="center"
              show-overflow-tooltip
            />
            <el-table-column
              prop="dispatchTime"
              label="调度时间"
              min-width="160"
              align="center"
              show-overflow-tooltip
            />
            <el-table-column label="操作" width="180" align="center" fixed="right">
              <template #default="{ row, $index }">
                <div class="business-crud-page__dispatch-actions">
                  <el-link type="primary" @click="handleDispatchEditRow(row, $index)">编辑</el-link>
                  <el-link type="danger" @click="removeDispatchRow($index)">删除</el-link>
                </div>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
      <template #footer>
        <div class="business-crud-page__dispatch-footer">
          <el-button @click="dispatchBox = false">关闭</el-button>
          <el-button
            type="primary"
            :loading="dispatchSaving === 'submit'"
            @click="handleDispatchSubmit('submit')"
          >
            确认生成
          </el-button>
        </div>
      </template>
    </el-dialog>

    <el-dialog
      :title="dispatchItemDialogTitle"
      append-to-body
      v-model="dispatchItemBox"
      width="96%"
      top="8vh"
      class="business-crud-page__dispatch-item-dialog"
      @closed="resetDispatchItemDialog"
    >
      <el-form
        :model="dispatchItemForm"
        label-position="right"
        label-width="auto"
        class="business-crud-page__dispatch-item-form"
      >
        <div class="dialog-section-title">收发货信息</div>
        <div class="business-crud-page__dispatch-shipping-form">
          <el-form-item label="发货地址" required>
            <div class="business-crud-page__route-address-row">
              <el-input
                v-model="dispatchItemForm.departureName"
                :placeholder="dispatchStationNamePlaceholder"
                :suffix-icon="dispatchStationMode ? Search : undefined"
              />
              <el-input
                v-model="dispatchItemForm.departureAddress"
                :placeholder="dispatchAddressDetailPlaceholder"
                :suffix-icon="dispatchStationMode ? undefined : Location"
              />
              <span class="business-crud-page__route-label">联系人</span>
              <el-input v-model="dispatchItemForm.departureContact" placeholder="请输入" />
              <span class="business-crud-page__route-label">联系方式</span>
              <el-input v-model="dispatchItemForm.departurePhone" placeholder="请输入" />
            </div>
          </el-form-item>
          <el-form-item label="收货地址" required>
            <div class="business-crud-page__route-address-row">
              <el-input
                v-model="dispatchItemForm.arrivalName"
                :placeholder="dispatchStationNamePlaceholder"
                :suffix-icon="dispatchStationMode ? Search : undefined"
              />
              <el-input
                v-model="dispatchItemForm.arrivalAddress"
                :placeholder="dispatchAddressDetailPlaceholder"
                :suffix-icon="dispatchStationMode ? undefined : Location"
              />
              <span class="business-crud-page__route-label">联系人</span>
              <el-input v-model="dispatchItemForm.arrivalContact" placeholder="请输入" />
              <span class="business-crud-page__route-label">联系方式</span>
              <el-input v-model="dispatchItemForm.arrivalPhone" placeholder="请输入" />
            </div>
          </el-form-item>
        </div>

        <div
          class="dialog-section-title dialog-section-title--action"
          style="display: flex; width: 100%; justify-content: space-between"
        >
          <span class="business-crud-page__dispatch-task-title">任务信息</span>
          <el-segmented
            v-model="dispatchItemForm.taskEntryMode"
            :options="taskEntryModeOptions"
            class="business-crud-page__dispatch-entry-mode"
          />
        </div>

        <template v-if="dispatchItemForm.taskEntryMode === 'full'">
          <div class="dialog-section-title">货物信息</div>
          <div class="business-crud-page__dispatch-item-grid">
            <el-form-item label="货物名称" required>
              <el-input v-model="dispatchItemForm.cargoName" placeholder="请输入" />
            </el-form-item>
            <el-form-item label="货物类型" required>
              <el-input v-model="dispatchItemForm.cargoType" placeholder="请输入" />
            </el-form-item>
            <el-form-item label="数量" required>
              <el-input v-model="dispatchItemForm.quantity" placeholder="请输入">
                <template #append>
                  <el-select
                    v-model="dispatchItemForm.quantityUnit"
                    class="business-crud-page__dispatch-unit-select"
                  >
                    <el-option
                      v-for="item in quantityUnitOptions"
                      :key="item"
                      :label="item"
                      :value="item"
                    />
                  </el-select>
                </template>
              </el-input>
            </el-form-item>
            <el-form-item label="包装">
              <el-select v-model="dispatchItemForm.packageType" clearable placeholder="请选择">
                <el-option
                  v-for="item in packageOptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="规格">
              <el-input v-model="dispatchItemForm.specification" placeholder="请输入" />
            </el-form-item>
            <el-form-item label="型号">
              <el-input v-model="dispatchItemForm.model" placeholder="请输入" />
            </el-form-item>
          </div>

          <div class="dialog-section-title">费用信息</div>
          <div class="business-crud-page__dispatch-item-grid">
            <el-form-item label="单价">
              <el-input v-model="dispatchItemForm.unitPrice" placeholder="请输入">
                <template #append>
                  <el-select
                    v-model="dispatchItemForm.priceUnit"
                    class="business-crud-page__dispatch-unit-select"
                    placeholder="元/吨"
                    :loading="taskFeeUnitLoading"
                    @visible-change="visible => visible && loadTaskFeeUnitOptions()"
                  >
                    <el-option
                      v-if="!taskFeeUnitOptions.some(item => item.value === '元/吨')"
                      label="元/吨"
                      value="元/吨"
                    />
                    <el-option
                      v-for="item in taskFeeUnitOptions"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    />
                  </el-select>
                </template>
              </el-input>
            </el-form-item>
            <el-form-item label="其他费用合计">
              <el-input v-model="dispatchItemForm.otherFeeTotal" placeholder="请输入" />
            </el-form-item>
          </div>
        </template>
        <template v-else>
          <div
            class="business-crud-page__dispatch-item-grid business-crud-page__dispatch-item-grid--compact"
          >
            <el-form-item
              label="承运类型"
              required
              class="business-crud-page__dispatch-item-carrier-type"
            >
              <el-radio-group
                v-model="dispatchItemForm.carrierType"
                @change="handleDispatchCarrierTypeChange"
              >
                <el-radio-button v-for="item in taskCarrierTypes" :key="item" :label="item" />
              </el-radio-group>
            </el-form-item>
            <el-form-item v-if="dispatchItemForm.carrierType === '承运商'" label="承运商" required>
              <el-select
                v-model="dispatchItemForm.carrierName"
                placeholder="请输入"
                filterable
                clearable
                :suffix-icon="Search"
                :loading="taskCarrierLoading"
                @visible-change="visible => visible && loadDispatchCarrierOptions()"
                @change="handleDispatchCarrierChange"
              >
                <el-option
                  v-for="item in taskCarrierOptions"
                  :key="
                    item.id || item.customerName || item.carrierName || item.fullName || item.name
                  "
                  :label="item.customerName || item.carrierName || item.fullName || item.name"
                  :value="item.customerName || item.carrierName || item.fullName || item.name"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="司机" :required="dispatchItemForm.carrierType !== '承运商'">
              <el-select
                v-model="dispatchItemForm.driverName"
                placeholder="请输入"
                filterable
                clearable
                allow-create
                default-first-option
                :suffix-icon="Search"
                :loading="taskDriverLoading"
                @visible-change="visible => visible && loadDispatchDriverOptions()"
                @change="handleDispatchDriverChange"
              >
                <el-option
                  v-for="item in taskDriverOptions"
                  :key="item.id || item.driverName || item.mobile"
                  :label="item.driverName || item.name"
                  :value="item.driverName || item.name"
                />
              </el-select>
            </el-form-item>
            <el-form-item
              :label="dispatchItemForm.carrierType === '承运商' ? '手机号' : '司机手机号'"
              :required="dispatchItemForm.carrierType !== '承运商'"
            >
              <el-input v-model="dispatchItemForm.driverPhone" placeholder="请输入" />
            </el-form-item>
            <el-form-item label="车牌号" required>
              <el-input v-model="dispatchItemForm.vehicleNo" placeholder="请输入" />
            </el-form-item>
            <el-form-item
              v-if="dispatchItemForm.carrierType !== '承运商'"
              label="挂车车牌号"
              required
            >
              <el-input v-model="dispatchItemForm.trailerVehicleNo" placeholder="请输入" />
            </el-form-item>
            <el-form-item v-if="dispatchItemForm.carrierType !== '承运商'" label="押运人" required>
              <el-input v-model="dispatchItemForm.escortName" placeholder="请输入" />
            </el-form-item>
            <el-form-item
              v-if="dispatchItemForm.carrierType !== '承运商'"
              label="押运人手机号"
              required
            >
              <el-input v-model="dispatchItemForm.escortPhone" placeholder="请输入" />
            </el-form-item>
            <el-form-item label="货物类型" required>
              <el-input v-model="dispatchItemForm.cargoType" placeholder="请输入" />
            </el-form-item>
            <el-form-item label="货物名称" required>
              <el-input v-model="dispatchItemForm.cargoName" placeholder="请输入" />
            </el-form-item>
            <el-form-item label="规格">
              <el-input v-model="dispatchItemForm.specification" placeholder="请输入" />
            </el-form-item>
            <el-form-item label="型号">
              <el-input v-model="dispatchItemForm.model" placeholder="请输入" />
            </el-form-item>
            <el-form-item label="数量" required>
              <el-input v-model="dispatchItemForm.quantity" placeholder="请输入">
                <template #append>
                  <el-select
                    v-model="dispatchItemForm.quantityUnit"
                    class="business-crud-page__dispatch-unit-select"
                  >
                    <el-option
                      v-for="item in quantityUnitOptions"
                      :key="item"
                      :label="item"
                      :value="item"
                    />
                  </el-select>
                </template>
              </el-input>
            </el-form-item>
            <el-form-item label="里程(公里)" :required="dispatchItemForm.carrierType !== '承运商'">
              <el-input v-model="dispatchItemForm.mileage" placeholder="请输入" />
            </el-form-item>
            <el-form-item label="预计发货日期">
              <el-date-picker
                v-model="dispatchItemForm.estimatedStartTime"
                type="date"
                format="YYYY-MM-DD"
                value-format="YYYY-MM-DD"
                placeholder="请选择"
              />
            </el-form-item>
            <el-form-item label="预计完成日期">
              <el-date-picker
                v-model="dispatchItemForm.estimatedEndTime"
                type="date"
                format="YYYY-MM-DD"
                value-format="YYYY-MM-DD"
                placeholder="请选择"
              />
            </el-form-item>
            <el-form-item label="单价">
              <el-input v-model="dispatchItemForm.unitPrice" placeholder="请输入">
                <template #append>
                  <el-select
                    v-model="dispatchItemForm.priceUnit"
                    class="business-crud-page__dispatch-unit-select"
                    placeholder="元/吨"
                    :loading="taskFeeUnitLoading"
                    @visible-change="visible => visible && loadTaskFeeUnitOptions()"
                  >
                    <el-option
                      v-if="!taskFeeUnitOptions.some(item => item.value === '元/吨')"
                      label="元/吨"
                      value="元/吨"
                    />
                    <el-option
                      v-for="item in taskFeeUnitOptions"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    />
                  </el-select>
                </template>
              </el-input>
            </el-form-item>
            <el-form-item label="备注" class="business-crud-page__dispatch-item-span-3">
              <el-input
                v-model="dispatchItemForm.remark"
                maxlength="200"
                show-word-limit
                placeholder="请输入，200字以内"
              />
            </el-form-item>
          </div>
        </template>

        <div
          v-if="dispatchItemForm.taskEntryMode === 'full'"
          class="dialog-section-title business-crud-page__dispatch-carrier-title"
          style="display: flex; width: 100%; margin-top: 16px"
        >
          承运信息
        </div>
        <div
          v-if="dispatchItemForm.taskEntryMode === 'full'"
          class="business-crud-page__dispatch-item-grid"
        >
          <el-form-item label="承运类型" required class="business-crud-page__dispatch-item-span-2">
            <el-radio-group
              v-model="dispatchItemForm.carrierType"
              @change="handleDispatchCarrierTypeChange"
            >
              <el-radio-button v-for="item in taskCarrierTypes" :key="item" :label="item" />
            </el-radio-group>
          </el-form-item>
          <el-form-item v-if="dispatchItemForm.carrierType === '承运商'" label="承运商" required>
            <el-select
              v-model="dispatchItemForm.carrierName"
              placeholder="请输入"
              filterable
              clearable
              :suffix-icon="Search"
              :loading="taskCarrierLoading"
              @visible-change="visible => visible && loadDispatchCarrierOptions()"
              @change="handleDispatchCarrierChange"
            >
              <el-option
                v-for="item in taskCarrierOptions"
                :key="
                  item.id || item.customerName || item.carrierName || item.fullName || item.name
                "
                :label="item.customerName || item.carrierName || item.fullName || item.name"
                :value="item.customerName || item.carrierName || item.fullName || item.name"
              />
            </el-select>
          </el-form-item>
          <el-form-item
            v-if="dispatchItemForm.carrierType"
            label="司机"
            :required="dispatchItemForm.carrierType !== '承运商'"
          >
            <el-select
              v-model="dispatchItemForm.driverName"
              placeholder="请输入"
              filterable
              clearable
              allow-create
              default-first-option
              :suffix-icon="Search"
              :loading="taskDriverLoading"
              @visible-change="visible => visible && loadDispatchDriverOptions()"
              @change="handleDispatchDriverChange"
            >
              <el-option
                v-for="item in taskDriverOptions"
                :key="item.id || item.driverName || item.mobile"
                :label="item.driverName || item.name"
                :value="item.driverName || item.name"
              />
            </el-select>
          </el-form-item>
          <el-form-item
            v-if="dispatchItemForm.carrierType"
            :label="dispatchItemForm.carrierType === '承运商' ? '手机号' : '司机手机号'"
            :required="dispatchItemForm.carrierType !== '承运商'"
          >
            <el-input v-model="dispatchItemForm.driverPhone" placeholder="请输入" />
          </el-form-item>
          <el-form-item
            v-if="dispatchItemForm.carrierType"
            label="车牌号/航班号/船号/班列号"
            required
          >
            <el-input v-model="dispatchItemForm.vehicleNo" placeholder="请输入" />
          </el-form-item>
          <el-form-item
            v-if="dispatchItemForm.carrierType && dispatchItemForm.carrierType !== '承运商'"
            label="挂车车牌号"
            required
          >
            <el-input v-model="dispatchItemForm.trailerVehicleNo" placeholder="请输入" />
          </el-form-item>
          <el-form-item
            v-if="dispatchItemForm.carrierType && dispatchItemForm.carrierType !== '承运商'"
            label="押运人"
            required
          >
            <el-input v-model="dispatchItemForm.escortName" placeholder="请输入" />
          </el-form-item>
          <el-form-item
            v-if="dispatchItemForm.carrierType && dispatchItemForm.carrierType !== '承运商'"
            label="押运人手机号"
            required
          >
            <el-input v-model="dispatchItemForm.escortPhone" placeholder="请输入" />
          </el-form-item>
          <el-form-item
            v-if="dispatchItemForm.carrierType && dispatchItemForm.carrierType !== '承运商'"
            label="里程(km)"
            required
          >
            <el-input v-model="dispatchItemForm.mileage" placeholder="请输入" />
          </el-form-item>
          <el-form-item label="预计发货日期">
            <el-date-picker
              v-model="dispatchItemForm.estimatedStartTime"
              type="date"
              format="YYYY-MM-DD"
              value-format="YYYY-MM-DD"
              placeholder="请选择"
            />
          </el-form-item>
          <el-form-item label="预计完成日期">
            <el-date-picker
              v-model="dispatchItemForm.estimatedEndTime"
              type="date"
              format="YYYY-MM-DD"
              value-format="YYYY-MM-DD"
              placeholder="请选择"
            />
          </el-form-item>
          <el-form-item label="备注" class="business-crud-page__dispatch-item-span-2">
            <el-input
              v-model="dispatchItemForm.remark"
              type="textarea"
              :rows="2"
              maxlength="200"
              show-word-limit
              placeholder="请输入，200字以内"
            />
          </el-form-item>
        </div>

        <template v-if="dispatchItemForm.taskEntryMode === 'full'">
          <div class="dialog-section-title">附件</div>
          <div class="business-crud-page__attachment">
            <div class="business-crud-page__attachment-head">
              <vehicle-attachment-upload
                v-model="dispatchItemAttachmentRows"
                :file-types="attachmentFileTypes"
                :max-size="500"
                :show-tip="false"
                :show-file-list="false"
                button-text="上传附件"
                @change="handleDispatchItemAttachmentChange"
              />
              <el-button
                type="primary"
                :disabled="!dispatchItemAttachmentRows.length"
                @click="handleDispatchItemBatchDownload"
              >
                批量下载
              </el-button>
            </div>
            <el-table
              :data="dispatchItemAttachmentRows"
              border
              class="business-crud-page__attachment-table"
            >
              <el-table-column type="index" label="序号" width="70" align="center" />
              <el-table-column label="文件名" min-width="200" align="center" show-overflow-tooltip>
                <template #default="{ row }">{{ row.originalName || row.name }}</template>
              </el-table-column>
              <el-table-column label="附件描述" min-width="220" align="center">
                <template #default="{ row }">
                  <el-input v-model="row.description" placeholder="请输入附件描述" />
                </template>
              </el-table-column>
              <el-table-column label="文件大小" width="110" align="center">
                <template #default="{ row }">{{ formatFileSize(row.size) }}</template>
              </el-table-column>
              <el-table-column prop="uploadUserName" label="上传人" width="140" align="center" />
              <el-table-column prop="uploadTime" label="上传时间" width="160" align="center" />
              <el-table-column label="操作" width="100" align="center">
                <template #default="{ $index }">
                  <el-link type="danger" @click="removeDispatchItemAttachment($index)">删除</el-link>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </template>
      </el-form>
      <template #footer>
        <el-button @click="dispatchItemBox = false">取消</el-button>
        <el-button type="primary" @click="saveDispatchItem">提交</el-button>
      </template>
    </el-dialog>

    <el-dialog
      :title="billingPlanMode === 'edit' ? '编辑计费方案' : '添加计费方案'"
      append-to-body
      v-model="billingPlanBox"
      width="96%"
      class="business-crud-page__billing-dialog"
    >
      <el-form
        ref="billingPlanFormRef"
        :model="billingPlanForm"
        :rules="billingPlanRules"
        label-position="right"
        label-width="auto"
      >
        <div class="business-crud-page__billing-form-row">
          <el-form-item label="方案名称" prop="planName" required>
            <el-input
              v-model="billingPlanForm.planName"
              maxlength="100"
              :disabled="dialogReadonly"
            />
          </el-form-item>
          <el-form-item label="" class="business-crud-page__billing-default">
            <el-checkbox v-model="billingPlanForm.defaultPlan" :disabled="dialogReadonly">
              默认方案
            </el-checkbox>
          </el-form-item>
        </div>
        <el-form-item label="备注">
          <el-input
            v-model="billingPlanForm.remark"
            maxlength="100"
            show-word-limit
            :disabled="dialogReadonly"
          />
        </el-form-item>
      </el-form>

      <div class="business-crud-page__billing-rule-head">
        <el-link v-if="!dialogReadonly" type="primary" @click="addBillingRule">
          +添加规则
        </el-link>
      </div>
      <div class="business-crud-page__billing-rule-wrap">
        <el-table
          :data="billingPlanForm.rules"
          border
          class="business-crud-page__billing-rule-table"
        >
          <el-table-column type="index" label="序号" width="70" align="center" fixed="left" />
          <el-table-column width="180" align="center">
            <template #header>
              <span class="business-crud-page__required-column">费用类型</span>
            </template>
            <template #default="{ row }">
              <el-select
                v-model="row.feeType"
                class="business-crud-page__billing-field"
                clearable
                filterable
                :disabled="dialogReadonly"
                :loading="billingFeeCategoryLoading"
                placeholder="请选择"
                @change="value => handleBillingFeeTypeChange(row, value)"
              >
                <el-option
                  v-for="item in billingFeeCategoryOptions"
                  :key="item.id || item.dictKey"
                  :label="item.dictValue"
                  :value="item.dictKey"
                />
              </el-select>
            </template>
          </el-table-column>
          <el-table-column width="210" align="center">
            <template #header>
              <span class="business-crud-page__required-column">费用项</span>
            </template>
            <template #default="{ row }">
              <el-select
                v-model="row.feeItem"
                class="business-crud-page__billing-field"
                clearable
                filterable
                :disabled="dialogReadonly || !row.feeType"
                :loading="billingFeeItemLoadingMap[resolveBillingFeeType(row.feeType)]"
                :placeholder="row.feeType ? '请选择' : '请先选择费用类型'"
              >
                <el-option
                  v-for="item in getBillingFeeItemOptions(row.feeType)"
                  :key="item.id || item.name || item.englishName"
                  :label="item.name || item.englishName"
                  :value="item.name || item.englishName"
                />
              </el-select>
            </template>
          </el-table-column>
          <el-table-column width="170" align="center">
            <template #header>
              <span class="business-crud-page__required-column">计费要素</span>
            </template>
            <template #default="{ row }">
              <el-select
                v-model="row.billingElement"
                :disabled="dialogReadonly"
                placeholder="请选择"
                @change="handleBillingElementChange(row)"
              >
                <el-option
                  v-for="item in billingElementOptions"
                  :key="item"
                  :label="item"
                  :value="item"
                />
              </el-select>
            </template>
          </el-table-column>
          <el-table-column width="180" align="center">
            <template #header>
              <span class="business-crud-page__required-column">计费类型</span>
            </template>
            <template #default="{ row }">
              <el-select
                v-model="row.billingType"
                :disabled="dialogReadonly || !row.billingElement"
                :placeholder="row.billingElement ? '请选择' : '请先选择计费要素'"
                @change="handleBillingTypeChange(row)"
              >
                <el-option
                  v-for="item in getBillingTypeOptions(row)"
                  :key="item"
                  :label="item"
                  :value="item"
                />
              </el-select>
            </template>
          </el-table-column>
          <el-table-column width="150" align="center">
            <template #header>
              <span class="business-crud-page__required-column">计费单位</span>
            </template>
            <template #default="{ row }">
              <el-select
                v-model="row.billingUnit"
                clearable
                filterable
                :disabled="dialogReadonly"
                :loading="billingUnitLoading"
                placeholder="请选择"
              >
                <el-option
                  v-for="item in billingUnitOptions"
                  :key="item.id || item.dictKey || item.dictValue"
                  :label="item.dictValue"
                  :value="item.dictValue"
                />
              </el-select>
            </template>
          </el-table-column>
          <el-table-column width="140" align="center">
            <template #header>
              <span class="business-crud-page__required-column">单价（元）</span>
            </template>
            <template #default="{ row }">
              <el-input
                v-model="row.unitPrice"
                :disabled="dialogReadonly"
                placeholder="请输入"
                @input="value => handleBillingDecimalInput(row, 'unitPrice', value)"
              />
            </template>
          </el-table-column>
          <el-table-column label="计费要素下限" width="260" align="center">
            <template #default="{ row }">
              <div class="business-crud-page__limit-list">
                <el-input
                  v-for="(item, rangeIndex) in getBillingLimitRanges(row)"
                  :key="rangeIndex"
                  v-model="item.lowerLimit"
                  :disabled="!canEditBillingLimit(row)"
                  :placeholder="canEditBillingLimit(row) ? '请输入下限' : '无需配置'"
                  @input="value => handleBillingLimitInput(row, rangeIndex, 'lowerLimit', value)"
                />
              </div>
            </template>
          </el-table-column>
          <el-table-column label="计费要素上限" width="260" align="center">
            <template #default="{ row }">
              <div class="business-crud-page__limit-list">
                <div
                  v-for="(item, rangeIndex) in getBillingLimitRanges(row)"
                  :key="rangeIndex"
                  class="business-crud-page__limit-row"
                >
                  <el-input
                    v-model="item.upperLimit"
                    :disabled="!canEditBillingLimit(row)"
                    :placeholder="canEditBillingLimit(row) ? '请输入上限' : '无需配置'"
                    @input="value => handleBillingLimitInput(row, rangeIndex, 'upperLimit', value)"
                  />
                  <el-link
                    v-if="canEditBillingLimit(row)"
                    type="primary"
                    @click="addBillingLimitRange(row, rangeIndex)"
                  >
                    添加
                  </el-link>
                  <el-button
                    v-if="canEditBillingLimit(row) && getBillingLimitRanges(row).length > 1"
                    type="primary"
                    text
                    @click="removeBillingLimitRange(row, rangeIndex)"
                  >
                    删除
                  </el-button>
                </div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="保底计费重量" width="240" align="center">
            <template #default="{ row }">
              <el-input
                v-model="row.minimumBillingWeight"
                :disabled="!canEditMinimumBillingWeight(row)"
                :placeholder="
                  canEditMinimumBillingWeight(row)
                    ? '实际计量值小于保底数值时按保底计费'
                    : '仅按重量、按吨·公里可填写'
                "
                @input="value => handleBillingDecimalInput(row, 'minimumBillingWeight', value)"
              />
            </template>
          </el-table-column>
          <el-table-column label="备注" width="180" align="center">
            <template #default="{ row }">
              <el-input
                v-model="row.remark"
                maxlength="100"
                show-word-limit
                :disabled="dialogReadonly"
                placeholder="请输入"
              />
            </template>
          </el-table-column>
          <el-table-column label="操作" width="230" align="center" fixed="right">
            <template #default="{ row, $index }">
              <el-link type="primary" @click="openBillingMatch(row, $index)">
                设置匹配条件
              </el-link>
              <el-link v-if="!dialogReadonly" type="primary" @click="copyBillingRule(row)">
                复制
              </el-link>
              <el-link
                v-if="!dialogReadonly"
                type="primary"
                @click="removeBillingRule($index)"
              >
                删除
              </el-link>
            </template>
          </el-table-column>
        </el-table>
      </div>

      <template #footer>
        <div class="business-crud-page__dialog-footer">
          <el-button type="primary" :disabled="dialogReadonly" @click="submitBillingPlan">
            提交
          </el-button>
          <el-button @click="billingPlanBox = false">取消</el-button>
        </div>
      </template>
    </el-dialog>

    <el-dialog title="设置匹配条件" append-to-body v-model="billingMatchBox" width="720px">
      <el-form
        :model="billingMatchForm"
        label-position="right"
        label-width="90px"
        class="business-crud-page__match-form"
      >
        <el-row :gutter="48">
          <el-col :span="12">
            <el-form-item label="起运地">
              <el-cascader
                v-model="billingMatchForm.originPath"
                :options="billingMatchRegionOptions"
                :props="billingMatchRegionCascaderProps"
                :placeholder="billingMatchForm.origin || '请选择起运地'"
                :loading="billingMatchRegionLoading"
                :disabled="dialogReadonly"
                clearable
                filterable
                @visible-change="visible => visible && ensureBillingMatchRegionOptions()"
                @change="value => handleBillingMatchRegionChange('origin', value)"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="目的地">
              <el-cascader
                v-model="billingMatchForm.destinationPath"
                :options="billingMatchRegionOptions"
                :props="billingMatchRegionCascaderProps"
                :placeholder="billingMatchForm.destination || '请选择目的地'"
                :loading="billingMatchRegionLoading"
                :disabled="dialogReadonly"
                clearable
                filterable
                @visible-change="visible => visible && ensureBillingMatchRegionOptions()"
                @change="value => handleBillingMatchRegionChange('destination', value)"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="运输方式">
              <el-select
                v-model="billingMatchForm.transportMode"
                :disabled="dialogReadonly"
                clearable
              >
                <el-option label="公路" value="公路" />
                <el-option label="铁路" value="铁路" />
                <el-option label="水路" value="水路" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="货物类型">
              <el-cascader
                v-model="billingMatchForm.cargoTypePath"
                :options="billingCargoTypeOptions"
                :props="billingCargoTypeCascaderProps"
                :placeholder="billingMatchForm.cargoType || '请选择货物类型'"
                :loading="billingCargoTypeLoading"
                :disabled="dialogReadonly"
                clearable
                filterable
                :filter-method="filterBillingCargoType"
                @visible-change="visible => visible && ensureBillingCargoTypeOptions()"
                @change="handleBillingMatchCargoTypeChange"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer>
        <el-button @click="billingMatchBox = false">取消</el-button>
        <el-button type="primary" :disabled="dialogReadonly" @click="saveBillingMatch">
          保存
        </el-button>
      </template>
    </el-dialog>

    <el-dialog
      title="选择线路"
      append-to-body
      v-model="transportRouteBox"
      width="1280px"
      @opened="loadTransportRouteList"
    >
      <div class="business-crud-page__dialog-search">
        <el-form :model="transportRouteQuery" label-position="right" label-width="86px">
          <el-row :gutter="16">
            <el-col :span="6">
              <el-form-item label="线路名称">
                <el-input v-model="transportRouteQuery.routeName" clearable placeholder="请输入" />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="发货地址">
                <el-input
                  v-model="transportRouteQuery.departureAddress"
                  clearable
                  placeholder="请输入"
                />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="收货地址">
                <el-input
                  v-model="transportRouteQuery.arrivalAddress"
                  clearable
                  placeholder="请输入"
                />
              </el-form-item>
            </el-col>
            <el-col :span="6" class="business-crud-page__dialog-search-actions">
              <el-button type="primary" @click="handleTransportRouteSearch">查询</el-button>
              <el-button @click="handleTransportRouteReset">重置</el-button>
            </el-col>
          </el-row>
        </el-form>
      </div>
      <el-table border height="320" :data="transportRouteRows" v-loading="transportRouteLoading">
        <el-table-column type="index" label="序号" width="70" align="center" />
        <el-table-column prop="routeName" label="线路名称" min-width="150" />
        <el-table-column prop="routeCode" label="线路编号" min-width="140" />
        <el-table-column prop="departureName" label="发货地" min-width="140" />
        <el-table-column
          prop="departureAddress"
          label="发货地址"
          min-width="220"
          show-overflow-tooltip
        />
        <el-table-column prop="departureContact" label="发货联系人" min-width="120" />
        <el-table-column prop="departurePhone" label="发货联系方式" min-width="140" />
        <el-table-column prop="arrivalName" label="收货地" min-width="140" />
        <el-table-column
          prop="arrivalAddress"
          label="收货地址"
          min-width="220"
          show-overflow-tooltip
        />
        <el-table-column prop="arrivalContact" label="收货联系人" min-width="120" />
        <el-table-column prop="arrivalPhone" label="收货联系方式" min-width="140" />
        <el-table-column prop="remark" label="备注" min-width="180" show-overflow-tooltip />
        <el-table-column prop="deptName" label="组织" min-width="150" show-overflow-tooltip />
        <el-table-column
          prop="updateUserName"
          label="更新人"
          min-width="120"
          :formatter="formatTransportRouteUpdateUserName"
        />
        <el-table-column prop="updateTime" label="更新时间" min-width="160" />
        <el-table-column prop="createTime" label="创建时间" min-width="160" />
        <el-table-column label="操作" width="110" fixed="right">
          <template #default="{ row }">
            <el-link type="primary" @click.stop="selectTransportRouteRow(row)">
              选择
            </el-link>
          </template>
        </el-table-column>
      </el-table>
      <div class="business-crud-page__dialog-pagination">
        <el-pagination
          v-model:current-page="transportRoutePage.currentPage"
          v-model:page-size="transportRoutePage.pageSize"
          :page-sizes="[10, 20, 50, 100]"
          layout="total, prev, pager, next, sizes"
          :total="transportRoutePage.total"
          @size-change="handleTransportRouteSizeChange"
          @current-change="handleTransportRouteCurrentChange"
        />
      </div>
      <template #footer>
        <el-button @click="transportRouteBox = false">关闭</el-button>
      </template>
    </el-dialog>

    <el-dialog
      title="选择常用地址"
      append-to-body
      v-model="transportAddressBox"
      width="1280px"
      @opened="loadTransportAddressList"
    >
      <div class="business-crud-page__dialog-search">
        <el-form :model="transportAddressQuery" label-position="right" label-width="86px">
          <el-row :gutter="16">
            <el-col :span="6">
              <el-form-item label="地址名称">
                <el-input
                  v-model="transportAddressQuery.addressName"
                  clearable
                  placeholder="请输入"
                />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="地址类型">
                <el-select
                  v-model="transportAddressQuery.addressType"
                  clearable
                  filterable
                  placeholder="请选择"
                >
                  <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="transportAddressQuery.detailAddress"
                  clearable
                  placeholder="请输入"
                />
              </el-form-item>
            </el-col>
            <el-col :span="6" class="business-crud-page__dialog-search-actions">
              <el-button type="primary" @click="handleTransportAddressSearch">查询</el-button>
              <el-button @click="handleTransportAddressReset">重置</el-button>
            </el-col>
          </el-row>
        </el-form>
      </div>
      <el-table
        border
        height="320"
        :data="transportAddressRows"
        v-loading="transportAddressLoading"
      >
        <el-table-column type="index" label="序号" width="70" align="center" />
        <el-table-column prop="addressName" label="地址名称" min-width="150" />
        <el-table-column prop="addressCode" label="地址编号" min-width="130" />
        <el-table-column prop="addressType" label="类型" min-width="120" />
        <el-table-column
          prop="siteCodeDisplay"
          label="站点编码"
          min-width="120"
          :formatter="formatTransportAddressSiteCode"
        />
        <el-table-column
          prop="detailAddress"
          label="详细地址"
          min-width="260"
          show-overflow-tooltip
        />
        <el-table-column prop="longitude" label="经度" min-width="120" />
        <el-table-column prop="latitude" label="纬度" min-width="120" />
        <el-table-column prop="regionName" label="行政区划" min-width="150" show-overflow-tooltip />
        <el-table-column prop="contactName" label="联系人" min-width="120" />
        <el-table-column prop="contactPhone" label="联系方式" min-width="140" />
        <el-table-column prop="deptName" label="组织" min-width="150" show-overflow-tooltip />
        <el-table-column prop="remark" label="备注" min-width="180" show-overflow-tooltip />
        <el-table-column prop="updateTime" label="更新时间" min-width="160" />
        <el-table-column prop="createTime" label="创建时间" min-width="160" />
        <el-table-column label="操作" width="110" fixed="right">
          <template #default="{ row }">
            <el-link type="primary" @click.stop="selectTransportAddressRow(row)">
              选择
            </el-link>
          </template>
        </el-table-column>
      </el-table>
      <div class="business-crud-page__dialog-pagination">
        <el-pagination
          v-model:current-page="transportAddressPage.currentPage"
          v-model:page-size="transportAddressPage.pageSize"
          :page-sizes="[10, 20, 50, 100]"
          layout="total, prev, pager, next, sizes"
          :total="transportAddressPage.total"
          @size-change="handleTransportAddressSizeChange"
          @current-change="handleTransportAddressCurrentChange"
        />
      </div>
      <template #footer>
        <el-button @click="transportAddressBox = false">关闭</el-button>
      </template>
    </el-dialog>

    <el-dialog
      title="选择站点"
      append-to-body
      v-model="transportStationBox"
      width="1180px"
      @opened="loadTransportStationList"
    >
      <div class="business-crud-page__dialog-search">
        <el-form :model="transportStationQuery" label-position="right" label-width="86px">
          <el-row :gutter="16">
            <el-col :span="6">
              <el-form-item label="站点名称">
                <el-input v-model="transportStationQuery.name" clearable placeholder="请输入" />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="站点类型">
                <el-input :model-value="transportStationTypeLabel" disabled />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="详细地址">
                <el-input
                  v-model="transportStationQuery.detailAddress"
                  clearable
                  placeholder="请输入"
                />
              </el-form-item>
            </el-col>
            <el-col :span="6" class="business-crud-page__dialog-search-actions">
              <el-button type="primary" @click="handleTransportStationSearch">查询</el-button>
              <el-button @click="handleTransportStationReset">重置</el-button>
            </el-col>
          </el-row>
        </el-form>
      </div>
      <el-table
        border
        height="320"
        :data="transportStationRows"
        v-loading="transportStationLoading"
      >
        <el-table-column type="index" label="序号" width="70" align="center" />
        <el-table-column prop="stationName" label="站点名" min-width="160" />
        <el-table-column prop="stationType" label="类型" min-width="120" />
        <el-table-column prop="stationCode" label="站点编码" min-width="130" />
        <el-table-column
          prop="detailAddress"
          label="详细地址"
          min-width="260"
          show-overflow-tooltip
        />
        <el-table-column prop="longitude" label="经度" min-width="120" />
        <el-table-column prop="latitude" label="纬度" min-width="120" />
        <el-table-column prop="regionName" label="行政区划" min-width="160" show-overflow-tooltip />
        <el-table-column prop="remark" label="备注" min-width="180" show-overflow-tooltip />
        <el-table-column prop="updateTime" label="更新时间" min-width="160" />
        <el-table-column prop="createTime" label="创建时间" min-width="160" />
        <el-table-column label="操作" width="110" fixed="right">
          <template #default="{ row }">
            <el-link type="primary" @click.stop="selectTransportStationRow(row)">
              选择
            </el-link>
          </template>
        </el-table-column>
      </el-table>
      <div class="business-crud-page__dialog-pagination">
        <el-pagination
          v-model:current-page="transportStationPage.currentPage"
          v-model:page-size="transportStationPage.pageSize"
          :page-sizes="[10, 20, 50, 100]"
          layout="total, prev, pager, next, sizes"
          :total="transportStationPage.total"
          @size-change="handleTransportStationSizeChange"
          @current-change="handleTransportStationCurrentChange"
        />
      </div>
      <template #footer>
        <el-button @click="transportStationBox = false">关闭</el-button>
      </template>
    </el-dialog>

    <el-dialog
      title="地图选择地址"
      append-to-body
      v-model="transportMapBox"
      width="920px"
      @opened="initTransportAmap"
    >
      <div class="business-crud-page__map-toolbar">
        <el-input
          v-model="transportMapKeyword"
          clearable
          placeholder="输入地址关键词"
          @keyup.enter="searchTransportMapKeyword"
        />
        <el-button
          type="primary"
          :icon="Search"
          :loading="transportMapLoading"
          @click="searchTransportMapKeyword"
        >
          搜索
        </el-button>
      </div>
      <div ref="transportAmap" class="business-crud-page__map"></div>
      <div class="business-crud-page__map-info">
        <span>{{ transportMapStatus }}</span>
        <span v-if="transportMapSelected.regionName"
          >行政区划：{{ transportMapSelected.regionName }}</span
        >
      </div>
      <template #footer>
        <el-button @click="transportMapBox = false">取消</el-button>
        <el-button
          type="primary"
          :disabled="!transportMapSelected.longitude"
          @click="confirmTransportMapPick"
        >
          确定
        </el-button>
      </template>
    </el-dialog>

    <el-dialog
      title="选择常用货物"
      append-to-body
      v-model="commonCargoBox"
      width="1280px"
      @opened="loadCommonCargoList"
    >
      <div class="business-crud-page__dialog-search">
        <el-form :model="commonCargoQuery" label-position="right" label-width="100px">
          <el-row :gutter="16">
            <el-col :span="6">
              <el-form-item label="货物名称">
                <el-input v-model="commonCargoQuery.cargoName" clearable placeholder="请输入" />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="货物类型">
                <el-cascader
                  v-model="commonCargoQuery.cargoTypePath"
                  :options="billingCargoTypeOptions"
                  :props="billingCargoTypeCascaderProps"
                  placeholder="请选择"
                  clearable
                  filterable
                  :filter-method="filterBillingCargoType"
                  @visible-change="visible => visible && ensureBillingCargoTypeOptions()"
                  @change="handleCommonCargoTypeChange"
                />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="规格型号">
                <el-input
                  v-model="commonCargoQuery.specificationModel"
                  clearable
                  placeholder="请输入"
                />
              </el-form-item>
            </el-col>
            <el-col :span="6" class="business-crud-page__dialog-search-actions">
              <el-button type="primary" @click="handleCommonCargoSearch">查询</el-button>
              <el-button @click="handleCommonCargoReset">重置</el-button>
            </el-col>
          </el-row>
        </el-form>
      </div>
      <el-table border height="320" :data="commonCargoRows" v-loading="commonCargoLoading">
        <el-table-column type="index" label="序号" width="70" align="center" />
        <el-table-column prop="cargoName" label="货物名称" min-width="150" />
        <el-table-column prop="cargoCode" label="货物编号" min-width="130" />
        <el-table-column prop="firstCargoTypeName" label="一级货物类型" min-width="150" />
        <el-table-column prop="secondCargoTypeName" label="二级货物类型" min-width="150" />
        <el-table-column prop="secondCargoTypeCode" label="二级货物编码" min-width="140" />
        <el-table-column prop="packageType" label="包装" min-width="100" />
        <el-table-column prop="brand" label="品牌" min-width="120" />
        <el-table-column prop="specification" label="规格" min-width="120" />
        <el-table-column prop="model" label="型号" min-width="120" />
        <el-table-column prop="cargoValue" label="单价" min-width="120" />
        <el-table-column prop="priceUnit" label="计价单位" min-width="120" />
        <el-table-column
          prop="cargoSize"
          label="尺寸"
          min-width="120"
          :formatter="formatCommonCargoSize"
        />
        <el-table-column
          prop="descriptionOne"
          label="其他说明1"
          min-width="160"
          show-overflow-tooltip
        />
        <el-table-column
          prop="descriptionTwo"
          label="其他说明2"
          min-width="160"
          show-overflow-tooltip
        />
        <el-table-column prop="remark" label="备注" min-width="180" show-overflow-tooltip />
        <el-table-column prop="deptName" label="组织" min-width="150" show-overflow-tooltip />
        <el-table-column prop="updateTime" label="更新时间" min-width="160" />
        <el-table-column prop="createTime" label="创建时间" min-width="160" />
        <el-table-column label="操作" width="110" fixed="right">
          <template #default="{ row }">
            <el-link type="primary" @click.stop="selectCommonCargoRow(row)">
              选择
            </el-link>
          </template>
        </el-table-column>
      </el-table>
      <div class="business-crud-page__dialog-pagination">
        <el-pagination
          v-model:current-page="commonCargoPage.currentPage"
          v-model:page-size="commonCargoPage.pageSize"
          :page-sizes="[10, 20, 50, 100]"
          layout="total, prev, pager, next, sizes"
          :total="commonCargoPage.total"
          @size-change="handleCommonCargoSizeChange"
          @current-change="handleCommonCargoCurrentChange"
        />
      </div>
      <template #footer>
        <el-button @click="commonCargoBox = false">关闭</el-button>
      </template>
    </el-dialog>

    <el-dialog title="导入货物" append-to-body v-model="cargoImportBox" width="560px">
      <el-upload
        drag
        action="#"
        accept=".xls,.xlsx"
        :auto-upload="false"
        :show-file-list="false"
        :disabled="cargoImportLoading"
        :on-change="handleCargoImportFileChange"
      >
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">将 Excel 文件拖到此处，或点击上传</div>
        <template #tip>
          <div class="el-upload__tip">
            按货物信息表头读取：货物名称、货物类型、数量、数量单位、包装、品牌、规格、型号、物料编码、设备编码、备注
          </div>
        </template>
      </el-upload>
      <template #footer>
        <el-button @click="cargoImportBox = false">关闭</el-button>
      </template>
    </el-dialog>

    <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 { exportBlob } from '@/api/common';
import { getList as getCommonAddressList } from '@/api/base/common-address';
import { getList as getAirportMasterList } from '@/api/base/airport-master';
import { getList as getCargoTypeList } from '@/api/base/cargo-type';
import { getList as getFeeItemList } from '@/api/base/fee-item';
import { getList as getPortTerminalList } from '@/api/base/port-terminal';
import { getList as getRailwayStationList } from '@/api/base/railway-station';
import { getLazyTree as getRegionLazyTree } from '@/api/base/region';
import { getList as getCommonCargoList } from '@/api/business/common-cargo';
import { getList as getContractList } from '@/api/business/contract-manage';
import { getList as getProjectList } from '@/api/business/project-apply';
import { getList as getCommonRouteList } from '@/api/business/common-route';
import { getList as getTransportPlanList } from '@/api/business/transport-plan';
import { getList as getCarrierCustomerList } from '@/api/vehicle/customer-archive';
import { getList as getDriverList } from '@/api/transportCapacity/driver';
import { getDictionary } from '@/api/system/dictbiz';
import { getDeptTree } from '@/api/system/dept';
import { addressTypeOptions } from '@/option/base/common-address';
import { packageOptions } from '@/option/business/common';
import { formatUpdateUserName } from '@/utils/audit';
import { getToken } from '@/utils/auth';
import { openImportDialog } from '@/utils/import-excel';
import { applyTableMenuWidth } from '@/utils/table-menu';
import { downloadFileByUrl, downloadXls } from '@/utils/util';
import { List, Location, Search } from '@element-plus/icons-vue';
import { mapGetters } from 'vuex';
import NProgress from 'nprogress';
import 'nprogress/nprogress.css';
import WaybillImportDialog from './waybill-import-dialog.vue';

const AMAP_KEY = '653b7cf105ad7fb8ec9b2f5198ade315';
const AMAP_SECURITY_CODE = '5aab65c632e48ebae0d0e28f5b28e21a';
let amapLoader;

const estimateMenuButtonCount = config => {
  const rowActions = (config.actions || []).filter(action => action !== 'batchComplete');
  return 3 + rowActions.length + (config.operations || []).length;
};

const extractRecords = res => {
  const data = res?.data?.data || res?.data || res;
  if (Array.isArray(data)) return data;
  if (Array.isArray(data?.records)) return data.records;
  if (Array.isArray(data?.data)) return data.data;
  if (Array.isArray(data?.data?.records)) return data.data.records;
  return [];
};

const transportPlanImportColumns = [
  ['计划名称', 'planName'],
  ['运输方式', 'transportType'],
  ['计划开始日期', 'planStartDate'],
  ['计划结束日期', 'planEndDate'],
  ['货物名称', 'cargoName'],
  ['货物类型', 'cargoType'],
  ['数量', 'quantity'],
  ['数量单位', 'quantityUnit'],
  ['包装', 'packageType'],
  ['品牌', 'brand'],
  ['规格', 'specification'],
  ['型号', 'model'],
  ['物料编码', 'materialCode'],
  ['设备编码', 'deviceCode'],
  ['发货地址', 'departureAddress'],
  ['发货联系人', 'departureContact'],
  ['发货联系方式', 'departurePhone'],
  ['收货地址', 'arrivalAddress'],
  ['收货联系人', 'arrivalContact'],
  ['收货联系方式', 'arrivalPhone'],
  ['备注', 'remark'],
];

const defaultBillingRule = () => ({
  feeType: '',
  feeItem: '',
  billingElement: '',
  billingType: '',
  billingUnit: '',
  unitPrice: '',
  lowerLimit: '',
  upperLimit: '',
  limitRanges: [{ lowerLimit: '', upperLimit: '' }],
  minimumBillingWeight: '',
  remark: '',
  matchCondition: {
    origin: '',
    originCode: '',
    originPath: [],
    destination: '',
    destinationCode: '',
    destinationPath: [],
    transportMode: '',
    cargoType: '',
    cargoTypeCode: '',
    cargoTypePath: [],
  },
});

const defaultBillingPlan = () => ({
  planName: '',
  defaultPlan: false,
  remark: '',
  rules: [defaultBillingRule()],
});

const defaultSettlementRule = () => ({
  autoGenerate: 1,
  billStartDate: '',
  settlementType: '月结',
  billCycleType: '固定截单日',
  billCutoffDay: 25,
  cycleDays: '',
});

const defaultReconciliation = () => ({
  skipReconciliation: 1,
  reconciliationMode: '明细逐行核对',
});

const defaultTransportCargo = () => ({
  cargoName: '',
  cargoType: '',
  cargoTypeCode: '',
  cargoTypePath: [],
  quantity: '',
  quantityUnit: '',
  packageType: '',
  brand: '',
  specification: '',
  model: '',
  materialCode: '',
  deviceCode: '',
  remark: '',
});

const defaultDispatchRow = () => ({
  taskEntryMode: 'simple',
  transportType: '',
  carrierType: '承运商',
  carrierId: '',
  carrierName: '',
  driverId: '',
  driverName: '',
  driverPhone: '',
  vehicleNo: '',
  trailerVehicleNo: '',
  escortName: '',
  escortPhone: '',
  mileage: '',
  cargoType: '',
  cargoName: '',
  cargoInfo: '',
  quantity: '',
  quantityUnit: '吨',
  specification: '',
  model: '',
  packageType: '',
  brand: '',
  materialCode: '',
  unitPrice: '',
  priceUnit: '元/吨',
  otherFeeTotal: '',
  estimatedStartTime: '',
  estimatedEndTime: '',
  departureAddress: '',
  departureName: '',
  departureContact: '',
  departurePhone: '',
  arrivalAddress: '',
  arrivalName: '',
  arrivalContact: '',
  arrivalPhone: '',
  dispatchUserName: '',
  dispatchTime: '',
  attachmentsJson: '',
  remark: '',
});

const taskCarrierTypes = ['承运商', '自运', '网货平台'];

export default {
  components: { WaybillImportDialog },
  name: 'BusinessCrudPage',
  props: {
    api: {
      type: Object,
      required: true,
    },
    config: {
      type: Object,
      required: true,
    },
    crudOption: {
      type: Object,
      required: true,
    },
    crudExcelOption: {
      type: Object,
      default: () => ({ column: [] }),
    },
  },
  data() {
    return {
      List,
      Location,
      Search,
      form: {},
      suppressTransportTypeClear: false,
      query: {},
      loading: true,
      data: [],
      allDept: 0,
      dialogReadonly: false,
      detailBox: false,
      detailLoading: false,
      detailRow: {},
      waybillImportBox: false,
      transportPlanImportBox: false,
      transportPlanImportLoading: false,
      transportPlanImportFiles: [],
      transportPlanImportSourceFile: null,
      transportPlanImportRows: [],
      transportPlanImportSelection: [],
      transportPlanImportTab: 'all',
      transportPlanImportEditingKey: '',
      transportPlanImportEditSnapshot: null,
      transportPlanImportContractOptions: [],
      transportPlanImportContractLoading: false,
      transportPlanImportForm: {
        projectId: '',
        projectName: '',
        customerName: '',
        contractId: '',
        contractName: '',
        file: null,
      },
      transportPlanImportRules: {
        projectId: [{ required: true, message: '请选择项目', trigger: 'change' }],
        customerName: [{ required: true, message: '请选择项目后带出客户', trigger: 'change' }],
        contractId: [{ required: true, message: '请选择项目后带出客户合同', trigger: 'change' }],
        file: [{ required: true, message: '请上传计划明细表', trigger: 'change' }],
      },
      draftSaveLoading: false,
      crudDialogType: '',
      defaultDialogButtons: null,
      contractCreateActionLoading: '',
      transportPlanCreateActionLoading: '',
      option: this.cloneOption(this.crudOption, estimateMenuButtonCount(this.config)),
      selectedProjectId: '',
      projectOptions: [],
      projectLoading: false,
      contractOptions: [],
      contractLoading: false,
      shippingPlanOptions: [],
      shippingPlanLoading: false,
      selectedOrganizationId: '',
      organizationOptions: [],
      organizationFlatOptions: [],
      organizationLoading: false,
      addressTypeOptions,
      flowBox: false,
      flowUrl: '',
      processInstanceId: '',
      dispatchBox: false,
      dispatchLoading: false,
      dispatchRow: {},
      dispatchRows: [],
      dispatchSaving: '',
      dispatchItemBox: false,
      dispatchItemIndex: -1,
      dispatchItemForm: defaultDispatchRow(),
      dispatchItemAttachmentRows: [],
      attachmentRows: [],
      contractFileRows: [],
      transportCargoRows: [],
      transportRouteBox: false,
      transportRouteLoading: false,
      transportRouteQuery: {},
      transportRouteRows: [],
      transportRouteSelected: null,
      transportRoutePage: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      transportAddressBox: false,
      transportAddressTarget: '',
      transportAddressLoading: false,
      transportAddressQuery: {},
      transportAddressRows: [],
      transportAddressSelected: null,
      transportAddressPage: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      transportStationBox: false,
      transportStationTarget: '',
      transportStationLoading: false,
      transportStationQuery: {},
      transportStationRows: [],
      transportStationPage: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      transportMapBox: false,
      transportMapTarget: '',
      transportMapLoading: false,
      transportMapKeyword: '',
      transportMapStatus: '可搜索地址或点击地图选点',
      transportMapSelected: {},
      transportAmap: null,
      transportAmapMarker: null,
      transportAmapGeocoder: null,
      commonCargoBox: false,
      commonCargoLoading: false,
      commonCargoQuery: {},
      commonCargoRows: [],
      commonCargoSelected: [],
      commonCargoPage: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      taskCarrierTypes,
      taskCarrierOptions: [],
      taskCarrierLoading: false,
      taskDriverOptions: [],
      taskDriverLoading: false,
      taskCargoOptionsMap: {},
      taskCargoLoadingMap: {},
      taskQuantityUnitOptions: [],
      taskQuantityUnitLoading: false,
      taskFeeUnitOptions: [],
      taskFeeUnitLoading: false,
      cargoImportBox: false,
      cargoImportLoading: false,
      billingPlanRows: [],
      settlementRuleForm: defaultSettlementRule(),
      reconciliationForm: defaultReconciliation(),
      changeRecordRows: [],
      billingPlanBox: false,
      billingPlanMode: 'add',
      billingPlanIndex: -1,
      billingPlanForm: defaultBillingPlan(),
      billingFeeCategoryOptions: [],
      billingFeeCategoryLoading: false,
      billingFeeCategoryRequest: null,
      billingFeeItemOptionsMap: {},
      billingFeeItemLoadingMap: {},
      billingFeeItemRequestMap: {},
      billingUnitOptions: [],
      billingUnitLoading: false,
      billingUnitRequest: null,
      billingMatchBox: false,
      billingMatchRuleIndex: -1,
      billingMatchForm: defaultBillingRule().matchCondition,
      billingMatchRegionOptions: [],
      billingMatchRegionLoading: false,
      billingMatchRegionRequest: null,
      billingCargoTypeOptions: [],
      billingCargoTypeFlatOptions: [],
      billingCargoTypeLoading: false,
      billingCargoTypeRequest: null,
      billingPlanRules: {
        planName: [{ required: true, message: '请输入方案名称', trigger: 'blur' }],
      },
      billingElementOptions: [
        '按重量',
        '按体积',
        '按车辆',
        '按里程',
        '按吨·公里',
        '固定金额（整单一口价）',
        '按数量',
      ],
      billingElementTypeMap: {
        按重量: ['固定单价', '区间单价', '阶梯单价', '区间阶梯一口价'],
        按体积: ['固定单价', '区间单价', '阶梯单价', '区间阶梯一口价'],
        按车辆: ['固定单价'],
        按里程: ['固定单价', '区间单价', '阶梯单价', '区间阶梯一口价'],
        '按吨·公里': ['固定单价', '区间单价', '阶梯单价', '区间阶梯一口价'],
        '固定金额（整单一口价）': ['固定一口价'],
        按数量: ['固定单价', '区间单价', '阶梯单价', '区间阶梯一口价'],
      },
      settlementTypeOptions: ['月结', '日结', '周结', '半月结', '固定天数周期结算'],
      billCycleTypeOptions: ['固定截单日', '自然月'],
      reconciliationModeOptions: ['明细逐行核对', '按账单汇总核对', '跳过自动核对'],
      packageOptions,
      quantityUnitOptions: ['吨', '千克', '立方米', '件', '车', '箱', '托盘'],
      attachmentFileTypes: [
        'pdf',
        'bmp',
        'jpeg',
        'png',
        'jpg',
        'doc',
        'docx',
        'ppt',
        'pptx',
        'xlsx',
        'xls',
        'eml',
        'msg',
        'zip',
      ],
      excelBox: false,
      excelForm: {},
      excelOptionConfig: this.cloneOption(this.crudExcelOption),
      page: {
        pageSize: 10,
        pageSizes: [10, 20, 50, 100],
        currentPage: 1,
        total: 0,
      },
      selectionList: [],
    };
  },
  created() {
    if (this.config.enableProjectSelect) {
      this.loadProjectOptions();
    }
    if (this.config.enableOrganizationSelect) {
      this.loadOrganizationOptions();
    }
    if (this.config.enableBillingPlan) {
      this.ensureBillingFeeCategoryOptions();
      this.ensureBillingUnitOptions();
    }
    if (this.config.enableTaskInfoForm) {
      this.loadTaskQuantityUnitOptions();
      this.loadTaskFeeUnitOptions();
      this.ensureBillingCargoTypeOptions();
    }
    this.consumeTemplateCreatePayload();
  },
  computed: {
    ...mapGetters(['permission', 'userInfo']),
    permissionList() {
      return {
        addBtn: this.canCreate,
      };
    },
    detailSections() {
      return this.config.detailSections || [];
    },
    transportPlanImportDuplicateCount() {
      return this.transportPlanImportRows.filter(row => row._duplicate).length;
    },
    transportPlanImportVisibleRows() {
      return this.transportPlanImportTab === 'duplicate'
        ? this.transportPlanImportRows.filter(row => row._duplicate)
        : this.transportPlanImportRows;
    },
    actionButtonLikeSearch() {
      return this.config.actionButtonLikeSearch === true;
    },
    contractSelectEnabled() {
      return this.config.enableContractSelect || this.config.enableTransportPlanForm;
    },
    shippingPlanSelectEnabled() {
      return this.config.enableShippingPlanSelect === true;
    },
    shippingInfoFormEnabled() {
      return this.config.enableShippingInfoForm || this.config.enableTransportPlanForm;
    },
    taskInfoFormEnabled() {
      return this.config.enableTaskInfoForm === true;
    },
    taskEntryModeOptions() {
      return [
        { label: '精简录入', value: 'simple' },
        { label: '完整录入', value: 'full' },
      ];
    },
    isTaskFullMode() {
      return this.form.taskEntryMode === 'full';
    },
    isCarrierMode() {
      return this.form.carrierType === '承运商';
    },
    taskCargoOptions() {
      return this.getTaskCargoOptionsByPath(this.form.cargoTypePath);
    },
    taskCargoLoading() {
      return this.isTaskCargoOptionsLoading(this.form.cargoTypePath);
    },
    taskCargoQuantityTotal() {
      const total = this.transportCargoRows.reduce((sum, row) => {
        const value = Number(row.quantity);
        return Number.isFinite(value) ? sum + value : sum;
      }, 0);
      if (!total) return '';
      return Number.isInteger(total) ? String(total) : String(Number(total.toFixed(3)));
    },
    dispatchPlanGoodsRows() {
      return this.parseJsonArray(this.dispatchRow.goodsJson);
    },
    dispatchPlanCargoInfo() {
      const cargoInfo = this.dispatchPlanGoodsRows
        .map(row => this.formatDispatchCargoInfo({}, row))
        .filter(Boolean)
        .join('; ');
      return cargoInfo || this.dispatchRow.goodsInfo || '';
    },
    dispatchSummaryTotalQuantity() {
      const goodsQuantity = this.dispatchPlanGoodsRows.reduce(
        (total, row) =>
          total +
          this.parseDispatchQuantity(row.quantity || row.cargoQuantity || row.goodsQuantity),
        0
      );
      if (goodsQuantity > 0) return goodsQuantity;
      return this.parseDispatchQuantity(
        this.dispatchRow.totalQuantity ||
          this.dispatchRow.totalCargoQuantity ||
          this.dispatchRow.quantity
      );
    },
    dispatchSummaryAssignedQuantity() {
      return this.dispatchRows.reduce(
        (total, row) => total + this.parseDispatchQuantity(row.quantity),
        0
      );
    },
    dispatchSummaryRemainingQuantity() {
      const total = this.dispatchSummaryTotalQuantity;
      const assigned = this.dispatchSummaryAssignedQuantity;
      const remain = total - assigned;
      return remain > 0 ? remain : 0;
    },
    dispatchSummaryUnit() {
      const unitRow = this.dispatchPlanGoodsRows.find(
        row => row.quantityUnit || row.goodsQuantityUnit || row.unit
      );
      return (
        unitRow?.quantityUnit ||
        unitRow?.goodsQuantityUnit ||
        unitRow?.unit ||
        this.dispatchRow.quantityUnit ||
        this.dispatchRows.find(row => row.quantityUnit)?.quantityUnit ||
        '吨'
      );
    },
    dispatchSummaryText() {
      const total = this.formatDispatchQuantity(this.dispatchSummaryTotalQuantity);
      const assigned = this.formatDispatchQuantity(this.dispatchSummaryAssignedQuantity);
      const remain = this.formatDispatchQuantity(this.dispatchSummaryRemainingQuantity);
      return `共${total}${this.dispatchSummaryUnit} | 已调度 ${assigned}${this.dispatchSummaryUnit}，剩余${remain}${this.dispatchSummaryUnit}`;
    },
    dispatchAttachmentRows() {
      return this.parseJsonArray(this.dispatchRow.attachmentsJson);
    },
    dispatchRouteStart() {
      const address = this.dispatchRow.departureAddress || this.dispatchRow.departureName || '';
      return {
        label: this.dispatchRow.departureName || '起',
        address,
        detail: this.dispatchRow.departureDetailAddress || address,
        contact: [this.dispatchRow.departureContact, this.dispatchRow.departurePhone]
          .filter(Boolean)
          .join(' - '),
      };
    },
    dispatchRouteEnd() {
      const address = this.dispatchRow.arrivalAddress || this.dispatchRow.arrivalName || '';
      return {
        label: this.dispatchRow.arrivalName || '终',
        address,
        detail: this.dispatchRow.arrivalDetailAddress || address,
        contact: [this.dispatchRow.arrivalContact, this.dispatchRow.arrivalPhone]
          .filter(Boolean)
          .join(' - '),
      };
    },
    dispatchDialogTitle() {
      return '计划调度';
    },
    dispatchItemDialogTitle() {
      const mode = this.dispatchItemForm.taskEntryMode === 'full' ? '完整录入' : '精简录入';
      return this.dispatchItemIndex < 0 ? `新增/编辑（${mode}）` : `编辑调度信息（${mode}）`;
    },
    dispatchTransportMode() {
      return this.resolveTransportMode(this.dispatchItemForm.transportType);
    },
    dispatchStationMode() {
      return ['water', 'rail', 'air'].includes(this.dispatchTransportMode);
    },
    dispatchStationNamePlaceholder() {
      if (!this.dispatchStationMode) return '行政区划自动带出';
      const labelMap = {
        water: '请选择港口/码头',
        rail: '请选择车站',
        air: '请选择空港',
      };
      return labelMap[this.dispatchTransportMode] || '请选择站点';
    },
    dispatchAddressDetailPlaceholder() {
      return this.dispatchStationMode ? '选择站点后带出详细地址' : '请输入';
    },
    dispatchDialogNo() {
      return this.dispatchRow.planNo || this.dispatchRow.loadingNo || '';
    },
    dispatchDialogStatusText() {
      return this.displayStatus(this.dispatchRow, this.config.statusProp || 'businessStatus');
    },
    taskFreightAmount() {
      const quantity = Number(this.taskCargoQuantityTotal || this.form.quantity || 0);
      const unitPrice = Number(this.form.unitPrice || 0);
      if (!quantity || !unitPrice) return '';
      const amount = quantity * unitPrice;
      return Number.isInteger(amount) ? String(amount) : String(Number(amount.toFixed(2)));
    },
    isAdmin() {
      const authority = this.userInfo && this.userInfo.authority;
      return Array.isArray(authority)
        ? authority.includes('admin')
        : String(authority || '').includes('admin');
    },
    canViewAllDept() {
      return this.isAdmin;
    },
    readonlyScope() {
      return this.config.enableAllDept && this.allDept === 1;
    },
    canCreate() {
      return this.hasPermission(`${this.config.permission}_add`) && !this.readonlyScope;
    },
    showContractCreateActions() {
      return (
        this.config.enableContractCreateActions &&
        this.crudDialogType === 'add' &&
        !this.dialogReadonly
      );
    },
    showTransportPlanCreateActions() {
      return (
        this.config.enableTransportPlanCreateActions &&
        this.crudDialogType === 'add' &&
        !this.dialogReadonly
      );
    },
    organizationCascaderProps() {
      return {
        label: 'label',
        value: 'id',
        children: 'children',
        checkStrictly: true,
        emitPath: false,
      };
    },
    billingMatchRegionCascaderProps() {
      return {
        label: 'title',
        value: 'id',
        children: 'children',
        leaf: 'leaf',
        emitPath: true,
      };
    },
    billingCargoTypeCascaderProps() {
      return {
        label: 'cargoName',
        value: 'id',
        children: 'children',
        disabled: (data, node) => node.level === 1,
        leaf: 'leaf',
        checkStrictly: true,
        emitPath: true,
      };
    },
    transportCargoTypeOptions() {
      return this.billingCargoTypeOptions.filter(item => item.children?.length);
    },
    transportCargoTypeCascaderProps() {
      return {
        label: 'cargoName',
        value: 'id',
        children: 'children',
        emitPath: true,
      };
    },
    showSettlementBillCycleType() {
      return this.settlementRuleForm.settlementType === '月结';
    },
    showSettlementBillCutoffDay() {
      return (
        this.showSettlementBillCycleType && this.settlementRuleForm.billCycleType === '固定截单日'
      );
    },
    showSettlementCycleDays() {
      return this.settlementRuleForm.settlementType === '固定天数周期结算';
    },
    canBatchComplete() {
      return (
        this.hasAction('batchComplete') &&
        this.hasPermission(`${this.config.permission}_batch_complete`) &&
        !this.readonlyScope
      );
    },
    canRoadLoading() {
      const permission =
        this.config.roadLoadingPermission || `${this.config.permission}_road_loading`;
      return this.config.roadLoading && this.hasPermission(permission) && !this.readonlyScope;
    },
    ids() {
      return this.selectionList.map(item => item.id).join(',');
    },
    billCutoffDayOptions() {
      return Array.from({ length: 31 }, (_, index) => {
        const value = index + 1;
        return {
          label: `${value}日`,
          value,
        };
      });
    },
    cycleDayOptions() {
      return Array.from({ length: 365 }, (_, index) => {
        const value = index + 1;
        return {
          label: `${value}天`,
          value,
        };
      });
    },
    transportCargoQuantityTotal() {
      if (!this.transportCargoRows.length) return '系统自动计算';
      const total = this.transportCargoRows.reduce((sum, row) => {
        const value = Number(row.quantity);
        return Number.isFinite(value) ? sum + value : sum;
      }, 0);
      return Number.isInteger(total) ? String(total) : total.toFixed(2);
    },
    transportAddressSelectDisabled() {
      return this.dialogReadonly || this.isBillingFieldEmpty(this.form.transportType);
    },
    transportMode() {
      return this.resolveTransportMode(this.form.transportType);
    },
    transportStationMode() {
      return ['water', 'rail', 'air'].includes(this.transportMode);
    },
    transportStationTypeLabel() {
      const labelMap = {
        water: '港口/码头',
        rail: '铁路车站',
        air: '空港机场',
      };
      return labelMap[this.transportMode] || '';
    },
    transportStationNamePlaceholder() {
      if (!this.transportStationMode) return '行政区划自动带出';
      const labelMap = {
        water: '请选择港口/码头',
        rail: '请选择车站',
        air: '请选择空港',
      };
      return labelMap[this.transportMode] || '请选择站点';
    },
    transportAddressDetailPlaceholder() {
      return this.transportStationMode ? '选择站点后带出详细地址' : '请输入';
    },
  },
  watch: {
    'form.transportType'(value, oldValue) {
      if (!this.shippingInfoFormEnabled || this.suppressTransportTypeClear) return;
      if (String(value ?? '') === String(oldValue ?? '')) return;
      this.handleTransportTypeChange(value);
    },
  },
  methods: {
    cloneOption(option, menuButtonCount) {
      const nextOption = {
        ...option,
        column: (option.column || []).map(column => ({ ...column })),
      };
      return applyTableMenuWidth(nextOption, menuButtonCount);
    },
    hasPermission(code) {
      return this.isAdmin || this.validData(this.permission && this.permission[code], false);
    },
    hasAction(action) {
      return (this.config.actions || []).includes(action);
    },
    statusValue(row) {
      return row[this.config.statusProp || 'status'];
    },
    inStatus(row, statusList) {
      if (!statusList || !statusList.length) {
        return true;
      }
      const status = this.statusValue(row);
      const statusText = this.config.statusTextProp ? row[this.config.statusTextProp] : '';
      return statusList.includes(status) || statusList.includes(statusText);
    },
    isReadonlyEditAllowed(row) {
      return this.inStatus(row, this.config.ignoreReadonlyEditStatus);
    },
    isReadonlyDeleteAllowed(row) {
      return this.inStatus(row, this.config.ignoreReadonlyDeleteStatus);
    },
    canEdit(row) {
      return (
        this.hasPermission(`${this.config.permission}_edit`) &&
        !this.readonlyScope &&
        (!row.readonly || this.isReadonlyEditAllowed(row)) &&
        this.inStatus(row, this.config.editStatus)
      );
    },
    canDelete(row) {
      return (
        this.hasPermission(`${this.config.permission}_delete`) &&
        !this.readonlyScope &&
        (!row.readonly || this.isReadonlyDeleteAllowed(row)) &&
        this.inStatus(row, this.config.deleteStatus) &&
        (!this.config.deleteStage || this.config.deleteStage.includes(row.contractStage))
      );
    },
    canCopy(row) {
      return (
        this.hasAction('copy') &&
        this.hasPermission(`${this.config.permission}_copy`) &&
        !this.readonlyScope &&
        !row.readonly
      );
    },
    canEnable(row) {
      return (
        this.hasAction('enable') &&
        this.hasPermission(`${this.config.permission}_enable`) &&
        !this.readonlyScope &&
        !row.readonly &&
        [0, 2].includes(row.status)
      );
    },
    canDisable(row) {
      return (
        this.hasAction('disable') &&
        this.hasPermission(`${this.config.permission}_disable`) &&
        !this.readonlyScope &&
        !row.readonly &&
        row.status === 1
      );
    },
    canCancel(row) {
      if (
        !this.hasAction('cancel') ||
        !this.hasPermission(`${this.config.permission}_cancel`) ||
        this.readonlyScope ||
        row.readonly
      ) {
        return false;
      }
      const status = this.statusValue(row);
      return this.config.permission === 'transport_plan'
        ? ['waiting_dispatch', 'dispatching'].includes(status)
        : ['pending', 'processing'].includes(status);
    },
    canComplete(row) {
      if (
        !this.hasAction('complete') ||
        !this.hasPermission(`${this.config.permission}_complete`) ||
        this.readonlyScope ||
        row.readonly
      ) {
        return false;
      }
      const status = this.statusValue(row);
      return this.config.permission === 'transport_plan'
        ? status === 'dispatching'
        : status === 'processing';
    },
    canReassign(row) {
      return (
        this.hasAction('reassign') &&
        this.hasPermission(`${this.config.permission}_reassign`) &&
        !this.readonlyScope &&
        !row.readonly &&
        this.statusValue(row) === 'pending'
      );
    },
    customOperations(row) {
      return (this.config.operations || []).filter(operation => this.canOperation(operation, row));
    },
    menuActions(row) {
      const actions = [];
      if (this.canCopy(row)) {
        actions.push({ key: 'copy', label: '复制', action: 'copy' });
      }
      if (this.canEdit(row)) {
        actions.push({
          key: 'edit',
          label: this.editLabel(row),
          action: 'edit',
        });
      }
      this.customOperations(row).forEach(operation => {
        actions.push({
          ...operation,
          key: `${operation.action}-${operation.label}`,
        });
      });
      if (this.canDelete(row)) {
        actions.push({ key: 'delete', label: '删除', action: 'delete', type: 'danger' });
      }
      return actions;
    },
    editLabel(row) {
      const status = this.statusValue(row);
      return this.config.editLabelStatusMap?.[status] || '编辑';
    },
    handleMenuAction(action, row, index) {
      if (action.action === 'copy') {
        this.handleCopy(row);
        return;
      }
      if (action.action === 'edit' || action.action === 'attachmentUpload') {
        this.$refs.crud.rowEdit(row, index);
        return;
      }
      if (action.action === 'delete') {
        this.rowDel(row);
        return;
      }
      this.handleCustomOperation(action, row);
    },
    consumeTemplateCreatePayload() {
      const target = this.config.templateCreateTarget;
      if (!target) return;
      const storageKey = 'business-template-create';
      const raw = sessionStorage.getItem(storageKey);
      if (!raw) return;
      let payload;
      try {
        payload = JSON.parse(raw);
      } catch (error) {
        sessionStorage.removeItem(storageKey);
        return;
      }
      if (payload.target !== target) return;
      sessionStorage.removeItem(storageKey);
      this.$nextTick(() => {
        this.$refs.crud.rowAdd();
        this.$nextTick(() => {
          const row = payload.data || {};
          this.suppressTransportTypeClear = true;
          Object.assign(this.form, row);
          this.$nextTick(() => {
            this.suppressTransportTypeClear = false;
          });
          this.form.planName = this.form.planName || this.form.templateName || '';
          this.selectedProjectId = this.form.projectId || '';
          this.attachmentRows = this.parseJsonArray(this.form.attachmentsJson);
          if (this.contractSelectEnabled) {
            this.syncCurrentContractOption();
            this.loadContractOptionsForProject();
          }
          if (this.config.enableProjectSelect) this.syncCurrentProjectOption();
          if (this.config.enableTransportPlanForm) this.initTransportPlanFormRows();
          if (this.taskInfoFormEnabled) this.initTaskInfoForm();
        });
      });
    },
    canOperation(operation, row) {
      const permission = operation.permission || `${this.config.permission}_${operation.action}`;
      if (!this.hasPermission(permission) || this.readonlyScope || row.readonly) {
        return false;
      }
      const prop = operation.statusProp || this.config.statusProp || 'status';
      const statusList = operation.status || [];
      if (statusList.length && !statusList.includes(row[prop])) {
        return false;
      }
      if (operation.stage && !operation.stage.includes(row.contractStage)) {
        return false;
      }
      return true;
    },
    showDetailButton(row) {
      if (!this.config.detailButton || !this.hasPermission(`${this.config.permission}_view`))
        return false;
      const status = this.statusValue(row);
      return status !== 'draft';
    },
    formatDetailValue(row, prop) {
      if (!row) return '-';
      if (prop === 'businessStatus') return this.displayStatus(row, prop);
      const column = this.findColumn(this.option.column, prop);
      if (column?.formatter) return column.formatter(row, {}, row[prop]);
      if (column?.dicData) {
        const item = column.dicData.find(dic => String(dic.value) === String(row[prop]));
        if (item) return item.label;
      }
      const value = row[prop];
      return value === undefined || value === null || value === '' ? '-' : value;
    },
    openDetail(row) {
      this.detailBox = true;
      this.detailLoading = true;
      this.detailRow = { ...row };
      const request =
        typeof this.api.getDetail === 'function'
          ? this.api.getDetail(row.id)
          : Promise.resolve({ data: { data: row } });
      request
        .then(res => {
          const detail = res?.data?.data || res?.data || row;
          this.detailRow = detail;
          this.applyFormDetail(detail);
        })
        .finally(() => {
          this.detailLoading = false;
        });
    },
    displayStatus(row, prop) {
      const textProp = prop === this.config.statusProp ? this.config.statusTextProp : '';
      if (textProp && row[textProp]) {
        return row[textProp];
      }
      const column = this.findColumn(this.option.column, prop);
      const item = column && (column.dicData || []).find(dic => dic.value === row[prop]);
      return item ? item.label : row[prop] || '未知';
    },
    syncContractNoDisabled(type) {
      if (!this.config.enableContractForm) return;
      const column = this.findColumn?.(this.option.column, 'contractNo');
      if (column) {
        column.disabled = type !== 'add';
      }
    },
    syncCustomCreateDialogButtons(type) {
      if (
        !this.config.enableContractCreateActions &&
        !this.config.enableTransportPlanCreateActions
      ) {
        return;
      }
      if (!this.defaultDialogButtons) {
        this.defaultDialogButtons = {
          saveBtn: this.option.saveBtn,
          cancelBtn: this.option.cancelBtn,
        };
      }
      const customCreate = type === 'add';
      this.option.saveBtn = customCreate ? false : this.defaultDialogButtons.saveBtn;
      this.option.cancelBtn = customCreate ? false : this.defaultDialogButtons.cancelBtn;
    },
    statusTagType(status) {
      if (
        [
          1,
          'pending',
          'waiting_dispatch',
          'processing',
          'dispatching',
          'approved',
          'change_approved',
        ].includes(status)
      ) {
        return 'success';
      }
      if ([2, 'cancelled', 'withdrawn', 'draft'].includes(status)) {
        return 'info';
      }
      if (['rejected', 'change_rejected'].includes(status)) {
        return 'danger';
      }
      if (status === 'completed') {
        return 'primary';
      }
      return 'warning';
    },
    stageTagType(stage) {
      if (stage === 'formal') {
        return 'success';
      }
      if (stage === 'temporary') {
        return 'warning';
      }
      if (stage === 'terminated') {
        return 'danger';
      }
      return 'info';
    },
    isMonthlySettlement(rule = this.settlementRuleForm) {
      return rule.settlementType === '月结';
    },
    isFixedBillCutoffSettlement(rule = this.settlementRuleForm) {
      return this.isMonthlySettlement(rule) && rule.billCycleType === '固定截单日';
    },
    isFixedCycleSettlement(rule = this.settlementRuleForm) {
      return rule.settlementType === '固定天数周期结算';
    },
    handleSettlementTypeChange(value) {
      if (value === '月结') {
        if (!this.settlementRuleForm.billCycleType) {
          this.settlementRuleForm.billCycleType = '固定截单日';
        }
        if (this.settlementRuleForm.billCycleType === '固定截单日') {
          this.settlementRuleForm.billCutoffDay = this.settlementRuleForm.billCutoffDay || 25;
        }
        this.settlementRuleForm.cycleDays = '';
        return;
      }
      this.settlementRuleForm.billCycleType = '';
      this.settlementRuleForm.billCutoffDay = '';
      if (value !== '固定天数周期结算') {
        this.settlementRuleForm.cycleDays = '';
      }
    },
    handleSettlementBillCycleTypeChange(value) {
      if (value === '固定截单日') {
        this.settlementRuleForm.billCutoffDay = this.settlementRuleForm.billCutoffDay || 25;
        return;
      }
      this.settlementRuleForm.billCutoffDay = '';
    },
    normalizeSettlementRule(rule = this.settlementRuleForm) {
      const nextRule = {
        ...defaultSettlementRule(),
        ...(rule || {}),
      };
      if (!this.isMonthlySettlement(nextRule)) {
        nextRule.billCycleType = '';
        nextRule.billCutoffDay = '';
      } else if (!this.isFixedBillCutoffSettlement(nextRule)) {
        nextRule.billCutoffDay = '';
      }
      if (!this.isFixedCycleSettlement(nextRule)) {
        nextRule.cycleDays = '';
      }
      return nextRule;
    },
    validateSettlementRule() {
      const rule = this.normalizeSettlementRule(this.settlementRuleForm);
      if (this.isBillingFieldEmpty(rule.billStartDate)) {
        this.$message.warning('请选择账单起始日期');
        return false;
      }
      if (this.isBillingFieldEmpty(rule.settlementType)) {
        this.$message.warning('请选择结算类型');
        return false;
      }
      if (this.isMonthlySettlement(rule) && this.isBillingFieldEmpty(rule.billCycleType)) {
        this.$message.warning('请选择账单周期类型');
        return false;
      }
      if (this.isFixedBillCutoffSettlement(rule)) {
        const billCutoffDay = Number(rule.billCutoffDay);
        if (!Number.isInteger(billCutoffDay) || billCutoffDay < 1 || billCutoffDay > 31) {
          this.$message.warning('账单截单日必须为1~31的整数');
          return false;
        }
      }
      if (this.isFixedCycleSettlement(rule)) {
        const cycleDays = Number(rule.cycleDays);
        if (!Number.isInteger(cycleDays) || cycleDays < 1 || cycleDays > 365) {
          this.$message.warning('周期天数必须为1~365的整数');
          return false;
        }
      }
      return true;
    },
    normalizeRow(row) {
      const submitRow = { ...row };
      if (this.config.enableTransportPlanForm) {
        if (!this.validateTransportPlanForm(submitRow)) return false;
        submitRow.goodsJson = JSON.stringify(this.transportCargoRows);
      }
      if (this.taskInfoFormEnabled) {
        if (!this.validateTaskInfoForm(submitRow)) return false;
        this.syncTaskInfoToRow(submitRow);
      }
      if (this.config.enableAttachmentTable) {
        submitRow.attachmentsJson = JSON.stringify(this.attachmentRows);
      }
      if (this.config.enableContractFileUpload) {
        submitRow.contractFileJson = JSON.stringify(this.contractFileRows);
      }
      if (this.config.enableBillingPlan) {
        submitRow.billingPlanJson = JSON.stringify(this.billingPlanRows);
      }
      if (this.config.enableSettlementRule) {
        if (!this.validateSettlementRule()) return false;
        submitRow.settlementRuleJson = JSON.stringify(this.normalizeSettlementRule());
      }
      if (this.config.enableReconciliation) {
        submitRow.reconciliationJson = JSON.stringify(this.reconciliationForm);
      }
      if (this.config.enableChangeRecord) {
        submitRow.changeRecordJson = JSON.stringify(this.changeRecordRows);
      }
      if (this.config.saveAsDraft) {
        submitRow.approvalStatus = 'draft';
      }
      delete submitRow.basicInfoTitle;
      delete submitRow.templateInfoTitle;
      delete submitRow.shippingInfoTitle;
      delete submitRow.taskInfoTitle;
      delete submitRow.taskInfoForm;
      delete submitRow.goodsInfoTitle;
      delete submitRow.contractFileTitle;
      delete submitRow.billingInfoTitle;
      delete submitRow.settlementRuleTitle;
      delete submitRow.reconciliationTitle;
      delete submitRow.attachmentTitle;
      delete submitRow.changeRecordTitle;
      delete submitRow.contractPeriod;
      Object.keys(submitRow).forEach(key => {
        if (typeof submitRow[key] === 'string') {
          submitRow[key] = submitRow[key].trim();
        }
      });
      return submitRow;
    },
    validateTransportPlanForm(row) {
      const requiredFields = this.config.transportFormRequiredFields || [
        ['projectName', '项目'],
        ['contractName', '客户合同'],
        ['planName', '计划名称'],
        ['transportType', '运输方式'],
        ['planStartDate', '计划开始日期'],
        ['planEndDate', '计划结束日期'],
        ['departureAddress', '发货地址'],
        ['arrivalAddress', '收货地址'],
      ];
      const emptyField = requiredFields.find(([prop]) => this.isBillingFieldEmpty(row[prop]));
      if (emptyField) {
        this.$message.warning(`请选择或输入${emptyField[1]}`);
        return false;
      }
      if (row.planStartDate && row.planEndDate && row.planEndDate < row.planStartDate) {
        this.$message.warning('计划结束日期不能早于计划开始日期');
        return false;
      }
      if (row.remark && row.remark.length > 200) {
        this.$message.warning('备注不能超过200个字符');
        return false;
      }
      for (const [index, cargo] of this.transportCargoRows.entries()) {
        if (!cargo.cargoType) {
          this.$message.warning(`第${index + 1}行货物类型不能为空`);
          return false;
        }
      }
      return true;
    },
    stopSubmitLoading(loading) {
      if (typeof loading === 'function') {
        loading();
      }
    },
    rowSave(row, done, loading) {
      const submitRow = this.normalizeRow(row);
      if (!submitRow) {
        this.stopSubmitLoading(loading);
        return;
      }
      this.getSaveRequest()(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 (!submitRow) {
        this.stopSubmitLoading(loading);
        return;
      }
      this.getSaveRequest()(submitRow).then(
        () => {
          this.onLoad(this.page);
          this.$message({ type: 'success', message: '操作成功!' });
          done();
        },
        error => {
          window.console.log(error);
          this.stopSubmitLoading(loading);
        }
      );
    },
    getSaveRequest() {
      if (this.config.saveAsDraft && typeof this.api.saveDraft === 'function') {
        return this.api.saveDraft;
      }
      return this.api.submit;
    },
    buildContractCreateSubmitRow(action) {
      const contractStage = action === 'draft' ? 'draft' : 'temporary';
      const submitRow = this.normalizeRow({
        ...this.form,
        contractStage,
        approvalStatus: 'draft',
      });
      return submitRow;
    },
    validateContractCreateAction(action, row) {
      if (!row) return false;
      if (this.isBillingFieldEmpty(row.contractName)) {
        this.$message.warning('请输入合同名称');
        return false;
      }
      if (this.isBillingFieldEmpty(row.contractCategory)) {
        this.$message.warning('请选择合同类别');
        return false;
      }
      if (['temporary', 'formal'].includes(action) && this.isBillingFieldEmpty(row.signType)) {
        this.$message.warning('请选择签约类型');
        return false;
      }
      if (action !== 'formal') return true;
      const formalFields = [
        ['partyA', '甲方'],
        ['partyB', '乙方'],
        ['startDate', '合同期限'],
        ['signDate', '签订日期'],
      ];
      const emptyField = formalFields.find(([prop]) => this.isBillingFieldEmpty(row[prop]));
      if (emptyField) {
        this.$message.warning(`请选择或输入${emptyField[1]}`);
        return false;
      }
      return true;
    },
    extractSavedContract(res, fallback = {}) {
      const data = res?.data?.data || res?.data || {};
      if (data && typeof data === 'object' && !Array.isArray(data)) {
        return {
          ...fallback,
          ...data,
        };
      }
      return fallback;
    },
    getSavedContractId(savedContract) {
      const id = savedContract?.id || this.form.id;
      if (!id) {
        this.$message.warning('合同保存成功但未返回主键，无法继续流转');
        return '';
      }
      return id;
    },
    handleContractCreateAction(action) {
      if (!this.config.enableContractCreateActions || this.contractCreateActionLoading) return;
      const submitRow = this.buildContractCreateSubmitRow(action);
      if (!this.validateContractCreateAction(action, submitRow)) return;
      this.contractCreateActionLoading = action;
      this.api
        .saveDraft(submitRow)
        .then(res => {
          const savedContract = this.extractSavedContract(res, submitRow);
          this.form.id = savedContract.id || this.form.id;
          if (action === 'draft') {
            return savedContract;
          }
          const id = this.getSavedContractId(savedContract);
          if (!id) return Promise.reject(new Error('合同主键为空'));
          if (action === 'formal') {
            return this.api.submitFormal(id).then(() => savedContract);
          }
          return savedContract;
        })
        .then(() => {
          const messageMap = {
            draft: '保存成功',
            temporary: '临时合同提交成功',
            formal: '正式合同提交成功',
          };
          this.$message.success(messageMap[action]);
          this.onLoad(this.page, this.query);
          this.closeCrudDialog();
        })
        .catch(error => {
          if (error?.message !== '合同主键为空') {
            window.console.log(error);
          }
        })
        .finally(() => {
          this.contractCreateActionLoading = '';
        });
    },
    handleTransportPlanCreateAction(action) {
      if (!this.config.enableTransportPlanCreateActions || this.transportPlanCreateActionLoading) {
        return;
      }
      const statusProp = this.config.statusProp || 'businessStatus';
      const submitRow = this.normalizeRow({
        ...this.form,
        [statusProp]: action === 'draft' ? 'draft' : 'waiting_dispatch',
      });
      if (!submitRow) return;
      this.transportPlanCreateActionLoading = action;
      this.api
        .submit(submitRow)
        .then(() => {
          this.$message.success(action === 'draft' ? '暂存成功' : '创建成功');
          this.onLoad(this.page, this.query);
          this.closeCrudDialog();
        })
        .finally(() => {
          this.transportPlanCreateActionLoading = '';
        });
    },
    handleDraftSave() {
      const request =
        typeof this.api.saveDraft === 'function' ? this.api.saveDraft : this.api.submit;
      const submitRow = this.normalizeRow(this.form);
      if (!submitRow) return;
      this.draftSaveLoading = true;
      request(submitRow)
        .then(() => {
          this.$message.success('保存成功');
          this.onLoad(this.page, this.query);
          this.closeCrudDialog();
        })
        .finally(() => {
          this.draftSaveLoading = false;
        });
    },
    closeCrudDialog() {
      const crud = this.$refs.crud;
      if (crud && typeof crud.closeDialog === 'function') {
        crud.closeDialog();
      }
    },
    rowDel(row) {
      this.$confirm('确定将选择数据删除?', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => this.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 => this.canDelete(item));
      if (!selection.length) {
        this.$message.warning('所选数据当前状态不可删除');
        return;
      }
      this.$confirm('确定将选择数据删除?', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => this.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.crudDialogType = type;
      this.syncCustomCreateDialogButtons(type);
      this.dialogReadonly = type === 'view';
      this.syncContractNoDisabled(type);
      if (type === 'add') {
        this.form = {
          ...(this.config.defaultForm || {}),
        };
        this.form.taskEntryMode = 'simple';
        this.selectedProjectId = '';
        this.selectedOrganizationId = '';
        this.attachmentRows = [];
        this.contractFileRows = [];
        this.shippingPlanOptions = [];
        if (this.contractSelectEnabled) {
          this.contractOptions = [];
          this.form.contractId = '';
          this.form.contractName = '';
        }
        if (this.shippingPlanSelectEnabled) {
          this.clearShippingPlan();
        }
        this.transportCargoRows = [];
        this.billingPlanRows = [];
        this.settlementRuleForm = defaultSettlementRule();
        this.reconciliationForm = defaultReconciliation();
        this.changeRecordRows = [];
        this.applyCurrentUserHandler();
        this.initTaskInfoForm();
        this.initTransportPlanFormRows();
        this.syncContractPeriod(false);
        this.syncBillingPlanJson();
        if (this.config.enableTemplateCodePreview && typeof this.api.nextCode === 'function') {
          this.api
            .nextCode()
            .then(res => {
              this.form.templateCode = res.data?.data || '';
            })
            .finally(done);
          return;
        }
        done();
        return;
      }
      if (['edit', 'view'].includes(type)) {
        this.api.getDetail(this.form.id).then(res => {
          this.applyFormDetail(res.data.data || {});
          done();
        });
        return;
      }
      done();
    },
    applyFormDetail(row) {
      this.suppressTransportTypeClear = true;
      this.form = row || {};
      this.$nextTick(() => {
        this.suppressTransportTypeClear = false;
      });
      this.selectedProjectId = this.form.projectId || '';
      this.selectedOrganizationId = this.form.organizationId || '';
      this.attachmentRows = this.parseJsonArray(this.form.attachmentsJson);
      this.contractFileRows = this.parseJsonArray(this.form.contractFileJson);
      this.initTransportPlanFormRows();
      this.billingPlanRows = this.parseJsonArray(this.form.billingPlanJson);
      this.settlementRuleForm = this.normalizeSettlementRule({
        ...defaultSettlementRule(),
        ...this.parseJsonObject(this.form.settlementRuleJson),
      });
      this.reconciliationForm = {
        ...defaultReconciliation(),
        ...this.parseJsonObject(this.form.reconciliationJson),
      };
      this.changeRecordRows = this.parseJsonArray(this.form.changeRecordJson);
      this.applyCurrentUserHandler();
      this.initTaskInfoForm();
      this.syncContractPeriod(false);
      this.syncBillingPlanJson();
      if (this.config.enableOrganizationSelect) {
        this.syncCurrentOrganizationOption();
      }
      if (this.config.enableProjectSelect) {
        this.form.usedFundLimit = 0;
        this.form.remainingFundLimit = 0;
        this.syncCurrentProjectOption();
      }
      if (this.contractSelectEnabled) {
        this.syncCurrentContractOption();
      }
      if (this.shippingPlanSelectEnabled) {
        this.syncCurrentShippingPlanOption();
      }
    },
    parseJsonArray(value) {
      if (!value) return [];
      if (Array.isArray(value)) return value;
      try {
        const list = JSON.parse(value);
        return Array.isArray(list) ? list : [];
      } catch (error) {
        return [];
      }
    },
    parseJsonObject(value) {
      if (!value) return {};
      if (typeof value === 'object' && !Array.isArray(value)) return value;
      try {
        const data = JSON.parse(value);
        return data && typeof data === 'object' && !Array.isArray(data) ? data : {};
      } catch (error) {
        return {};
      }
    },
    parseDispatchQuantity(value) {
      if (value === undefined || value === null || value === '') return 0;
      const text = String(value).replace(/,/g, '');
      const match = text.match(/-?\d+(\.\d+)?/);
      if (!match) return 0;
      const number = Number(match[0]);
      return Number.isFinite(number) ? number : 0;
    },
    formatDispatchQuantity(value) {
      const number = Number(value || 0);
      if (!Number.isFinite(number)) return '0';
      const fixed = Math.round((number + Number.EPSILON) * 1000) / 1000;
      return Number.isInteger(fixed) ? String(fixed) : String(fixed).replace(/\.?0+$/, '');
    },
    loadProjectOptions() {
      if (!this.config.enableProjectSelect || this.projectLoading) return;
      this.projectLoading = true;
      getProjectList(1, 9999, {})
        .then(res => {
          this.projectOptions = extractRecords(res);
          this.syncCurrentProjectOption();
        })
        .finally(() => {
          this.projectLoading = false;
        });
    },
    syncCurrentProjectOption() {
      if (!this.form.projectId || !this.form.projectName) return;
      const exists = this.projectOptions.some(
        item => String(item.id) === String(this.form.projectId)
      );
      if (!exists) {
        this.projectOptions.unshift({
          id: this.form.projectId,
          projectName: this.form.projectName,
          projectCode: this.form.projectCode,
          undertakeDeptName: this.form.undertakeDeptName,
          fundLimit: this.form.projectFundLimit,
        });
      }
    },
    handleProjectChange(projectId) {
      const project = this.projectOptions.find(item => String(item.id) === String(projectId));
      if (!project) {
        this.form.projectId = '';
        this.form.projectName = '';
        this.form.projectCode = '';
        this.form.undertakeDeptName = '';
        this.form.projectFundLimit = '';
        this.form.usedFundLimit = 0;
        this.form.remainingFundLimit = 0;
        if (this.contractSelectEnabled) {
          this.form.contractId = '';
          this.form.contractName = '';
          this.contractOptions = [];
        }
        if (this.shippingPlanSelectEnabled) {
          this.clearShippingPlan();
          this.shippingPlanOptions = [];
        }
        return;
      }
      this.form.projectId = project.id;
      this.form.projectName = project.projectName || '';
      this.form.projectCode = project.projectCode || '';
      this.form.undertakeDeptName = project.undertakeDeptName || '';
      this.form.projectFundLimit = project.fundLimit || project.projectFundLimit || 0;
      this.form.usedFundLimit = 0;
      this.form.remainingFundLimit = 0;
      if (this.contractSelectEnabled || this.config.enableTransportPlanForm) {
        this.form.customerName =
          project.customerName ||
          project.customerNames ||
          project.customer ||
          this.form.customerName ||
          '';
      }
      if (this.config.enableTransportPlanForm) {
        this.form.transportType =
          project.transportType ||
          project.transportMode ||
          project.transportWay ||
          this.form.transportType ||
          '';
      }
      if (this.contractSelectEnabled) {
        this.form.contractId = '';
        this.form.contractName = '';
        this.loadContractOptionsForProject(true);
      }
      if (this.shippingPlanSelectEnabled) {
        this.clearShippingPlan();
        this.loadShippingPlanOptions();
      }
      this.$refs.crud?.validateField?.('projectName');
    },
    loadContractOptionsForProject(autoPick = false) {
      if (!this.contractSelectEnabled || !this.form.projectId || this.contractLoading) {
        return Promise.resolve([]);
      }
      this.contractLoading = true;
      return getContractList(1, 9999, {
        projectId: this.form.projectId,
        projectName: this.form.projectName,
      })
        .then(res => {
          this.contractOptions = extractRecords(res);
          this.syncCurrentContractOption();
          if (autoPick && this.contractOptions.length) {
            this.applyContract(this.contractOptions[0]);
          }
          return this.contractOptions;
        })
        .finally(() => {
          this.contractLoading = false;
        });
    },
    syncCurrentContractOption() {
      if (!this.form.contractId || !this.form.contractName) return;
      const exists = this.contractOptions.some(
        item => String(item.id) === String(this.form.contractId)
      );
      if (!exists) {
        this.contractOptions.unshift({
          id: this.form.contractId,
          contractName: this.form.contractName,
        });
      }
    },
    handleContractChange(contractId) {
      const contract = this.contractOptions.find(item => String(item.id) === String(contractId));
      if (!contract) {
        this.form.contractId = '';
        this.form.contractName = '';
        return;
      }
      this.applyContract(contract);
    },
    applyContract(contract = {}) {
      this.form.contractId = contract.id || '';
      this.form.contractName = contract.contractName || '';
      this.form.customerName =
        contract.customerName || contract.customerNames || this.form.customerName || '';
      this.$refs.crud?.validateField?.('contractName');
    },
    loadShippingPlanOptions() {
      if (!this.shippingPlanSelectEnabled || this.shippingPlanLoading) {
        return Promise.resolve([]);
      }
      this.shippingPlanLoading = true;
      return getTransportPlanList(1, 9999, {
        projectId: this.form.projectId,
        projectName: this.form.projectName,
      })
        .then(res => {
          this.shippingPlanOptions = extractRecords(res);
          this.syncCurrentShippingPlanOption();
          return this.shippingPlanOptions;
        })
        .finally(() => {
          this.shippingPlanLoading = false;
        });
    },
    syncCurrentShippingPlanOption() {
      if (!this.form.planName) return;
      const exists = this.shippingPlanOptions.some(
        item =>
          String(item.id) === String(this.form.planId) ||
          String(item.planName) === String(this.form.planName)
      );
      if (!exists) {
        this.shippingPlanOptions.unshift({
          id: this.form.planId || this.form.planName,
          planName: this.form.planName,
        });
      }
    },
    handleShippingPlanChange(planName) {
      const plan = this.shippingPlanOptions.find(
        item =>
          String(item.planName) === String(planName) || String(item.id) === String(this.form.planId)
      );
      if (!plan) {
        this.clearShippingPlan();
        return;
      }
      this.applyShippingPlan(plan);
    },
    applyShippingPlan(plan = {}) {
      this.form.planId = plan.id || '';
      this.form.planName = plan.planName || '';
      this.$refs.crud?.validateField?.('planName');
    },
    clearShippingPlan() {
      this.form.planId = '';
      this.form.planName = '';
    },
    initTaskInfoForm() {
      if (!this.taskInfoFormEnabled) return;
      const taskInfo = this.parseJsonObject(this.form.taskInfoJson);
      const carrierRows = this.parseJsonArray(this.form.carrierJson);
      const carrierInfo = carrierRows[0] || this.parseJsonObject(this.form.carrierJson);
      const goodsRows = this.parseJsonArray(this.form.goodsJson);
      const goodsInfo = goodsRows[0] || {};
      this.form.taskEntryMode =
        this.form.taskEntryMode || taskInfo.taskEntryMode || carrierInfo.taskEntryMode || 'simple';
      this.form.carrierType =
        this.form.carrierType ||
        taskInfo.carrierType ||
        carrierInfo.carrierType ||
        carrierInfo.type ||
        '承运商';
      this.form.carrierName =
        this.form.carrierName ||
        taskInfo.carrierName ||
        carrierInfo.carrierName ||
        carrierInfo.customerName ||
        carrierInfo.name ||
        '';
      this.form.driverName =
        this.form.driverName || taskInfo.driverName || carrierInfo.driverName || '';
      this.form.driverPhone =
        this.form.driverPhone ||
        taskInfo.driverPhone ||
        carrierInfo.driverPhone ||
        carrierInfo.mobile ||
        '';
      this.form.vehicleNo =
        this.form.vehicleNo || taskInfo.vehicleNo || carrierInfo.vehicleNo || '';
      this.form.trailerVehicleNo =
        this.form.trailerVehicleNo ||
        taskInfo.trailerVehicleNo ||
        carrierInfo.trailerVehicleNo ||
        '';
      this.form.escortName =
        this.form.escortName || taskInfo.escortName || carrierInfo.escortName || '';
      this.form.escortPhone =
        this.form.escortPhone || taskInfo.escortPhone || carrierInfo.escortPhone || '';
      this.form.cargoType =
        this.form.cargoType ||
        taskInfo.cargoType ||
        goodsInfo.cargoType ||
        goodsInfo.goodsType ||
        '';
      this.form.cargoTypeCode =
        this.form.cargoTypeCode ||
        taskInfo.cargoTypeCode ||
        goodsInfo.cargoTypeCode ||
        goodsInfo.goodsTypeCode ||
        '';
      this.form.cargoName =
        this.form.cargoName ||
        taskInfo.cargoName ||
        goodsInfo.cargoName ||
        goodsInfo.goodsName ||
        '';
      this.form.specification =
        this.form.specification || taskInfo.specification || goodsInfo.specification || '';
      this.form.model = this.form.model || taskInfo.model || goodsInfo.model || '';
      this.form.quantity = this.form.quantity || taskInfo.quantity || goodsInfo.quantity || '';
      this.form.quantityUnit =
        this.form.quantityUnit || taskInfo.quantityUnit || goodsInfo.quantityUnit || '';
      this.form.mileage = this.form.mileage || taskInfo.mileage || goodsInfo.mileage || '';
      this.form.unitPrice = this.form.unitPrice || taskInfo.unitPrice || goodsInfo.unitPrice || '';
      this.form.priceUnit = this.form.priceUnit || taskInfo.priceUnit || goodsInfo.priceUnit || '';
      this.form.otherFeeTotal =
        this.form.otherFeeTotal || taskInfo.otherFeeTotal || goodsInfo.otherFeeTotal || '';
      this.form.estimatedStartTime =
        this.form.estimatedStartTime ||
        taskInfo.estimatedStartTime ||
        goodsInfo.estimatedStartTime ||
        '';
      this.form.estimatedEndTime =
        this.form.estimatedEndTime || taskInfo.estimatedEndTime || goodsInfo.estimatedEndTime || '';
      this.form.taskRemark = this.form.taskRemark || taskInfo.taskRemark || goodsInfo.remark || '';
      this.form.cargoTypePath = this.normalizeBillingCargoTypePath(this.form.cargoTypePath);
      if (!this.form.cargoTypePath.length) {
        this.ensureBillingCargoTypeOptions().then(() => {
          const cargoType = this.findBillingCargoTypeByCodeOrName({
            cargoTypeCode: this.form.cargoTypeCode,
            cargoType: this.form.cargoType,
          });
          if (cargoType?.path) {
            this.form.cargoTypePath = cargoType.path;
          }
        });
      }
      if (this.isTaskFullMode) {
        this.initTaskFullCargoRows(goodsRows);
      }
    },
    handleTaskEntryModeChange(value) {
      this.form.taskEntryMode = value || 'simple';
      if (this.form.taskEntryMode === 'full') {
        this.initTaskFullCargoRows(this.parseJsonArray(this.form.goodsJson));
      }
    },
    handleTaskCarrierTypeChange(value) {
      const nextValue = value || '承运商';
      if (nextValue === '承运商') {
        this.form.trailerVehicleNo = '';
        this.form.escortName = '';
        this.form.escortPhone = '';
      } else {
        this.form.carrierName = '';
        this.form.carrierId = '';
      }
      this.form.carrierType = nextValue;
    },
    loadTaskCarrierOptions() {
      if (!this.taskInfoFormEnabled || this.taskCarrierLoading) return Promise.resolve([]);
      this.taskCarrierLoading = true;
      return getCarrierCustomerList(1, 9999, { customerType: '承运商' })
        .then(res => {
          this.taskCarrierOptions = extractRecords(res);
          return this.taskCarrierOptions;
        })
        .finally(() => {
          this.taskCarrierLoading = false;
        });
    },
    handleTaskCarrierChange(value) {
      const carrier = this.taskCarrierOptions.find(item =>
        [item.customerName, item.carrierName, item.fullName, item.name].some(
          name => String(name || '') === value
        )
      );
      this.form.carrierId = carrier?.id || '';
      this.form.carrierName = value || '';
    },
    loadTaskDriverOptions() {
      if (!this.taskInfoFormEnabled || this.taskDriverLoading) return Promise.resolve([]);
      this.taskDriverLoading = true;
      return getDriverList(1, 9999, {})
        .then(res => {
          this.taskDriverOptions = extractRecords(res);
          return this.taskDriverOptions;
        })
        .finally(() => {
          this.taskDriverLoading = false;
        });
    },
    handleTaskDriverChange(value) {
      const driver = this.taskDriverOptions.find(item =>
        [item.driverName, item.name].some(name => String(name || '') === String(value || ''))
      );
      this.form.driverId = driver?.id || '';
      this.form.driverName = value || '';
      if (driver) {
        this.form.driverPhone =
          driver.mobile || driver.phone || driver.driverPhone || this.form.driverPhone || '';
      }
    },
    getTaskCargoTypeOptionsKey(path = []) {
      const normalizedPath = this.normalizeBillingCargoTypePath(path);
      if (!normalizedPath.length) return '';
      const cargoType = this.findBillingCargoTypeByPath(normalizedPath);
      return String(cargoType?.cargoCode || cargoType?.code || normalizedPath.join('/'));
    },
    getTaskCargoOptionsByPath(path = []) {
      const key = this.getTaskCargoTypeOptionsKey(path);
      return key ? this.taskCargoOptionsMap[key] || [] : [];
    },
    isTaskCargoOptionsLoading(path = []) {
      const key = this.getTaskCargoTypeOptionsKey(path);
      return key ? !!this.taskCargoLoadingMap[key] : false;
    },
    setTaskCargoOptionsByKey(key, options = []) {
      if (!key) return;
      this.taskCargoOptionsMap = {
        ...this.taskCargoOptionsMap,
        [key]: options,
      };
    },
    setTaskCargoLoadingByKey(key, loading) {
      if (!key) return;
      this.taskCargoLoadingMap = {
        ...this.taskCargoLoadingMap,
        [key]: loading,
      };
    },
    buildTaskCargoListQueryParams(path = []) {
      const normalizedPath = this.normalizeBillingCargoTypePath(path);
      const labels = this.getBillingCargoTypePathLabels(normalizedPath);
      const secondCargoType = this.findBillingCargoTypeByPath(normalizedPath);
      return {
        secondCargoTypeName: labels[1] || '',
        secondCargoTypeCode: secondCargoType?.cargoCode || secondCargoType?.code || '',
      };
    },
    loadTaskCargoOptionsByPath(path = []) {
      const normalizedPath = this.normalizeBillingCargoTypePath(path);
      if (!normalizedPath.length) return Promise.resolve([]);
      return this.ensureBillingCargoTypeOptions().then(() => {
        const key = this.getTaskCargoTypeOptionsKey(normalizedPath);
        const params = this.buildTaskCargoListQueryParams(normalizedPath);
        if (!params.secondCargoTypeName && !params.secondCargoTypeCode) {
          this.setTaskCargoOptionsByKey(key, []);
          return [];
        }
        this.setTaskCargoLoadingByKey(key, true);
        return getCommonCargoList(1, 500, {
          ...params,
          allDept: 0,
        })
          .then(res => {
            const records = extractRecords(res);
            this.setTaskCargoOptionsByKey(key, records);
            return records;
          })
          .catch(error => {
            window.console.log(error);
            this.setTaskCargoOptionsByKey(key, []);
            return [];
          })
          .finally(() => {
            this.setTaskCargoLoadingByKey(key, false);
          });
      });
    },
    loadTaskCargoOptionsForForm() {
      return this.loadTaskCargoOptionsByPath(this.form.cargoTypePath);
    },
    handleTaskCargoTypeChange(value) {
      const path = this.normalizeBillingCargoTypePath(value);
      const cargoType = this.findBillingCargoTypeByPath(path);
      const labels = this.getBillingCargoTypePathLabels(path);
      this.form.cargoTypePath = path;
      this.form.cargoType = labels.length ? labels[labels.length - 1] : '';
      this.form.cargoTypeCode = cargoType?.cargoCode || cargoType?.code || cargoType?.id || '';
      this.form.cargoName = '';
      this.form.specification = '';
      this.form.model = '';
      this.loadTaskCargoOptionsForForm();
    },
    handleTaskCargoChange(value) {
      const cargo = this.taskCargoOptions.find(
        item => this.formatBillingCargoTypeLabel(item) === value
      );
      this.form.cargoName = value || '';
      if (cargo) {
        this.form.specification =
          cargo.specification || cargo.spec || this.form.specification || '';
        this.form.model = cargo.model || cargo.modelName || this.form.model || '';
      }
    },
    getTaskCargoRowOptions(row = {}) {
      return this.getTaskCargoOptionsByPath(row.cargoTypePath);
    },
    handleTaskCargoRowNameChange(row, value) {
      const cargo = this.getTaskCargoRowOptions(row).find(
        item => this.formatBillingCargoTypeLabel(item) === value
      );
      row.cargoName = value || '';
      if (cargo) {
        row.specification = cargo.specification || cargo.spec || row.specification || '';
        row.model = cargo.model || cargo.modelName || row.model || '';
      }
      this.syncTransportCargoJson();
    },
    initTaskFullCargoRows(goodsRows = []) {
      if (!this.taskInfoFormEnabled) return;
      const rows = (goodsRows.length ? goodsRows : this.transportCargoRows).map(row =>
        this.normalizeTransportCargoRow(row)
      );
      while (rows.length < 1) {
        rows.push(this.normalizeTransportCargoRow());
      }
      this.transportCargoRows = rows;
      this.syncTransportCargoJson();
    },
    loadTaskQuantityUnitOptions() {
      if (this.taskQuantityUnitOptions.length || this.taskQuantityUnitLoading) {
        return Promise.resolve(this.taskQuantityUnitOptions);
      }
      this.taskQuantityUnitLoading = true;
      return getDictionary({ code: 'quantity_unit' })
        .then(res => {
          this.taskQuantityUnitOptions = this.normalizeDictOptions(res.data.data || []);
          return this.taskQuantityUnitOptions;
        })
        .finally(() => {
          this.taskQuantityUnitLoading = false;
        });
    },
    loadTaskFeeUnitOptions() {
      if (this.taskFeeUnitOptions.length || this.taskFeeUnitLoading) {
        return Promise.resolve(this.taskFeeUnitOptions);
      }
      this.taskFeeUnitLoading = true;
      return getDictionary({ code: 'unit_fee' })
        .then(res => {
          this.taskFeeUnitOptions = this.normalizeDictOptions(res.data.data || []);
          return this.taskFeeUnitOptions;
        })
        .finally(() => {
          this.taskFeeUnitLoading = false;
        });
    },
    normalizeDictOptions(list = []) {
      return (list || []).map(item => ({
        label: item.dictValue || item.label || item.value || '',
        value: item.dictKey || item.value || item.dictValue || '',
      }));
    },
    handleTaskNumberInput(prop, value) {
      this.form[prop] = this.normalizeTaskNumber(value);
    },
    normalizeTaskNumber(value) {
      const text = String(value || '').replace(/[^\d.]/g, '');
      const parts = text.split('.');
      return parts.length > 1 ? `${parts[0]}.${parts.slice(1).join('')}` : parts[0];
    },
    validateTaskCargoRows() {
      if (!this.transportCargoRows.length) {
        this.$message.warning('请至少添加一条货物信息');
        return false;
      }
      for (const [index, cargo] of this.transportCargoRows.entries()) {
        const requiredFields = [
          ['cargoName', '货物名称'],
          ['cargoType', '货物类型'],
          ['quantity', '数量'],
          ['quantityUnit', '数量单位'],
        ];
        const emptyField = requiredFields.find(([prop]) => this.isBillingFieldEmpty(cargo[prop]));
        if (emptyField) {
          this.$message.warning(`第${index + 1}行${emptyField[1]}不能为空`);
          return false;
        }
        const invalidField = [['quantity', '数量']].find(([prop]) => {
          const value = cargo[prop];
          return value !== undefined && value !== null && value !== '' && Number(value) < 0;
        });
        if (invalidField) {
          this.$message.warning(`第${index + 1}行${invalidField[1]}不能小于0`);
          return false;
        }
      }
      return true;
    },
    validateTaskInfoForm(row = {}) {
      if (this.isTaskFullMode && !this.validateTaskCargoRows()) {
        return false;
      }
      const requiredFields = this.config.transportFormRequiredFields || [
        ['carrierType', '承运类型'],
        ['vehicleNo', '车牌号'],
      ];
      if (row.carrierType === '承运商') {
        requiredFields.push(['carrierName', '承运商']);
      }
      if (row.carrierType === '自运') {
        requiredFields.push(['driverPhone', '手机号']);
      }
      const emptyField = requiredFields.find(([prop]) => this.isBillingFieldEmpty(row[prop]));
      if (emptyField) {
        this.$message.warning(`请选择或输入${emptyField[1]}`);
        return false;
      }
      const numberFields = [
        ['quantity', '数量'],
        ['mileage', '里程'],
        ['unitPrice', '单价'],
        ['otherFeeTotal', '其他运费合计'],
      ];
      const invalidField = numberFields.find(([prop]) => {
        const value = row[prop];
        return value !== undefined && value !== null && value !== '' && Number(value) < 0;
      });
      if (invalidField) {
        this.$message.warning(`${invalidField[1]}不能小于0`);
        return false;
      }
      if (
        row.estimatedStartTime &&
        row.estimatedEndTime &&
        row.estimatedEndTime < row.estimatedStartTime
      ) {
        this.$message.warning('预计完成日期不能早于预计发货日期');
        return false;
      }
      if (row.taskRemark && row.taskRemark.length > 200) {
        this.$message.warning('任务备注不能超过200个字符');
        return false;
      }
      return true;
    },
    syncTaskInfoToRow(row) {
      row.taskEntryMode = row.taskEntryMode || 'simple';
      const taskInfo = {
        taskEntryMode: row.taskEntryMode,
        carrierType: row.carrierType,
        carrierId: row.carrierId,
        carrierName: row.carrierName,
        driverId: row.driverId,
        driverName: row.driverName,
        driverPhone: row.driverPhone,
        vehicleNo: row.vehicleNo,
        trailerVehicleNo: row.trailerVehicleNo,
        escortName: row.escortName,
        escortPhone: row.escortPhone,
        mileage: row.mileage,
        estimatedStartTime: row.estimatedStartTime,
        estimatedEndTime: row.estimatedEndTime,
        unitPrice: row.unitPrice,
        priceUnit: row.priceUnit,
        otherFeeTotal: row.otherFeeTotal,
        taskRemark: row.taskRemark,
      };
      row.taskInfoJson = JSON.stringify(taskInfo);
      row.carrierJson = JSON.stringify([
        {
          carrierType: row.carrierType,
          carrierId: row.carrierId,
          carrierName: row.carrierName,
          driverId: row.driverId,
          driverName: row.driverName,
          driverPhone: row.driverPhone,
          vehicleNo: row.vehicleNo,
          trailerVehicleNo: row.trailerVehicleNo,
          escortName: row.escortName,
          escortPhone: row.escortPhone,
          mileage: row.mileage,
          taskEntryMode: row.taskEntryMode,
        },
      ]);
      const goodsRows = this.isTaskFullMode
        ? this.transportCargoRows.map(item => this.normalizeTransportCargoRow(item))
        : [
            {
              cargoType: row.cargoType,
              cargoTypeCode: row.cargoTypeCode,
              cargoTypePath: row.cargoTypePath,
              cargoName: row.cargoName,
              specification: row.specification,
              model: row.model,
              quantity: row.quantity,
              quantityUnit: row.quantityUnit,
              mileage: row.mileage,
              unitPrice: row.unitPrice,
              priceUnit: row.priceUnit,
              remark: row.taskRemark,
            },
          ];
      row.goodsJson = JSON.stringify(goodsRows);
      const firstGoodsRow =
        goodsRows.find(
          item =>
            !this.isBillingFieldEmpty(item.cargoName) || !this.isBillingFieldEmpty(item.cargoType)
        ) ||
        goodsRows[0] ||
        {};
      row.cargoType = firstGoodsRow.cargoType || row.cargoType || '';
      row.cargoTypeCode = firstGoodsRow.cargoTypeCode || row.cargoTypeCode || '';
      row.cargoTypePath = firstGoodsRow.cargoTypePath || row.cargoTypePath || [];
      row.cargoName = firstGoodsRow.cargoName || row.cargoName || '';
      row.specification = firstGoodsRow.specification || row.specification || '';
      row.model = firstGoodsRow.model || row.model || '';
      row.quantity = firstGoodsRow.quantity || row.quantity || '';
      row.quantityUnit = firstGoodsRow.quantityUnit || row.quantityUnit || '';
      row.mileage = firstGoodsRow.mileage || row.mileage || '';
      row.unitPrice = firstGoodsRow.unitPrice || row.unitPrice || '';
      row.priceUnit = firstGoodsRow.priceUnit || row.priceUnit || '';
      row.taskRemark = firstGoodsRow.remark || row.taskRemark || '';
    },
    initTransportPlanFormRows() {
      if (!this.config.enableTransportPlanForm) return;
      this.transportCargoRows = this.parseJsonArray(this.form.goodsJson).map(row =>
        this.normalizeTransportCargoRow(row)
      );
      this.syncTransportCargoJson();
      this.syncCurrentContractOption();
      this.restoreTransportCargoTypePaths();
    },
    restoreTransportCargoTypePaths() {
      if (!this.transportCargoRows.length) return Promise.resolve();
      return this.ensureBillingCargoTypeOptions().then(() => {
        this.transportCargoRows.forEach(row => {
          if (this.normalizeBillingCargoTypePath(row.cargoTypePath).length) return;
          const cargoType = this.findBillingCargoTypeByCodeOrName({
            cargoTypeCode: row.cargoTypeCode,
            cargoType: row.cargoType,
          });
          if (!cargoType?.path) return;
          row.cargoTypePath = cargoType.path;
          row.cargoType =
            this.getBillingCargoTypePathLabels(cargoType.path).at(-1) || row.cargoType;
          row.cargoTypeCode = cargoType.cargoCode || cargoType.code || row.cargoTypeCode;
        });
        this.syncTransportCargoJson();
      });
    },
    normalizeTransportCargoRow(row = {}) {
      return {
        ...defaultTransportCargo(),
        ...row,
        cargoTypePath: this.normalizeBillingCargoTypePath(row.cargoTypePath),
        cargoType:
          row.cargoType || row.goodsType || row.secondCargoTypeName || row.firstCargoTypeName || '',
        cargoTypeCode:
          row.cargoTypeCode ||
          row.goodsTypeCode ||
          row.secondCargoTypeCode ||
          row.firstCargoTypeCode ||
          '',
        cargoName: row.cargoName || row.goodsName || '',
        packageType: row.packageType || row.package || '',
        specification: row.specification || row.spec || '',
      };
    },
    syncTransportCargoJson() {
      if (!this.config.enableTransportPlanForm && !this.isTaskFullMode) return;
      this.form.goodsJson = JSON.stringify(
        this.transportCargoRows.map(row => this.normalizeTransportCargoRow(row))
      );
    },
    addTransportCargoRow(index = -1, row = {}) {
      const nextRow = this.normalizeTransportCargoRow(row);
      if (index > -1) {
        this.transportCargoRows.splice(index + 1, 0, nextRow);
      } else {
        this.transportCargoRows.push(nextRow);
      }
      this.syncTransportCargoJson();
    },
    removeTransportCargoRow(index) {
      this.transportCargoRows.splice(index, 1);
      if (
        !this.transportCargoRows.length &&
        (this.isTaskFullMode || this.config.enableTransportPlanForm)
      ) {
        this.transportCargoRows.push(this.normalizeTransportCargoRow());
      }
      this.syncTransportCargoJson();
    },
    handleTransportCargoQuantityInput(row, value) {
      const text = String(value || '').replace(/[^\d.]/g, '');
      const parts = text.split('.');
      row.quantity =
        parts.length > 1 ? `${parts[0]}.${parts.slice(1).join('').slice(0, 3)}` : parts[0];
      this.syncTransportCargoJson();
    },
    handleTransportCargoTypeChange(row, value) {
      const path = this.normalizeBillingCargoTypePath(value);
      const cargoType = this.findBillingCargoTypeByPath(path);
      const labels = this.getBillingCargoTypePathLabels(path);
      row.cargoTypePath = path;
      row.cargoType = labels.length ? labels[labels.length - 1] : '';
      row.cargoTypeCode = cargoType?.cargoCode || cargoType?.code || cargoType?.id || '';
      row.cargoName = '';
      row.specification = '';
      row.model = '';
      this.syncTransportCargoJson();
      this.loadTaskCargoOptionsByPath(path);
    },
    handleTransportTypeChange(value) {
      this.form.transportTypeName = this.getTransportTypeLabel(value);
      this.clearTransportShippingInfo();
    },
    clearTransportShippingInfo() {
      [
        'departureName',
        'departureAddress',
        'departureAddressCode',
        'departureSiteCode',
        'departureLongitude',
        'departureLatitude',
        'departureContact',
        'departurePhone',
        'arrivalName',
        'arrivalAddress',
        'arrivalAddressCode',
        'arrivalSiteCode',
        'arrivalLongitude',
        'arrivalLatitude',
        'arrivalContact',
        'arrivalPhone',
      ].forEach(prop => {
        this.form[prop] = '';
      });
      this.transportRouteSelected = null;
      this.transportAddressSelected = null;
      this.transportMapSelected = {};
      this.transportRouteBox = false;
      this.transportAddressBox = false;
      this.transportStationBox = false;
      this.transportMapBox = false;
      this.transportAddressTarget = '';
      this.transportStationTarget = '';
      this.transportMapTarget = '';
      this.transportMapKeyword = '';
      this.transportMapStatus = '可搜索地址或点击地图选点';
      if (this.transportAmapMarker) {
        this.transportAmapMarker.setMap(null);
        this.transportAmapMarker = null;
      }
      this.$refs.crud?.clearValidate?.([
        'departureAddress',
        'arrivalAddress',
        'departureName',
        'arrivalName',
        'departureContact',
        'departurePhone',
        'arrivalContact',
        'arrivalPhone',
      ]);
    },
    getTransportTypeLabel(value) {
      const column = (this.option.column || []).find(item => item.prop === 'transportType');
      const dictionary = column?.dicData || [];
      const item = dictionary.find(
        dic =>
          String(dic.value ?? dic.dictKey ?? '') === String(value ?? '') ||
          String(dic.dictKey ?? '') === String(value ?? '')
      );
      return item?.label || item?.dictValue || '';
    },
    resolveTransportMode(value) {
      const text = [value, this.form.transportTypeName, this.getTransportTypeLabel(value)]
        .filter(Boolean)
        .join(' ')
        .toLowerCase();
      if (!text) return '';
      if (
        text.includes('公路') ||
        text.includes('道路') ||
        text.includes('road') ||
        text.includes('highway') ||
        text === 'gl'
      ) {
        return 'road';
      }
      if (
        text.includes('铁路') ||
        text.includes('rail') ||
        text.includes('train') ||
        text === 'tl'
      ) {
        return 'rail';
      }
      if (
        text.includes('水路') ||
        text.includes('水运') ||
        text.includes('海运') ||
        text.includes('港') ||
        text.includes('water') ||
        text.includes('ship') ||
        text.includes('sea') ||
        text === 'sl'
      ) {
        return 'water';
      }
      if (
        text.includes('航空') ||
        text.includes('空运') ||
        text.includes('空港') ||
        text.includes('air') ||
        text.includes('airport') ||
        text === 'hk'
      ) {
        return 'air';
      }
      return '';
    },
    openTransportPrimaryAddressPicker(target) {
      if (this.transportStationMode) {
        this.openTransportStationDialog(target);
      }
    },
    openTransportSecondaryAddressPicker(target) {
      if (this.transportStationMode) {
        this.openTransportStationDialog(target);
        return;
      }
      this.openTransportMapDialog(target);
    },
    ensureTransportTypeBeforeAddress() {
      if (!this.shippingInfoFormEnabled || !this.isBillingFieldEmpty(this.form.transportType)) {
        return true;
      }
      this.$message.warning('请先选择运输方式');
      return false;
    },
    openTransportRouteDialog() {
      if (!this.ensureTransportTypeBeforeAddress()) return;
      this.transportRouteSelected = null;
      this.transportRoutePage.currentPage = 1;
      this.transportRouteQuery = {};
      this.transportRouteBox = true;
    },
    loadTransportRouteList() {
      this.transportRouteLoading = true;
      getCommonRouteList(this.transportRoutePage.currentPage, this.transportRoutePage.pageSize, {
        ...this.transportRouteQuery,
        allDept: 0,
      })
        .then(res => {
          const data = res.data.data || {};
          this.transportRouteRows = data.records || [];
          this.transportRoutePage.total = data.total || 0;
        })
        .finally(() => {
          this.transportRouteLoading = false;
        });
    },
    handleTransportRouteSearch() {
      this.transportRoutePage.currentPage = 1;
      this.loadTransportRouteList();
    },
    handleTransportRouteReset() {
      this.transportRouteQuery = {};
      this.transportRoutePage.currentPage = 1;
      this.loadTransportRouteList();
    },
    handleTransportRouteSizeChange(pageSize) {
      this.transportRoutePage.pageSize = pageSize;
      this.transportRoutePage.currentPage = 1;
      this.loadTransportRouteList();
    },
    handleTransportRouteCurrentChange(currentPage) {
      this.transportRoutePage.currentPage = currentPage;
      this.loadTransportRouteList();
    },
    formatTransportRouteUpdateUserName(row) {
      return formatUpdateUserName(row);
    },
    selectTransportRouteRow(row) {
      this.transportRouteSelected = row;
      this.applyTransportRoute(row);
      this.transportRouteBox = false;
    },
    applyTransportRoute(route = {}) {
      this.applyTransportAddress('departure', {
        addressName: route.departureName,
        detailAddress: route.departureAddress,
        longitude: route.departureLongitude,
        latitude: route.departureLatitude,
        contactName: route.departureContact,
        contactPhone: route.departurePhone,
        addressCode: route.departureAddressCode,
        siteCode: route.departureSiteCode,
      });
      this.applyTransportAddress('arrival', {
        addressName: route.arrivalName,
        detailAddress: route.arrivalAddress,
        longitude: route.arrivalLongitude,
        latitude: route.arrivalLatitude,
        contactName: route.arrivalContact,
        contactPhone: route.arrivalPhone,
        addressCode: route.arrivalAddressCode,
        siteCode: route.arrivalSiteCode,
      });
    },
    openTransportStationDialog(target) {
      if (!this.ensureTransportTypeBeforeAddress()) return;
      if (!this.transportStationMode) return;
      this.transportStationTarget = target;
      this.transportStationQuery = {};
      this.transportStationPage.currentPage = 1;
      this.transportStationBox = true;
    },
    getTransportStationListRequest() {
      const requestMap = {
        water: getPortTerminalList,
        rail: getRailwayStationList,
        air: getAirportMasterList,
      };
      return requestMap[this.transportMode];
    },
    loadTransportStationList() {
      const request = this.getTransportStationListRequest();
      if (!request) return;
      this.transportStationLoading = true;
      request(
        this.transportStationPage.currentPage,
        this.transportStationPage.pageSize,
        this.buildTransportStationQueryParams()
      )
        .then(res => {
          const data = res.data.data || {};
          this.transportStationRows = (data.records || []).map(row =>
            this.normalizeTransportStationRow(row)
          );
          this.transportStationPage.total = data.total || 0;
        })
        .finally(() => {
          this.transportStationLoading = false;
        });
    },
    buildTransportStationQueryParams() {
      const query = this.transportStationQuery || {};
      return Object.keys(query).reduce((params, key) => {
        const value = query[key];
        if (value !== undefined && value !== null && value !== '') {
          params[key] = value;
        }
        return params;
      }, {});
    },
    handleTransportStationSearch() {
      this.transportStationPage.currentPage = 1;
      this.loadTransportStationList();
    },
    handleTransportStationReset() {
      this.transportStationQuery = {};
      this.transportStationPage.currentPage = 1;
      this.loadTransportStationList();
    },
    handleTransportStationSizeChange(pageSize) {
      this.transportStationPage.pageSize = pageSize;
      this.transportStationPage.currentPage = 1;
      this.loadTransportStationList();
    },
    handleTransportStationCurrentChange(currentPage) {
      this.transportStationPage.currentPage = currentPage;
      this.loadTransportStationList();
    },
    normalizeTransportStationRow(row = {}) {
      const regionName =
        row.regionName ||
        [row.provinceName, row.cityName, row.districtName].filter(Boolean).join('');
      return {
        ...row,
        stationName: row.name || row.stationName || row.addressName || '',
        stationType: row.category || this.transportStationTypeLabel,
        stationCode: row.code || row.tmisCode || row.iataCode || row.icaoCode || row.siteCode || '',
        detailAddress: row.detailAddress || row.address || '',
        regionName,
      };
    },
    selectTransportStationRow(row) {
      const station = this.normalizeTransportStationRow(row);
      this.applyTransportAddress(this.transportStationTarget, {
        addressName: station.stationName,
        addressType: this.transportStationTypeLabel,
        detailAddress: station.detailAddress,
        longitude: station.longitude,
        latitude: station.latitude,
        regionName: station.regionName,
        regionCode: station.regionCode,
        siteCode: station.stationCode,
        siteCodeDisplay: station.stationCode,
        remark: station.remark,
      });
      this.transportStationBox = false;
    },
    openTransportAddressDialog(target) {
      if (!this.ensureTransportTypeBeforeAddress()) return;
      this.transportAddressTarget = target;
      this.transportAddressSelected = null;
      this.transportAddressQuery = {};
      this.transportAddressPage.currentPage = 1;
      this.transportAddressBox = true;
    },
    loadTransportAddressList() {
      this.transportAddressLoading = true;
      getCommonAddressList(
        this.transportAddressPage.currentPage,
        this.transportAddressPage.pageSize,
        {
          ...this.transportAddressQuery,
          allDept: 0,
        }
      )
        .then(res => {
          const data = res.data.data || {};
          this.transportAddressRows = data.records || [];
          this.transportAddressPage.total = data.total || 0;
        })
        .finally(() => {
          this.transportAddressLoading = false;
        });
    },
    handleTransportAddressSearch() {
      this.transportAddressPage.currentPage = 1;
      this.loadTransportAddressList();
    },
    handleTransportAddressReset() {
      this.transportAddressQuery = {};
      this.transportAddressPage.currentPage = 1;
      this.loadTransportAddressList();
    },
    handleTransportAddressSizeChange(pageSize) {
      this.transportAddressPage.pageSize = pageSize;
      this.transportAddressPage.currentPage = 1;
      this.loadTransportAddressList();
    },
    handleTransportAddressCurrentChange(currentPage) {
      this.transportAddressPage.currentPage = currentPage;
      this.loadTransportAddressList();
    },
    formatTransportAddressSiteCode(row) {
      return row.addressType === '常规地址' ? '/' : row.siteCodeDisplay || row.siteCode || '';
    },
    selectTransportAddressRow(row) {
      this.transportAddressSelected = row;
      this.applyTransportAddress(this.transportAddressTarget, {
        ...row,
        preferRegionName: true,
      });
      this.transportAddressBox = false;
    },
    applyTransportAddress(target, address = {}) {
      const prefix = target === 'departure' ? 'departure' : 'arrival';
      this.form[`${prefix}Name`] = address.preferRegionName
        ? address.regionName || address.addressName || ''
        : address.addressName || address.regionName || '';
      this.form[`${prefix}Address`] = address.detailAddress || address.address || '';
      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`] || '';
      this.$refs.crud?.validateField?.(`${prefix}Address`);
    },
    openTransportMapDialog(target) {
      if (this.dialogReadonly) return;
      if (!this.ensureTransportTypeBeforeAddress()) return;
      const prefix = target === 'departure' ? 'departure' : 'arrival';
      this.transportMapTarget = prefix;
      this.transportMapKeyword = this.form[`${prefix}Address`] || this.form[`${prefix}Name`] || '';
      this.transportMapSelected = this.buildTransportMapSelection({
        lng: this.form[`${prefix}Longitude`],
        lat: this.form[`${prefix}Latitude`],
        address: this.form[`${prefix}Address`],
        regionName: this.form[`${prefix}Name`],
      });
      this.transportMapStatus = this.transportMapSelected.longitude
        ? '已加载当前选点，可重新选点'
        : '可搜索地址或点击地图选点';
      this.transportMapBox = true;
    },
    loadAmap() {
      if (window.AMap && window.AMap.Map) {
        return Promise.resolve();
      }
      if (!amapLoader) {
        amapLoader = new Promise((resolve, reject) => {
          window._AMapSecurityConfig = {
            securityJsCode: AMAP_SECURITY_CODE,
          };
          const script = document.createElement('script');
          script.src = `https://webapi.amap.com/maps?v=2.0&key=${AMAP_KEY}`;
          script.async = true;
          script.onload = resolve;
          script.onerror = () => reject(new Error('高德地图组件加载失败'));
          document.body.appendChild(script);
        });
      }
      return amapLoader;
    },
    initTransportAmap() {
      this.loadAmap()
        .then(() => {
          this.$nextTick(() => {
            if (!this.transportAmap) {
              const center = this.toLngLat(
                this.transportMapSelected.longitude || 116.40769,
                this.transportMapSelected.latitude || 39.89945
              );
              this.transportAmap = new window.AMap.Map(this.$refs.transportAmap, {
                center,
                zoom: this.transportMapSelected.longitude ? 14 : 11,
              });
              window.AMap.plugin(['AMap.ToolBar', 'AMap.Geocoder'], () => {
                this.transportAmap.addControl(new window.AMap.ToolBar());
                if (!this.transportAmapGeocoder) {
                  this.transportAmapGeocoder = new window.AMap.Geocoder();
                }
              });
              this.transportAmap.on('click', event => this.pickTransportMapPoint(event.lnglat));
            } else if (typeof this.transportAmap.resize === 'function') {
              this.transportAmap.resize();
            }
            if (this.transportMapSelected.longitude) {
              this.renderTransportMapMarker(
                this.toLngLat(
                  this.transportMapSelected.longitude,
                  this.transportMapSelected.latitude
                )
              );
            }
          });
        })
        .catch(() => {
          this.$message.error('高德地图组件加载失败，请稍后重试或重新打开弹窗');
          this.transportMapBox = false;
        });
    },
    searchTransportMapKeyword() {
      const keyword = String(this.transportMapKeyword || '').trim();
      if (!keyword) {
        this.$message.warning('请输入地址关键词');
        return;
      }
      this.loadAmap()
        .then(() => {
          this.transportMapLoading = true;
          this.ensureTransportAmapGeocoder()
            .then(() => this.runAmapGeocode('location', keyword))
            .then(result => {
              const point = this.resolveMapPoint(result);
              if (!point) {
                this.transportMapStatus = '未找到匹配地址';
                this.$message.warning('地图搜索无匹配地址');
                return;
              }
              this.pickTransportMapPoint(point, keyword);
            })
            .catch(() => {
              this.transportMapStatus = '地图搜索失败';
              this.$message.error('地图搜索失败，请稍后重试');
            })
            .finally(() => {
              this.transportMapLoading = false;
            });
        })
        .catch(() => {
          this.$message.error('高德地图组件加载失败，请稍后重试或重新打开弹窗');
        });
    },
    pickTransportMapPoint(lnglat, keyword) {
      const longitude = this.getPointLng(lnglat);
      const latitude = this.getPointLat(lnglat);
      if (longitude === undefined || latitude === undefined) {
        this.$message.warning('选点坐标无效');
        return;
      }
      const point = this.toLngLat(longitude, latitude);
      this.renderTransportMapMarker(point);
      this.transportMapSelected = this.buildTransportMapSelection({
        lng: longitude,
        lat: latitude,
        address: keyword,
      });
      this.transportMapStatus = '正在反查地址...';
      this.ensureTransportAmapGeocoder()
        .then(() => this.runAmapGeocode('address', point))
        .then(result => {
          const address = this.resolveMapAddress(result);
          this.transportMapSelected = {
            ...this.transportMapSelected,
            detailAddress: address.detailAddress || this.transportMapSelected.detailAddress,
            regionName: address.regionName || this.transportMapSelected.regionName,
            regionCode: address.regionCode || this.transportMapSelected.regionCode,
          };
          this.transportMapKeyword =
            this.transportMapSelected.detailAddress || this.transportMapKeyword;
          this.transportMapStatus = this.transportMapSelected.detailAddress || '已选点，可确认回填';
        })
        .catch(() => {
          this.transportMapStatus = '反查地址失败';
          this.$message.error('反查地址失败，请重新选点');
        });
    },
    renderTransportMapMarker(point) {
      if (!this.transportAmap || !window.AMap) return;
      if (this.transportAmapMarker) {
        this.transportAmapMarker.setMap(null);
      }
      this.transportAmapMarker = new window.AMap.Marker({
        position: point,
      });
      this.transportAmapMarker.setMap(this.transportAmap);
      this.transportAmap.setCenter(point);
    },
    confirmTransportMapPick() {
      if (!this.transportMapSelected.longitude) {
        this.$message.warning('请先搜索或点击地图完成选点');
        return;
      }
      const prefix = this.transportMapTarget;
      this.form[`${prefix}Address`] =
        this.transportMapSelected.detailAddress || this.form[`${prefix}Address`];
      this.form[`${prefix}Name`] =
        this.transportMapSelected.regionName || this.form[`${prefix}Name`];
      this.form[`${prefix}Longitude`] = this.transportMapSelected.longitude;
      this.form[`${prefix}Latitude`] = this.transportMapSelected.latitude;
      this.transportMapBox = false;
      this.$refs.crud?.validateField?.(`${prefix}Address`);
    },
    buildTransportMapSelection({ lng, lat, address, regionName, regionCode }) {
      const longitude = this.formatCoordinate(lng);
      const latitude = this.formatCoordinate(lat);
      return {
        longitude,
        latitude,
        detailAddress: address || '',
        regionName: regionName || '',
        regionCode: regionCode || '',
      };
    },
    formatCoordinate(value) {
      if (value === undefined || value === null || value === '') return '';
      const numberValue = Number(value);
      return Number.isFinite(numberValue) ? numberValue.toFixed(6) : '';
    },
    toLngLat(lng, lat) {
      return new window.AMap.LngLat(Number(lng), Number(lat));
    },
    getPointLng(point) {
      if (!point) return undefined;
      if (typeof point.getLng === 'function') return point.getLng();
      return point.lng ?? point.lon;
    },
    getPointLat(point) {
      if (!point) return undefined;
      if (typeof point.getLat === 'function') return point.getLat();
      return point.lat;
    },
    ensureTransportAmapGeocoder() {
      if (this.transportAmapGeocoder) {
        return Promise.resolve(this.transportAmapGeocoder);
      }
      return new Promise((resolve, reject) => {
        if (!window.AMap || !window.AMap.plugin) {
          reject(new Error('高德地图组件未就绪'));
          return;
        }
        window.AMap.plugin(['AMap.Geocoder'], () => {
          try {
            this.transportAmapGeocoder = new window.AMap.Geocoder();
            resolve(this.transportAmapGeocoder);
          } catch (error) {
            reject(error);
          }
        });
      });
    },
    runAmapGeocode(action, input) {
      return new Promise((resolve, reject) => {
        const timer = window.setTimeout(() => {
          reject(new Error('高德地图请求超时'));
        }, 10000);
        const done = (status, result) => {
          window.clearTimeout(timer);
          if (status === 'complete' && result) {
            resolve(result);
            return;
          }
          reject(new Error('高德地图请求失败'));
        };
        try {
          if (action === 'location') {
            this.transportAmapGeocoder.getLocation(input, done);
          } else {
            this.transportAmapGeocoder.getAddress(input, done);
          }
        } catch (error) {
          window.clearTimeout(timer);
          reject(error);
        }
      });
    },
    resolveMapPoint(result) {
      if (!result) return null;
      const geocode = Array.isArray(result.geocodes) ? result.geocodes[0] : null;
      if (geocode && geocode.location) return geocode.location;
      if (result.location) return result.location;
      if (result.lnglat) return result.lnglat;
      if (result.getLng || result.lng || result.lon) return result;
      return null;
    },
    resolveMapAddress(result = {}) {
      const regeocode = result.regeocode || {};
      const component = regeocode.addressComponent || {};
      const city = Array.isArray(component.city) ? '' : component.city;
      const regionName = [component.province, city, component.district].filter(Boolean).join('');
      return {
        detailAddress: regeocode.formattedAddress || '',
        regionName,
        regionCode: component.adcode || '',
      };
    },
    openCommonCargoDialog() {
      this.commonCargoSelected = [];
      this.commonCargoQuery = {};
      this.commonCargoPage.currentPage = 1;
      this.commonCargoBox = true;
    },
    loadCommonCargoList() {
      this.commonCargoLoading = true;
      getCommonCargoList(this.commonCargoPage.currentPage, this.commonCargoPage.pageSize, {
        ...this.buildCommonCargoQueryParams(),
        allDept: 0,
      })
        .then(res => {
          const data = res.data.data || {};
          this.commonCargoRows = data.records || [];
          this.commonCargoPage.total = data.total || 0;
        })
        .finally(() => {
          this.commonCargoLoading = false;
        });
    },
    buildCommonCargoQueryParams() {
      const { cargoTypePath, ...query } = this.commonCargoQuery || {};
      return Object.keys(query).reduce((params, key) => {
        const value = query[key];
        if (value !== undefined && value !== null && value !== '') {
          params[key] = value;
        }
        return params;
      }, {});
    },
    handleCommonCargoSearch() {
      this.commonCargoPage.currentPage = 1;
      this.loadCommonCargoList();
    },
    handleCommonCargoReset() {
      this.commonCargoQuery = {};
      this.commonCargoPage.currentPage = 1;
      this.loadCommonCargoList();
    },
    handleCommonCargoSizeChange(pageSize) {
      this.commonCargoPage.pageSize = pageSize;
      this.commonCargoPage.currentPage = 1;
      this.loadCommonCargoList();
    },
    handleCommonCargoCurrentChange(currentPage) {
      this.commonCargoPage.currentPage = currentPage;
      this.loadCommonCargoList();
    },
    handleCommonCargoTypeChange(value) {
      const path = this.normalizeBillingCargoTypePath(value);
      const labels = this.getBillingCargoTypePathLabels(path);
      const firstCargoType = this.billingCargoTypeFlatOptions.find(
        item => String(item.id) === String(path[0] || '') && item.path?.length === 1
      );
      const secondCargoType = this.findBillingCargoTypeByPath(path);
      this.commonCargoQuery = {
        ...this.commonCargoQuery,
        cargoTypePath: path,
        firstCargoTypeName: labels[0] || '',
        firstCargoTypeCode: firstCargoType?.cargoCode || firstCargoType?.code || '',
        secondCargoTypeName: labels[1] || '',
        secondCargoTypeCode: secondCargoType?.cargoCode || secondCargoType?.code || '',
      };
      if (!path.length) {
        delete this.commonCargoQuery.firstCargoTypeName;
        delete this.commonCargoQuery.firstCargoTypeCode;
        delete this.commonCargoQuery.secondCargoTypeName;
        delete this.commonCargoQuery.secondCargoTypeCode;
      }
    },
    formatCommonCargoSize(row) {
      return row.cargoSize || row.size || row.dimension || row.dimensions || '';
    },
    async selectCommonCargoRow(row) {
      this.commonCargoSelected = [row];
      await this.ensureBillingCargoTypeOptions();
      this.addTransportCargoRow(-1, this.mapCommonCargoRow(row));
      this.commonCargoBox = false;
    },
    mapCommonCargoRow(row = {}) {
      const cargoTypePath = this.resolveCommonCargoTypePath(row);
      const cargoType = this.findBillingCargoTypeByPath(cargoTypePath);
      const labels = this.getBillingCargoTypePathLabels(cargoTypePath);
      return {
        cargoName: row.cargoName,
        cargoTypePath,
        cargoType: labels[1] || row.secondCargoTypeName || row.firstCargoTypeName,
        cargoTypeCode:
          cargoType?.cargoCode ||
          cargoType?.code ||
          row.secondCargoTypeCode ||
          row.firstCargoTypeCode,
        packageType: row.packageType,
        brand: row.brand,
        specification: row.specification,
        model: row.model,
        remark: row.remark || row.descriptionOne || '',
      };
    },
    async handleCargoImportFileChange(file) {
      const rawFile = file.raw;
      if (!rawFile) return;
      this.cargoImportLoading = true;
      try {
        const ExcelJSModule = await import('exceljs');
        const ExcelJS = ExcelJSModule.default || ExcelJSModule;
        const workbook = new ExcelJS.Workbook();
        await workbook.xlsx.load(await rawFile.arrayBuffer());
        const worksheet = workbook.worksheets[0];
        const headerRow = worksheet.getRow(1);
        const headerMap = {};
        headerRow.eachCell((cell, colNumber) => {
          headerMap[String(cell.value || '').trim()] = colNumber;
        });
        const fieldMap = {
          货物名称: 'cargoName',
          货物类型: 'cargoType',
          数量: 'quantity',
          数量单位: 'quantityUnit',
          包装: 'packageType',
          品牌: 'brand',
          规格: 'specification',
          型号: 'model',
          物料编码: 'materialCode',
          设备编码: 'deviceCode',
          备注: 'remark',
        };
        const rows = [];
        worksheet.eachRow((row, rowNumber) => {
          if (rowNumber === 1) return;
          const nextRow = defaultTransportCargo();
          Object.entries(fieldMap).forEach(([label, prop]) => {
            const columnIndex = headerMap[label];
            if (!columnIndex) return;
            nextRow[prop] = String(row.getCell(columnIndex).value || '').trim();
          });
          if (Object.values(nextRow).some(value => String(value || '').trim())) {
            rows.push(nextRow);
          }
        });
        if (!rows.length) {
          this.$message.warning('未读取到货物数据');
          return;
        }
        rows.forEach(row => this.addTransportCargoRow(-1, row));
        this.$message.success(`成功导入${rows.length}条货物`);
        this.cargoImportBox = false;
      } catch (error) {
        window.console.log(error);
        this.$message.error('货物导入失败，请检查文件格式');
      } finally {
        this.cargoImportLoading = false;
      }
    },
    loadOrganizationOptions() {
      if (!this.config.enableOrganizationSelect || this.organizationLoading) return;
      this.organizationLoading = true;
      getDeptTree(this.userInfo?.tenantId)
        .then(res => {
          this.organizationOptions = this.normalizeOrganizationOptions(res.data.data || []);
          this.organizationFlatOptions = this.flattenOrganizationOptions(this.organizationOptions);
          this.syncOrganizationSearchDic();
          this.syncCurrentOrganizationOption();
        })
        .finally(() => {
          this.organizationLoading = false;
        });
    },
    normalizeOrganizationOptions(tree = []) {
      return (tree || []).map(item => {
        const name = item.title || item.deptName || item.name || item.label || '';
        const children = this.normalizeOrganizationOptions(item.children || []);
        return {
          ...item,
          id: String(item.id),
          label: name,
          rawLabel: name,
          children: children.length ? children : undefined,
        };
      });
    },
    flattenOrganizationOptions(tree = []) {
      const result = [];
      tree.forEach(item => {
        result.push({
          id: String(item.id),
          label: item.label,
          rawLabel: item.rawLabel || item.label,
        });
        if (item.children && item.children.length) {
          result.push(...this.flattenOrganizationOptions(item.children));
        }
      });
      return result;
    },
    syncOrganizationSearchDic() {
      const column = this.findColumn?.(this.option.column, 'organizationName');
      if (column) {
        column.dicData = this.organizationOptions;
      }
    },
    syncCurrentOrganizationOption() {
      if (!this.form.organizationId || !this.form.organizationName) return;
      const exists = this.organizationFlatOptions.some(
        item => String(item.id) === String(this.form.organizationId)
      );
      if (!exists) {
        const current = {
          id: String(this.form.organizationId),
          label: this.form.organizationName,
          rawLabel: this.form.organizationName,
        };
        this.organizationOptions.unshift(current);
        this.organizationFlatOptions.unshift(current);
        this.syncOrganizationSearchDic();
      }
    },
    findOrganizationOption(organizationId) {
      const value = Array.isArray(organizationId)
        ? organizationId[organizationId.length - 1]
        : organizationId;
      return this.organizationFlatOptions.find(item => String(item.id) === String(value));
    },
    handleOrganizationChange(organizationId) {
      const organization = this.findOrganizationOption(organizationId);
      if (!organization) {
        this.form.organizationId = '';
        this.form.organizationName = '';
        return;
      }
      this.form.organizationId = organization.id;
      this.form.organizationName = organization.rawLabel || organization.label || '';
      this.$refs.crud?.validateField?.('organizationName');
    },
    handleAmountInput(prop, value) {
      const text = String(value || '').replace(/[^\d.]/g, '');
      const parts = text.split('.');
      this.form[prop] =
        parts.length > 1 ? `${parts[0]}.${parts.slice(1).join('').slice(0, 2)}` : parts[0];
    },
    handleIntegerInput(prop, value) {
      this.form[prop] = String(value || '').replace(/\D/g, '');
    },
    handleContractDateChange() {
      this.syncContractPeriod(true);
    },
    syncContractPeriod(validate = true) {
      if (!this.config.enableContractPeriod) return;
      this.form.contractPeriod =
        this.form.startDate && this.form.endDate
          ? `${this.form.startDate}至${this.form.endDate}`
          : '';
      if (validate) {
        this.$refs.crud?.validateField?.('contractPeriod');
      }
    },
    applyCurrentUserHandler() {
      if (!this.config.enableCurrentUserHandler || this.form.handlerUserName) return;
      this.form.handlerUserName =
        this.userInfo?.realName || this.userInfo?.userName || this.userInfo?.account || '';
    },
    handleAttachmentChange(list) {
      const userName = this.userInfo?.realName || this.userInfo?.userName || '';
      const uploadTime = this.$dayjs().format('YYYY-MM-DD HH:mm:ss');
      this.attachmentRows = (list || []).map(item => ({
        ...item,
        description: item.description || '',
        uploadUserName: item.uploadUserName || userName,
        uploadTime: item.uploadTime || uploadTime,
      }));
      this.form.attachmentsJson = JSON.stringify(this.attachmentRows);
    },
    removeAttachment(index) {
      this.attachmentRows.splice(index, 1);
      this.form.attachmentsJson = JSON.stringify(this.attachmentRows);
    },
    formatFileSize(size) {
      const number = Number(size);
      if (!number) return '';
      if (number < 1024) return `${number}B`;
      if (number < 1024 * 1024) return `${(number / 1024).toFixed(1)}KB`;
      return `${(number / 1024 / 1024).toFixed(1)}MB`;
    },
    downloadAttachment(row) {
      const url = row.url || row.link;
      if (!url) {
        this.$message.warning('附件地址为空');
        return;
      }
      downloadFileByUrl(url, row.originalName || row.name || '附件');
    },
    handleBatchDownload() {
      this.attachmentRows.forEach(row => this.downloadAttachment(row));
    },
    handleDispatchItemAttachmentChange(list) {
      const userName = this.userInfo?.realName || this.userInfo?.userName || '';
      const uploadTime = this.$dayjs().format('YYYY-MM-DD HH:mm:ss');
      this.dispatchItemAttachmentRows = (list || []).map(item => ({
        ...item,
        description: item.description || '',
        uploadUserName: item.uploadUserName || userName,
        uploadTime: item.uploadTime || uploadTime,
      }));
    },
    removeDispatchItemAttachment(index) {
      this.dispatchItemAttachmentRows.splice(index, 1);
    },
    handleDispatchItemBatchDownload() {
      this.dispatchItemAttachmentRows.forEach(row => this.downloadAttachment(row));
    },
    handleContractFileChange(list) {
      const userName = this.userInfo?.realName || this.userInfo?.userName || '';
      const uploadTime = this.$dayjs().format('YYYY-MM-DD HH:mm:ss');
      this.contractFileRows = (list || []).map(item => ({
        ...item,
        uploadUserName: item.uploadUserName || userName,
        uploadTime: item.uploadTime || uploadTime,
      }));
      this.form.contractFileJson = JSON.stringify(this.contractFileRows);
    },
    removeContractFile(index) {
      this.contractFileRows.splice(index, 1);
      this.form.contractFileJson = JSON.stringify(this.contractFileRows);
    },
    cloneData(data) {
      return JSON.parse(JSON.stringify(data));
    },
    syncBillingPlanJson() {
      if (!this.config.enableBillingPlan) return;
      if (
        this.form.billingEnabled === undefined ||
        this.form.billingEnabled === null ||
        this.form.billingEnabled === ''
      ) {
        this.form.billingEnabled = 1;
      }
      this.form.billingPlanJson = JSON.stringify(this.billingPlanRows);
    },
    ensureBillingMatchRegionOptions() {
      if (!this.config.enableBillingPlan && !this.config.enableTransportPlanForm) {
        return Promise.resolve([]);
      }
      if (this.billingMatchRegionOptions.length) {
        return Promise.resolve(this.billingMatchRegionOptions);
      }
      if (this.billingMatchRegionRequest) {
        return this.billingMatchRegionRequest;
      }
      this.billingMatchRegionLoading = true;
      this.billingMatchRegionRequest = getRegionLazyTree()
        .then(res => {
          const regionTree = this.buildBillingMatchRegionTree(res.data.data || []);
          const regions = this.extractBillingMatchChinaRegions(regionTree);
          this.billingMatchRegionOptions = regions
            .map(item => this.normalizeBillingMatchRegionNode(item, 1))
            .filter(Boolean);
          return this.billingMatchRegionOptions;
        })
        .finally(() => {
          this.billingMatchRegionLoading = false;
          this.billingMatchRegionRequest = null;
        });
      return this.billingMatchRegionRequest;
    },
    ensureBillingCargoTypeOptions() {
      if (
        !this.config.enableBillingPlan &&
        !this.config.enableTransportPlanForm &&
        !this.taskInfoFormEnabled
      ) {
        return Promise.resolve([]);
      }
      if (this.billingCargoTypeOptions.length) {
        return Promise.resolve(this.billingCargoTypeOptions);
      }
      if (this.billingCargoTypeRequest) {
        return this.billingCargoTypeRequest;
      }
      this.billingCargoTypeLoading = true;
      this.billingCargoTypeRequest = getCargoTypeList(1, 9999)
        .then(res => {
          this.billingCargoTypeOptions = this.buildBillingCargoTypeTree(extractRecords(res));
          this.billingCargoTypeFlatOptions = this.flattenBillingCargoTypeOptions(
            this.billingCargoTypeOptions
          );
          return this.billingCargoTypeOptions;
        })
        .finally(() => {
          this.billingCargoTypeLoading = false;
          this.billingCargoTypeRequest = null;
        });
      return this.billingCargoTypeRequest;
    },
    buildBillingCargoTypeTree(cargoTypes = []) {
      const flatCargoTypes = [];
      const collectCargoTypes = list => {
        (list || []).forEach(item => {
          flatCargoTypes.push({
            ...item,
            children: undefined,
          });
          if (item.children?.length) collectCargoTypes(item.children);
        });
      };
      collectCargoTypes(cargoTypes);

      const nodeMap = new Map();
      const codeMap = new Map();
      flatCargoTypes.forEach(item => {
        const id = item.id ?? item.cargoCode ?? item.code;
        if (id === undefined || id === null) return;
        const node = {
          ...item,
          id: String(id),
          cargoName: this.formatBillingCargoTypeLabel(item),
          cargoCode: item.cargoCode || item.code || '',
          parentId:
            item.parentId === undefined || item.parentId === null ? '' : String(item.parentId),
          parentCargoCode: item.parentCargoCode || item.parentCode || '',
          children: [],
        };
        nodeMap.set(node.id, node);
        if (node.cargoCode) {
          codeMap.set(String(node.cargoCode), node);
        }
      });

      const rootNodes = [];
      nodeMap.forEach(node => {
        const parent =
          nodeMap.get(node.parentId) ||
          codeMap.get(String(node.parentCargoCode || '')) ||
          codeMap.get(String(node.parentId || ''));
        if (parent && parent !== node && Number(node.typeLevel) !== 1) {
          parent.children.push(node);
        } else {
          rootNodes.push(node);
        }
      });
      return rootNodes.map(item => this.normalizeBillingCargoTypeNode(item, 1)).filter(Boolean);
    },
    normalizeBillingCargoTypeNode(cargoType, level = 1, parentPath = []) {
      if (level > 2) return null;
      const id = String(cargoType.id);
      const path = [...parentPath, id];
      const children =
        level === 1
          ? (cargoType.children || [])
              .map(item => this.normalizeBillingCargoTypeNode(item, level + 1, path))
              .filter(Boolean)
          : [];
      return {
        ...cargoType,
        id,
        cargoName: this.formatBillingCargoTypeLabel(cargoType),
        cargoCode: cargoType.cargoCode || cargoType.code || '',
        path,
        leaf: level === 2,
        children: children.length ? children : undefined,
      };
    },
    flattenBillingCargoTypeOptions(options = []) {
      const result = [];
      const collectOptions = list => {
        (list || []).forEach(item => {
          result.push(item);
          if (item.children?.length) collectOptions(item.children);
        });
      };
      collectOptions(options);
      return result;
    },
    buildBillingMatchRegionTree(regions = []) {
      const flatRegions = [];
      const collectRegions = list => {
        (list || []).forEach(item => {
          flatRegions.push({
            ...item,
            children: undefined,
          });
          if (item.children?.length) collectRegions(item.children);
        });
      };
      collectRegions(regions);

      const nodeMap = new Map();
      flatRegions.forEach(item => {
        const id = item.id ?? item.code ?? item.value;
        if (id === undefined || id === null) return;
        nodeMap.set(String(id), {
          ...item,
          id: String(id),
          parentId:
            item.parentId === undefined || item.parentId === null
              ? String(item.parentCode || '')
              : String(item.parentId),
          children: [],
        });
      });

      const rootNodes = [];
      nodeMap.forEach(node => {
        const parent = nodeMap.get(node.parentId);
        if (parent && parent !== node) {
          parent.children.push(node);
        } else {
          rootNodes.push(node);
        }
      });
      return rootNodes;
    },
    normalizeBillingMatchRegionNode(region, level = 1) {
      if (level > 2) return null;
      const children =
        level === 1
          ? (region.children || [])
              .map(item => this.normalizeBillingMatchRegionNode(item, level + 1))
              .filter(Boolean)
          : [];
      return {
        ...region,
        title: region.title || region.name || '',
        leaf: level === 2,
        children: children.length ? children : undefined,
      };
    },
    isBillingMatchChinaRegion(region = {}) {
      const title = String(region.title || region.name || '').trim();
      return title === '中国' || title === '中华人民共和国';
    },
    extractBillingMatchChinaRegions(regions) {
      const china = (regions || []).find(item => this.isBillingMatchChinaRegion(item));
      if (china?.children?.length) return china.children;
      if (regions.length === 1 && regions[0].children?.length) return regions[0].children;
      return regions;
    },
    getBillingMatchRegionPathLabels(path = []) {
      let options = this.billingMatchRegionOptions;
      const labels = [];
      (path || []).forEach(value => {
        const option = (options || []).find(item => String(item.id) === String(value));
        if (!option) return;
        labels.push(option.title || option.name || '');
        options = option.children || [];
      });
      return labels.filter(Boolean);
    },
    handleBillingMatchRegionChange(prop, value) {
      const pathProp = `${prop}Path`;
      const path = Array.isArray(value) && value.length >= 2 ? value.slice(0, 2) : [];
      const labels = this.getBillingMatchRegionPathLabels(path);
      this.billingMatchForm[pathProp] = path;
      if (!path.length) {
        this.billingMatchForm[prop] = '';
        this.billingMatchForm[`${prop}Code`] = '';
        return;
      }
      if (labels.length) {
        this.billingMatchForm[prop] = labels.join('');
      }
      this.billingMatchForm[`${prop}Code`] = String(path[path.length - 1]);
    },
    formatBillingCargoTypeLabel(item = {}) {
      return item.cargoName || item.name || item.typeName || item.label || '';
    },
    filterBillingCargoType(node, keyword) {
      const text = String(keyword || '').trim();
      if (!text) return true;
      const labels = node.pathLabels?.length ? node.pathLabels : [node.label];
      return (
        labels.some(label => String(label || '').includes(text)) ||
        String(node.text || '').includes(text)
      );
    },
    getBillingCargoTypePathLabels(path = []) {
      let options = this.billingCargoTypeOptions;
      const labels = [];
      (path || []).forEach(value => {
        const option = (options || []).find(item => String(item.id) === String(value));
        if (!option) return;
        labels.push(option.cargoName || '');
        options = option.children || [];
      });
      return labels.filter(Boolean);
    },
    findBillingCargoTypeByPath(path = []) {
      const value = Array.isArray(path) && path.length >= 2 ? String(path[1]) : '';
      if (!value) return null;
      return (
        this.billingCargoTypeFlatOptions.find(
          item => String(item.id) === value && item.path?.length >= 2
        ) || null
      );
    },
    findBillingCargoTypeByCodeOrName(condition = {}) {
      const code = String(condition.cargoTypeCode || '').trim();
      const name = String(condition.cargoType || '').trim();
      return (
        this.billingCargoTypeFlatOptions.find(item => {
          const cargoCode = String(item.cargoCode || item.code || item.id || '');
          return item.path?.length >= 2 && code && cargoCode === code;
        }) ||
        this.billingCargoTypeFlatOptions.find(item => {
          const cargoName = this.formatBillingCargoTypeLabel(item);
          return item.path?.length >= 2 && name && (cargoName === name || name.endsWith(cargoName));
        }) ||
        null
      );
    },
    resolveCommonCargoTypePath(row = {}) {
      const path = this.normalizeBillingCargoTypePath(row.cargoTypePath);
      if (path.length) return path;
      const cargoType =
        this.findBillingCargoTypeByCodeOrName({
          cargoTypeCode: row.secondCargoTypeCode || row.firstCargoTypeCode || row.cargoTypeCode,
          cargoType: row.secondCargoTypeName || row.firstCargoTypeName || row.cargoType,
        }) ||
        this.findBillingCargoTypeByCodeOrName({
          cargoTypeCode: row.firstCargoTypeCode || '',
          cargoType: row.firstCargoTypeName || '',
        });
      return cargoType?.path || [];
    },
    handleBillingMatchCargoTypeChange(value) {
      const path =
        Array.isArray(value) && value.length >= 2
          ? value.slice(0, 2).map(item => String(item))
          : [];
      const cargoType = this.findBillingCargoTypeByPath(path);
      const labels = this.getBillingCargoTypePathLabels(path);
      this.billingMatchForm.cargoTypePath = path;
      if (!path.length || !cargoType) {
        this.billingMatchForm.cargoType = '';
        this.billingMatchForm.cargoTypeCode = '';
        return;
      }
      this.billingMatchForm.cargoType =
        labels.length > 1
          ? labels.join('/')
          : labels[0] || this.formatBillingCargoTypeLabel(cargoType || {});
      this.billingMatchForm.cargoTypeCode =
        cargoType?.cargoCode || cargoType?.code || cargoType?.id || '';
    },
    normalizeBillingCargoTypePath(path) {
      return Array.isArray(path) && path.length >= 2
        ? path.slice(0, 2).map(value => String(value))
        : [];
    },
    resolveBillingMatchCargoTypePath(condition = {}) {
      const path = this.normalizeBillingCargoTypePath(condition.cargoTypePath);
      if (path.length) return path;
      const cargoType = this.findBillingCargoTypeByCodeOrName(condition);
      return cargoType?.path || [];
    },
    normalizeBillingMatchRegionPath(path) {
      return Array.isArray(path) && path.length >= 2
        ? path.slice(0, 2).map(value => String(value))
        : [];
    },
    normalizeBillingMatchCondition(condition = {}) {
      const defaults = defaultBillingRule().matchCondition;
      const nextCondition = {
        ...defaults,
        ...(condition || {}),
      };
      nextCondition.originPath = this.normalizeBillingMatchRegionPath(condition?.originPath);
      nextCondition.destinationPath = this.normalizeBillingMatchRegionPath(
        condition?.destinationPath
      );
      nextCondition.cargoTypePath = this.normalizeBillingCargoTypePath(condition?.cargoTypePath);
      return nextCondition;
    },
    ensureBillingFeeCategoryOptions() {
      if (!this.config.enableBillingPlan) return Promise.resolve([]);
      if (this.billingFeeCategoryOptions.length) {
        return Promise.resolve(this.billingFeeCategoryOptions);
      }
      if (this.billingFeeCategoryRequest) {
        return this.billingFeeCategoryRequest;
      }
      this.billingFeeCategoryLoading = true;
      this.billingFeeCategoryRequest = getDictionary({ code: 'fee_category' })
        .then(res => {
          this.billingFeeCategoryOptions = res.data.data || [];
          return this.billingFeeCategoryOptions;
        })
        .finally(() => {
          this.billingFeeCategoryLoading = false;
          this.billingFeeCategoryRequest = null;
        });
      return this.billingFeeCategoryRequest;
    },
    ensureBillingUnitOptions() {
      if (!this.config.enableBillingPlan) return Promise.resolve([]);
      if (this.billingUnitOptions.length) {
        return Promise.resolve(this.billingUnitOptions);
      }
      if (this.billingUnitRequest) {
        return this.billingUnitRequest;
      }
      this.billingUnitLoading = true;
      this.billingUnitRequest = getDictionary({ code: 'unit_fee' })
        .then(res => {
          this.billingUnitOptions = res.data.data || [];
          return this.billingUnitOptions;
        })
        .finally(() => {
          this.billingUnitLoading = false;
          this.billingUnitRequest = null;
        });
      return this.billingUnitRequest;
    },
    resolveBillingFeeType(value) {
      const feeType = String(value || '').trim();
      if (!feeType) return '';
      const option = this.billingFeeCategoryOptions.find(
        item => String(item.dictKey || '') === feeType || String(item.dictValue || '') === feeType
      );
      return String((option && option.dictKey) || feeType);
    },
    getBillingFeeItemOptions(feeType) {
      const key = this.resolveBillingFeeType(feeType);
      return key ? this.billingFeeItemOptionsMap[key] || [] : [];
    },
    loadBillingFeeItemOptions(feeType) {
      const key = this.resolveBillingFeeType(feeType);
      if (!key) return Promise.resolve([]);
      if (this.billingFeeItemOptionsMap[key]) {
        return Promise.resolve(this.billingFeeItemOptionsMap[key]);
      }
      if (this.billingFeeItemRequestMap[key]) {
        return this.billingFeeItemRequestMap[key];
      }
      this.billingFeeItemLoadingMap[key] = true;
      this.billingFeeItemRequestMap[key] = getFeeItemList(1, 9999, { feeCategory: key })
        .then(res => {
          const records = extractRecords(res);
          this.billingFeeItemOptionsMap[key] = records;
          return records;
        })
        .finally(() => {
          this.billingFeeItemLoadingMap[key] = false;
          delete this.billingFeeItemRequestMap[key];
        });
      return this.billingFeeItemRequestMap[key];
    },
    loadBillingRuleFeeItems(rules = []) {
      const feeTypes = Array.from(
        new Set((rules || []).map(row => this.resolveBillingFeeType(row.feeType)).filter(Boolean))
      );
      feeTypes.forEach(feeType => this.loadBillingFeeItemOptions(feeType));
    },
    handleBillingFeeTypeChange(row, value) {
      row.feeType = this.resolveBillingFeeType(value);
      row.feeItem = '';
      this.loadBillingFeeItemOptions(row.feeType);
    },
    openBillingPlan(row, index = -1) {
      this.billingPlanMode = index > -1 ? 'edit' : 'add';
      this.billingPlanIndex = index;
      const plan = row ? this.cloneData(row) : defaultBillingPlan();
      this.billingPlanForm = {
        ...defaultBillingPlan(),
        ...plan,
        rules: this.normalizeBillingRules(
          Array.isArray(plan.rules) && plan.rules.length ? plan.rules : [defaultBillingRule()]
        ),
      };
      this.billingPlanBox = true;
      this.ensureBillingUnitOptions();
      this.ensureBillingFeeCategoryOptions().then(() => {
        this.billingPlanForm.rules = this.normalizeBillingRules(this.billingPlanForm.rules);
        this.loadBillingRuleFeeItems(this.billingPlanForm.rules);
      });
      this.$nextTick(() => this.$refs.billingPlanFormRef?.clearValidate?.());
    },
    submitBillingPlan() {
      this.$refs.billingPlanFormRef?.validate(valid => {
        if (!valid) return;
        if (!this.validateBillingRules()) return;
        const plan = this.cloneData(this.billingPlanForm);
        plan.rules = this.normalizeBillingRules(plan.rules).map(rule => {
          const ranges = this.canEditBillingLimit(rule) ? rule.limitRanges : [];
          return {
            ...rule,
            limitRanges: ranges,
            lowerLimit: ranges[0]?.lowerLimit || '',
            upperLimit: ranges[0]?.upperLimit || '',
            minimumBillingWeight: this.canEditMinimumBillingWeight(rule)
              ? rule.minimumBillingWeight
              : '',
          };
        });
        if (!this.billingPlanRows.length && this.billingPlanIndex === -1) {
          plan.defaultPlan = true;
        }
        if (plan.defaultPlan) {
          this.billingPlanRows.forEach(item => {
            item.defaultPlan = false;
          });
        }
        if (this.billingPlanIndex > -1) {
          this.billingPlanRows.splice(this.billingPlanIndex, 1, plan);
        } else {
          this.billingPlanRows.push(plan);
        }
        this.syncBillingPlanJson();
        this.billingPlanBox = false;
      });
    },
    validateBillingRules() {
      const groups = {};
      const requiredFields = [
        ['feeType', '费用类型'],
        ['feeItem', '费用项'],
        ['billingElement', '计费要素'],
        ['billingType', '计费类型'],
        ['billingUnit', '计费单位'],
        ['unitPrice', '单价'],
      ];
      for (const [index, row] of (this.billingPlanForm.rules || []).entries()) {
        const emptyField = requiredFields.find(([prop]) => this.isBillingFieldEmpty(row[prop]));
        if (emptyField) {
          this.$message.warning(`第${index + 1}行${emptyField[1]}不能为空`);
          return false;
        }
        if (row.billingElement && !this.getBillingTypeOptions(row).includes(row.billingType)) {
          this.$message.warning('请选择计费要素对应的计费类型');
          return false;
        }
        if (!this.canEditBillingLimit(row)) {
          continue;
        }
        const key = row.billingElement || '';
        groups[key] = groups[key] || [];
        const ranges = this.getBillingLimitRanges(row);
        for (const range of ranges) {
          const lower = Number(range.lowerLimit);
          const upper = Number(range.upperLimit);
          if (
            range.lowerLimit === '' ||
            range.upperLimit === '' ||
            Number.isNaN(lower) ||
            Number.isNaN(upper)
          ) {
            this.$message.warning('请完整填写计费要素上下限');
            return false;
          }
          if (lower > upper) {
            this.$message.warning('计费要素下限不能大于上限');
            return false;
          }
          groups[key].push({ lower, upper });
        }
      }
      return this.validateBillingLimitRangeGroups(groups);
    },
    validateBillingLimitRangeGroups(groups) {
      const precision = 0.000001;
      for (const [billingElement, ranges] of Object.entries(groups)) {
        if (ranges.length <= 1) continue;
        const sortedRanges = [...ranges].sort((prev, next) => {
          if (prev.lower !== next.lower) return prev.lower - next.lower;
          return prev.upper - next.upper;
        });
        for (let index = 1; index < sortedRanges.length; index += 1) {
          const prevRange = sortedRanges[index - 1];
          const currentRange = sortedRanges[index];
          if (currentRange.lower < prevRange.upper - precision) {
            this.$message.warning(`${billingElement}的计费要素区间不能重叠`);
            return false;
          }
          if (currentRange.lower > prevRange.upper + precision) {
            this.$message.warning(`${billingElement}的计费要素区间必须连续，不能存在间隙`);
            return false;
          }
        }
      }
      return true;
    },
    isBillingFieldEmpty(value) {
      return value === undefined || value === null || String(value).trim() === '';
    },
    removeBillingPlan(index) {
      this.$confirm('确定删除该计费方案?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
        this.billingPlanRows.splice(index, 1);
        this.syncBillingPlanJson();
      });
    },
    addBillingRule() {
      const row = defaultBillingRule();
      this.billingPlanForm.rules.push(row);
      this.ensureBillingFeeCategoryOptions();
    },
    copyBillingRule(row) {
      const nextRow = this.cloneData(row);
      this.billingPlanForm.rules.push(nextRow);
      this.loadBillingFeeItemOptions(nextRow.feeType);
    },
    removeBillingRule(index) {
      this.billingPlanForm.rules.splice(index, 1);
      if (!this.billingPlanForm.rules.length) {
        this.billingPlanForm.rules.push(defaultBillingRule());
      }
    },
    getBillingTypeOptions(row) {
      return this.billingElementTypeMap[row.billingElement] || [];
    },
    handleBillingElementChange(row) {
      if (!this.getBillingTypeOptions(row).includes(row.billingType)) {
        row.billingType = '';
      }
      if (!this.canEditMinimumBillingWeight(row)) {
        row.minimumBillingWeight = '';
      }
      this.handleBillingTypeChange(row);
    },
    handleBillingTypeChange(row) {
      if (!this.canEditBillingLimit(row)) {
        row.limitRanges = [{ lowerLimit: '', upperLimit: '' }];
        row.lowerLimit = '';
        row.upperLimit = '';
        return;
      }
      row.limitRanges = this.normalizeBillingLimitRanges(row);
      this.syncBillingLegacyLimit(row);
    },
    canEditBillingLimit(row) {
      return (
        !this.dialogReadonly &&
        Boolean(row.billingElement) &&
        Boolean(row.billingType) &&
        (row.billingType.includes('区间') || row.billingType.includes('阶梯'))
      );
    },
    canEditMinimumBillingWeight(row) {
      return !this.dialogReadonly && ['按重量', '按吨·公里'].includes(row.billingElement);
    },
    getBillingLimitRanges(row) {
      return Array.isArray(row.limitRanges) && row.limitRanges.length
        ? row.limitRanges
        : [{ lowerLimit: '', upperLimit: '' }];
    },
    normalizeBillingRules(rules = []) {
      return (rules || []).map(rule => {
        const nextRule = {
          ...defaultBillingRule(),
          ...rule,
        };
        nextRule.feeType = this.resolveBillingFeeType(nextRule.feeType);
        nextRule.limitRanges = this.normalizeBillingLimitRanges(nextRule);
        this.syncBillingLegacyLimit(nextRule);
        return nextRule;
      });
    },
    normalizeBillingLimitRanges(row) {
      const ranges = Array.isArray(row.limitRanges) ? row.limitRanges : [];
      const nextRanges = ranges
        .map(item => ({
          lowerLimit: item?.lowerLimit ?? '',
          upperLimit: item?.upperLimit ?? '',
        }))
        .filter(item => item.lowerLimit !== '' || item.upperLimit !== '');
      if (!nextRanges.length && (row.lowerLimit !== '' || row.upperLimit !== '')) {
        nextRanges.push({
          lowerLimit: row.lowerLimit ?? '',
          upperLimit: row.upperLimit ?? '',
        });
      }
      return nextRanges.length ? nextRanges : [{ lowerLimit: '', upperLimit: '' }];
    },
    syncBillingLegacyLimit(row) {
      const firstRange = row.limitRanges?.[0] || {};
      row.lowerLimit = firstRange.lowerLimit || '';
      row.upperLimit = firstRange.upperLimit || '';
    },
    addBillingLimitRange(row, index) {
      row.limitRanges = this.getBillingLimitRanges(row);
      row.limitRanges.splice(index + 1, 0, { lowerLimit: '', upperLimit: '' });
    },
    removeBillingLimitRange(row, index) {
      row.limitRanges = this.getBillingLimitRanges(row);
      row.limitRanges.splice(index, 1);
      if (!row.limitRanges.length) {
        row.limitRanges.push({ lowerLimit: '', upperLimit: '' });
      }
      this.syncBillingLegacyLimit(row);
    },
    handleBillingLimitInput(row, index, prop, value) {
      row.limitRanges = this.getBillingLimitRanges(row);
      const text = String(value || '').replace(/[^\d.]/g, '');
      const parts = text.split('.');
      row.limitRanges[index][prop] =
        parts.length > 1 ? `${parts[0]}.${parts.slice(1).join('').slice(0, 2)}` : parts[0];
      this.syncBillingLegacyLimit(row);
    },
    openBillingMatch(row, index) {
      this.billingMatchRuleIndex = index;
      this.billingMatchForm = this.normalizeBillingMatchCondition(row.matchCondition);
      this.billingMatchBox = true;
      this.ensureBillingMatchRegionOptions();
      this.ensureBillingCargoTypeOptions().then(() => {
        const path = this.resolveBillingMatchCargoTypePath(this.billingMatchForm);
        if (path.length) {
          this.handleBillingMatchCargoTypeChange(path);
        }
      });
    },
    saveBillingMatch() {
      const row = this.billingPlanForm.rules[this.billingMatchRuleIndex];
      if (row) {
        this.handleBillingMatchRegionChange('origin', this.billingMatchForm.originPath);
        this.handleBillingMatchRegionChange('destination', this.billingMatchForm.destinationPath);
        this.handleBillingMatchCargoTypeChange(this.billingMatchForm.cargoTypePath);
        row.matchCondition = this.cloneData(this.billingMatchForm);
      }
      this.billingMatchBox = false;
    },
    handleBillingDecimalInput(row, prop, value) {
      const text = String(value || '').replace(/[^\d.]/g, '');
      const parts = text.split('.');
      row[prop] =
        parts.length > 1 ? `${parts[0]}.${parts.slice(1).join('').slice(0, 2)}` : parts[0];
    },
    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);
    },
    handleScopeChange() {
      if (!this.canViewAllDept) {
        this.allDept = 0;
      }
      this.page.currentPage = 1;
      this.onLoad(this.page);
    },
    normalizeSearchRangeValue(value, suffix) {
      if (!value) return undefined;
      return suffix ? `${value} ${suffix}` : value;
    },
    normalizeSearchRangeParams(params = {}) {
      const query = { ...params };
      const rangeMap = this.config.searchRangeMap || {};
      Object.entries(rangeMap).forEach(([rangeProp, mapping]) => {
        const [startProp, endProp, startSuffix, endSuffix] = Array.isArray(mapping)
          ? mapping
          : [mapping.startProp, mapping.endProp, mapping.startSuffix, mapping.endSuffix];
        const range = query[rangeProp];
        if (Array.isArray(range) && range.length === 2) {
          query[startProp] = this.normalizeSearchRangeValue(range[0], startSuffix);
          query[endProp] = this.normalizeSearchRangeValue(range[1], endSuffix);
        }
        delete query[rangeProp];
      });
      return query;
    },
    normalizeQueryParams(params = {}) {
      let query = { ...params };
      if (Object.keys(this.config.searchRangeMap || {}).length) {
        query = this.normalizeSearchRangeParams(query);
      }
      if (this.config.enableOrganizationSelect && query.organizationName) {
        const organizationId = Array.isArray(query.organizationName)
          ? query.organizationName[query.organizationName.length - 1]
          : query.organizationName;
        if (!organizationId) {
          delete query.organizationId;
          delete query.organizationName;
          return query;
        }
        const organization = this.findOrganizationOption(organizationId);
        query.organizationId = organizationId;
        if (organization) {
          query.organizationName = organization.rawLabel || organization.label || '';
        } else {
          delete query.organizationName;
        }
        if (this.canViewAllDept) {
          query.allDept = 1;
        }
      }
      return query;
    },
    onLoad(page, params = {}) {
      this.loading = true;
      const query = this.normalizeQueryParams({ ...params, ...this.query, allDept: this.allDept });
      this.api
        .getList(page.currentPage, page.pageSize, query)
        .then(res => {
          const result = res.data.data;
          this.page.total = result.total;
          this.data = result.records;
          this.selectionClear();
        })
        .finally(() => {
          this.loading = false;
        });
    },
    buildExportParams() {
      const query = this.normalizeQueryParams({ ...this.query, allDept: this.allDept });
      return {
        ...query,
        ids: this.ids,
        [this.website.tokenHeader]: getToken(),
      };
    },
    handleExport() {
      this.$confirm(`是否导出${this.config.exportName || this.config.title}?`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
        NProgress.start();
        exportBlob(this.config.exportUrl, this.buildExportParams(), { feedback: true })
          .then(res => {
            downloadXls(
              res.data,
              `${this.config.exportName || this.config.title}${this.$dayjs().format(
                'YYYY-MM-DD HH:mm:ss'
              )}.xlsx`
            );
          })
          .finally(() => {
            NProgress.done();
          });
      });
    },
    handleTemplate() {
      NProgress.start();
      exportBlob(
        this.config.templateUrl,
        {
          [this.website.tokenHeader]: getToken(),
        },
        { feedback: true }
      )
        .then(res => {
          downloadXls(res.data, `${this.config.title}模板.xlsx`);
        })
        .finally(() => {
          NProgress.done();
        });
    },
    handleImport() {
      if (this.config.enableWaybillImport) {
        this.waybillImportBox = true;
        return;
      }
      if (this.config.enableTransportPlanImport) {
        this.transportPlanImportBox = true;
        this.loadProjectOptions();
        return;
      }
      const column = this.findColumn(this.excelOptionConfig.column, 'excelFile');
      column.action = this.config.importUrl;
      openImportDialog(this, this.config.title, () => this.onLoad(this.page, this.query));
    },
    resetTransportPlanImport() {
      this.transportPlanImportForm = {
        projectId: '',
        projectName: '',
        customerName: '',
        contractId: '',
        contractName: '',
        file: null,
      };
      this.transportPlanImportFiles = [];
      this.transportPlanImportSourceFile = null;
      this.transportPlanImportRows = [];
      this.transportPlanImportSelection = [];
      this.transportPlanImportTab = 'all';
      this.transportPlanImportEditingKey = '';
      this.transportPlanImportEditSnapshot = null;
      this.transportPlanImportContractOptions = [];
      this.transportPlanImportContractLoading = false;
      this.$refs.transportPlanImportFormRef?.clearValidate();
    },
    handleTransportPlanImportProjectChange(projectId) {
      const project = this.projectOptions.find(item => String(item.id) === String(projectId));
      this.transportPlanImportForm.customerName =
        project?.customerName || project?.customerNames || project?.customer || '';
      this.transportPlanImportForm.projectName = project?.projectName || '';
      this.transportPlanImportForm.contractId = '';
      this.transportPlanImportForm.contractName = '';
      this.transportPlanImportContractOptions = [];
      if (!projectId) return;
      this.transportPlanImportContractLoading = true;
      getContractList(1, 9999, { projectId, projectName: project?.projectName })
        .then(res => {
          this.transportPlanImportContractOptions = extractRecords(res);
          const contract = this.transportPlanImportContractOptions[0];
          this.transportPlanImportForm.customerName =
            this.transportPlanImportForm.customerName || contract?.customerName || '';
          this.transportPlanImportForm.contractId = contract?.id || '';
          this.transportPlanImportForm.contractName = contract?.contractName || '';
        })
        .finally(() => {
          this.transportPlanImportContractLoading = false;
        });
    },
    handleTransportPlanImportContractChange(contractId) {
      const contract = this.transportPlanImportContractOptions.find(
        item => String(item.id) === String(contractId)
      );
      this.transportPlanImportForm.contractName = contract?.contractName || '';
    },
    async handleTransportPlanImportFileChange(file, fileList) {
      const isExcel = /\.(xls|xlsx)$/i.test(file.name || '');
      if (!isExcel) {
        this.$message.error('请上传 .xls 或 .xlsx 格式文件');
        this.transportPlanImportFiles = [];
        this.transportPlanImportForm.file = null;
        return;
      }
      try {
        const XLSX = await import('xlsx');
        const workbook = XLSX.read(await file.raw.arrayBuffer(), {
          type: 'array',
          cellDates: false,
        });
        const worksheet = workbook.Sheets[workbook.SheetNames[0]];
        const values = XLSX.utils.sheet_to_json(worksheet, {
          header: 1,
          defval: '',
          raw: false,
          blankrows: false,
        });
        const headers = values[0] || [];
        const headerMap = headers.reduce((result, label, index) => {
          const normalized = String(label || '')
            .replace(/^\*/, '')
            .trim();
          if (normalized) result[normalized] = index;
          return result;
        }, {});
        const rows = values.slice(1).reduce((result, cells, index) => {
          const row = {
            _key: `${Date.now()}-${index}-${Math.random().toString(36).slice(2)}`,
          };
          transportPlanImportColumns.forEach(([label, prop]) => {
            row[prop] = String(cells[headerMap[label]] ?? '').trim();
          });
          if (transportPlanImportColumns.some(([, prop]) => row[prop])) result.push(row);
          return result;
        }, []);
        if (!rows.length) {
          this.$message.warning('未读取到计划明细数据');
          this.transportPlanImportFiles = [];
          this.transportPlanImportForm.file = null;
          return;
        }
        this.transportPlanImportFiles = fileList.slice(-1);
        this.transportPlanImportSourceFile = file.raw;
        this.transportPlanImportForm.file = file.raw;
        this.transportPlanImportRows = rows;
        this.markTransportPlanImportDuplicates();
        this.$refs.transportPlanImportFormRef?.validateField('file');
        this.$message.success(`已读取${rows.length}条计划明细`);
      } catch (error) {
        this.transportPlanImportFiles = [];
        this.transportPlanImportSourceFile = null;
        this.transportPlanImportForm.file = null;
        this.transportPlanImportRows = [];
        this.$message.error('计划明细表读取失败，请检查文件格式');
      }
    },
    handleTransportPlanImportFileRemove() {
      this.transportPlanImportFiles = [];
      this.transportPlanImportSourceFile = null;
      this.transportPlanImportForm.file = null;
      this.transportPlanImportRows = [];
      this.transportPlanImportSelection = [];
      this.transportPlanImportEditingKey = '';
      this.transportPlanImportEditSnapshot = null;
    },
    transportPlanImportDuplicateKey(row) {
      return transportPlanImportColumns
        .map(([, prop]) => String(row[prop] || '').trim())
        .join('\u0001');
    },
    markTransportPlanImportDuplicates() {
      const countMap = this.transportPlanImportRows.reduce((result, row) => {
        const key = this.transportPlanImportDuplicateKey(row);
        result[key] = (result[key] || 0) + 1;
        return result;
      }, {});
      this.transportPlanImportRows.forEach(row => {
        row._duplicate = countMap[this.transportPlanImportDuplicateKey(row)] > 1;
      });
    },
    handleTransportPlanImportSelectionChange(rows) {
      this.transportPlanImportSelection = rows;
    },
    isEditingTransportPlanImportRow(row) {
      return this.transportPlanImportEditingKey === row._key;
    },
    editTransportPlanImportRow(row) {
      if (this.transportPlanImportEditingKey && this.transportPlanImportEditingKey !== row._key) {
        this.$message.warning('请先保存或取消当前编辑');
        return;
      }
      this.transportPlanImportEditingKey = row._key;
      this.transportPlanImportEditSnapshot = { ...row };
    },
    saveTransportPlanImportRow() {
      this.transportPlanImportEditingKey = '';
      this.transportPlanImportEditSnapshot = null;
      this.markTransportPlanImportDuplicates();
    },
    cancelTransportPlanImportRow(row) {
      Object.assign(row, this.transportPlanImportEditSnapshot || {});
      this.transportPlanImportEditingKey = '';
      this.transportPlanImportEditSnapshot = null;
      this.markTransportPlanImportDuplicates();
    },
    removeTransportPlanImportRow(row) {
      this.transportPlanImportRows = this.transportPlanImportRows.filter(
        item => item._key !== row._key
      );
      this.transportPlanImportSelection = this.transportPlanImportSelection.filter(
        item => item._key !== row._key
      );
      this.markTransportPlanImportDuplicates();
    },
    removeSelectedTransportPlanImportRows() {
      const selectedKeys = new Set(this.transportPlanImportSelection.map(row => row._key));
      this.transportPlanImportRows = this.transportPlanImportRows.filter(
        row => !selectedKeys.has(row._key)
      );
      this.transportPlanImportSelection = [];
      this.markTransportPlanImportDuplicates();
    },
    validateTransportPlanImportRows() {
      if (!this.transportPlanImportRows.length) {
        this.$message.warning('请保留至少一条计划明细');
        return false;
      }
      const requiredFields = [
        ['planName', '计划名称'],
        ['transportType', '运输方式'],
        ['planStartDate', '计划开始日期'],
        ['planEndDate', '计划结束日期'],
        ['cargoType', '货物类型'],
        ['departureAddress', '发货地址'],
        ['arrivalAddress', '收货地址'],
      ];
      for (const [index, row] of this.transportPlanImportRows.entries()) {
        const emptyField = requiredFields.find(([prop]) => !String(row[prop] || '').trim());
        if (emptyField) {
          this.$message.warning(`第${index + 1}行${emptyField[1]}不能为空`);
          return false;
        }
        const isValidDate = value => {
          if (!/^\d{4}-\d{2}-\d{2}$/.test(value)) return false;
          const date = new Date(`${value}T00:00:00`);
          return !Number.isNaN(date.getTime()) && date.toISOString().slice(0, 10) === value;
        };
        if (!isValidDate(row.planStartDate) || !isValidDate(row.planEndDate)) {
          this.$message.warning(`第${index + 1}行计划日期格式必须为 YYYY-MM-DD`);
          return false;
        }
        if (row.planEndDate < row.planStartDate) {
          this.$message.warning(`第${index + 1}行计划结束日期不能早于计划开始日期`);
          return false;
        }
        if (
          row.quantity !== '' &&
          (!Number.isFinite(Number(row.quantity)) || Number(row.quantity) < 0)
        ) {
          this.$message.warning(`第${index + 1}行数量必须为非负数`);
          return false;
        }
      }
      return true;
    },
    async buildTransportPlanImportFile() {
      const XLSX = await import('xlsx');
      const headers = transportPlanImportColumns.map(([label]) => {
        return [
          '计划名称',
          '运输方式',
          '计划开始日期',
          '计划结束日期',
          '货物类型',
          '发货地址',
          '收货地址',
        ].includes(label)
          ? `*${label}`
          : label;
      });
      const values = [
        headers,
        ...this.transportPlanImportRows.map(row =>
          transportPlanImportColumns.map(([, prop]) => String(row[prop] ?? ''))
        ),
      ];
      const workbook = XLSX.utils.book_new();
      XLSX.utils.book_append_sheet(workbook, XLSX.utils.aoa_to_sheet(values), '运输计划导入模板');
      const binary = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' });
      const fileName = (
        this.transportPlanImportSourceFile?.name || '运输计划导入模板.xlsx'
      ).replace(/\.xls$/i, '.xlsx');
      return new File([binary], fileName, {
        type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
      });
    },
    handleTransportPlanTemplate() {
      exportBlob(this.config.transportPlanTemplateUrl, {}, { feedback: true }).then(res => {
        downloadXls(res.data, '运输计划导入模板.xlsx');
      });
    },
    async submitTransportPlanImport() {
      const valid = await this.$refs.transportPlanImportFormRef?.validate().catch(() => false);
      if (!valid || this.transportPlanImportLoading) return;
      if (!this.validateTransportPlanImportRows()) return;
      if (typeof this.api.importTransportPlan !== 'function') {
        this.$message.error('运输计划导入接口不可用');
        return;
      }
      this.transportPlanImportLoading = true;
      try {
        const file = await this.buildTransportPlanImportFile();
        const res = await this.api.importTransportPlan({ ...this.transportPlanImportForm, file });
        const contentType = res.headers?.['content-type'] || res.data?.type || '';
        if (
          contentType.includes('application/vnd.ms-excel') ||
          contentType.includes('spreadsheetml')
        ) {
          downloadXls(
            res.data,
            `运输计划导入失败明细${this.$dayjs().format('YYYY-MM-DD HH:mm:ss')}.xlsx`
          );
          this.$message.warning('部分数据导入失败，已下载失败明细');
        } else {
          const text = await res.data.text();
          const result = text ? JSON.parse(text) : {};
          if (result.code !== 200) throw new Error(result.msg || '导入失败');
          this.$message.success('导入完成');
        }
        this.transportPlanImportBox = false;
        this.onLoad(this.page, this.query);
      } catch (error) {
        this.$message.error(error.message || '导入失败');
      } finally {
        this.transportPlanImportLoading = false;
      }
    },
    handleCopy(row) {
      this.$confirm(`确定复制该${this.config.title}?`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => this.api.copy(row.id))
        .then(() => {
          this.$message.success('复制成功');
          this.onLoad(this.page, this.query);
        });
    },
    handleAction(action, row) {
      const actionName = {
        enable: '启用',
        disable: '停用',
        cancel: '取消',
        complete: '完成',
        reassign: '重新派单',
      }[action];
      this.$confirm(`确定${actionName}该${this.config.title}?`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => this.api[action](row.id))
        .then(() => {
          this.$message.success(`${actionName}成功`);
          this.onLoad(this.page, this.query);
        });
    },
    handleCustomOperation(operation, row) {
      if (operation.action === 'createFromTemplate') {
        this.api.getDetail(row.id).then(res => {
          const template = res.data?.data || row;
          const templateType = template.templateType || template.templateTypeName;
          const target =
            templateType === '运单' ? '/business/waybill-manage' : '/business/transport-plan';
          sessionStorage.setItem(
            'business-template-create',
            JSON.stringify({ target: target.slice('/business/'.length), data: template })
          );
          this.$router.push({ path: target, query: { fromTemplate: Date.now().toString() } });
        });
        return;
      }
      if (operation.action === 'flow') {
        this.handleFlow(row);
        return;
      }
      if (operation.action === 'dispatch') {
        this.openDispatchDialog(row);
        return;
      }
      const run = value => {
        const args = operation.prompt ? [row.id, value] : [row.id];
        this.api[operation.action](...args).then(() => {
          this.$message.success(`${operation.label}成功`);
          this.onLoad(this.page, this.query);
        });
      };
      if (operation.prompt) {
        this.$prompt(operation.prompt, operation.label, {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          inputPattern: /\S+/,
          inputErrorMessage: operation.promptError || '请输入内容',
        }).then(({ value }) => run(value));
        return;
      }
      this.$confirm(operation.confirm || `确定${operation.label}该${this.config.title}?`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => run());
    },
    handleFlow(row, loadedDetail = false) {
      const processInstanceId = row.processInstanceId || row.processInstanceID || row.procInstId;
      if (
        !processInstanceId &&
        !loadedDetail &&
        row.id &&
        typeof this.api.getDetail === 'function'
      ) {
        this.api.getDetail(row.id).then(res => this.handleFlow(res.data.data || {}, true));
        return;
      }
      if (!processInstanceId) {
        this.$message.warning('流程实例为空，无法查看流程');
        return;
      }
      if (this.website.design.designMode) {
        this.processInstanceId = processInstanceId;
      } else {
        this.flowUrl = `/api/blade-flow/process/diagram-view?processInstanceId=${processInstanceId}`;
      }
      this.flowBox = true;
    },
    openDispatchDialog(row) {
      if (!row?.id) {
        this.$message.warning('运输计划数据异常，无法调度');
        return;
      }
      this.dispatchRow = { ...row };
      this.dispatchBox = true;
      this.dispatchLoading = true;
      this.dispatchRows = [];
      const request =
        this.api && typeof this.api.getDetail === 'function'
          ? this.api.getDetail(row.id)
          : Promise.resolve({ data: { data: row } });
      request
        .then(res => {
          const detail = {
            ...row,
            ...(res?.data?.data || {}),
          };
          this.dispatchRow = detail;
          this.dispatchRows = this.buildDispatchRows(detail);
        })
        .finally(() => {
          this.dispatchLoading = false;
        });
    },
    resetDispatchDialog() {
      this.dispatchRow = {};
      this.dispatchRows = [];
      this.dispatchLoading = false;
      this.dispatchSaving = '';
      this.dispatchItemBox = false;
      this.dispatchItemIndex = -1;
      this.dispatchItemForm = defaultDispatchRow();
      this.dispatchItemAttachmentRows = [];
    },
    buildDispatchRows(plan = {}) {
      const goodsRows = this.parseJsonArray(plan.goodsJson);
      const sourceRows = goodsRows.length ? goodsRows : [plan];
      return sourceRows.map((item, index) => this.normalizeDispatchRow(plan, item, index));
    },
    normalizeDispatchRow(plan = {}, item = {}, index = 0) {
      const cargoInfo = this.formatDispatchCargoInfo(plan, item);
      return {
        _key: `${plan.id || 'dispatch'}-${index}-${
          item.id || item.cargoName || item.vehicleNo || 'row'
        }`,
        taskEntryMode: item.taskEntryMode || 'simple',
        transportType: item.transportType || plan.transportType || '',
        carrierType: item.carrierType || plan.carrierType || '承运商',
        carrierName: item.carrierName || plan.carrierName || '',
        driverName: item.driverName || plan.driverName || '',
        driverPhone: item.driverPhone || plan.driverPhone || '',
        vehicleNo: item.vehicleNo || plan.vehicleNo || '',
        trailerVehicleNo: item.trailerVehicleNo || '',
        escortName: item.escortName || '',
        escortPhone: item.escortPhone || '',
        mileage: item.mileage || '',
        cargoType: item.cargoType || item.goodsType || plan.cargoType || '',
        cargoName: item.cargoName || item.goodsName || plan.cargoName || '',
        cargoInfo,
        quantity: item.quantity || item.cargoQuantity || item.goodsQuantity || '',
        quantityUnit: item.quantityUnit || item.goodsQuantityUnit || item.unit || '吨',
        specification: item.specification || item.spec || '',
        model: item.model || '',
        packageType: item.packageType || item.package || '',
        estimatedStartTime: item.estimatedStartTime || plan.planStartDate || '',
        estimatedEndTime: item.estimatedEndTime || plan.planEndDate || '',
        departureAddress: item.departureAddress || plan.departureAddress || '',
        departureName: item.departureName || plan.departureName || '',
        departureContact: item.departureContact || plan.departureContact || '',
        departurePhone: item.departurePhone || plan.departurePhone || '',
        arrivalAddress: item.arrivalAddress || plan.arrivalAddress || '',
        arrivalName: item.arrivalName || plan.arrivalName || '',
        arrivalContact: item.arrivalContact || plan.arrivalContact || '',
        arrivalPhone: item.arrivalPhone || plan.arrivalPhone || '',
        dispatchUserName: item.dispatchUserName || plan.dispatchUserName || '',
        dispatchTime: item.dispatchTime || plan.dispatchTime || '',
        attachmentsJson: item.attachmentsJson || '',
        remark: item.remark || item.taskRemark || plan.remark || '',
      };
    },
    formatDispatchCargoInfo(plan = {}, item = {}) {
      const cargoName = item.cargoName || item.goodsName || plan.cargoName || '';
      const cargoType = item.cargoType || item.goodsType || plan.cargoType || '';
      const quantity = item.quantity || item.cargoQuantity || item.goodsQuantity || '';
      const unit = item.quantityUnit || item.goodsQuantityUnit || item.unit || '';
      const quantityText = quantity ? `${quantity}${unit}` : '';
      return (
        [cargoName, cargoType, quantityText].filter(Boolean).join(' - ') || plan.goodsInfo || ''
      );
    },
    openDispatchItemDialog(index = -1, row = defaultDispatchRow()) {
      const defaultGoods = this.dispatchPlanGoodsRows[0] || {};
      const baseRow = {
        ...defaultDispatchRow(),
        transportType: this.dispatchRow.transportType || '',
        carrierType: this.dispatchRow.carrierType || '承运商',
        carrierName: this.dispatchRow.carrierName || '',
        driverName: this.dispatchRow.driverName || '',
        driverPhone: this.dispatchRow.driverPhone || '',
        vehicleNo: this.dispatchRow.vehicleNo || '',
        cargoName: defaultGoods.cargoName || this.dispatchRow.cargoName || '',
        cargoType: defaultGoods.cargoType || this.dispatchRow.cargoType || '',
        quantity:
          index >= 0
            ? defaultGoods.quantity || ''
            : this.formatDispatchQuantity(this.dispatchSummaryRemainingQuantity),
        quantityUnit: defaultGoods.quantityUnit || '吨',
        specification: defaultGoods.specification || '',
        model: defaultGoods.model || '',
        packageType: defaultGoods.packageType || '',
        departureName: this.dispatchRow.departureName || '',
        departureAddress: this.dispatchRow.departureAddress || '',
        departureContact: this.dispatchRow.departureContact || '',
        departurePhone: this.dispatchRow.departurePhone || '',
        arrivalName: this.dispatchRow.arrivalName || '',
        arrivalAddress: this.dispatchRow.arrivalAddress || '',
        arrivalContact: this.dispatchRow.arrivalContact || '',
        arrivalPhone: this.dispatchRow.arrivalPhone || '',
      };
      this.dispatchItemIndex = index;
      this.dispatchItemForm = {
        ...baseRow,
        ...(index >= 0 ? row : {}),
      };
      this.dispatchItemForm.carrierType = this.dispatchItemForm.carrierType || '承运商';
      this.dispatchItemAttachmentRows = this.parseJsonArray(
        index >= 0 ? row.attachmentsJson : this.dispatchRow.attachmentsJson
      );
      this.dispatchItemBox = true;
    },
    handleDispatchCarrierTypeChange(value) {
      const nextValue = value || '';
      if (nextValue === '承运商') {
        this.dispatchItemForm.trailerVehicleNo = '';
        this.dispatchItemForm.escortName = '';
        this.dispatchItemForm.escortPhone = '';
      } else {
        this.dispatchItemForm.carrierId = '';
        this.dispatchItemForm.carrierName = '';
      }
      this.dispatchItemForm.carrierType = nextValue;
    },
    loadDispatchCarrierOptions() {
      if (this.taskCarrierLoading) return Promise.resolve([]);
      this.taskCarrierLoading = true;
      return getCarrierCustomerList(1, 9999, { customerType: '承运商' })
        .then(res => {
          this.taskCarrierOptions = extractRecords(res);
          return this.taskCarrierOptions;
        })
        .finally(() => {
          this.taskCarrierLoading = false;
        });
    },
    handleDispatchCarrierChange(value) {
      const carrier = this.taskCarrierOptions.find(item =>
        [item.customerName, item.carrierName, item.fullName, item.name].some(
          name => String(name || '') === String(value || '')
        )
      );
      this.dispatchItemForm.carrierId = carrier?.id || '';
      this.dispatchItemForm.carrierName = value || '';
    },
    loadDispatchDriverOptions() {
      if (this.taskDriverLoading) return Promise.resolve([]);
      this.taskDriverLoading = true;
      return getDriverList(1, 9999, {})
        .then(res => {
          this.taskDriverOptions = extractRecords(res);
          return this.taskDriverOptions;
        })
        .finally(() => {
          this.taskDriverLoading = false;
        });
    },
    handleDispatchDriverChange(value) {
      const driver = this.taskDriverOptions.find(item =>
        [item.driverName, item.name].some(name => String(name || '') === String(value || ''))
      );
      this.dispatchItemForm.driverId = driver?.id || '';
      this.dispatchItemForm.driverName = value || '';
      if (driver) {
        this.dispatchItemForm.driverPhone =
          driver.mobile ||
          driver.phone ||
          driver.driverPhone ||
          this.dispatchItemForm.driverPhone ||
          '';
      }
    },
    saveDispatchItem() {
      const nextRow = {
        ...this.dispatchItemForm,
        attachmentsJson: JSON.stringify(this.dispatchItemAttachmentRows),
      };
      const otherDispatchedQuantity = this.dispatchRows.reduce((total, row, index) => {
        if (index === this.dispatchItemIndex) return total;
        return total + this.parseDispatchQuantity(row.quantity);
      }, 0);
      const currentQuantity = this.parseDispatchQuantity(nextRow.quantity);
      const totalQuantity = this.dispatchSummaryTotalQuantity;
      if (totalQuantity > 0 && otherDispatchedQuantity + currentQuantity > totalQuantity) {
        this.$message.warning(
          `已调度数量合计不能超过总数量${this.formatDispatchQuantity(totalQuantity)}${
            this.dispatchSummaryUnit
          }`
        );
        return;
      }
      if (this.dispatchItemIndex >= 0) {
        this.dispatchRows.splice(this.dispatchItemIndex, 1, nextRow);
      } else {
        this.dispatchRows.push(nextRow);
      }
      this.dispatchItemBox = false;
      this.dispatchItemIndex = -1;
      this.dispatchItemForm = defaultDispatchRow();
      this.dispatchItemAttachmentRows = [];
    },
    resetDispatchItemDialog() {
      this.dispatchItemIndex = -1;
      this.dispatchItemForm = defaultDispatchRow();
      this.dispatchItemAttachmentRows = [];
    },
    removeDispatchRow(index) {
      this.$confirm('确定删除该调度明细?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
        this.dispatchRows.splice(index, 1);
      });
    },
    handleDispatchAddRow() {
      if (this.dispatchSummaryRemainingQuantity <= 0) {
        this.$message.warning('剩余数量为0，不能新增调度明细');
        return;
      }
      this.openDispatchItemDialog();
    },
    handleDispatchEditRow(row, index) {
      this.openDispatchItemDialog(index, row);
    },
    buildDispatchPayload(mode) {
      const rows = this.dispatchRows.map(
        ({ _key, cargoInfo, dispatchUserName, dispatchTime, ...rest }) => rest
      );
      return {
        id: this.dispatchRow.id,
        mode,
        waybills: rows.map(row => ({
          ...row,
          taskEntryMode: row.taskEntryMode || 'simple',
          taskRemark: row.remark || '',
          estimatedStartTime: this.formatDispatchDate(row.estimatedStartTime),
          estimatedEndTime: this.formatDispatchDate(row.estimatedEndTime),
          goodsJson: JSON.stringify([
            {
              cargoName: row.cargoName,
              cargoType: row.cargoType,
              quantity: row.quantity,
              quantityUnit: row.quantityUnit,
              specification: row.specification,
              model: row.model,
              packageType: row.packageType,
            },
          ]),
        })),
      };
    },
    formatDispatchDate(value) {
      if (!value) return '';
      const date = this.$dayjs(value);
      return date.isValid() ? date.format('YYYY-MM-DD') : value;
    },
    validateDispatchRows(mode) {
      if (!this.dispatchRows.length) {
        this.$message.warning('请先添加调度明细');
        return false;
      }
      if (mode === 'draft') return true;
      const invalidRow = this.dispatchRows.find(row => {
        const selfTransport = row.carrierType !== '承运商';
        return (
          !row.transportType ||
          !row.cargoName ||
          !row.cargoType ||
          !row.quantity ||
          !row.quantityUnit ||
          !row.carrierType ||
          !row.vehicleNo ||
          !row.departureAddress ||
          !row.arrivalAddress ||
          (row.carrierType === '承运商' && !row.carrierName) ||
          (selfTransport &&
            (!row.driverName ||
              !row.driverPhone ||
              !row.trailerVehicleNo ||
              !row.escortName ||
              !row.escortPhone ||
              !row.mileage))
        );
      });
      if (invalidRow) {
        this.$message.warning('请补全调度明细中的必填信息');
        return false;
      }
      return true;
    },
    handleDispatchSubmit(mode) {
      if (!this.dispatchRow?.id || typeof this.api.dispatch !== 'function') {
        this.$message.warning('运输计划调度接口不可用');
        return;
      }
      if (!this.validateDispatchRows(mode)) {
        return;
      }
      if (mode === 'submit') {
        this.$confirm(
          `请确认调度信息，将生成 <span style="color: #409eff; font-size: 20px; padding: 0 4px;">${this.dispatchRows.length}</span> 条运单，是否继续？`,
          '提示',
          {
            confirmButtonText: '确认',
            cancelButtonText: '取消',
            dangerouslyUseHTMLString: true,
            type: 'warning',
          }
        )
          .then(() => this.submitDispatch(mode))
          .catch(() => {});
        return;
      }
      this.submitDispatch(mode);
    },
    submitDispatch(mode) {
      this.dispatchSaving = mode;
      const shouldCompletePlan = mode === 'submit' && this.dispatchSummaryRemainingQuantity <= 0;
      this.api
        .dispatch(this.buildDispatchPayload(mode))
        .then(() => {
          if (shouldCompletePlan && typeof this.api.complete === 'function') {
            return this.api.complete(this.dispatchRow.id);
          }
          return undefined;
        })
        .then(() => {
          const message =
            mode === 'draft'
              ? '生成草稿成功'
              : shouldCompletePlan
              ? '确认生成成功，运输计划已完成'
              : '确认生成成功';
          this.$message.success(message);
          this.dispatchBox = false;
          this.onLoad(this.page, this.query);
        })
        .finally(() => {
          this.dispatchSaving = '';
        });
    },
    dispatchRowKey(row, index) {
      return row._key || `${index}-${row.vehicleNo || row.cargoInfo || row.dispatchTime || 'row'}`;
    },
    dispatchAttachmentLabel(item) {
      return (
        item?.originalName ||
        item?.name ||
        item?.fileName ||
        item?.attachmentName ||
        item?.title ||
        '附件'
      );
    },
    dispatchAttachmentUrl(item) {
      return item?.url || item?.fileUrl || item?.downloadUrl || '';
    },
    formatDispatchRouteContact(contact = '', phone = '') {
      return [contact, phone].filter(Boolean).join(' - ');
    },
    parseDispatchRoutePoint(row, type) {
      const prefix = type === 'start' ? 'departure' : 'arrival';
      const name = row[`${prefix}Name`] || row[`${prefix}Address`] || '';
      const address = row[`${prefix}Address`] || row[`${prefix}DetailAddress`] || '';
      const contact = this.formatDispatchRouteContact(
        row[`${prefix}Contact`],
        row[`${prefix}Phone`]
      );
      return { name, address, contact };
    },
    handleDispatchConfirm() {
      this.handleDispatchSubmit('submit');
    },
    handleChangeRecordFlow(row) {
      const processInstanceId = row.processInstanceId || row.processInstanceID || row.procInstId;
      if (!processInstanceId) {
        this.$message.warning('该变更记录暂无流程实例');
        return;
      }
      this.handleFlow(row, true);
    },
    handleBatchComplete() {
      if (!this.selectionList.length) {
        this.$message.warning('请选择至少一条数据');
        return;
      }
      this.$confirm('确定完成选中的运单?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => this.api.batchComplete(this.ids))
        .then(res => {
          const result = res.data.data || {};
          this.$message.success(
            `成功完成${result.successCount || 0}条，跳过${result.skippedCount || 0}条`
          );
          this.onLoad(this.page, this.query);
        });
    },
    handleRoadLoading() {
      if (!this.selectionList.length) {
        this.$message.warning('请选择至少一条数据');
        return;
      }
      if (typeof this.api.roadLoading !== 'function') {
        this.$message.warning('公路配载功能暂未配置');
        return;
      }
      this.$confirm('确定对选中的运单进行公路配载?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => this.api.roadLoading(this.ids))
        .then(() => {
          this.$message.success('公路配载成功');
          this.onLoad(this.page, this.query);
        });
    },
  },
};
</script>

<style lang="scss" scoped>
.business-crud-page {
  &__field {
    width: 100%;
  }

  .dialog-section-title {
    display: flex;
    align-items: center;
    width: 100%;
    color: #303133;
    font-size: 15px;
    font-weight: 600;

    &::before {
      display: block;
      width: 4px;
      height: 16px;
      margin-right: 8px;
      background: #409eff;
      content: '';
    }

    &--action {
      justify-content: space-between;
    }
  }

  &__shipping-title,
  &__goods-title {
    min-width: 100%;
  }

  &__goods-title &__section-actions,
  &__shipping-title .el-button {
    margin-left: auto;
  }

  &__section-actions {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
  }

  &__task {
    width: 100%;
  }

  &__task-toolbar {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 16px;
  }

  &__task-form {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 24px;
    row-gap: 16px;
    width: 100%;

    :deep(.el-form-item) {
      min-width: 0;
      margin-bottom: 0;
    }

    :deep(.el-form-item__content) {
      min-width: 0;
    }

    :deep(.el-select),
    :deep(.el-cascader),
    :deep(.el-date-editor.el-input) {
      width: 100%;
    }

    :deep(.el-radio-group) {
      width: 100%;
    }

    :deep(.el-radio-button) {
      flex: 1;
    }

    :deep(.el-radio-button__inner) {
      width: 100%;
    }
  }

  &__task-form--full {
    display: block;
  }

  &__task-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 24px;
    row-gap: 16px;
    margin-bottom: 16px;
    width: 100%;

    &:last-child {
      margin-bottom: 0;
    }

    :deep(.el-form-item) {
      min-width: 0;
      margin-bottom: 0;
    }

    :deep(.el-form-item__content) {
      min-width: 0;
    }

    :deep(.el-select),
    :deep(.el-cascader),
    :deep(.el-date-editor.el-input) {
      width: 100%;
    }
  }

  &__task-span-4 {
    grid-column: 1 / -1;
  }

  &__task-span-1 {
    grid-column: span 1;
  }

  &__task-carrier-type {
    :deep(.el-form-item__content) {
      flex: 0 1 260px;
      max-width: 260px;
    }
  }

  &__task-remark {
    grid-column: span 3;
  }

  &__task-note {
    grid-column: 1 / -1;

    :deep(.el-input) {
      width: 100%;
    }
  }

  &__suffix-select {
    width: 72px;
    margin-right: -8px;

    :deep(.el-select__wrapper),
    :deep(.el-select__wrapper:hover),
    :deep(.el-select__wrapper.is-focused) {
      min-height: 24px;
      padding: 0 4px;
      border: 0;
      box-shadow: none !important;
    }
  }

  &__suffix-select--wide {
    width: 104px;
  }

  &__append-select {
    width: 92px;
    margin-right: -8px;

    :deep(.el-select__wrapper),
    :deep(.el-select__wrapper:hover),
    :deep(.el-select__wrapper.is-focused) {
      min-height: 24px;
      padding: 0 4px;
      border: 0;
      box-shadow: none !important;
    }
  }

  :deep(.business-crud-page__goods-info-cell .cell) {
    overflow: visible;
    line-height: 20px;
    white-space: normal;
    word-break: break-word;
    text-overflow: clip;
  }

  &__route-address-row {
    display: grid;
    grid-template-columns: 260px minmax(280px, 1fr) 40px 58px minmax(160px, 220px) 72px minmax(
        160px,
        220px
      );
    gap: 8px;
    align-items: center;
    width: 100%;

    :deep(.el-input),
    :deep(.el-select),
    :deep(.el-cascader) {
      width: 100%;
    }

    .el-button {
      width: 32px;
      min-width: 32px;
      padding: 0;
    }
  }

  &__dispatch-shipping-form {
    :deep(.el-form-item) {
      margin-bottom: 16px;
    }
  }

  &__dispatch-shipping-form &__route-address-row {
    grid-template-columns: 260px minmax(280px, 1fr) 58px minmax(160px, 220px) 72px minmax(
        160px,
        220px
      );
  }

  &__dispatch-item-attachments {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 20px;
    min-height: 32px;
    padding: 4px 0 16px 12px;
    color: #909399;
    font-size: 14px;
  }

  &__dispatch-carrier-title {
    flex-basis: 100%;
    margin-top: 16px;
  }

  &__dispatch-task-title {
    margin-right: auto;
  }

  &__route-label {
    color: #606266;
    font-size: 14px;
    line-height: 32px;
    text-align: right;
    white-space: nowrap;
  }

  &__cargo-wrap {
    display: block;
    width: 100%;
    min-width: 0;
    overflow-x: auto;
  }

  &__cargo-table {
    width: 100%;
    min-width: 1870px;

    :deep(.el-table__header th) {
      background: #f5f7fa;
      color: #303133;
      font-weight: 600;
    }

    :deep(.el-table__cell) {
      border-color: #eff1f7;
    }

    :deep(.el-input),
    :deep(.el-select),
    :deep(.el-cascader) {
      width: 100%;
    }
  }

  &__cargo-actions {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;

    .el-button {
      margin-left: 0;
    }
  }

  :deep(.business-crud-page__full-form-item) {
    width: 100%;
    max-width: 100%;
  }

  :deep(.business-crud-page__full-form-item .el-form-item) {
    width: 100%;
  }

  :deep(.business-crud-page__full-form-item .el-form-item__label) {
    display: none;
    width: 0 !important;
    padding: 0 !important;
  }

  :deep(.business-crud-page__full-form-item .el-form-item__content) {
    flex: 1 1 100%;
    width: 100%;
    max-width: 100%;
    margin-left: 0 !important;
  }

  :deep(.business-crud-page__full-form-item .el-form-item__content > div) {
    width: 100%;
    min-width: 0;
  }

  &__cargo-total {
    display: flex;
    justify-content: flex-end;
    padding-top: 12px;
    color: #303133;
    font-weight: 600;
  }

  &__dialog-search {
    padding: 12px 12px 4px;
    margin-bottom: 12px;
    border: 1px solid #eff1f7;
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);

    :deep(.el-form-item) {
      margin-bottom: 8px;
    }

    :deep(.el-input),
    :deep(.el-select),
    :deep(.el-cascader) {
      width: 100%;
    }
  }

  &__dialog-search-actions {
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
  }

  &__freight-form {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 24px;
    row-gap: 16px;
    width: 100%;

    :deep(.el-form-item) {
      min-width: 0;
      margin-bottom: 0;
    }

    :deep(.el-form-item__content) {
      min-width: 0;
    }

    :deep(.el-input),
    :deep(.el-select) {
      width: 100%;
    }
  }

  &__dialog-pagination {
    display: flex;
    justify-content: flex-end;
    margin-top: 12px;
  }

  &__map-toolbar {
    display: flex;
    gap: 8px;
    margin-bottom: 12px;

    .el-input {
      flex: 1;
      min-width: 0;
    }
  }

  &__map {
    width: 100%;
    height: 420px;
    border: 1px solid #eff1f7;
  }

  &__map-info {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 10px;
    color: #606266;
    line-height: 1.6;
  }

  &__date-range {
    display: flex;
    align-items: center;
    width: 100%;
    min-width: 0;
  }

  &__date {
    flex: 1;
    min-width: 0;
  }

  &__date-separator {
    flex: 0 0 auto;
    padding: 0 8px;
    color: #303133;
  }

  &__inline-number {
    display: flex;
    align-items: center;
    width: 100%;

    .el-input {
      flex: 1;
      min-width: 0;
    }

    span {
      flex: 0 0 auto;
      margin-left: 8px;
      color: #303133;
    }
  }

  &__billing {
    width: 100%;
  }

  &__billing-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
  }

  &__billing-switch {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #303133;
  }

  &__billing-table {
    width: 100%;

    :deep(.el-table__header th) {
      background: #f5f7fa;
      color: #303133;
      font-weight: 600;
    }

    :deep(.el-table__cell) {
      border-color: #eff1f7;
    }
  }

  &__settlement-rule {
    width: 100%;
  }

  &__settlement-switch {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
    color: #303133;
  }

  &__module-form {
    width: 100%;

    :deep(.el-form-item) {
      margin-bottom: 16px;
    }

    :deep(.el-select),
    :deep(.el-date-editor.el-input) {
      width: 100%;
    }
  }

  &__module-form--three {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 72px;
  }

  &__module-form--two {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 96px;
  }

  &__billing-dialog {
    :deep(.el-dialog__body) {
      padding-top: 28px;
    }

    :deep(.el-dialog__body),
    :deep(.el-form) {
      width: 100%;
    }
  }

  &__dispatch-dialog {
    :deep(.el-dialog__header) {
      display: none;
    }

    :deep(.el-dialog__body) {
      padding: 0;
    }
  }

  &__dispatch-shell {
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - 140px);
  }

  &__dispatch-top {
    padding: 22px 32px 14px;
    border-bottom: 1px solid #e9edf5;
  }

  &__dispatch-heading {
    margin-bottom: 20px;
  }

  &__dispatch-heading-title {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
  }

  &__dispatch-heading-name {
    font-size: 22px;
    font-weight: 600;
    color: #303133;
  }

  &__dispatch-heading-split {
    font-size: 20px;
    color: #606266;
  }

  &__dispatch-heading-no {
    font-size: 15px;
    color: #303133;
  }

  &__dispatch-summary {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(520px, 1fr);
    gap: 32px;
    align-items: start;
  }

  &__dispatch-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 48px;
    row-gap: 18px;
  }

  &__dispatch-summary-item {
    min-width: 0;
  }

  &__dispatch-summary-label {
    margin-bottom: 8px;
    font-size: 14px;
    color: #666;
    font-weight: 500;
  }

  &__dispatch-summary-value {
    min-height: 24px;
    font-size: 15px;
    line-height: 1.45;
    color: #333;
    word-break: break-word;
  }

  &__dispatch-summary-item--attachments {
    grid-column: 1 / -1;
  }

  &__dispatch-attachment-link {
    display: inline-block;
    margin-right: 22px;
    margin-bottom: 6px;
  }

  &__dispatch-route {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 72px minmax(0, 1fr);
    gap: 24px;
    align-items: center;
    justify-items: center;
    min-height: 200px;
  }

  &__dispatch-route-item {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    max-width: 100%;
  }

  &__dispatch-route-badge {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border-radius: 6px;
    color: #fff;
    font-size: 16px;
    font-weight: 600;

    &.is-start {
      background: #2a92ff;
    }

    &.is-end {
      background: #ffb11a;
    }
  }

  &__dispatch-route-body {
    max-width: 340px;
    text-align: center;
  }

  &__dispatch-route-title {
    font-size: 22px;
    line-height: 1.25;
    color: #303133;
    font-weight: 600;
  }

  &__dispatch-route-address {
    margin-top: 12px;
    font-size: 15px;
    line-height: 1.45;
    color: #333;
  }

  &__dispatch-route-contact {
    margin-top: 10px;
    font-size: 15px;
    color: #333;
  }

  &__dispatch-route-line {
    width: 72px;
    height: 4px;
    background: #3b3b3b;
    border-radius: 999px;
  }

  &__dispatch-list {
    padding: 12px 18px 18px;
  }

  &__dispatch-list-head {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    padding: 0 0 12px;
  }

  &__dispatch-list-title {
    font-size: 18px;
    font-weight: 600;
    color: #303133;
  }

  &__dispatch-list-summary {
    margin-left: 8px;
    font-size: 14px;
    color: #3c3c3c;
  }

  &__dispatch-table {
    font-size: 13px;

    :deep(.el-table__header .cell) {
      font-size: 13px;
      font-weight: 600;
    }

    :deep(.cell) {
      white-space: normal;
      line-height: 1.35;
    }
  }

  &__dispatch-actions {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;

    .el-button {
      margin-left: 0;
    }
  }

  &__dispatch-footer {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding-right: 0;
  }

  &__dispatch-item-dialog {
    :deep(.el-dialog__body) {
      padding-top: 20px;
    }
  }

  &__dispatch-item-form {
    width: 100%;
  }

  &__dispatch-unit-select {
    width: 104px;

    :deep(.el-select__wrapper),
    :deep(.el-select__wrapper:hover),
    :deep(.el-select__wrapper.is-focused) {
      width: 104px;
      min-height: 24px;
      padding: 0 8px;
      border: 0;
      box-shadow: none !important;
    }
  }

  &__dispatch-item-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 24px;

    :deep(.el-form-item) {
      margin-bottom: 0;
      min-width: 0;
    }

    &--compact {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
  }

  &__dispatch-item-span-2 {
    grid-column: span 2;
  }

  &__dispatch-item-span-3 {
    grid-column: span 3;
  }

  &__dispatch-item-carrier-type {
    grid-column: 1 / -1;
    width: calc((100% - 72px) / 4);
  }

  &__billing-form-row {
    display: grid;
    grid-template-columns: minmax(360px, 520px) 1fr;
    column-gap: 48px;
    align-items: center;
  }

  &__billing-default {
    margin-bottom: 18px;
  }

  &__billing-rule-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 20px 0 12px;
  }

  &__required-column {
    &::before {
      margin-right: 4px;
      color: #f56c6c;
      content: '*';
    }
  }

  &__billing-tip {
    display: flex;
    max-width: 620px;
    color: #ff6f86;
    line-height: 1.7;

    span {
      position: relative;
      display: inline-flex;
      flex: 0 0 auto;
      align-items: center;
      justify-content: center;
      width: 28px;
      height: 28px;
      margin-right: 12px;
      border-radius: 50%;
      background: #ffd6ea;
      color: #ff4f92;
      font-weight: 600;

      &::after {
        position: absolute;
        right: 6px;
        bottom: -8px;
        width: 0;
        height: 0;
        border: 8px solid transparent;
        border-top-color: #ffd6ea;
        content: '';
      }
    }
  }

  &__billing-rule-wrap {
    width: 100%;
    overflow-x: auto;
  }

  &__billing-rule-table {
    width: 100%;
    min-width: 2230px;

    :deep(.el-table__header th) {
      background: #f5f7fa;
      color: #303133;
      font-weight: 600;
    }

    :deep(.el-table__cell) {
      border-color: #eff1f7;
      vertical-align: top;
    }
  }

  &__limit-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
  }

  &__limit-row {
    display: flex;
    align-items: center;
    gap: 8px;

    .el-input {
      flex: 1;
      min-width: 0;
    }

    .el-button {
      flex: 0 0 auto;
      padding: 0;
    }
  }

  &__dialog-footer {
    display: flex;
    justify-content: center;
    gap: 16px;
  }

  &__match-form {
    padding: 12px 32px 4px;

    .el-select,
    .el-cascader {
      width: 100%;
    }
  }

  &__attachment {
    width: 100%;
  }

  &__attachment-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
  }

  &__attachment-table {
    width: 100%;
    min-width: 1000px;

    :deep(.el-table__header th) {
      background: #f5f7fa;
      color: #303133;
      font-weight: 600;
    }

    :deep(.el-table__cell) {
      border-color: #eff1f7;
    }
  }

  &__change-table {
    width: 100%;

    :deep(.el-table__header th) {
      background: #f5f7fa;
      color: #303133;
      font-weight: 600;
    }

    :deep(.el-table__cell) {
      border-color: #eff1f7;
    }
  }

  &__detail-section {
    margin-bottom: 20px;

    :deep(.el-descriptions__label) {
      width: 140px;
      color: #606266;
      font-weight: 600;
      text-align: right;
    }

    :deep(.el-descriptions__content) {
      min-height: 42px;
      white-space: pre-wrap;
      word-break: break-word;
    }

    :deep(.el-table) {
      border-color: #eff1f7;
    }
  }

  &__transport-plan-import-form {
    padding: 12px 24px 4px;

    .el-select,
    .el-input {
      width: 100%;
    }
  }

  &__import-file-item {
    margin-top: 28px;

    :deep(.el-form-item__content) {
      gap: 16px;
    }
  }

  &__import-file-tip {
    color: #606266;
  }

  &__import-preview {
    margin: 8px 24px 0;
    padding-top: 16px;
    border-top: 1px solid #eff1f7;
  }

  &__import-preview-head {
    display: flex;
    align-items: center;
    gap: 24px;
    margin-bottom: 12px;

    .dialog-section-title {
      margin-bottom: 0;
    }
  }

  &__import-preview-tabs {
    margin-bottom: 12px;
  }

  &__import-preview-table {
    overflow-x: auto;

    :deep(.el-table) {
      min-width: 1550px;
    }

    :deep(.el-table__cell) {
      border-color: #eff1f7;
    }

    :deep(.el-table__row:nth-child(even) td) {
      background: #fafafa;
    }
  }

  @media (max-width: 1280px) {
    &__route-address-row {
      grid-template-columns: 240px minmax(240px, 1fr) 40px 58px minmax(140px, 1fr);
    }

    &__route-address-row &__route-label:nth-of-type(2),
    &__route-address-row .el-input:last-child {
      grid-column: auto;
    }
  }

  @media (max-width: 960px) {
    &__route-address-row {
      grid-template-columns: 1fr;
    }

    &__route-label {
      text-align: left;
    }

    &__dialog-search-actions {
      justify-content: flex-start;
    }
  }
}
</style>
