🦄 refactor: 封装统一表格组件，便于批量扩展表格能力

2025-08-27 16:47:33 +08:00
parent 278b0c8258
commit 7ea0de6a67
133 changed files with 465 additions and 432 deletions
--- a/klp-ui/src/views/finance/account/index.vue
+++ b/klp-ui/src/views/finance/account/index.vue
@@ -55,7 +55,7 @@
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

-    <el-table
+    <KLPTable
      v-if="refreshTable"
      v-loading="loading"
      :data="accountList"
@@ -95,7 +95,7 @@
          >删除</el-button>
        </template>
      </el-table-column>
-    </el-table>
+    </KLPTable>

    <!-- 添加或修改会计科目对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
--- a/klp-ui/src/views/finance/document/components/FinanceVoucherTable.vue
+++ b/klp-ui/src/views/finance/document/components/FinanceVoucherTable.vue
@@ -20,12 +20,12 @@
      </div>

      <!-- 凭证明细表格 -->
-      <el-table :data="voucher.detailList || []" border style="width: 100%;">
+      <KLPTable :data="voucher.detailList || []" border style="width: 100%;">
        <el-table-column label="摘要" prop="voucherNo" />
        <el-table-column label="科目" prop="accountId" />
        <el-table-column label="借方金额" prop="debitAmount" align="right" />
        <el-table-column label="贷方金额" prop="creditAmount" align="right" />
-      </el-table>
+      </KLPTable>

      <!-- 总计行 -->
      <div class="total-row">
--- a/klp-ui/src/views/finance/document/components/Voucher.vue
+++ b/klp-ui/src/views/finance/document/components/Voucher.vue
@@ -22,7 +22,7 @@
    </el-row>

    <el-row>
-      <el-table :data="tableData" style="width: 100%" empty-text="暂无数据">
+      <KLPTable :data="tableData" style="width: 100%" empty-text="暂无数据">
        <el-table-column label="序号" type="index" width="50" align="center" />
        <el-table-column prop="voucherNo" label="摘要">
          <template slot-scope="scope">
@@ -68,7 +68,7 @@
            </el-button>
          </template>
        </el-table-column>
-      </el-table>
+      </KLPTable>
    </el-row>

    <!-- 合计部分 -->
--- a/klp-ui/src/views/finance/document/components/detail.vue
+++ b/klp-ui/src/views/finance/document/components/detail.vue
@@ -113,7 +113,7 @@
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

-    <el-table v-loading="loading" :data="journalEntryList" @selection-change="handleSelectionChange">
+    <KLPTable v-loading="loading" :data="journalEntryList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="分录ID" align="center" prop="entryId" v-if="true"/>
      <el-table-column label="凭证编号" align="center" prop="voucherNo" />
@@ -146,7 +146,7 @@
          >删除</el-button>
        </template>
      </el-table-column>
-    </el-table>
+    </KLPTable>

    <pagination
      v-show="total>0"
--- a/klp-ui/src/views/finance/jounery/index.vue
+++ b/klp-ui/src/views/finance/jounery/index.vue
@@ -50,7 +50,7 @@
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

-    <el-table v-loading="loading" :data="journalList" @selection-change="handleSelectionChange">
+    <KLPTable v-loading="loading" :data="journalList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="主键ID" align="center" prop="journalId" v-if="false" />
      <el-table-column label="日期" align="center" prop="journalDate" width="180">
@@ -85,7 +85,7 @@
          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)">删除</el-button>
        </template>
      </el-table-column>
-    </el-table>
+    </KLPTable>

    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
      @pagination="getList" />
--- a/klp-ui/src/views/finance/order/index.vue
+++ b/klp-ui/src/views/finance/order/index.vue
@@ -72,7 +72,7 @@
            <order-detail-list :orderId="currentOrder.orderId" />
          </el-tab-pane>
          <el-tab-pane label="应收明细" name="receivable">
-            <el-table v-loading="rightLoading" :data="currentOrder.receivables" empty-text="暂无数据">
+            <KLPTable v-loading="rightLoading" :data="currentOrder.receivables" empty-text="暂无数据">
              <el-table-column label="客户" align="center" prop="customerName" />
              <el-table-column label="订单ID" align="center" prop="orderId" />
              <el-table-column label="到期日" align="center" prop="dueDate" width="180">
@@ -89,10 +89,10 @@
              <el-table-column label="未收金额" align="center" prop="balanceAmount" />
              <el-table-column label="状态" align="center" prop="status" />
              <el-table-column label="备注" align="center" prop="remark" />
-            </el-table>
+            </KLPTable>
          </el-tab-pane>
          <el-tab-pane label="应付明细" name="payable">
-            <el-table v-loading="rightLoading" :data="currentOrder.payables" empty-text="暂无数据">
+            <KLPTable v-loading="rightLoading" :data="currentOrder.payables" empty-text="暂无数据">
              <el-table-column label="供应商" align="center" prop="supplierName" />
              <el-table-column label="订单ID" align="center" prop="orderId" />
              <el-table-column label="到期日" align="center" prop="dueDate" width="180">
@@ -109,15 +109,15 @@
              <el-table-column label="未付金额" align="center" prop="balanceAmount" />
              <el-table-column label="状态" align="center" prop="status" />
              <el-table-column label="备注" align="center" prop="remark" />
-            </el-table>
+            </KLPTable>
          </el-tab-pane>
          <el-tab-pane label="凭证管理" name="document">
-            <el-table :data="currentOrder.documents" style="width: 100%" empty-text="暂无数据">
+            <KLPTable :data="currentOrder.documents" style="width: 100%" empty-text="暂无数据">
              <el-table-column prop="docNo" label="凭证编号" />
              <el-table-column prop="docDate" label="凭证日期" />
              <el-table-column prop="amount" label="凭证金额" />
              <el-table-column prop="status" label="凭证状态" />
-            </el-table>
+            </KLPTable>
          </el-tab-pane>
        </el-tabs>

--- a/klp-ui/src/views/finance/pay/index.vue
+++ b/klp-ui/src/views/finance/pay/index.vue
@@ -68,7 +68,7 @@
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

-    <el-table v-loading="loading" :data="payableList" @selection-change="handleSelectionChange">
+    <KLPTable v-loading="loading" :data="payableList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="应付ID" align="center" prop="payableId" v-if="false"/>
      <el-table-column label="供应商" align="center" prop="supplierName" />
@@ -107,7 +107,7 @@
          >付款</el-button>
        </template>
      </el-table-column>
-    </el-table>
+    </KLPTable>

    <pagination
      v-show="total>0"
--- a/klp-ui/src/views/finance/receive/index.vue
+++ b/klp-ui/src/views/finance/receive/index.vue
@@ -68,7 +68,7 @@
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

-    <el-table v-loading="loading" :data="receivableList" @selection-change="handleSelectionChange">
+    <KLPTable v-loading="loading" :data="receivableList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="应收ID" align="center" prop="receivableId" v-if="false"/>
      <el-table-column label="客户" align="center" prop="customerName" />
@@ -107,7 +107,7 @@
          >收款</el-button>
        </template>
      </el-table-column>
-    </el-table>
+    </KLPTable>

    <pagination
      v-show="total>0"