⚡ 优化表格工具栏、附件文件名展示与合同金额两位小数

Co-authored-by: Cursor <cursoragent@cursor.com>

src/views/settlement/pre-settlement.vue

@@ -1,6 +1,6 @@
 <template>
   <basic-container class="pre-settlement-page">
-    <section class="pre-settlement-page__search">
+    <section v-show="searchVisible" class="pre-settlement-page__search">
       <el-form :model="query" label-position="right" label-width="88px" @submit.prevent>
         <div class="pre-settlement-page__search-grid">
           <template v-for="field in visibleSearchFields" :key="field.prop">
@@ -94,16 +94,19 @@
             导出
           </el-button>
         </div>
-        <div class="pre-settlement-page__toolbar-right">
-          <el-tooltip content="刷新" placement="top">
-            <el-button :icon="Refresh" text @click="loadTable" />
-          </el-tooltip>
-        </div>
+        <settlement-table-tools
+          :columns="columnSettingOptions"
+          v-model:visible-column-keys="visibleColumnKeys"
+          v-model:table-size="tableSize"
+          v-model:search-visible="searchVisible"
+          @refresh="loadTable"
+        />
       </div>
 
       <el-table
         v-loading="loading"
         :data="rows"
+        :size="tableSize"
         border
         class="pre-settlement-page__table"
         @selection-change="handleSelectionChange"
@@ -111,7 +114,7 @@
         <el-table-column type="selection" width="52" fixed="left" align="center" />
         <el-table-column type="index" label="序号" width="64" fixed="left" align="center" />
         <el-table-column
-          v-for="column in tableColumns"
+          v-for="column in visibleTableColumns"
           :key="column.prop"
           :prop="column.prop"
           :label="column.label"
@@ -285,7 +288,7 @@
 </template>
 
 <script>
-import { ArrowDown, ArrowUp, Refresh } from '@element-plus/icons-vue';
+import { ArrowDown, ArrowUp } from '@element-plus/icons-vue';
 import { mapGetters } from 'vuex';
 import {
   approve,
@@ -306,6 +309,7 @@ import { downloadFile } from '@/utils/util';
 import { getMKApprovalUrl } from '@/api/system/business-process';
 import { loadMkEnabled, submitMkApprovalFlow } from '@/utils/mk-approval';
 import PreSettlementEditor from './components/pre-settlement-editor.vue';
+import SettlementTableTools from './components/settlement-table-tools.vue';
 import { isAdministrator } from '@/utils/auth';
 
 const emptyQuery = () => ({
@@ -323,18 +327,20 @@ const emptyQuery = () => ({
 
 export default {
   name: 'PreSettlement',
-  components: { PreSettlementEditor },
+  components: { PreSettlementEditor, SettlementTableTools },
   mixins: [organizationSearch],
   data() {
     return {
       ArrowDown,
       ArrowUp,
-      Refresh,
       loading: false,
       query: emptyQuery(),
       searchFields: preSettlementSearchFields,
       searchExpanded: false,
+      searchVisible: true,
+      tableSize: 'default',
       tableColumns: preSettlementTableColumns,
+      visibleColumnKeys: preSettlementTableColumns.map(column => column.prop),
       rows: [],
       selection: [],
       page: {
@@ -365,6 +371,15 @@ export default {
     visibleSearchFields() {
       return this.searchExpanded ? this.searchFields : this.searchFields.slice(0, 4);
     },
+    columnSettingOptions() {
+      return this.tableColumns.map(column => ({
+        prop: column.prop,
+        label: column.label,
+      }));
+    },
+    visibleTableColumns() {
+      return this.tableColumns.filter(column => this.visibleColumnKeys.includes(column.prop));
+    },
   },
   watch: {
     '$route.query.detailNo'(detailNo) {
@@ -776,7 +791,6 @@ export default {
   }
 
   &__toolbar-left,
-  &__toolbar-right,
   &__links {
     display: flex;
     flex-wrap: wrap;