1、调整配载、总单

2、新增收付款模块
2026-08-22 21:11:48 +08:00
parent 1962bee882
commit 5fcb82c0c0
51 changed files with 11663 additions and 1506 deletions
@@ -131,7 +131,7 @@
          <el-form :model="route" label-position="right" label-width="auto" class="dispatch-form carrier-form">
            <el-row :gutter="16">
              <template v-if="isRoad(route)">
-                <el-col v-if="route.carrierType === '承运商'" :span="6"><el-form-item label="承运商" required><el-select v-model="route.carrierName" filterable remote clearable placeholder="请选择" :remote-method="loadCarrierOptions" :loading="carrierLoading" @visible-change="visible => visible && loadCarrierOptions()"><el-option v-for="item in carrierOptions" :key="carrierOptionKey(item)" :label="carrierOptionLabel(item)" :value="carrierOptionLabel(item)" /></el-select></el-form-item></el-col>
+                <el-col v-if="route.carrierType !== '自运'" :span="6"><el-form-item label="承运商" required><el-select v-model="route.carrierContractId" filterable clearable placeholder="请选择" :loading="carrierLoading" @change="value => handleCarrierContractChange(route, value)"><el-option v-for="item in carrierOptions" :key="item.contractId" :label="item.carrierName" :value="item.contractId" /></el-select></el-form-item></el-col>
                <el-col :span="6"><el-form-item label="司机" :required="route.carrierType !== '承运商'"><el-autocomplete :ref="element => setDriverInput(route.segmentNo, element)" v-model="route.driverName" :debounce="300" :fetch-suggestions="fetchDriverSuggestions" clearable placeholder="请输入司机" :loading="driverLoading" @select="item => handleDriverSuggestionSelect(route, item)" /></el-form-item></el-col>
                <el-col :span="6"><el-form-item :label="route.carrierType === '承运商' ? '手机号' : '司机手机号'" :required="route.carrierType !== '承运商'"><el-input v-model="route.driverPhone" placeholder="请输入" /></el-form-item></el-col>
                <el-col :span="6"><el-form-item label="车牌号" required><el-input v-model="route.vehicleNo" placeholder="请输入" /></el-form-item></el-col>
@@ -140,7 +140,7 @@
                <el-col v-if="route.carrierType !== '承运商'" :span="6"><el-form-item label="押运人手机号" required><el-input v-model="route.escortPhone" placeholder="请输入" /></el-form-item></el-col>
              </template>
              <template v-else>
-                <el-col v-if="route.carrierType === '承运商'" :span="6"><el-form-item label="承运商" required><el-select v-model="route.carrierName" filterable remote clearable placeholder="请选择" :remote-method="loadCarrierOptions" :loading="carrierLoading" @visible-change="visible => visible && loadCarrierOptions()"><el-option v-for="item in carrierOptions" :key="carrierOptionKey(item)" :label="carrierOptionLabel(item)" :value="carrierOptionLabel(item)" /></el-select></el-form-item></el-col>
+                <el-col v-if="route.carrierType !== '自运'" :span="6"><el-form-item label="承运商" required><el-select v-model="route.carrierContractId" filterable clearable placeholder="请选择" :loading="carrierLoading" @change="value => handleCarrierContractChange(route, value)"><el-option v-for="item in carrierOptions" :key="item.contractId" :label="item.carrierName" :value="item.contractId" /></el-select></el-form-item></el-col>
                <el-col :span="6"><el-form-item label="船/航/班列号" required><el-input v-model="route.vehicleNo" placeholder="请输入" /></el-form-item></el-col>
                <el-col :span="6"><el-form-item label="船长" required><el-input v-model="route.captainName" placeholder="请输入" /></el-form-item></el-col>
                <el-col :span="6"><el-form-item label="联系电话" required><el-input v-model="route.driverPhone" placeholder="请输入" /></el-form-item></el-col>
@@ -180,7 +180,6 @@

 <script>
 import * as api from '@/api/business/master-order';
-import { getList as getCustomerList } from '@/api/vehicle/customer-archive';
 import { getList as getDriverList } from '@/api/transportCapacity/driver';
 import { isMobile } from '@/utils/validate';

@@ -251,6 +250,7 @@ export default {
        selected: false,
        documentType: '运单',
        carrierType: '承运商',
+        carrierContractId: '',
        currency: 'CNY',
        otherFeeTotal: '',
        freightItems: [],
@@ -514,28 +514,29 @@ export default {
        route.trailerVehicleNo = '';
        route.escortName = '';
        route.escortPhone = '';
-      } else {
+      }
+      if (value === '自运') {
+        route.carrierContractId = '';
        route.carrierName = '';
      }
    },
-    carrierOptionLabel(item) { return item.customerName || item.carrierName || item.fullName || item.name || ''; },
-    carrierOptionKey(item) { return item.id || item.customerId || item.carrierId || this.carrierOptionLabel(item); },
+    handleCarrierContractChange(route, contractId) {
+      const contract = this.carrierOptions.find(
+        item => String(item.contractId) === String(contractId)
+      );
+      route.carrierContractId = contract?.contractId || '';
+      route.carrierName = contract?.carrierName || '';
+    },
    driverOptionLabel(item) { return item.driverName || item.name || ''; },
    driverOptionKey(item) { return item.id || item.driverId || this.driverOptionLabel(item) || item.mobile; },
    handleDriverChange(route, value) {
      const driver = this.driverOptions.find(item => this.driverOptionLabel(item) === value);
      if (driver) route.driverPhone = driver.mobile || driver.driverPhone || driver.phone || '';
    },
-    async loadCarrierOptions(keyword = '') {
+    async loadCarrierOptions() {
      this.carrierLoading = true;
      try {
-        this.carrierOptions = unwrapRecords(
-          await getCustomerList(1, 20, {
-            customerName: keyword,
-            customerType: '承运商',
-            status: 1,
-          })
-        );
+        this.carrierOptions = unwrapRecords(await api.getCarriers(this.id));
      } finally {
        this.carrierLoading = false;
      }
@@ -593,9 +594,9 @@ export default {
      if (!this.validateRoutePhones(route)) return;
      if (route.documentType === '运单') {
        if (this.isRoad(route)) {
-          if (route.carrierType === '承运商' && (!route.carrierName || !route.vehicleNo)) return this.$message.warning('请填写承运商和车牌号');
+          if (route.carrierType !== '自运' && (!route.carrierContractId || !route.carrierName || !route.vehicleNo)) return this.$message.warning('请选择承运商并填写车牌号');
          if (route.carrierType !== '承运商' && (!route.driverName || !route.driverPhone || !route.vehicleNo || !route.trailerVehicleNo || !route.escortName || !route.escortPhone)) return this.$message.warning('请补全自运或网货平台的车辆与人员信息');
-        } else if (!route.vehicleNo || !route.captainName || !route.driverPhone || !route.containerNo || !route.cabinNo || (route.carrierType === '承运商' && !route.carrierName)) {
+        } else if (!route.vehicleNo || !route.captainName || !route.driverPhone || !route.containerNo || !route.cabinNo || (route.carrierType !== '自运' && (!route.carrierContractId || !route.carrierName))) {
          return this.$message.warning('请补全非公路运输的承运信息');
        }
      }
@@ -604,7 +605,7 @@ export default {
        id: `${route.segmentNo}-${item.cargoName}-${Date.now()}-${Math.random()}`,
        batchNo,
        segmentNo: route.segmentNo, relationNo: route.segmentNo, documentType: route.documentType, transportType: route.transportType, carrierType: route.carrierType,
-        carrierName: route.carrierName, driverName: route.driverName, driverPhone: route.driverPhone, vehicleNo: route.vehicleNo, captainName: route.captainName, cabinNo: route.cabinNo, containerNo: route.containerNo, trailerVehicleNo: route.trailerVehicleNo, escortName: route.escortName, escortPhone: route.escortPhone, mileage: this.normalizeMileage(route.mileage), unitPrice: this.freightItemsForGoods(route, item).unitPrice || '', priceUnit: this.freightItemsForGoods(route, item).priceUnit || '', currency: route.currency || 'CNY', freightAmount: this.freightAmount(this.freightItemsForGoods(route, item)), freightTotal: this.freightTotal(route), otherFeeTotal: route.otherFeeTotal || '', freightJson: this.buildFreightJson(route), remark: route.remark,
+        carrierContractId: route.carrierContractId, carrierName: route.carrierName, driverName: route.driverName, driverPhone: route.driverPhone, vehicleNo: route.vehicleNo, captainName: route.captainName, cabinNo: route.cabinNo, containerNo: route.containerNo, trailerVehicleNo: route.trailerVehicleNo, escortName: route.escortName, escortPhone: route.escortPhone, mileage: this.normalizeMileage(route.mileage), unitPrice: this.freightItemsForGoods(route, item).unitPrice || '', priceUnit: this.freightItemsForGoods(route, item).priceUnit || '', currency: route.currency || 'CNY', freightAmount: this.freightAmount(this.freightItemsForGoods(route, item)), freightTotal: this.freightTotal(route), otherFeeTotal: route.otherFeeTotal || '', freightJson: this.buildFreightJson(route), remark: route.remark,
        departureName: route.departureName, departureAddress: route.departureAddress, departureContact: route.departureContact, departurePhone: route.departurePhone,
        arrivalName: route.arrivalName, arrivalAddress: route.arrivalAddress, arrivalContact: route.arrivalContact, arrivalPhone: route.arrivalPhone,
        estimatedStartTime: route.estimatedStartTime, estimatedEndTime: route.estimatedEndTime,
@@ -853,6 +853,10 @@ export default {
      }
      return String(value).replace('T', ' ').slice(0, 10);
    },
+    normalizeDateTimeValue(value, endOfDay = false) {
+      const date = this.normalizeDateValue(value);
+      return date ? `${date} ${endOfDay ? '23:59:59' : '00:00:00'}` : '';
+    },
    getRegionDisplay(target, fallback) {
      const labels = this.regionLabels(this.addressRegionPaths[target] || []);
      return labels.length ? labels.join('/') : fallback;
@@ -1689,8 +1693,8 @@ export default {
      }
      const payload = {
        ...this.form,
-        planStartTime: this.normalizeDateValue(this.form.planStartTime),
-        planEndTime: this.normalizeDateValue(this.form.planEndTime),
+        planStartTime: this.normalizeDateTimeValue(this.form.planStartTime),
+        planEndTime: this.normalizeDateTimeValue(this.form.planEndTime, true),
        attachmentsJson: JSON.stringify(this.attachmentRows),
        routes: [
          ...this.form.routes.map((route, index) => ({ ...route, segmentNo: `段${index + 1}` })),
@@ -822,23 +822,26 @@
            />
          </div>
          <div class="loading-manage-dialog__grid loading-manage-dialog__task-grid">
-            <el-form-item v-if="!['自运', '网货平台'].includes(dialogForm.carrierType)" label="承运商" required>
+            <el-form-item
+              v-if="dialogForm.carrierType !== '自运'"
+              label="承运商"
+              required
+            >
              <el-select
-                v-model="dialogForm.carrierName"
+                v-model="dialogForm.carrierContractId"
                clearable
                filterable
-                remote
-                reserve-keyword
-                :remote-method="loadCarrierOptions"
-                :loading="carrierLoading"
-                placeholder="请输入"
-                @visible-change="visible => visible && loadCarrierOptions(dialogForm.carrierName)"
+                :disabled="dialogReadonly || !selectedWaybillRows.length"
+                :loading="taskCarrierLoading"
+                :placeholder="taskCarrierPlaceholder"
+                @change="handleTaskCarrierChange"
+                @visible-change="visible => visible && loadTaskCarrierOptions()"
              >
                <el-option
-                  v-for="item in carrierOptions"
-                  :key="item.id || item.fullName || item.customerName || item.carrierName"
-                  :label="item.fullName || item.customerName || item.carrierName || item.name"
-                  :value="item.fullName || item.customerName || item.carrierName || item.name"
+                  v-for="item in taskCarrierOptions"
+                  :key="item.id"
+                  :label="item.carrierName"
+                  :value="item.id"
                />
              </el-select>
            </el-form-item>
@@ -1054,6 +1057,7 @@ const createDialogForm = () => ({
  driverPhone: '',
  carrierType: '承运商',
  carrierName: '',
+  carrierContractId: '',
  escortName: '',
  escortPhone: '',
  departureAddress: '',
@@ -1165,13 +1169,16 @@ export default {
      cargoTypeOptions: [],
      driverOptions: [],
      carrierOptions: [],
+      taskCarrierOptions: [],
      planOptions: [],
      projectLoading: false,
      customerLoading: false,
      cargoTypeLoading: false,
      driverLoading: false,
      carrierLoading: false,
+      taskCarrierLoading: false,
      planLoading: false,
+      taskCarrierRequestId: 0,
      carrierTypeOptions,
      statusOptions: loadingStatusOptions,
      dataSourceOptions: loadingManageConfig.dataSourceOptions,
@@ -1199,6 +1206,11 @@ export default {
    dialogReadonly() {
      return this.dialogMode === 'view';
    },
+    taskCarrierPlaceholder() {
+      if (!this.selectedWaybillRows.length) return '请先选择运单';
+      if (!this.taskCarrierLoading && !this.taskCarrierOptions.length) return '暂无可用承运商合同';
+      return '请选择';
+    },
    dialogTitle() {
      const titleMap = {
        add: '新建配载',
@@ -1567,6 +1579,10 @@ export default {
            this.dialogForm.waybillIdsJson,
            this.dialogForm.loadingSubNos
          );
+          if (this.dialogForm.carrierType === '自运') {
+            this.dialogForm.carrierContractId = '';
+            this.dialogForm.carrierName = '';
+          }
          this.syncProcessProjectOptions();
          this.restoreRouteAndCargo();
          this.restoreRouteChangeRecords();
@@ -1604,6 +1620,9 @@ export default {
      this.candidateRows = [];
      this.candidateSelection = [];
      this.selectedWaybillRows = [];
+      this.taskCarrierRequestId += 1;
+      this.taskCarrierOptions = [];
+      this.taskCarrierLoading = false;
      this.routeNodes = [];
      this.cargoRows = [];
      this.candidatePage.currentPage = 1;
@@ -1855,10 +1874,12 @@ export default {
        );
        this.selectedWaybillRows = rows.filter(Boolean);
        this.rebuildSummaryFromWaybills(false);
+        await this.loadTaskCarrierOptions();
        return;
      }
      this.selectedWaybillRows = this.splitText(loadingSubNos).map(waybillNo => ({ waybillNo }));
      this.rebuildSummaryFromWaybills(false);
+      await this.loadTaskCarrierOptions();
    },
    async loadCandidateWaybills() {
      this.candidateLoading = true;
@@ -1933,6 +1954,7 @@ export default {
        });
        this.selectedWaybillRows = nextRows;
        this.rebuildSummaryFromWaybills();
+        await this.loadTaskCarrierOptions();
        this.$refs.candidateTableRef?.clearSelection?.();
        this.candidateSelection = [];
      } finally {
@@ -1942,6 +1964,7 @@ export default {
    removeSelectedWaybill(index) {
      this.selectedWaybillRows.splice(index, 1);
      this.rebuildSummaryFromWaybills();
+      this.loadTaskCarrierOptions();
    },
    rebuildSummaryFromWaybills(rebuildRoute = true) {
      const rows = this.selectedWaybillRows;
@@ -2071,6 +2094,10 @@ export default {
    normalizePayload() {
      this.syncRouteAddressFields();
      this.rebuildSummaryFromWaybills(false);
+      if (this.dialogForm.carrierType === '自运') {
+        this.dialogForm.carrierContractId = '';
+        this.dialogForm.carrierName = '';
+      }
      return {
        ...this.dialogForm,
        routeJson: JSON.stringify(this.routeNodes),
@@ -2130,14 +2157,15 @@ export default {
        ElMessage.warning('请输入车牌号');
        return false;
      }
+      if (this.dialogForm.carrierType !== '自运' && !this.dialogForm.carrierContractId) {
+        ElMessage.warning('请选择承运商合同');
+        return false;
+      }
      if (['自运', '网货平台'].includes(this.dialogForm.carrierType)) {
        if (!this.dialogForm.driverName || !this.dialogForm.driverPhone) {
          ElMessage.warning('请输入司机和司机手机号');
          return false;
        }
-      } else if (!this.dialogForm.carrierName) {
-        ElMessage.warning('请选择承运商');
-        return false;
      }
      return true;
    },
@@ -2217,9 +2245,14 @@ export default {
          const ids = this.selectionRows.map(row => row.id).join(',');
          const res = await loadingApi.batchComplete(ids);
          const result = res.data?.data || {};
-          ElMessage.success(
-            `批量完成成功 ${result.successCount || 0} 条，跳过 ${result.skippedCount || 0} 条`
-          );
+          const summary = `批量完成成功 ${result.successCount || 0} 条，跳过 ${
+            result.skippedCount || 0
+          } 条`;
+          if (result.skippedCount && result.skippedReasons?.length) {
+            ElMessage.warning(`${summary}；${result.skippedReasons.join('；')}`);
+          } else {
+            ElMessage.success(summary);
+          }
          this.loadTable();
        })
        .catch(() => {});
@@ -2245,10 +2278,17 @@ export default {
        this.dialogForm.trailerVehicleNo = '';
        this.dialogForm.escortName = '';
        this.dialogForm.escortPhone = '';
-      } else if (['自运', '网货平台'].includes(this.dialogForm.carrierType)) {
+      }
+      if (this.dialogForm.carrierType === '自运') {
+        this.dialogForm.carrierContractId = '';
        this.dialogForm.carrierName = '';
      }
    },
+    handleTaskCarrierChange(contractId) {
+      const contract = this.taskCarrierOptions.find(item => String(item.id) === String(contractId));
+      this.dialogForm.carrierContractId = contract?.id || '';
+      this.dialogForm.carrierName = contract?.carrierName || '';
+    },
    handleDriverChange(value) {
      const driver = this.driverOptions.find(item => (item.driverName || item.name) === value);
      if (driver && !this.dialogForm.driverPhone) {
@@ -2343,6 +2383,46 @@ export default {
        this.carrierLoading = false;
      }
    },
+    async loadTaskCarrierOptions() {
+      const requestId = ++this.taskCarrierRequestId;
+      if (!this.selectedWaybillRows.length) {
+        this.taskCarrierOptions = [];
+        this.taskCarrierLoading = false;
+        this.dialogForm.carrierContractId = '';
+        this.dialogForm.carrierName = '';
+        return [];
+      }
+      this.taskCarrierLoading = true;
+      try {
+        const response = await loadingApi.getCarrierContracts();
+        if (requestId !== this.taskCarrierRequestId) return [];
+        const contracts = response.data?.data || response.data || [];
+        this.taskCarrierOptions = contracts;
+        const current =
+          contracts.find(
+            item => String(item.id) === String(this.dialogForm.carrierContractId)
+          ) ||
+          contracts.find(
+            item => item.carrierName === this.dialogForm.carrierName
+          );
+        if (current) {
+          this.dialogForm.carrierContractId = current.id;
+          this.dialogForm.carrierName = current.carrierName;
+        } else {
+          this.dialogForm.carrierContractId = '';
+          this.dialogForm.carrierName = '';
+        }
+        return contracts;
+      } catch (error) {
+        if (requestId !== this.taskCarrierRequestId) return [];
+        this.taskCarrierOptions = [];
+        this.dialogForm.carrierContractId = '';
+        this.dialogForm.carrierName = '';
+        return [];
+      } finally {
+        if (requestId === this.taskCarrierRequestId) this.taskCarrierLoading = false;
+      }
+    },
    async loadPlanOptions(keyword = '') {
      this.planLoading = true;
      try {
@@ -1,20 +1,669 @@
 <template>
-  <business-crud-page :api="api" :config="config" :crud-option="option" :menu-width="320" />
+  <basic-container class="temporary-credit-limit-page">
+    <avue-crud
+      ref="crud"
+      v-model="form"
+      v-model:page="page"
+      :data="data"
+      :option="tableOption"
+      :permission="permissionList"
+      :table-loading="loading"
+      :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 v-if="canCreate" type="primary" icon="el-icon-plus" @click="$refs.crud.rowAdd()">
+          新增
+        </el-button>
+        <el-button
+          v-if="config.exportUrl && hasPermission(`${config.permission}_export`)"
+          type="primary"
+          icon="el-icon-download"
+          plain
+          @click="handleExport"
+        >
+          批量导出
+        </el-button>
+        <el-button
+          v-if="hasPermission(`${config.permission}_delete`)"
+          type="danger"
+          icon="el-icon-delete"
+          plain
+          @click="handleDelete"
+        >
+          批量删除
+        </el-button>
+      </template>
+
+      <template #approvalStatus="{ row }">
+        <el-tag :type="statusTagType(row.approvalStatus)">
+          {{ displayStatus(row, 'approvalStatus') }}
+        </el-tag>
+      </template>
+
+      <template #projectName-form>
+        <el-select
+          v-model="selectedProjectId"
+          class="temporary-credit-limit-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 #applyLimit-form>
+        <el-input
+          v-model="form.applyLimit"
+          class="temporary-credit-limit-page__field"
+          placeholder="请输入申请临时额度"
+          :disabled="dialogReadonly"
+          @input="handleAmountInput"
+        />
+      </template>
+
+      <template #attachmentsJson-form>
+        <div class="temporary-credit-limit-page__attachment">
+          <div class="temporary-credit-limit-page__attachment-head">
+            <vehicle-attachment-upload
+              v-model="attachmentRows"
+              :readonly="dialogReadonly"
+              :file-types="attachmentFileTypes"
+              :max-size="50"
+              :show-file-list="false"
+              button-text="上传附件"
+              @change="handleAttachmentChange"
+            />
+            <el-button type="primary" :disabled="!attachmentRows.length" @click="batchDownload">
+              批量下载
+            </el-button>
+          </div>
+          <el-table :data="attachmentRows" border @selection-change="selectedAttachments = $event">
+            <el-table-column type="selection" width="55" align="center" />
+            <el-table-column type="index" label="序号" width="70" align="center" />
+            <el-table-column label="文件名" min-width="240" show-overflow-tooltip>
+              <template #default="{ row }">
+                <el-link type="primary" @click="downloadAttachment(row)">
+                  {{ attachmentName(row) }}
+                </el-link>
+              </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="180" align="center" />
+            <el-table-column label="操作" width="100" align="center" fixed="right">
+              <template #default="{ row, $index }">
+                <el-link v-if="!dialogReadonly" type="danger" @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 #menu-form-before>
+        <el-button
+          v-if="!dialogReadonly"
+          type="primary"
+          plain
+          :loading="draftLoading"
+          @click="saveDraft"
+        >
+          保存
+        </el-button>
+      </template>
+
+      <template #menu="{ row }">
+        <el-link
+          v-if="hasPermission(`${config.permission}_view`)"
+          type="primary"
+          @click="$refs.crud.rowView(row)"
+        >
+          查看
+        </el-link>
+        <el-link v-if="canEdit(row)" type="primary" @click="$refs.crud.rowEdit(row)">
+          编辑
+        </el-link>
+        <el-link
+          v-for="operation in customOperations(row)"
+          :key="operation.action"
+          :type="operation.type || 'primary'"
+          @click="handleOperation(operation, row)"
+        >
+          {{ operation.label }}
+        </el-link>
+        <el-link v-if="canDelete(row)" type="danger" @click="rowDel(row)">删除</el-link>
+      </template>
+    </avue-crud>
+
+    <empty-pagination
+      :page="page"
+      @size-change="sizeChange"
+      @current-change="currentChange"
+      @load="onLoad(page, query)"
+    />
+
+    <flow-design-step
+      v-if="website.design.designMode"
+      v-model:is-display="flowBox"
+      :process-instance-id="processInstanceId"
+    />
+    <el-dialog v-else v-model="flowBox" title="流程图" append-to-body fullscreen>
+      <iframe class="temporary-credit-limit-page__flow" :src="flowUrl" />
+      <template #footer><el-button @click="flowBox = false">关闭</el-button></template>
+    </el-dialog>
+  </basic-container>
 </template>

 <script>
-import BusinessCrudPage from './components/business-crud-page.vue';
+import { exportBlob } from '@/api/common';
 import * as api from '@/api/business/temporary-credit-limit';
+import {
+  getDetail as getProjectDetail,
+  getList as getProjectList,
+} from '@/api/business/project-apply';
 import { config, option } from '@/option/business/temporary-credit-limit';
+import { getToken } from '@/utils/auth';
+import { downloadFileByUrl, downloadXls } from '@/utils/util';
+import { mapGetters } from 'vuex';
+import NProgress from 'nprogress';
+import 'nprogress/nprogress.css';
+
+const attachmentFileTypes = [
+  'pdf',
+  'bmp',
+  'jpeg',
+  'png',
+  'jpg',
+  'doc',
+  'docx',
+  'ppt',
+  'pptx',
+  'xlsx',
+  'xls',
+  'eml',
+  'msg',
+  'zip',
+];
+
+const extractRecords = res => {
+  const data = res?.data?.data || res?.data || {};
+  return Array.isArray(data) ? data : data.records || [];
+};

 export default {
-  components: { BusinessCrudPage },
+  name: 'TemporaryCreditLimit',
  data() {
    return {
      api,
      config,
-      option,
+      form: {},
+      data: [],
+      query: {},
+      loading: true,
+      draftLoading: false,
+      dialogReadonly: false,
+      tableOption: this.buildTableOption(),
+      page: {
+        currentPage: 1,
+        pageSize: 10,
+        pageSizes: [10, 20, 50, 100],
+        total: 0,
+      },
+      selectionList: [],
+      selectedProjectId: '',
+      projectOptions: [],
+      projectLoading: false,
+      attachmentRows: [],
+      selectedAttachments: [],
+      attachmentFileTypes,
+      flowBox: false,
+      flowUrl: '',
+      processInstanceId: '',
    };
  },
+  computed: {
+    ...mapGetters(['permission', 'userInfo']),
+    permissionList() {
+      return { addBtn: this.canCreate };
+    },
+    isAdmin() {
+      const authority = this.userInfo?.authority;
+      return Array.isArray(authority)
+        ? authority.includes('admin')
+        : String(authority || '').includes('admin');
+    },
+    canCreate() {
+      return this.hasPermission(`${this.config.permission}_add`);
+    },
+    ids() {
+      return this.selectionList.map(item => item.id).join(',');
+    },
+  },
+  created() {
+    this.loadProjectOptions();
+  },
+  methods: {
+    buildTableOption() {
+      return {
+        ...option,
+        addBtn: false,
+        viewBtn: false,
+        editBtn: false,
+        delBtn: false,
+        menuWidth: 320,
+        column: (option.column || []).map(column => ({ ...column })),
+      };
+    },
+    hasPermission(code) {
+      return this.isAdmin || this.validData(this.permission?.[code], false);
+    },
+    statusValue(row) {
+      return row[this.config.statusProp || 'status'];
+    },
+    statusTagType(status) {
+      if (['approved', 'change_approved'].includes(status)) return 'success';
+      if (['draft', 'withdrawn'].includes(status)) return 'info';
+      if (['rejected', 'change_rejected'].includes(status)) return 'danger';
+      return 'warning';
+    },
+    displayStatus(row, prop) {
+      const textProp = prop === this.config.statusProp ? this.config.statusTextProp : '';
+      if (textProp && row[textProp]) return row[textProp];
+      const column = this.findColumn(this.tableOption.column, prop);
+      const item = column?.dicData?.find(dic => String(dic.value) === String(row[prop]));
+      return item?.label || row[prop] || '未知';
+    },
+    canEdit(row) {
+      return (
+        this.hasPermission(`${this.config.permission}_edit`) &&
+        !row.readonly &&
+        (this.config.editStatus || []).includes(this.statusValue(row))
+      );
+    },
+    canDelete(row) {
+      return (
+        this.hasPermission(`${this.config.permission}_delete`) &&
+        !row.readonly &&
+        (this.config.deleteStatus || []).includes(this.statusValue(row))
+      );
+    },
+    customOperations(row) {
+      return (this.config.operations || []).filter(operation => {
+        const permission = operation.permission || `${this.config.permission}_${operation.action}`;
+        const statusProp = operation.statusProp || this.config.statusProp || 'status';
+        return (
+          this.hasPermission(permission) &&
+          !row.readonly &&
+          (!operation.status?.length || operation.status.includes(row[statusProp]))
+        );
+      });
+    },
+    onLoad(page, params = {}) {
+      this.loading = true;
+      this.api
+        .getList(page.currentPage, page.pageSize, { ...params, ...this.query })
+        .then(res => {
+          const result = res.data?.data || {};
+          this.page.total = result.total || 0;
+          this.data = result.records || [];
+          this.selectionClear();
+        })
+        .finally(() => {
+          this.loading = false;
+        });
+    },
+    searchChange(params, done) {
+      this.query = { ...params };
+      this.page.currentPage = 1;
+      this.onLoad(this.page);
+      done();
+    },
+    searchReset() {
+      this.query = {};
+      this.page.currentPage = 1;
+      this.onLoad(this.page);
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      this.$refs.crud?.toggleSelection();
+    },
+    currentChange(currentPage) {
+      this.page.currentPage = currentPage;
+    },
+    sizeChange(pageSize) {
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
+    beforeOpen(done, type) {
+      this.dialogReadonly = type === 'view';
+      if (type === 'add') {
+        this.form = { ...(this.config.defaultForm || {}) };
+        this.selectedProjectId = '';
+        this.attachmentRows = [];
+        this.selectedAttachments = [];
+        done();
+        return;
+      }
+      this.api
+        .getDetail(this.form.id)
+        .then(res => this.applyDetail(res.data?.data || {}))
+        .finally(done);
+    },
+    applyDetail(detail) {
+      this.form = { ...detail };
+      this.selectedProjectId = detail.projectId || '';
+      this.attachmentRows = this.parseJsonArray(detail.attachmentsJson);
+      this.selectedAttachments = [];
+      this.syncCurrentProjectOption();
+    },
+    normalizeForm(row = this.form) {
+      return {
+        ...row,
+        applyLimit: row.applyLimit === '' ? '' : Number(row.applyLimit),
+        attachmentsJson: JSON.stringify(this.attachmentRows),
+      };
+    },
+    rowSave(row, done, loading) {
+      this.api
+        .submit(this.normalizeForm(row))
+        .then(() => {
+          this.$message.success('新增成功');
+          done();
+          this.onLoad(this.page, this.query);
+        })
+        .catch(() => loading());
+    },
+    rowUpdate(row, index, done, loading) {
+      this.api
+        .submit(this.normalizeForm(row))
+        .then(() => {
+          this.$message.success('修改成功');
+          done();
+          this.onLoad(this.page, this.query);
+        })
+        .catch(() => loading());
+    },
+    saveDraft() {
+      if (this.draftLoading) return;
+      this.draftLoading = true;
+      this.api
+        .saveDraft(this.normalizeForm())
+        .then(() => {
+          this.$message.success('保存成功');
+          this.$refs.crud?.closeDialog();
+          this.onLoad(this.page, this.query);
+        })
+        .finally(() => {
+          this.draftLoading = false;
+        });
+    },
+    rowDel(row) {
+      this.removeRows([row]);
+    },
+    handleDelete() {
+      if (!this.selectionList.length) {
+        this.$message.warning('请选择至少一条数据');
+        return;
+      }
+      const rows = this.selectionList.filter(this.canDelete);
+      if (!rows.length) {
+        this.$message.warning('所选数据当前状态不可删除');
+        return;
+      }
+      this.removeRows(rows);
+    },
+    removeRows(rows) {
+      this.$confirm('确定将选择数据删除?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => this.api.remove(rows.map(row => row.id).join(',')))
+        .then(() => {
+          this.$message.success('删除成功');
+          this.onLoad(this.page, this.query);
+        });
+    },
+    handleOperation(operation, row) {
+      if (operation.action === 'flow') {
+        this.openFlow(row);
+        return;
+      }
+      this.$confirm(`确定${operation.label}该${this.config.title}?`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => this.api[operation.action](row.id))
+        .then(() => {
+          this.$message.success(`${operation.label}成功`);
+          this.onLoad(this.page, this.query);
+        });
+    },
+    openFlow(row, loaded = false) {
+      const processInstanceId = row.processInstanceId || row.processInstanceID || row.procInstId;
+      if (!processInstanceId && !loaded && row.id) {
+        this.api.getDetail(row.id).then(res => this.openFlow(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;
+    },
+    loadProjectOptions() {
+      if (this.projectLoading) return;
+      this.projectLoading = true;
+      getProjectList(1, 9999, this.config.projectQueryParams || {})
+        .then(res => {
+          this.projectOptions = extractRecords(res);
+          this.syncCurrentProjectOption();
+        })
+        .finally(() => {
+          this.projectLoading = false;
+        });
+    },
+    syncCurrentProjectOption() {
+      if (!this.form.projectId || !this.form.projectName) return;
+      if (this.projectOptions.some(item => String(item.id) === String(this.form.projectId))) return;
+      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) {
+        Object.assign(this.form, {
+          projectId: '',
+          projectName: '',
+          projectCode: '',
+          undertakeDeptName: '',
+          projectFundLimit: '',
+          usedFundLimit: 0,
+          remainingFundLimit: 0,
+        });
+        return;
+      }
+      Object.assign(this.form, {
+        projectId: project.id,
+        projectName: project.projectName || '',
+        projectCode: project.projectCode || '',
+        undertakeDeptName: project.undertakeDeptName || '',
+        projectFundLimit: project.fundLimit || project.projectFundLimit || 0,
+        usedFundLimit: project.usedFundLimit || 0,
+      });
+      this.form.remainingFundLimit = this.calculateRemainingFundLimit();
+      getProjectDetail(project.id).then(res => {
+        const detail = res.data?.data || {};
+        Object.assign(this.form, {
+          projectCode: detail.projectCode || this.form.projectCode,
+          undertakeDeptName: detail.undertakeDeptName || this.form.undertakeDeptName,
+          projectFundLimit:
+            detail.fundLimit ?? detail.projectFundLimit ?? this.form.projectFundLimit,
+          usedFundLimit: detail.usedFundLimit ?? this.form.usedFundLimit,
+        });
+        this.form.remainingFundLimit = this.calculateRemainingFundLimit();
+      });
+    },
+    calculateRemainingFundLimit() {
+      const total = Number(this.form.projectFundLimit);
+      const used = Number(this.form.usedFundLimit);
+      if (!Number.isFinite(total) || !Number.isFinite(used)) return '';
+      return Math.round((total - used + Number.EPSILON) * 100) / 100;
+    },
+    handleAmountInput(value) {
+      const text = String(value || '').replace(/[^\d.]/g, '');
+      const parts = text.split('.');
+      this.form.applyLimit =
+        parts.length > 1 ? `${parts[0]}.${parts.slice(1).join('').slice(0, 2)}` : parts[0];
+    },
+    handleAttachmentChange(list) {
+      const uploadUserName = this.userInfo?.realName || this.userInfo?.userName || '';
+      const uploadTime = this.$dayjs().format('YYYY-MM-DD HH:mm:ss');
+      this.attachmentRows = (list || []).map(item => ({
+        ...item,
+        uploadUserName: item.uploadUserName || uploadUserName,
+        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);
+    },
+    parseJsonArray(value) {
+      if (Array.isArray(value)) return value;
+      if (!value) return [];
+      try {
+        const data = JSON.parse(value);
+        return Array.isArray(data) ? data : [];
+      } catch (error) {
+        return [];
+      }
+    },
+    attachmentName(row = {}) {
+      return row.originalName || row.name || row.fileName || '附件';
+    },
+    attachmentUrl(row = {}) {
+      return row.url || row.link || row.fileUrl || row.downloadUrl || row.domain || '';
+    },
+    downloadAttachment(row) {
+      const url = this.attachmentUrl(row);
+      if (!url) {
+        this.$message.warning('附件地址为空，无法下载');
+        return;
+      }
+      downloadFileByUrl(url, this.attachmentName(row));
+    },
+    batchDownload() {
+      const rows = this.selectedAttachments.length ? this.selectedAttachments : this.attachmentRows;
+      rows.forEach(this.downloadAttachment);
+    },
+    formatFileSize(size) {
+      const value = Number(size);
+      if (!value) return '';
+      if (value < 1024) return `${value}B`;
+      if (value < 1024 * 1024) return `${(value / 1024).toFixed(1)}KB`;
+      return `${(value / 1024 / 1024).toFixed(1)}MB`;
+    },
+    handleExport() {
+      this.$confirm(`是否导出${this.config.exportName || this.config.title}?`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      }).then(() => {
+        NProgress.start();
+        exportBlob(
+          this.config.exportUrl,
+          { ...this.query, ids: this.ids, [this.website.tokenHeader]: getToken() },
+          { 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());
+      });
+    },
+  },
 };
 </script>
+
+<style lang="scss" scoped>
+.temporary-credit-limit-page {
+  &__field {
+    width: 100%;
+  }
+
+  &__attachment-head {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-bottom: 12px;
+  }
+
+  &__flow {
+    width: 100%;
+    height: calc(100vh - 150px);
+    border: 0;
+  }
+
+  :deep(.avue-crud__header) {
+    margin-top: 12px;
+  }
+
+  :deep(.avue-crud__menu) {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+  }
+}
+</style>
+
+<style>
+.temporary-credit-limit-dialog .el-form-item__label {
+  white-space: normal;
+  line-height: 1.2;
+}
+</style>