修改计划: 执行中

src/views/business/plan/list/audit/index.vue

@@ -37,7 +37,8 @@
     <component :is="componentId"
                v-if="componentId"
                :selectedRow="selectedRow"
-               @cancel="closeComponent"></component>
+               @cancel="closeComponent">
+    </component>
   </div>
 </template>
 

src/views/business/plan/list/running/index.vue

@@ -3,82 +3,78 @@
   <div class="plan_running"
        :loading="loading">
     <Filter @search="updateColumn">
-      <BtnList :btnList="commonBtn" />
+      <BtnList :btnList="firstBtn"
+               @click="openComponent" />
     </Filter>
-    <contextMenu :contextMenuList="forDataBtn">
-      <a-table :columns="columns"
-               class="topTable"
-               :pagination="false"
-               :expandedRowKeys="expandedRowKeys"
-               :customRow="Rowclick"
-               rowKey="key"
-               :data-source="tableList">
-        <!-- 额外的展开行 -->
-        <template #expandedRowRender="{  }">
-          <BtnList :btnList="forDataBtn" />
-        </template>
-        <template #contracttype="{ text }">
-          <a>{{ getPlanContractType(text) }}</a>
-        </template>
-        <template #hedgeplanstatus="{ text }">
-          <a>{{ getPlanStatusName(text) }}</a>
-        </template>
-      </a-table>
+    <a-table :columns="columns"
+             class="srcollYTable"
+             :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }"
+             :pagination="false"
+             :loading="loading"
+             :expandedRowKeys="expandedRowKeys"
+             :customRow="Rowclick"
+             rowKey="key"
+             :data-source="tableList">
+      <!-- 额外的展开行 -->
+      <template #expandedRowRender="{ record }">
+        <BtnList :btnList="secondBtn"
+                 :record="record"
+                 @click="openComponent" />
+      </template>
+      <template #contracttype="{ text }">
+        <a>{{ getPlanContractType(text) }}</a>
+      </template>
+      <template #hedgeplanstatus="{ text }">
+        <a>{{ getPlanStatusName(text) }}</a>
+      </template>
+    </a-table>
+    <!-- 右键 -->
+    <contextMenu :contextMenu="contextMenu"
+                 @cancel="closeContext"
+                 :list="secondBtn">
     </contextMenu>
-    <!-- 详情 -->
-    <Detail :selectedRow="selectedRow"
-            @refresh="queryTable" />
-    <!-- 撤销 -->
-    <Cancel :selectedRow="selectedRow"
-            @refresh="queryTable" />
-    <!-- 审核 -->
-    <Audit :selectedRow="selectedRow"
-           @refresh="queryTable" />
+    <component :is="componentId"
+               v-if="componentId"
+               :selectedRow="selectedRow"
+               @cancel="closeComponent">
+    </component>
   </div>
 </template>
 
 <script lang="ts">
-import { defineComponent, initData, getTableColumns, getTableEvent, getBtnList, contextMenu, BtnList } from '@/common/export/table';
-import { queryTableList, Ermcp3HedgePlan } from '../index';
-import { Add, Detail, Filter, Recommit } from '../../components';
+import { queryTableList, BtnList, contextMenu, defineAsyncComponent, defineComponent, ModalEnum, handleComposeTable, ComposeTableParam } from '@/common/export/commonTable';
+import { Filter } from '../../components';
 import { getPlanContractType, getPlanStatusName } from '@/views/business/plan/setup';
+import { Ermcp3HedgePlan } from '@/services/go/ermcp/plan/interface';
+import { QueryHedgePlan } from '@/services/go/ermcp/plan';
+
+const Detail = defineAsyncComponent(() => import('../../components/detail/index.vue'));
 
 export default defineComponent({
     name: 'spot-contract-peddding',
     components: {
         contextMenu,
         BtnList,
-        Add,
-        Recommit,
         Filter,
-        Detail,
+        [ModalEnum.detail]: Detail,
     },
     setup() {
-        // 表头数据
-        const { columns, registerColumn, updateColumn } = getTableColumns();
-        // 表格事件
-        const { expandedRowKeys, selectedRow, Rowclick } = getTableEvent<Ermcp3HedgePlan>({});
-        // 表格操作按钮列表
-        const { commonBtn, forDataBtn } = getBtnList('plan_running', true);
         // 表格列表数据
-        const { loading, tableList, queryTable } = queryTableList('2');
-
-        initData(() => {
-            // 获取列表数据
-            queryTable();
-            // 注册表头信息 过滤
-            registerColumn('table_pcweb_hedging_plan', ['contracttype', 'hedgeplanno', 'deliverygoodsname']);
-        });
+        const { loading, tableList, queryTable } = queryTableList<Ermcp3HedgePlan>();
+        // 获取列表数据
+        const queryTableAction = () => queryTable(QueryHedgePlan, '2');
+        // 表格通用逻辑
+        const param: ComposeTableParam = {
+            queryFn: queryTableAction,
+            menuType: 'plan_running',
+            tableName: 'table_pcweb_hedging_plan',
+            tableFilterKey: ['contracttype', 'hedgeplanno', 'deliverygoodsname'],
+            isDetail: true,
+        };
         return {
-            columns,
-            expandedRowKeys,
-            selectedRow,
-            Rowclick,
-            commonBtn,
-            forDataBtn,
+            ...handleComposeTable<Ermcp3HedgePlan>(param),
             loading,
             tableList,
-            updateColumn,
             getPlanStatusName,
             getPlanContractType,
             queryTable,