优化 千海金 融资信息

src/views/platinum/platinum_financing_information/list/tab/compoments/detail/index.vue

@@ -32,28 +32,28 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType, ref, watchEffect } from 'vue';
-import { QueryCustomInfoType } from '@/services/go/ermcp/customInfo/interface';
-import { formatValue } from '@/common/methods';
 import { Des, handleDesList } from '@/common/components/commonDes';
-import { closeModal } from '@/common/setup/modal';
+import { getFinancingStatus } from '@/common/constants/enumsName';
 import { queryTableList } from '@/common/export/table';
-import { QhjContract, QueryContractLogReq } from '@/services/go/ermcp/qhj/interface';
+import { formatValue } from '@/common/methods';
+import { _closeModal } from '@/common/setup/modal/modal';
 import { queryContractLog } from '@/services/go/ermcp/qhj';
-import Long from 'long';
-import {getFinancingStatus} from "@/common/constants/enumsName";
+import { QhjContract, QueryContractLogReq } from '@/services/go/ermcp/qhj/interface';
+import { defineComponent, PropType } from 'vue';
 
 export default defineComponent({
     name: 'platinum_financing_information_detail',
     components: { Des },
+    emits: ['cancel', 'update'],
     props: {
         selectedRow: {
             type: Object as PropType<QhjContract>,
             default: {},
         },
     },
-    setup(props: { selectedRow: QhjContract }) {
-        const { visible, cancel } = closeModal('platinum_financing_information_detail');
+    setup(props: { selectedRow: QhjContract }, context) {
+        // 控制关闭弹窗
+        const { visible, cancel } = _closeModal(context);
         const { desList, getDesList } = handleDesList();
         // 表格列表数据
         const { loading, tableList, queryTable } = queryTableList();
@@ -116,33 +116,31 @@ export default defineComponent({
             }
             return result;
         }
-        watchEffect(() => {
-            if (visible.value) {
-                const data = props.selectedRow;
 
-                const addinfo = data.currisklevel === 2 ? " 需追加" + data.reckonrecovermargin + "元" : ""
-                // 个人
-                const person = [
-                    { label: '账号', value: formatValue(data.logincode) },
-                    { label: '名称', value: formatValue(data.username) },
-                    { label: '账户类型', value: formatValue(data.userinfotype === 1 ? '个人' : '企业') },
-                    { label: '商品', value: formatValue(data.goodsname) },
-                    { label: '价格', value: formatValue(data.tradeprice) },
-                    { label: '数 量', value: formatValue(data.wrqty) },
-                    { label: '金额', value: formatValue(data.lenderamount) },
-                    { label: '已付款', value: formatValue(data.payamount) },
-                    { label: '融资额', value: formatValue(data.remainamount) },
-                    { label: '融资时间', value: formatValue(data.contractconfirmtime) },
-                    { label: '状 态', value: getFinancingStatus(data.currisklevel, data.reckonrecovermargin.toString()) + addinfo},
-                ];
+        const data = props.selectedRow;
+
+        const addinfo = data.currisklevel === 2 ? ' 需追加' + data.reckonrecovermargin + '元' : '';
+        // 个人
+        const person = [
+            { label: '账号', value: formatValue(data.logincode) },
+            { label: '名称', value: formatValue(data.username) },
+            { label: '账户类型', value: formatValue(data.userinfotype === 1 ? '个人' : '企业') },
+            { label: '商品', value: formatValue(data.goodsname) },
+            { label: '价格', value: formatValue(data.tradeprice) },
+            { label: '数 量', value: formatValue(data.wrqty) },
+            { label: '金额', value: formatValue(data.lenderamount) },
+            { label: '已付款', value: formatValue(data.payamount) },
+            { label: '融资额', value: formatValue(data.remainamount) },
+            { label: '融资时间', value: formatValue(data.contractconfirmtime) },
+            { label: '状 态', value: getFinancingStatus(data.currisklevel, data.reckonrecovermargin.toString()) + addinfo },
+        ];
+
+        getDesList(person);
+        const param: QueryContractLogReq = {
+            scfcontractid: data.scfcontractid,
+        };
+        queryTable(queryContractLog, param);
 
-                getDesList(person);
-                const param: QueryContractLogReq = {
-                    scfcontractid: data.scfcontractid,
-                };
-                queryTable(queryContractLog, param);
-            }
-        });
         return {
             desList,
             cancel,

src/views/platinum/platinum_financing_information/list/tab/index.vue

@@ -2,77 +2,84 @@
   <!-- 融资信息 -->
   <div class="platinum_financing_information_tab">
     <Filter @search="updateColumn" />
-    <contextMenu :contextMenuList="firstBtn">
-      <a-table :columns="columns"
-               class="topOrderTable"
-               :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }"
-               :pagination="false"
-               :expandedRowKeys="expandedRowKeys"
-               :customRow="Rowclick"
-               rowKey="key"
-               :data-source="tableList">
-        <!-- 额外的展开行 -->
-        <template #expandedRowRender="{ record }">
-          <BtnList :btnList="firstBtn"
-                   class="btn-list-sticky"
-                   @onClick="btnClick(record)" />
-        </template>
-        <!-- 物流信息 -->
-        <template #scfcontractstatus="{ record }">
-          <div>{{ getFinancingStatus(record.currisklevel, record.reckonrecovermargin) }}</div>
-          <div v-if="record.currisklevel === 2">{{  "需追加" + record.reckonrecovermargin + "元" }}
-          </div>
-        </template>
+    <a-table :columns="columns"
+             class="srcollYTable"
+             :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }"
+             :pagination="false"
+             :expandedRowKeys="expandedRowKeys"
+             :customRow="Rowclick"
+             rowKey="key"
+             :data-source="tableList">
+      <!-- 额外的展开行 -->
+      <template #expandedRowRender="{ record }">
+        <mtp-table-button class="btn-list-sticky"
+                          :buttons="buttons"
+                          :record="record"
+                          @click="openComponent" />
+      </template>
+      <!-- 物流信息 -->
+      <template #scfcontractstatus="{ record }">
+        <div>{{ getFinancingStatus(record.currisklevel, record.reckonrecovermargin) }}</div>
+        <div v-if="record.currisklevel === 2">{{  "需追加" + record.reckonrecovermargin + "元" }}
+        </div>
+      </template>
 
-        <!-- 账户类型 -->
-        <template #userinfotype="{ record }">
-          <a>{{ record.userinfotype === 1 ? "个人" : "企业" }}</a>
-        </template>
+      <!-- 账户类型 -->
+      <template #userinfotype="{ record }">
+        <a>{{ record.userinfotype === 1 ? "个人" : "企业" }}</a>
+      </template>
 
-      </a-table>
-    </contextMenu>
-    <Detail :selectedRow="selectedRow" />
+    </a-table>
+    <!-- 右键 -->
+    <contextMenu :contextMenu="contextMenu"
+                 @cancel="closeContext"
+                 :list="buttons"> </contextMenu>
+    <component :is="componentId"
+               v-if="componentId"
+               :selectedRow="selectedRow"
+               @cancel="closeComponent"> </component>
   </div>
 </template>
 
 <script lang="ts">
-import { defineComponent, initData, getTableColumns, getTableEvent, contextMenu, BtnList, _getBtnList, queryTableList } from '@/common/export/table';
-import Filter from './compoments/filter/index.vue';
-import Detail from './compoments/detail/index.vue';
-import { QhjContract } from '@/services/go/ermcp/qhj/interface';
+import { EnumRouterName } from '@/common/constants/enumRouterName';
+import { getFinancingStatus } from '@/common/constants/enumsName';
+import { ComposeTableParam, contextMenu, defineAsyncComponent, defineComponent, handleComposeTable, MtpTableButton, queryTableList } from '@/common/export/commonTable';
+import { getTableButton } from '@/common/setup/table/button';
 import { queryContract } from '@/services/go/ermcp/qhj';
-import { getContractName, getFinancingStatus } from '@/common/constants/enumsName';
+import { QhjContract } from '@/services/go/ermcp/qhj/interface';
+import Filter from './compoments/filter/index.vue';
 
 export default defineComponent({
     name: 'platinum_financing_information_tab',
-    components: { Filter, contextMenu, BtnList, Detail },
+    components: {
+        Filter,
+        contextMenu,
+        MtpTableButton,
+        detail: defineAsyncComponent(() => import('./compoments/detail/index.vue')), // 详情
+    },
     setup() {
-        // 表头数据
-        const { columns, registerColumn, updateColumn } = getTableColumns();
-        // 表格事件
-        const { expandedRowKeys, selectedRow, Rowclick, btnClick } = getTableEvent<QhjContract>({});
-        // 表格操作按钮列表
-        const [firstBtn] = _getBtnList('platinum_financing_information_tab', false).value;
         // 表格列表数据
-        const { loading, tableList, queryTable } = queryTableList();
-        initData(() => {
+        const { loading, tableList, queryTable } = queryTableList<QhjContract>();
+        const queryTableAction = () => {
             // 获取列表数据
             queryTable(queryContract);
-            // 注册表头信息 过滤
-            registerColumn('table_pcweb_qhj_fixed_financing_information', ['goodsid', 'contractconfirmtime']);
-        });
+        };
 
+        // 表格通用逻辑
+        const param: ComposeTableParam = {
+            queryFn: queryTableAction,
+            menuType: EnumRouterName.plan_audit,
+            tableName: 'table_pcweb_qhj_fixed_financing_information',
+            tableFilterKey: ['goodsid', 'contractconfirmtime'],
+            isDetail: true,
+        };
+        const buttons = getTableButton();
         return {
-            columns,
-            expandedRowKeys,
-            selectedRow,
-            Rowclick,
-            firstBtn,
+            ...handleComposeTable<QhjContract>(param),
             loading,
             tableList,
-            updateColumn,
-            queryTable,
-            btnClick,
+            buttons,
             getFinancingStatus,
         };
     },