台账数据展示页面调整是按照订单状态区分。并且可以参考一下企业目前使用的系统的操作界面按钮布局（不能和企业现在使用的软件界面做的一模一样）。

huminmin

9 天以前 9360d4618e0f873eabb4e4a739d6b477b7461ce1

台账数据展示页面调整是按照订单状态区分。并且可以参考一下企业目前使用的系统的操作界面按钮布局（不能和企业现在使用的软件界面做的一模一样）。

 src/views/salesManagement/reverseAuditHistory/index.vue

@@ -49,7 +49,9 @@
    <div class="table_list">
      <el-table :data="tableData"
                border
                v-loading="loading">
                v-loading="loading"
                show-summary
                :summary-method="summarizeListTable">
        <el-table-column label="序号"
                         type="index"
                         width="60"
@@ -72,11 +74,25 @@
        <el-table-column label="项目名称"
                         prop="projectName"
                         show-overflow-tooltip />
        <el-table-column label="合同金额(元)"
        <el-table-column label="含税总价(元)"
                         prop="contractAmount"
                         align="right">
          <template #default="scope">
            {{ formattedNumber(null, null, scope.row.contractAmount) }}
          </template>
        </el-table-column>
        <el-table-column label="数量"
                         prop="productTotalQuantity"
                         align="right">
          <template #default="scope">
            {{ scope.row.productTotalQuantity ?? "-" }}
          </template>
        </el-table-column>
        <el-table-column label="总面积(m²)"
                         prop="productTotalArea"
                         align="right">
          <template #default="scope">
            {{ scope.row.productTotalArea != null && scope.row.productTotalArea !== "" ? Number(scope.row.productTotalArea).toFixed(4) : "-" }}
          </template>
        </el-table-column>
        <el-table-column label="反审核类型"
@@ -394,6 +410,57 @@
    return dayjs(time).format("YYYY-MM-DD HH:mm:ss");
  };

  const summarizeListTable = param => {
    const { columns, data } = param;
    const sums = [];
    columns.forEach((column, index) => {
      if (index === 0) {
        sums[index] = "合计";
        return;
      }
      const prop = column.property;
      if (prop === "productTotalQuantity") {
        const values = data.map(item => Number(item.productTotalQuantity));
        sums[index] = values.every(value => isNaN(value))
          ? ""
          : values.reduce((prev, curr) => {
              const value = Number(curr);
              return isNaN(value) ? prev : prev + value;
            }, 0);
        return;
      }
      if (prop === "productTotalArea") {
        const values = data.map(item => Number(item.productTotalArea));
        sums[index] = values.every(value => isNaN(value))
          ? ""
          : values
              .reduce((prev, curr) => {
                const value = Number(curr);
                return isNaN(value) ? prev : prev + value;
              }, 0)
              .toFixed(4);
        return;
      }
      if (prop === "contractAmount") {
        const values = data.map(item => Number(item.contractAmount));
        sums[index] = values.every(value => isNaN(value))
          ? ""
          : values
              .reduce((prev, curr) => {
                const value = Number(curr);
                return isNaN(value) ? prev : prev + value;
              }, 0)
              .toLocaleString("zh-CN", {
                minimumFractionDigits: 2,
                maximumFractionDigits: 2,
              });
        return;
      }
      sums[index] = "";
    });
    return sums;
  };

  const summarizeMainTable = param => {
    const { columns, data } = param;
    const sums = [];
@@ -408,7 +475,6 @@
          "quantity",
          "actualTotalArea",
          "taxInclusiveTotalPrice",
          "taxExclusiveTotalPrice",
        ].includes(prop)
      ) {
        const values = data.map(item => Number(item[prop]));

 src/views/salesManagement/salesLedger/index.vue

@@ -243,7 +243,7 @@
                             min-width="85">
              <template #default="scope">
                <el-input-number v-if="scope.row.__editing"
                                 controls-position="right"
                                 :controls="false"
                                 :step="0.01"
                                 :min="0"
                                 :precision="2"
@@ -261,7 +261,7 @@
                             min-width="85">
              <template #default="scope">
                <el-input-number v-if="scope.row.__editing"
                                 controls-position="right"
                                 :controls="false"
                                 v-model="scope.row.width"
                                 :min="0"
                                 :step="1"
@@ -280,7 +280,7 @@
                             min-width="85">
              <template #default="scope">
                <el-input-number v-if="scope.row.__editing"
                                 controls-position="right"
                                 :controls="false"
                                 v-model="scope.row.height"
                                 :min="0"
                                 :step="1"
@@ -708,6 +708,18 @@
      </div>
    </template>
    <template v-else>
    <div class="sales-ledger-status-bar">
      <button v-for="tab in salesLedgerStatusTabs"
              :key="tab.key"
              type="button"
              class="sales-ledger-status-tab"
              :class="{ 'is-active': activeStatusTab === tab.key }"
              @click="handleStatusTabChange(tab.key)">
        {{ tab.label }}
      </button>
    </div>
    <ReverseAuditHistory v-if="activeStatusTab === 'reverseReviewed'" />
    <div v-else>
    <div class="search_form">
      <el-form :model="searchForm"
               :inline="true">
@@ -813,8 +825,8 @@
      </el-form>
    </div>
    <div class="table_list">
      <div class="actions">
        <div>
      <div class="actions sales-ledger-toolbar">
        <div class="sales-ledger-toolbar-group">
          <OtherAmountMaintenanceButton />
          <ProcessFlowMaintenanceButton />
        </div>
@@ -822,68 +834,115 @@
                                       :default-route-id="processFlowSelectDefaultRouteId"
                                       :bound-route-name="processFlowSelectBoundRouteName"
                                       @confirm="handleProcessFlowSelectConfirm" />
        <el-space wrap>
          <el-button type="primary"
                     @click="handleAudit"
                     :disabled="isBatchButtonDisabled('audit')">审核</el-button>
          <el-button type="primary"
                     @click="handleReverseAudit"
                     :disabled="isBatchButtonDisabled('reverseAudit')">反审</el-button>
          <el-button type="warning"
                     @click="handleMarkCompleted"
                     :disabled="isBatchButtonDisabled('markCompleted')">标记完成</el-button>
          <el-button type="primary"
                     @click="handleSalesStock"
                     :disabled="isBatchButtonDisabled('stock')">入库</el-button>
          <el-button type="primary"
                     @click="openForm('add')">新增台账</el-button>
          <el-button type="primary"
                     @click="handleBulkDelivery"
                     :disabled="isBatchButtonDisabled('delivery')">发货</el-button>
          <el-button type="primary"
                     plain
                     @click="handleImport">导入</el-button>
          <el-dropdown @command="handleHistoryImportCommand">
        <div class="sales-ledger-toolbar-actions">
          <el-space v-if="activeStatusTab === 'pendingReview'"
                    wrap
                    class="sales-ledger-toolbar-group">
            <el-button type="primary"
                       plain>
              历史迁移<el-icon class="el-icon--right">
                <ArrowDown />
              </el-icon>
            </el-button>
            <template #dropdown>
              <el-dropdown-menu>
                <el-dropdown-item command="notShipped">未出库</el-dropdown-item>
                <el-dropdown-item command="shipped">已出库</el-dropdown-item>
              </el-dropdown-menu>
            </template>
          </el-dropdown>
          <el-button @click="handleOut"
                     :disabled="isBatchButtonDisabled('export')">导出</el-button>
          <el-button type="danger"
                     plain
                     @click="handleDelete"
                     :disabled="isBatchButtonDisabled('delete')">删除</el-button>
          <el-dropdown @command="handlePrintCommand">
                       @click="handleAudit"
                       :disabled="isBatchButtonDisabled('audit')">审核</el-button>
            <el-button type="danger"
                       plain
                       @click="handleDelete"
                       :disabled="isBatchButtonDisabled('delete')">删除</el-button>
            <el-button type="primary"
                       @click="openForm('add')">新增台账</el-button>
            <el-button type="primary"
                       plain
                       :disabled="isBatchButtonDisabled('print')">
              打印单据<el-icon class="el-icon--right">
                <ArrowDown />
              </el-icon>
            </el-button>
            <template #dropdown>
              <el-dropdown-menu>
                <el-dropdown-item command="finishedProcessCard">生产流程卡（成品）</el-dropdown-item>
                <el-dropdown-item command="salesOrder">销售订单</el-dropdown-item>
                <el-dropdown-item command="salesDeliveryNote">销售发货单</el-dropdown-item>
              </el-dropdown-menu>
            </template>
          </el-dropdown>
          <el-button type="primary"
                     plain
                     @click="handlePrintLabel"
                     :disabled="isBatchButtonDisabled('print')">打印标签</el-button>
        </el-space>
                       @click="handleImport">导入</el-button>
          </el-space>
          <el-space v-else-if="activeStatusTab === 'reviewed'"
                    wrap
                    class="sales-ledger-toolbar-group">
            <el-button type="primary"
                       @click="handleReverseAudit"
                       :disabled="isBatchButtonDisabled('reverseAudit')">反审</el-button>
            <el-button type="warning"
                       @click="handleMarkCompleted"
                       :disabled="isBatchButtonDisabled('markCompleted')">标记完成</el-button>
            <el-button type="primary"
                       @click="handleSalesStock"
                       :disabled="isBatchButtonDisabled('stock')">入库</el-button>
            <el-button type="primary"
                       @click="handleBulkDelivery"
                       :disabled="isBatchButtonDisabled('delivery')">发货</el-button>
          </el-space>
          <el-space v-else-if="activeStatusTab === 'stocked'"
                    wrap
                    class="sales-ledger-toolbar-group">
            <el-button type="primary"
                       @click="handleReverseAudit"
                       :disabled="isBatchButtonDisabled('reverseAudit')">反审</el-button>
            <el-button type="warning"
                       @click="handleMarkCompleted"
                       :disabled="isBatchButtonDisabled('markCompleted')">标记完成</el-button>
            <el-button type="primary"
                       @click="handleBulkDelivery"
                       :disabled="isBatchButtonDisabled('delivery')">发货</el-button>
          </el-space>
          <el-space v-else-if="activeStatusTab === 'delivered'"
                    wrap
                    class="sales-ledger-toolbar-group">
            <el-button type="warning"
                       @click="handleMarkCompleted"
                       :disabled="isBatchButtonDisabled('markCompleted')">标记完成</el-button>
            <el-button type="primary"
                       @click="handleReverseAudit"
                       :disabled="isBatchButtonDisabled('reverseAudit')">反审</el-button>
          </el-space>
          <el-space v-else-if="activeStatusTab === 'completed'"
                    wrap
                    class="sales-ledger-toolbar-group">
            <el-button @click="handleOut"
                       :disabled="isBatchButtonDisabled('export')">导出</el-button>
            <el-button type="primary"
                       plain
                       @click="handlePrintCommand('salesOrder')"
                       :disabled="isBatchButtonDisabled('print')">打印单据</el-button>
            <el-button type="primary"
                       plain
                       @click="handlePrintLabel"
                       :disabled="isBatchButtonDisabled('print')">打印标签</el-button>
          </el-space>
          <el-space wrap class="sales-ledger-toolbar-group sales-ledger-toolbar-group--muted">
            <el-dropdown @command="handleHistoryImportCommand">
              <el-button type="primary"
                         plain>
                历史迁移<el-icon class="el-icon--right">
                  <ArrowDown />
                </el-icon>
              </el-button>
              <template #dropdown>
                <el-dropdown-menu>
                  <el-dropdown-item command="notShipped">未出库</el-dropdown-item>
                  <el-dropdown-item command="shipped">已出库</el-dropdown-item>
                </el-dropdown-menu>
              </template>
            </el-dropdown>
          </el-space>
          <el-space wrap class="sales-ledger-toolbar-group sales-ledger-toolbar-group--muted">
            <el-dropdown @command="handlePrintCommand">
              <el-button type="primary"
                         plain
                         :disabled="isBatchButtonDisabled('print')">
                打印单据<el-icon class="el-icon--right">
                  <ArrowDown />
                </el-icon>
              </el-button>
              <template #dropdown>
                <el-dropdown-menu>
                  <el-dropdown-item command="finishedProcessCard">生产流程卡（成品）</el-dropdown-item>
                  <el-dropdown-item command="salesOrder">销售订单</el-dropdown-item>
                  <el-dropdown-item command="salesDeliveryNote">销售发货单</el-dropdown-item>
                </el-dropdown-menu>
              </template>
            </el-dropdown>
            <el-button type="primary"
                       plain
                       @click="handlePrintLabel"
                       :disabled="isBatchButtonDisabled('print')">打印标签</el-button>
          </el-space>
        </div>
      </div>
      <el-table :data="tableData"
                border
@@ -1055,6 +1114,7 @@
                  :page="page.current"
                  :limit="page.size"
                  @pagination="paginationChange" />
    </div>
    </div>
    </template>
    <FormDialog v-if="!isFormPageMode"
@@ -2491,6 +2551,7 @@
  import OtherAmountMaintenanceButton from "./components/OtherAmountMaintenanceButton.vue";
  import ProcessFlowMaintenanceButton from "./components/ProcessFlowMaintenanceButton.vue";
  import ProcessFlowConfigSelectDialog from "./components/ProcessFlowConfigSelectDialog.vue";
  import ReverseAuditHistory from "../reverseAuditHistory/index.vue";
  import { getQuotationList } from "@/api/salesManagement/salesQuotation.js";
  import {
    ledgerListPage,
@@ -3773,6 +3834,50 @@
    shipped: "销售发货历史数据导入模板-已发货.xlsx",
  };
  const currentImportCommand = ref("default");
  const activeStatusTab = ref("pendingReview");
  const salesLedgerStatusTabs = [
    { key: "pendingReview", label: "未审核" },
    { key: "reviewed", label: "已审核" },
    { key: "reverseReviewed", label: "反审核" },
    { key: "stocked", label: "已入库" },
    { key: "delivered", label: "已发货" },
    { key: "completed", label: "已完成" },
  ];

  const resetStatusFilters = () => {
    searchForm.reviewStatus = undefined;
    searchForm.stockStatus = undefined;
    searchForm.deliveryStatus = undefined;
    searchForm.orderStatus = undefined;
  };

  const handleStatusTabChange = tabKey => {
    activeStatusTab.value = tabKey;
    resetStatusFilters();
    switch (tabKey) {
      case "pendingReview":
        searchForm.reviewStatus = 0;
        break;
      case "reviewed":
        searchForm.reviewStatus = 1;
        break;
      case "reverseReviewed":
        searchForm.reviewStatus = 2;
        break;
      case "stocked":
        searchForm.stockStatus = 2;
        break;
      case "delivered":
        searchForm.deliveryStatus = 5;
        break;
      case "completed":
        searchForm.orderStatus = 1;
        break;
      default:
        break;
    }
    handleQuery();
  };
  const changeDaterange = value => {
    if (value) {
      searchForm.entryDateStart = dayjs(value[0]).format("YYYY-MM-DD");
@@ -4003,7 +4108,7 @@
    tableLoading.value = true;
    const { entryDate, ...rest } = searchForm;
    // 将范围日期字段传递给后端
    const params = { ...rest, ...page, reviewStatusList: [0, 1] };
    const params = { ...rest, ...page, reviewStatusList: [0, 1, 2] };
    // 移除录入日期的默认值设置，只保留范围日期字段
    delete params.entryDate;
    // 查询客户名称与新增保持一致：先选 customerId，再映射为 customerName 查询
@@ -6130,7 +6235,7 @@
    currentFactoryName.value = res.user.currentFactoryName;
  };
  onMounted(() => {
    getList();
    handleStatusTabChange(activeStatusTab.value);
    customerList().then(res => {
      customerOption.value = res;
    });
@@ -6180,10 +6285,77 @@
    margin-top: unset;
  }

  .sales-ledger-status-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px 14px;
    margin-bottom: 14px;
    background: linear-gradient(180deg, #f9fbff 0%, #f2f6ff 100%);
    border: 1px solid #dbe6ff;
    border-radius: 12px;
  }

  .sales-ledger-status-tab {
    min-width: 88px;
    height: 34px;
    padding: 0 14px;
    border: 1px solid #d7def0;
    border-radius: 9px;
    background: #fff;
    color: #4b5567;
    font-size: 13px;
    cursor: pointer;
    transition: all 0.18s ease;
  }

  .sales-ledger-status-tab:hover {
    border-color: #8fb3ff;
    color: #1d4ed8;
  }

  .sales-ledger-status-tab.is-active {
    border-color: #1d4ed8;
    background: linear-gradient(135deg, #2f67f6 0%, #1d4ed8 100%);
    color: #fff;
    box-shadow: 0 8px 18px rgba(29, 78, 216, 0.16);
  }

  .actions {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
  }

  .sales-ledger-toolbar {
    align-items: flex-start;
    gap: 14px;
    padding: 10px 12px;
    background: #fff;
    border: 1px solid #e7edf7;
    border-radius: 12px;
  }

  .sales-ledger-toolbar-actions {
    display: flex;
    flex: 1;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
  }

  .sales-ledger-toolbar-group {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 4px;
    background: #f7f9fc;
    border: 1px solid #edf1f7;
    border-radius: 10px;
  }

  .sales-ledger-toolbar-group--muted {
    background: #fbfcfe;
  }

  .sales-ledger-page-header {
@@ -6333,9 +6505,20 @@
  }

  @media (max-width: 768px) {
    .sales-ledger-status-tab {
      min-width: unset;
      flex: 1 1 calc(50% - 8px);
    }

    .sales-ledger-toolbar,
    .sales-ledger-page-header {
      flex-direction: column;
      align-items: stretch;
    }

    .sales-ledger-toolbar-actions {
      width: 100%;
      justify-content: flex-start;
    }

    .approver-node-item {
@@ -6363,4 +6546,4 @@
    margin-right: 0;
    margin-bottom: 8px;
  }
</style>
</style>