Merge remote-tracking branch 'origin/master'

# Conflicts:
#	src/views/information/spot-contract/components/detail/index.vue

src/common/setup/table/button.ts

@@ -79,7 +79,9 @@ export function _handleBtnList_(list: OperationTabMenu | undefined, hasDetail: b
             if (!Array.isArray(result.value[index])) {
                 result.value[index] = []
             }
-            if (type === 2 && isshow) { // 按钮类型 并且显示
+            if (type === 2 && isshow && code !== 'none_btn') {
+                // 按钮类型 并且显示
+                // 当code为 none_btn， 是空按钮，（返回按钮确保数据结构统一）
                 const item = { lable: title, code, className: getClassName(code) }
                 result.value[index].push(item)
             }

src/common/setup/table/interface.ts

@@ -24,6 +24,7 @@ export interface ComposeTableParam {
     menuType: keyof ButtonListKey,  // 操作按钮列表key
     tableName: keyof TableKey, // 表头key
     tableFilterKey: string[], // 表格过滤字段
+    tableFilterCB?: Function, // 表格过滤字段回调函数
     isDetail: boolean,  // 是否需要详情
 }
 

src/layout/components/top.vue

@@ -59,7 +59,14 @@ export default defineComponent({
             let name = temp;
             if (temp === 'home') {
                 // 第一次进入项目
-                name = value.code;
+                if (value?.children.length) {
+                    // 默认第一个tab页
+                    name = value.children[0].code;
+                    index.value = ['0'];
+                } else {
+                    router.push({ name: '404' });
+                    return;
+                }
             } else {
                 // 这里处理页面刷新，还原 导航栏数据
                 const i = value.children.findIndex((e) => e.code === temp);

src/views/information/spot-contract/components/add/index.vue

@@ -420,8 +420,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType, ref, watchEffect } from 'vue';
-import { closeModal } from '@/common/setup/modal/index';
+import { defineComponent, PropType, ref } from 'vue';
 import { addContractReq } from './setup';
 import { getUserName, getUsrId } from '@/services/bus/user';
 import { getGoodsList } from '@/services/bus/goods';
@@ -436,6 +435,7 @@ import { ErmcpLoginUser } from '@/services/go/ermcp/account/interface';
 import { handlerManagerList } from '@/common/setup/user';
 import { getUploadImg } from '@/common/setup/upload';
 import UploadImg from '@/common/components/uploadImg/index.vue';
+import { _closeModal } from '@/common/setup/modal/modal';
 
 export default defineComponent({
     name: 'add-spot-contract',
@@ -447,7 +447,7 @@ export default defineComponent({
         },
     },
     setup(props, context) {
-        const { visible, cancel } = closeModal('spot_contract_btn_add');
+        const { visible, cancel } = _closeModal(context);
         const { sendReq } = addContractReq();
         const loading = ref<boolean>(false);
 
@@ -476,17 +476,14 @@ export default defineComponent({
         // 现货商品列表
         const goodsList = ref<Goods[]>([]);
         const { getFirstImg, uploadImgAction } = getUploadImg();
-        watchEffect(() => {
-            if (visible.value) {
-                queryCustomList();
-                getDeliveryGoods();
-                queryTradeManager();
-                goodsList.value = getGoodsList();
-                queryBusinessManager().then(() => {
-                    businesserList.value = getBusinesserOrMerchandiser('22');
-                    merchandiserList.value = getBusinesserOrMerchandiser('23');
-                });
-            }
+
+        queryCustomList();
+        getDeliveryGoods();
+        queryTradeManager();
+        goodsList.value = getGoodsList();
+        queryBusinessManager().then(() => {
+            businesserList.value = getBusinesserOrMerchandiser('22');
+            merchandiserList.value = getBusinesserOrMerchandiser('23');
         });
         function submit(OperateType: 1 | 2) {
             validateAction<FormState>(formRef, formState).then((param) => {
@@ -515,8 +512,7 @@ export default defineComponent({
                 param.ContractAttachment = getFirstImg();
                 sendReq(param, loading, OperateType)
                     .then((res) => {
-                        context.emit('refresh');
-                        closeAction();
+                        cancel(true);
                     })
                     .catch((err) => {});
             });

src/views/information/spot-contract/components/cancel/index.vue

@@ -23,15 +23,14 @@
 
 <script lang="ts">
 import { defineComponent, PropType, ref } from 'vue';
-import { closeModal } from '@/common/setup/modal/index';
 import { Ermcp3ContractRsp } from '@/services/go/ermcp/spot-contract/interface';
 import { Modal } from 'ant-design-vue';
-import { orderContractOperateControl } from '@/views/information/spot-contract/components/setup';
 import { SpotContractOperateReq } from '@/services/proto/spotcontract/interface';
 import InfoDetail from '../infoDetail/index.vue';
 import { requestResultLoadingAndInfo } from '@/common/methods/request/resultInfo';
 import { orderContract } from '@/services/proto/spotcontract';
 import { ErmcpLoginUserEx } from '@/services/go/ermcp/account/interface';
+import { _closeModal } from '@/common/setup/modal/modal';
 
 export default defineComponent({
     name: 'spot-contract-detail',
@@ -47,7 +46,7 @@ export default defineComponent({
         },
     },
     setup(props, context) {
-        const { visible, cancel } = closeModal('spot_contract_btn_cancel');
+        const { visible, cancel } = _closeModal(context);
         const loading = ref<boolean>(false);
         const maskClosableFlag = ref<boolean>(false);
         function submit() {
@@ -64,8 +63,7 @@ export default defineComponent({
                     // Fixme 6/4 代码修改
                     // 撤销  操作类型-1:保存草稿2:提交申请3:删除4:审核通过5:审核拒绝6:撤销
                     requestResultLoadingAndInfo(orderContract, reqParam, loading, ['撤销成功', '撤销失败:']).then(() => {
-                        context.emit('refresh');
-                        cancel();
+                        cancel(true);
                     });
                 },
                 onCancel() {},

src/views/information/spot-contract/components/check/index.vue

@@ -111,25 +111,23 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType, ref, toRaw, watchEffect } from 'vue';
-import { closeModal } from '@/common/setup/modal/index';
+import { defineComponent, PropType, ref, toRaw } from 'vue';
 import { getBizTypeName, getContractStatusName, getContractTypeName, getPriceTypeName } from '@/common/constants/enumsName';
 import { Ermcp3ContractRsp } from '@/services/go/ermcp/spot-contract/interface';
 import { formatTime, formatValue } from '@/common/methods';
-import { orderContractControl, orderContractOperateControl } from '@/views/information/spot-contract/components/setup';
 import { Modal } from 'ant-design-vue';
 import { handleForm } from './setup';
-import { GldErmcpSpotContractOperateReq, SpotContractOperateReq } from '@/services/proto/spotcontract/interface';
+import { GldErmcpSpotContractOperateReq } from '@/services/proto/spotcontract/interface';
 import { validateAction } from '@/common/setup/form';
 import { FormState } from './interface';
 import { ErmcpLoginUser } from '@/services/go/ermcp/account/interface';
 import { handlerManagerList } from '@/common/setup/user';
 import { requestResultLoadingAndInfo } from '@/common/methods/request/resultInfo';
-import { hedgePlanReq } from '@/services/proto/hedgeplan';
-import { orderContract, spotContractStatus } from '@/services/proto/spotcontract';
+import { orderContract } from '@/services/proto/spotcontract';
 import { getUserId } from '@/services/bus/account';
 import { handlePreviewImg } from '@/common/setup/upload';
 import Detail from '../common-detail/index.vue';
+import { _closeModal } from '@/common/setup/modal/modal';
 
 export default defineComponent({
     name: 'spot-contract-detail',
@@ -142,7 +140,7 @@ export default defineComponent({
     },
     setup(props, context) {
         const loading = ref<boolean>(false);
-        const { visible, cancel } = closeModal('spot_contract_btn_check');
+        const { visible, cancel } = _closeModal(context);
         // 获取 业务账户
         const { queryTable: queryBusinessManager, getBusinesserOrMerchandiser } = handlerManagerList(loading, 1);
         const { tableList: traderList, queryTable: queryTradeManager } = handlerManagerList(loading, 2, true);
@@ -195,8 +193,7 @@ export default defineComponent({
                         // Fixme 6/9 代码修改
                         // 审核通过 GldErmcpSpotContractOperateReq 操作类型-1:保存草稿2:提交申请3:审核通过4:审核拒绝5:撤回6:正常完结7:异常终止
                         requestResultLoadingAndInfo(orderContract, reqParam, loading, ['审核通过成功', '审核失败:']).then(() => {
-                            context.emit('refresh');
-                            cancel();
+                            cancel(true);
                         });
                     },
                     onCancel() {},
@@ -218,30 +215,25 @@ export default defineComponent({
                     // Fixme 6/4 代码修改
                     // 审核拒绝  操作类型-1:保存草稿2:提交申请3:删除4:审核通过5:审核拒绝6:撤销
                     requestResultLoadingAndInfo(orderContract, reqParam, loading, ['审核拒绝成功', '审核失败:']).then(() => {
-                        context.emit('refresh');
-                        cancel();
+                        cancel(true);
                     });
                 },
                 onCancel() {},
             });
         }
-        function queryAccountList() {}
-        watchEffect(() => {
-            if (visible.value) {
-                queryBusinessManager().then(() => {
-                    businesserList.value = getBusinesserOrMerchandiser('22');
-                    merchandiserList.value = getBusinesserOrMerchandiser('23');
-                });
-                queryTradeManager();
-                const { saleuserid, tradeuserid, meruserid, remark } = props.selectedRow;
-
-                saleuserid && (formState.SaleUserID = saleuserid);
-                tradeuserid && (formState.TradeUserID = tradeuserid);
-                meruserid && (formState.MerUserID = meruserid);
 
-                formState.Remark = remark;
-            }
+        queryBusinessManager().then(() => {
+            businesserList.value = getBusinesserOrMerchandiser('22');
+            merchandiserList.value = getBusinesserOrMerchandiser('23');
         });
+        queryTradeManager();
+        const { saleuserid, tradeuserid, meruserid, remark } = props.selectedRow;
+
+        saleuserid && (formState.SaleUserID = saleuserid);
+        tradeuserid && (formState.TradeUserID = tradeuserid);
+        meruserid && (formState.MerUserID = meruserid);
+
+        formState.Remark = remark;
         return {
             visible,
             cancel,

src/views/information/spot-contract/components/delete/index.vue

@@ -16,21 +16,19 @@
                 :loading="loading"
                 @click="submit">确认删除</a-button>
     </template>
-    <InfoDetail :selectedRow="selectedRow"
-                :businessManager="businessManager" />
+    <InfoDetail :selectedRow="selectedRow" />
 
   </a-modal>
 </template>
 
 <script lang="ts">
 import { defineComponent, PropType, ref } from 'vue';
-import { closeModal } from '@/common/setup/modal/index';
 import { Ermcp3ContractRsp } from '@/services/go/ermcp/spot-contract/interface';
 import { Modal } from 'ant-design-vue';
 import { orderContractControl } from '@/views/information/spot-contract/components/setup';
 import { GldErmcpSpotContractOperateReq } from '@/services/proto/spotcontract/interface';
 import InfoDetail from '../infoDetail/index.vue';
-import { ErmcpLoginUserEx } from '@/services/go/ermcp/account/interface';
+import { _closeModal } from '@/common/setup/modal/modal';
 
 export default defineComponent({
     name: 'delete-spot-contract',
@@ -42,13 +40,9 @@ export default defineComponent({
             type: Object as PropType<Ermcp3ContractRsp>,
             default: {},
         },
-        businessManager: {
-            type: Array as PropType<ErmcpLoginUserEx[]>,
-            default: [],
-        },
     },
     setup(props, context) {
-        const { visible, cancel } = closeModal('spot_contract_btn_delete');
+        const { visible, cancel } = _closeModal(context);
         const loading = ref<boolean>(false);
         const maskClosableFlag = ref<boolean>(false);
         // 获取 业务账户
@@ -67,8 +61,7 @@ export default defineComponent({
                     orderContractControl(params, loading)
                         .then((res) => {
                             // 通知上层  刷新数据
-                            context.emit('refresh');
-                            cancel();
+                            cancel(true);
                         })
                         .catch((err) => {});
                 },

src/views/information/spot-contract/components/detail/index.vue

@@ -1,58 +1,57 @@
 <template>
-    <!-- 现货合同详情-->
-    <a-modal class="add-custom custom-detail"
-             title="现货合同详情"
-             v-model:visible="visible"
-             centered
-             :maskClosable="false"
-             @cancel="cancel"
-             width="890px">
-        <template #footer>
-            <a-button key="submit"
-                      type="primary"
-                      :loading="loading"
-                      @click="cancel">关闭
-            </a-button>
+  <!-- 现货合同详情-->
+  <a-modal class="add-custom custom-detail"
+           title="现货合同详情"
+           v-model:visible="visible"
+           centered
+           :maskClosable="false"
+           @cancel="cancel"
+           width="890px">
+    <template #footer>
+      <a-button key="submit"
+                type="primary"
+                :loading="loading"
+                @click="cancel">关闭
+      </a-button>
+    </template>
+    <a-tabs v-model:activeKey="activeKey"
+            @change="tabClick">
+      <a-tab-pane v-for="item in tabList"
+                  :key="item.key"
+                  :tab="item.name">
+      </a-tab-pane>
+    </a-tabs>
+    <InfoDetail :selectedRow="selectedRow"
+                v-if="activeKey == 1" />
+    <div class="tableDatas"
+         v-else>
+      <a-table class="dialogTable"
+               :columns="columns"
+               :data-source="tableList"
+               :pagination="false">
+        <template #status="{ text }">
+          <span class="yellow">{{ text }}</span>
+          <!-- 审核通过'green' 审核拒绝 'orange' 待审核'yellow'   -->
         </template>
-        <a-tabs v-model:activeKey="activeKey"
-                @change="tabClick">
-            <a-tab-pane v-for="item in tabList"
-                        :key="item.key"
-                        :tab="item.name">
-            </a-tab-pane>
-        </a-tabs>
-        <InfoDetail :selectedRow="selectedRow"
-                    :businessManager="businessManager"
-                    v-if="activeKey == 1"/>
-        <div class="tableDatas"
-             v-else>
-            <a-table class="dialogTable"
-                     :columns="columns"
-                     :data-source="tableList"
-                     :pagination="false">
-                <template #status="{ text }">
-                    <span class="yellow">{{ text }}</span>
-                    <!-- 审核通过'green' 审核拒绝 'orange' 待审核'yellow'   -->
-                </template>
 
-                <template #applystatus="{ text }">
-                    <a>{{ getApplyStatusName(text) }}</a>
-                </template>
+        <template #applystatus="{ text }">
+          <a>{{ getApplyStatusName(text) }}</a>
+        </template>
 
-                <!-- 发票金额-->
-                <template #invoicetype="{ text }">
-                    <a>{{ invoiceStatusName(text) }}</a>
-                </template>
+        <!-- 发票金额-->
+        <template #invoicetype="{ text }">
+          <a>{{ invoiceStatusName(text) }}</a>
+        </template>
 
-                <!-- 发票类型-->
-                <template #contracttype="{ text }">
-                    <a>{{ getPlanContractType(text) }}</a>
-                </template>
+        <!-- 发票类型-->
+        <template #contracttype="{ text }">
+          <a>{{ getPlanContractType(text) }}</a>
+        </template>
 
-                <!-- 出入库类型 -->
-                <template #inouttype="{ text }">
-                    <a>{{ InOutTypeName(text) }}</a>
-                </template>
+        <!-- 出入库类型 -->
+        <template #inouttype="{ text }">
+          <a>{{ InOutTypeName(text) }}</a>
+        </template>
 
                 <!-- 款项类型 -->
                 <template #kxtype="{ text }">
@@ -65,217 +64,204 @@
 </template>
 
 <script lang="ts">
-    import {defineComponent, PropType, ref, watchEffect} from 'vue';
-    import {closeModal} from '@/common/setup/modal/index';
-    import {Ermcp3ContractRsp} from '@/services/go/ermcp/spot-contract/interface';
-    import {queryResultLoadingAndInfo} from '@/common/methods/request/resultInfo';
-    import {QueryBusinessFp, QueryBusinessKx} from '@/services/go/ermcp/finance-review';
-    import {QueryBusinessDj, QueryBusinessJs} from '@/services/go/ermcp/business-review';
-    import {QueryAreaStockApply} from '@/services/go/ermcp/inventory-review';
-    import {QueryChangeLog} from '@/services/go/ermcp/spot-contract';
-    import {ErmcpLoginUserEx} from '@/services/go/ermcp/account/interface';
-    import InfoDetail from '../infoDetail/index.vue';
-    import {getApplyStatusName} from '@/common/constants/enumsName';
-    import {getTableColumns} from '@/common/setup/table';
-    import {invoiceStatusName} from '@/views/manage/finance-review/setup';
-    import {getPlanContractType} from '@/views/business/plan/setup';
-    import {InOutTypeName} from '@/views/manage/inventory-review/setup';
+import { defineComponent, PropType, ref } from 'vue';
+import { Ermcp3ContractRsp } from '@/services/go/ermcp/spot-contract/interface';
+import { queryResultLoadingAndInfo } from '@/common/methods/request/resultInfo';
+import { QueryBusinessFp, QueryBusinessKx } from '@/services/go/ermcp/finance-review';
+import { QueryBusinessDj, QueryBusinessJs } from '@/services/go/ermcp/business-review';
+import { QueryAreaStockApply } from '@/services/go/ermcp/inventory-review';
+import { QueryChangeLog } from '@/services/go/ermcp/spot-contract';
+import { ErmcpLoginUserEx } from '@/services/go/ermcp/account/interface';
+import InfoDetail from '../infoDetail/index.vue';
+import { getApplyStatusName } from '@/common/constants/enumsName';
+import { getTableColumns } from '@/common/setup/table';
+import { invoiceStatusName } from '@/views/manage/finance-review/setup';
+import { getPlanContractType } from '@/views/business/plan/setup';
+import { InOutTypeName } from '@/views/manage/inventory-review/setup';
+import { _closeModal } from '@/common/setup/modal/modal';
 
-    export default defineComponent({
-        name: 'spot-contract-detail',
-        components: {InfoDetail},
-        props: {
-            selectedRow: {
-                type: Object as PropType<Ermcp3ContractRsp>,
-                default: {},
-            },
-            businessManager: {
-                type: Array as PropType<ErmcpLoginUserEx[]>,
-                default: [],
-            },
+export default defineComponent({
+    name: 'spot-contract-detail',
+    components: { InfoDetail },
+    props: {
+        selectedRow: {
+            type: Object as PropType<Ermcp3ContractRsp>,
+            default: {},
         },
-        setup: function (props, context) {
-            const {visible, cancel} = closeModal('detail');
-            const tabList = ref<{ key: number; name: string }[]>([]);
-
-            const activeKey = ref<number>(1);
+    },
+    setup: function(props, context) {
+        const { visible, cancel } = _closeModal(context);
+        const tabList = ref<{ key: number; name: string }[]>([]);
 
-            const loading = ref<boolean>(false);
-            const tableList = ref<any[]>([]);
-            // 表头数据
-            const {columns, registerColumn} = getTableColumns();
-            watchEffect(() => {
-                if (visible.value && props.selectedRow.contracctstatus) {
-                    // 审核拒绝和未提交不显示后面的选项
+        const activeKey = ref<number>(1);
 
-                    console.log(props.selectedRow.contracctstatus);
-
-                    tabList.value = [0, 4, 6].includes(props.selectedRow.contracctstatus)
-                        ? [{key: 1, name: '合同详情'}]
-                        : props.selectedRow.contracttype === 1
-                            ? [
-                                {key: 1, name: '合同详情'},
-                                {key: 2, name: '点价记录'},
-                                {key: 3, name: '交收记录'},
-                                {key: 4, name: '款项记录'},
-                                {key: 5, name: '发票记录'},
-                                {key: 6, name: '入库记录'},
-                                {key: 8, name: '变更记录'},
-                            ]
-                            : [
-                                {key: 1, name: '合同详情'},
-                                {key: 2, name: '点价记录'},
-                                {key: 3, name: '交收记录'},
-                                {key: 4, name: '款项记录'},
-                                {key: 5, name: '发票记录'},
-                                {key: 7, name: '出库记录'},
-                                {key: 8, name: '变更记录'},
-                            ];
-                    activeKey.value = 1;
-                }
-            });
+        const loading = ref<boolean>(false);
+        const tableList = ref<any[]>([]);
+        // 表头数据
+        const { columns, registerColumn } = getTableColumns();
 
-            function tabClick() {
-                const relatedid = props.selectedRow.spotcontractid;
-                switch (activeKey.value) {
-                    case 1:
-                        break;
-                    case 2: // 点价记录
-                        registerColumn('table_pcweb_someprice_detail_dj', []);
-                        queryResultLoadingAndInfo(QueryBusinessDj, loading, {relatedid}).then((res) => {
-                            tableList.value = res;
-                        });
-                        break;
-                    case 3: // 交收记录
-                        registerColumn('table_pcweb_someprice_detail_js', []);
-                        queryResultLoadingAndInfo(QueryBusinessJs, loading, {relatedid}).then((res) => {
-                            tableList.value = res;
-                        });
-                        break;
-                    case 4: //款项记录
-                        registerColumn('table_pcweb_someprice_detail_kx', []);
-                        queryResultLoadingAndInfo(QueryBusinessKx, loading, {relatedid}).then((res) => {
-                            tableList.value = res;
-                        });
-                        break;
-                    case 5: // 发票记录
-                        registerColumn('table_pcweb_someprice_detail_fp', []);
-                        queryResultLoadingAndInfo(QueryBusinessFp, loading, {relatedid}).then((res) => {
-                            tableList.value = res;
-                        });
-                        break;
-                    case 6: // 入库记录
-                        registerColumn('table_pcweb_someprice_detail_stock', []);
-                        queryResultLoadingAndInfo(QueryAreaStockApply, loading, {
-                            spotcontractid: relatedid,
-                            inouttype: '1,3',
-                        }).then((res) => {
-                            tableList.value = res;
-                        });
-                        break;
-                    case 7: // 出库记录
-                        registerColumn('table_pcweb_someprice_detail_stock_out', []);
-                        queryResultLoadingAndInfo(QueryAreaStockApply, loading, {
-                            spotcontractid: relatedid,
-                            inouttype: '2,4',
-                        }).then((res) => {
-                            tableList.value = res;
-                        });
-                        break;
-                    case 8: //// 变更记录
-                        registerColumn('table_pcweb_someprice_detail_change', []);
-                        queryResultLoadingAndInfo(QueryChangeLog, loading, {RelatedId: relatedid}).then((res) => {
-                            tableList.value = res;
-                        });
-                        break;
-                }
+        // 审核拒绝和未提交不显示后面的选项
+        tabList.value = [0, 4, 6].includes(props.selectedRow.contracctstatus)
+            ? [{ key: 1, name: '合同详情' }]
+            : props.selectedRow.contracttype === 1
+            ? [
+                  { key: 1, name: '合同详情' },
+                  { key: 2, name: '点价记录' },
+                  { key: 3, name: '交收记录' },
+                  { key: 4, name: '款项记录' },
+                  { key: 5, name: '发票记录' },
+                  { key: 6, name: '入库记录' },
+                  { key: 8, name: '变更记录' },
+              ]
+            : [
+                  { key: 1, name: '合同详情' },
+                  { key: 2, name: '点价记录' },
+                  { key: 3, name: '交收记录' },
+                  { key: 4, name: '款项记录' },
+                  { key: 5, name: '发票记录' },
+                  { key: 7, name: '出库记录' },
+                  { key: 8, name: '变更记录' },
+              ];
+        activeKey.value = 1;
+        function tabClick() {
+            const relatedid = props.selectedRow.spotcontractid;
+            switch (activeKey.value) {
+                case 1:
+                    break;
+                case 2: // 点价记录
+                    registerColumn('table_pcweb_someprice_detail_dj', []);
+                    queryResultLoadingAndInfo(QueryBusinessDj, loading, { relatedid }).then((res) => {
+                        tableList.value = res;
+                    });
+                    break;
+                case 3: // 交收记录
+                    registerColumn('table_pcweb_someprice_detail_js', []);
+                    queryResultLoadingAndInfo(QueryBusinessJs, loading, { relatedid }).then((res) => {
+                        tableList.value = res;
+                    });
+                    break;
+                case 4: //款项记录
+                    registerColumn('table_pcweb_someprice_detail_kx', []);
+                    queryResultLoadingAndInfo(QueryBusinessKx, loading, { relatedid }).then((res) => {
+                        tableList.value = res;
+                    });
+                    break;
+                case 5: // 发票记录
+                    registerColumn('table_pcweb_someprice_detail_fp', []);
+                    queryResultLoadingAndInfo(QueryBusinessFp, loading, { relatedid }).then((res) => {
+                        tableList.value = res;
+                    });
+                    break;
+                case 6: // 入库记录
+                    registerColumn('table_pcweb_someprice_detail_stock', []);
+                    queryResultLoadingAndInfo(QueryAreaStockApply, loading, {
+                        spotcontractid: relatedid,
+                        inouttype: '1,3',
+                    }).then((res) => {
+                        tableList.value = res;
+                    });
+                    break;
+                case 7: // 出库记录
+                    registerColumn('table_pcweb_someprice_detail_stock_out', []);
+                    queryResultLoadingAndInfo(QueryAreaStockApply, loading, {
+                        spotcontractid: relatedid,
+                        inouttype: '2,4',
+                    }).then((res) => {
+                        tableList.value = res;
+                    });
+                    break;
+                case 8: //// 变更记录
+                    registerColumn('table_pcweb_someprice_detail_change', []);
+                    queryResultLoadingAndInfo(QueryChangeLog, loading, { RelatedId: relatedid }).then((res) => {
+                        tableList.value = res;
+                    });
+                    break;
             }
+        }
 
-            return {
-                visible,
-                cancel,
-                loading,
-                maskClosableFlag: false,
-                activeKey,
-                columns,
-                tableList,
-                tabList,
-                tabClick,
-                getApplyStatusName,
-                invoiceStatusName,
-                getPlanContractType,
-                InOutTypeName,
-            };
-        },
-    });
+        return {
+            visible,
+            cancel,
+            loading,
+            maskClosableFlag: false,
+            activeKey,
+            columns,
+            tableList,
+            tabList,
+            tabClick,
+            getApplyStatusName,
+            invoiceStatusName,
+            getPlanContractType,
+            InOutTypeName,
+        };
+    },
+});
 </script>
 
 <style lang="less">
-    .custom-detail {
-        .ant-modal-content {
-            .ant-modal-body {
-                padding-top: 0;
-                padding-left: 0;
-                padding-right: 0;
+.custom-detail {
+    .ant-modal-content {
+        .ant-modal-body {
+            padding-top: 0;
+            padding-left: 0;
+            padding-right: 0;
 
-                .ant-tabs {
-                    background: @m-black11;
-                    width: 100%;
-                    padding: 0 24px;
-
-                    .ant-tabs-bar {
-                        margin-bottom: 0;
-                        border-bottom: 0;
-                    }
-
-                    .anticon {
-                        color: #88a0ae;
-                    }
+            .ant-tabs {
+                background: @m-black11;
+                width: 100%;
+                padding: 0 24px;
 
-                    .ant-tabs-nav-container {
-                        .ant-tabs-nav-wrap {
-                            .ant-tabs-nav {
-                                .ant-tabs-tab {
-                                    width: 70px;
-                                    margin-right: 43px;
-                                    text-align: center;
-                                    font-size: 16px;
-                                    color: #88a0ae;
-                                    padding: 0;
-                                    line-height: 45px;
-                                }
+                .ant-tabs-bar {
+                    margin-bottom: 0;
+                    border-bottom: 0;
+                }
+                .anticon {
+                    color: #88a0ae;
+                }
+                .ant-tabs-nav-container {
+                    .ant-tabs-nav-wrap {
+                        .ant-tabs-nav {
+                            .ant-tabs-tab {
+                                width: 70px;
+                                margin-right: 43px;
+                                text-align: center;
+                                font-size: 16px;
+                                color: #88a0ae;
+                                padding: 0;
+                                line-height: 45px;
+                            }
 
-                                .ant-tabs-tab-active.ant-tabs-tab {
-                                    color: #3a87f7;
-                                }
+                            .ant-tabs-tab-active.ant-tabs-tab {
+                                color: #3a87f7;
+                            }
 
-                                .ant-tabs-ink-bar {
-                                    width: 70px !important;
-                                    background: #3a87f7;
-                                    .rounded-corners(1px);
-                                }
+                            .ant-tabs-ink-bar {
+                                width: 70px !important;
+                                background: #3a87f7;
+                                .rounded-corners(1px);
                             }
                         }
                     }
                 }
             }
         }
+    }
 
-        .tableDatas {
-            margin-top: 26px;
-            padding: 0 24px;
-            overflow: hidden;
+    .tableDatas {
+        margin-top: 26px;
+        padding: 0 24px;
+        overflow: hidden;
 
-            .dialogTable {
-                width: 100%;
-                overflow: overlay;
-            }
+        .dialogTable {
+            width: 100%;
+            overflow: overlay;
         }
+    }
 
-        .ant-form.inlineForm {
-            margin-top: 20px;
-            padding: 0 24px;
-        }
+    .ant-form.inlineForm {
+        margin-top: 20px;
+        padding: 0 24px;
     }
+}
 </style
 >;

src/views/information/spot-contract/components/finish/index.vue

@@ -23,13 +23,13 @@
 
 <script lang="ts">
 import { defineComponent, PropType, ref } from 'vue';
-import { closeModal } from '@/common/setup/modal/index';
 import { Ermcp3ContractRsp } from '@/services/go/ermcp/spot-contract/interface';
 import { Modal } from 'ant-design-vue';
 import { SpotContractOperateReq } from '@/services/proto/spotcontract/interface';
 import InfoDetail from '../infoDetail/index.vue';
 import { requestResultLoadingAndInfo } from '@/common/methods/request/resultInfo';
 import { spotContractStatus } from '@/services/proto/spotcontract';
+import { _closeModal } from '@/common/setup/modal/modal';
 
 export default defineComponent({
     name: 'spot-contract-finish',
@@ -41,7 +41,7 @@ export default defineComponent({
         },
     },
     setup(props, context) {
-        const { visible, cancel } = closeModal('spot_contract_btn_finish');
+        const { visible, cancel } = _closeModal(context);
         const maskClosableFlag = ref<boolean>(false);
         const loading = ref<boolean>(false);
         function submit() {
@@ -59,8 +59,7 @@ export default defineComponent({
                     // Fixme 6/4 代码修改
                     // 合同完结 SpotContractOperateReq operateType 操作类型-1:保存草稿(作废)2:提交申请(作废)3:审核通过4:审核拒绝(作废)5:撤回(作废)6:正常完结7:异常终止
                     requestResultLoadingAndInfo(spotContractStatus, reqParam, loading, ['合同正常完结', '合同完结失败:']).then(() => {
-                        context.emit('refresh');
-                        cancel();
+                        cancel(true);
                     });
                 },
                 onCancel() {},

src/views/information/spot-contract/components/infoDetail/index.vue

@@ -8,13 +8,12 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType, ref, watchEffect } from 'vue';
+import { defineComponent, PropType } from 'vue';
 import { Ermcp3ContractRsp } from '@/services/go/ermcp/spot-contract/interface';
 import { formatValue } from '@/common/methods';
-import { ErmcpLoginUserEx } from '@/services/go/ermcp/account/interface';
 import Detail from '../common-detail/index.vue';
 import { Des, handleDesList } from '@/common/components/commonDes';
-import { handlerManagerList } from '@/common/setup/user';
+import { businessManager, findManagerName } from '../../list/setup';
 
 export default defineComponent({
     name: 'spot-contract-info-detail',
@@ -24,30 +23,19 @@ export default defineComponent({
             type: Object as PropType<Ermcp3ContractRsp>,
             default: {},
         },
-        businessManager: {
-            type: Array as PropType<ErmcpLoginUserEx[]>,
-            default: [],
-        },
     },
     setup(props, context) {
-        const loading = ref<boolean>(false);
         // 预览附件
         const { desList, getDesList } = handleDesList();
-        // 获取 业务账户
-        const { findManagerName } = handlerManagerList(loading, 1);
-        watchEffect(() => {
-            if (props.selectedRow.contracctstatus) {
-                const data = props.selectedRow;
-                const list = [
-                    { label: '保证金', value: formatValue(data.contractmargin) },
-                    { label: '业务员', value: formatValue(findManagerName(data.saleuserid, props.businessManager)) },
-                    { label: '跟单员', value: formatValue(findManagerName(data.meruserid, props.businessManager)) },
-                    { label: '交易用户', value: formatValue(data.tradeusername) },
-                    { label: '备注', value: formatValue(data.remark) },
-                ];
-                getDesList(list);
-            }
-        });
+        const data = props.selectedRow;
+        const list = [
+            { label: '保证金', value: formatValue(data.contractmargin) },
+            { label: '业务员', value: formatValue(findManagerName(data.saleuserid, businessManager.value)) },
+            { label: '跟单员', value: formatValue(findManagerName(data.meruserid, businessManager.value)) },
+            { label: '交易用户', value: formatValue(data.tradeusername) },
+            { label: '备注', value: formatValue(data.remark) },
+        ];
+        getDesList(list);
         return {
             desList,
         };

src/views/information/spot-contract/components/modify/index.vue

@@ -411,8 +411,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType, ref, watchEffect } from 'vue';
-import { closeModal } from '@/common/setup/modal/index';
+import { defineComponent, PropType, ref } from 'vue';
 import { getUserName, getUsrId } from '@/services/bus/user';
 import { getGoodsList } from '@/services/bus/goods';
 import { Goods } from '@/services/go/ermcp/goodsInfo/interface';
@@ -428,6 +427,7 @@ import { ErmcpLoginUser } from '@/services/go/ermcp/account/interface';
 import { handlerManagerList } from '@/common/setup/user';
 import { getUploadImg } from '@/common/setup/upload';
 import UploadImg from '@/common/components/uploadImg/index.vue';
+import { _closeModal } from '@/common/setup/modal/modal';
 
 export default defineComponent({
     name: 'spot_contract_btn_modify',
@@ -439,7 +439,7 @@ export default defineComponent({
     },
     components: { UploadImg },
     setup(props, context) {
-        const { visible, cancel } = closeModal('spot_contract_btn_modify');
+        const { visible, cancel } = _closeModal(context);
         const loading = ref<boolean>(false);
         const { sendReq } = addContractReq();
         const { formState, businessType } = handleFromState();
@@ -468,48 +468,44 @@ export default defineComponent({
         // 现货商品列表
         const goodsList = ref<Goods[]>([]);
         const { uploadImgAction, uploadImgList, handleImg } = getUploadImg();
-        watchEffect(() => {
-            if (visible.value) {
-                queryCustomList();
-                getDeliveryGoods();
-                goodsList.value = getGoodsList();
-                queryBusinessManager().then(() => {
-                    businesserList.value = getBusinesserOrMerchandiser('22');
-                    merchandiserList.value = getBusinesserOrMerchandiser('23');
-                });
-                queryTradeManager();
-                mergeTwoObj(formState, props.selectedRow);
-                isSell.value = formState.ContractType === 1 ? false : true;
-                const { deliverygoodsid, qty, price, wrstandardid, spotgoodsbrandid, currencyid, attachment, deliverystartdate, deliveryenddate, startdate, enddate } = props.selectedRow;
-                if (deliverygoodsid) {
-                    deliveryGoodsChange(deliverygoodsid);
-                    if (wrstandardid) {
-                        WrStandardChange(wrstandardid);
-                        formState.WrStandardID = wrstandardid;
-                        formState.SpotGoodsBrandID = spotgoodsbrandid;
-                    }
-                }
-                formState.Qty = qty.toString();
-                formState.Price = price.toString();
-                formState.CurrencyID = currencyid;
-                formState.ContractAttachment = attachment;
-                if (deliverystartdate) {
-                    deliveryDate.value.push(moment(deliverystartdate));
-                }
-                if (deliveryenddate) {
-                    deliveryDate.value.push(moment(deliveryenddate));
-                }
-                if (startdate) {
-                    priceDate.value.push(moment(startdate));
-                }
-                if (enddate) {
-                    priceDate.value.push(moment(enddate));
-                }
-                if (attachment) {
-                    uploadImgList.value = handleImg(attachment);
-                }
-            }
+        queryCustomList();
+        getDeliveryGoods();
+        goodsList.value = getGoodsList();
+        queryBusinessManager().then(() => {
+            businesserList.value = getBusinesserOrMerchandiser('22');
+            merchandiserList.value = getBusinesserOrMerchandiser('23');
         });
+        queryTradeManager();
+        mergeTwoObj(formState, props.selectedRow);
+        isSell.value = formState.ContractType === 1 ? false : true;
+        const { deliverygoodsid, qty, price, wrstandardid, spotgoodsbrandid, currencyid, attachment, deliverystartdate, deliveryenddate, startdate, enddate } = props.selectedRow;
+        if (deliverygoodsid) {
+            deliveryGoodsChange(deliverygoodsid);
+            if (wrstandardid) {
+                WrStandardChange(wrstandardid);
+                formState.WrStandardID = wrstandardid;
+                formState.SpotGoodsBrandID = spotgoodsbrandid;
+            }
+        }
+        formState.Qty = qty.toString();
+        formState.Price = price.toString();
+        formState.CurrencyID = currencyid;
+        formState.ContractAttachment = attachment;
+        if (deliverystartdate) {
+            deliveryDate.value.push(moment(deliverystartdate));
+        }
+        if (deliveryenddate) {
+            deliveryDate.value.push(moment(deliveryenddate));
+        }
+        if (startdate) {
+            priceDate.value.push(moment(startdate));
+        }
+        if (enddate) {
+            priceDate.value.push(moment(enddate));
+        }
+        if (attachment) {
+            uploadImgList.value = handleImg(attachment);
+        }
         function submit() {
             validateAction<FormState>(formRef, formState).then((param) => {
                 const id = getUsrId();
@@ -536,8 +532,7 @@ export default defineComponent({
 
                 sendReq(param, loading, 2)
                     .then((res) => {
-                        context.emit('refresh');
-                        cancel();
+                        cancel(true);
                     })
                     .catch((err) => {});
             });

src/views/information/spot-contract/list/checkpending/index.vue

@@ -3,141 +3,125 @@
   <div class="spot-contract-peddding"
        :loading="loading">
     <filterCustomTable @search="updateColumn">
-      <BtnList :btnList="commonBtn" />
+      <BtnList :btnList="firstBtn"
+               @click="openComponent" />
     </filterCustomTable>
-    <contextMenu :contextMenuList="forDataBtn">
-      <a-table :columns="columns"
-               class="topTable"
-               :pagination="false"
-               rowKey="key"
-               :expandedRowKeys="expandedRowKeys"
-               :customRow="Rowclick"
-               :data-source="tableList"
-               :scroll="{ x: 'calc(100% - 180px)', y: 'calc(100vh - 163px)' }">
-        <!-- 额外的展开行 -->
-        <template #expandedRowRender="{  }">
-          <BtnList :btnList="forDataBtn" />
-        </template>
-        <!-- <template #userinfotype="{ text }">
-                          <a>{{ text === '2' ? '企业' : '个人'}}</a>
-                        </template> -->
+    <a-table :columns="columns"
+             class="topTable"
+             :pagination="false"
+             rowKey="key"
+             :expandedRowKeys="expandedRowKeys"
+             :customRow="Rowclick"
+             :data-source="tableList"
+             :scroll="{ x: 'calc(100% - 180px)', y: 'calc(100vh - 163px)' }">
+      <!-- 额外的展开行 -->
+      <template #expandedRowRender="{ record }">
+        <BtnList :btnList="secondBtn"
+                 :record="record"
+                 @click="openComponent" />
+      </template>
+      <template #biztype="{ text }">
+        <a>{{ getBizTypeName(text) }}</a>
+      </template>
 
-        <template #biztype="{ text }">
-          <a>{{ getBizTypeName(text) }}</a>
-        </template>
+      <template #pricetype="{ text }">
+        <a>{{ getPriceTypeName(text) }}</a>
+      </template>
 
-        <template #pricetype="{ text }">
-          <a>{{ getPriceTypeName(text) }}</a>
-        </template>
+      <template #contracctstatus="{ text }">
+        <a>{{ getContractStatusName(text) }}</a>
+      </template>
 
-        <template #contracctstatus="{ text }">
-          <a>{{ getContractStatusName(text) }}</a>
-        </template>
-
-        <template #contracttype="{ text }">
-          <a>{{ getContractTypeName(text) }}</a>
-        </template>
-        <!-- 对手方 -->
-        <template #negative="{ record }">
-          <a>{{ record.contracttype === 1 ? record.sellusername : record.buyusername }}</a>
-        </template>
-        <template #startdate="{ record }">
-          <a>{{ formatValue(formatTime(record.startdate, "d") + '--' + formatTime(record.enddate, "d")) }}</a>
-        </template>
-        <!-- 交收期 -->
-        <template #deliverystartdate="{ record }">
-          <a>{{ formatValue(formatTime(record.deliverystartdate, "d") + '--' +
+      <template #contracttype="{ text }">
+        <a>{{ getContractTypeName(text) }}</a>
+      </template>
+      <!-- 对手方 -->
+      <template #negative="{ record }">
+        <a>{{ record.contracttype === 1 ? record.sellusername : record.buyusername }}</a>
+      </template>
+      <template #startdate="{ record }">
+        <a>{{ formatValue(formatTime(record.startdate, "d") + '--' + formatTime(record.enddate, "d")) }}</a>
+      </template>
+      <!-- 交收期 -->
+      <template #deliverystartdate="{ record }">
+        <a>{{ formatValue(formatTime(record.deliverystartdate, "d") + '--' +
                         formatTime(record.deliveryenddate, "d")) }}</a>
-        </template>
-        <!-- 业务员 -->
-        <template #saleuserid="{ record }">
-          <a>{{ findManagerName(record.saleuserid) }}</a>
-        </template>
+      </template>
+      <!-- 业务员 -->
+      <template #saleuserid="{ record }">
+        <a>{{ findManagerName(record.saleuserid) }}</a>
+      </template>
 
-        <!-- 跟单员 -->
-        <template #meruserid="{ record }">
-          <a>{{ findManagerName(record.meruserid) }}</a>
-        </template>
+      <!-- 跟单员 -->
+      <template #meruserid="{ record }">
+        <a>{{ findManagerName(record.meruserid) }}</a>
+      </template>
 
-      </a-table>
+    </a-table>
+    <!-- 右键 -->
+    <contextMenu :contextMenu="contextMenu"
+                 @cancel="closeContext"
+                 :list="secondBtn">
     </contextMenu>
-    <!-- 现货合同: 详情 -->
-    <SpotContractDeatil :selectedRow="selectedRow"
-                        :businessManager="businessManager"
-                        @refresh="queryTable" />
-    <!-- 现货合同: 审核 -->
-    <Check :selectedRow="selectedRow"
-           @refresh="queryTable" />
-    <!-- 现货合同: 撤销 -->
-    <Cancel :selectedRow="selectedRow"
-            :businessManager="businessManager"
-            @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 { AddSpotContract, SpotContractDeatil, Check, Cancel, filterCustomTable } from '../../components';
-import { queryTableList, Ermcp3ContractRsp } from '../index';
+import { filterCustomTable } from '../../components';
 import { getBizTypeName, getContractStatusName, getContractTypeName, getPriceTypeName } from '@/common/constants/enumsName';
-import { Column, ColumnType } from '@/common/setup/table';
+import { queryTableList } from '@/common/setup/table';
 import { formatTime, formatValue } from '@/common/methods';
-import { handlerManagerList } from '@/common/setup/user';
+import { queryBusinessManager, findManagerName, tableFilterCB } from '../setup';
+import { Ermcp3ContractRsp } from '@/services/go/ermcp/spot-contract/interface';
+import { QuerySpotContract } from '@/services/go/ermcp/spot-contract';
+
+import BtnList from '@/common/components/btnList/index.vue';
+import contextMenu from '@/common/components/contextMenu/temp.vue';
+import { defineAsyncComponent, defineComponent } from 'vue';
+import { ModalEnum } from '@/common/constants/modalNameEnum';
+import { ComposeTableParam, handleComposeTable } from '@/common/setup/table/compose';
+
+const Detail = defineAsyncComponent(() => import('../../components/detail/index.vue'));
+const Check = defineAsyncComponent(() => import('../../components/check/index.vue'));
+const Cancel = defineAsyncComponent(() => import('../../components/cancel/index.vue'));
 
 export default defineComponent({
     name: 'spot-contract-peddding',
     components: {
         filterCustomTable,
         contextMenu,
-        AddSpotContract,
-        SpotContractDeatil,
-        Check,
-        Cancel,
+        [ModalEnum.detail]: Detail,
+        [ModalEnum.spot_contract_btn_check]: Check,
+        [ModalEnum.spot_contract_btn_cancel]: Cancel,
         BtnList,
     },
     setup() {
-        // 表头数据
-        const { columns, registerColumn, updateColumn } = getTableColumns();
-        // 表格事件
-        const { expandedRowKeys, selectedRow, Rowclick } = getTableEvent<Ermcp3ContractRsp>({});
-        // 表格操作按钮列表
-        const { commonBtn, forDataBtn } = getBtnList('spot_contract_checkpending', true);
         // 表格列表数据
-        const { loading, tableList, queryTable } = queryTableList(2);
-        // 获取 业务账户
-        const { tableList: businessManager, queryTable: queryBusinessManager, findManagerName } = handlerManagerList(loading, 1);
-
-        initData(() => {
-            // 获取列表数据
-            queryTable();
-            // 注册表头信息 过滤
-            registerColumn('table_pcweb_delivery', ['contracttype', 'pricetype', 'contractno'], (e: Column, item: ColumnType, filtered: any) => {
-                if (e.columntitle === '对手方') {
-                    item.onFilter = (value: string, record: Ermcp3ContractRsp) => {
-                        if (record.contracttype === 1) {
-                            //采购方
-                            return record.sellusername.includes(value);
-                        } else {
-                            // 销售
-                            return record.buyusername.includes(value);
-                        }
-                    };
-                    item.filteredValue = filtered.negative || null;
-                }
-            });
+        const { loading, tableList, queryTable } = queryTableList<Ermcp3ContractRsp>();
+        // 获取列表数据
+        const queryTableAction = () => {
+            queryTable(QuerySpotContract, { querytype: 2 });
+            // 获取 业务账户
             queryBusinessManager();
-        });
-        return {
-            columns,
+        };
+        // 表格通用逻辑
+        const param: ComposeTableParam = {
+            queryFn: queryTableAction,
+            menuType: 'spot_contract_checkpending',
+            tableName: 'table_pcweb_delivery',
+            tableFilterKey: ['contracttype', 'pricetype', 'contractno'],
+            tableFilterCB,
+            isDetail: true,
+        };
 
-            expandedRowKeys,
-            selectedRow,
-            Rowclick,
-            commonBtn,
-            forDataBtn,
+        return {
+            ...handleComposeTable<Ermcp3ContractRsp>(param),
             loading,
             tableList,
-            updateColumn,
             queryTable,
             getBizTypeName,
             getPriceTypeName,
@@ -146,7 +130,6 @@ export default defineComponent({
             formatTime,
             formatValue,
             findManagerName,
-            businessManager,
         };
     },
 });

src/views/information/spot-contract/list/finished/index.vue

@@ -3,133 +3,121 @@
   <div class="spot-contract-done">
     <filterCustomTable @search="updateColumn"
                        :loading="loading">
-      <BtnList :btnList="commonBtn" />
+      <BtnList :btnList="firstBtn"
+               @click="openComponent" />
     </filterCustomTable>
-    <contextMenu :contextMenuList="forDataBtn">
-      <a-table :columns="columns"
-               class="topTable"
-               :pagination="false"
-               :expandedRowKeys="expandedRowKeys"
-               :customRow="Rowclick"
-               rowKey="key"
-               :data-source="tableList"
-               :scroll="{ x: 'calc(100% - 180px)', y: 'calc(100vh - 163px)' }">
-        <!-- 额外的展开行 -->
-        <template #expandedRowRender="{  }">
-          <BtnList :btnList="forDataBtn" />
-        </template>
-        <!-- <template #userinfotype="{ text }">
-                  <a>{{ text === '2' ? '企业' : '个人'}}</a>
-                </template> -->
-        <template #biztype="{ text }">
-          <a>{{ getBizTypeName(text) }}</a>
-        </template>
+    <a-table :columns="columns"
+             class="topTable"
+             :pagination="false"
+             :expandedRowKeys="expandedRowKeys"
+             :customRow="Rowclick"
+             rowKey="key"
+             :data-source="tableList"
+             :scroll="{ x: 'calc(100% - 180px)', y: 'calc(100vh - 163px)' }">
+      <!-- 额外的展开行 -->
+      <template #expandedRowRender="{ record }">
+        <BtnList :btnList="secondBtn"
+                 :record="record"
+                 @click="openComponent" />
+      </template>
+      <template #biztype="{ text }">
+        <a>{{ getBizTypeName(text) }}</a>
+      </template>
 
-        <template #pricetype="{ text }">
-          <a>{{ getPriceTypeName(text) }}</a>
-        </template>
+      <template #pricetype="{ text }">
+        <a>{{ getPriceTypeName(text) }}</a>
+      </template>
 
-        <template #contracctstatus="{ text }">
-          <a>{{ getContractStatusName(text) }}</a>
-        </template>
+      <template #contracctstatus="{ text }">
+        <a>{{ getContractStatusName(text) }}</a>
+      </template>
 
-        <template #contracttype="{ text }">
-          <a>{{ getContractTypeName(text) }}</a>
-        </template>
-        <!-- 对手方 -->
-        <template #negative="{ record }">
-          <a>{{ record.contracttype === 1 ? record.sellusername : record.buyusername }}</a>
-        </template>
-        <template #startdate="{ record }">
-          <a>{{ formatValue(formatTime(record.startdate, "d") + '--' + formatTime(record.enddate, "d")) }}</a>
-        </template>
-        <!-- 交收期 -->
-        <template #deliverystartdate="{ record }">
-          <a>{{ formatValue(formatTime(record.deliverystartdate, "d") + '--' +
+      <template #contracttype="{ text }">
+        <a>{{ getContractTypeName(text) }}</a>
+      </template>
+      <!-- 对手方 -->
+      <template #negative="{ record }">
+        <a>{{ record.contracttype === 1 ? record.sellusername : record.buyusername }}</a>
+      </template>
+      <template #startdate="{ record }">
+        <a>{{ formatValue(formatTime(record.startdate, "d") + '--' + formatTime(record.enddate, "d")) }}</a>
+      </template>
+      <!-- 交收期 -->
+      <template #deliverystartdate="{ record }">
+        <a>{{ formatValue(formatTime(record.deliverystartdate, "d") + '--' +
                         formatTime(record.deliveryenddate, "d")) }}</a>
-        </template>
+      </template>
 
-        <!-- 业务员 -->
-        <template #saleuserid="{ record }">
-          <a>{{ findManagerName(record.saleuserid) }}</a>
-        </template>
+      <!-- 业务员 -->
+      <template #saleuserid="{ record }">
+        <a>{{ findManagerName(record.saleuserid) }}</a>
+      </template>
 
-        <!-- 跟单员 -->
-        <template #meruserid="{ record }">
-          <a>{{ findManagerName(record.meruserid) }}</a>
-        </template>
+      <!-- 跟单员 -->
+      <template #meruserid="{ record }">
+        <a>{{ findManagerName(record.meruserid) }}</a>
+      </template>
 
-      </a-table>
+    </a-table>
+    <!-- 右键 -->
+    <contextMenu :contextMenu="contextMenu"
+                 @cancel="closeContext"
+                 :list="secondBtn">
     </contextMenu>
-    <!-- 现货合同: 详情 -->
-    <SpotContractDeatil :selectedRow="selectedRow"
-                        :businessManager="businessManager"
-                        @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 { SpotContractDeatil, filterCustomTable } from '../../components';
+import { defineComponent, queryTableList, _getBtnList } from '@/common/export/table';
+import { queryBusinessManager, findManagerName, tableFilterCB } from '../setup';
 
-import { queryTableList, Ermcp3ContractRsp } from '../index';
 import { getBizTypeName, getContractStatusName, getContractTypeName, getPriceTypeName } from '@/common/constants/enumsName';
-import { Column, ColumnType } from '@/common/setup/table';
 import { formatTime, formatValue } from '@/common/methods';
-import { handlerManagerList } from '@/common/setup/user';
+
+import BtnList from '@/common/components/btnList/index.vue';
+import contextMenu from '@/common/components/contextMenu/temp.vue';
+import { defineAsyncComponent } from 'vue';
+import { ModalEnum } from '@/common/constants/modalNameEnum';
+import { ComposeTableParam, handleComposeTable } from '@/common/setup/table/compose';
+import { Ermcp3ContractRsp } from '@/services/go/ermcp/spot-contract/interface';
+import { QuerySpotContract } from '@/services/go/ermcp/spot-contract';
+
+const Detail = defineAsyncComponent(() => import('../../components/detail/index.vue'));
 
 export default defineComponent({
     name: 'spot-contract-done',
     components: {
-        filterCustomTable,
         contextMenu,
-        SpotContractDeatil,
         BtnList,
+        [ModalEnum.detail]: Detail,
     },
     setup() {
-        // 表头数据
-        const { columns, registerColumn, updateColumn } = getTableColumns();
-        // 表格事件
-        const { expandedRowKeys, selectedRow, Rowclick } = getTableEvent<Ermcp3ContractRsp>({});
-        // 表格操作按钮列表
-        const { commonBtn, forDataBtn } = getBtnList('spot_contract_finished', true);
         // 表格列表数据
-        const { loading, tableList, queryTable } = queryTableList(4);
-
-        // 获取 业务账户
-        const { tableList: businessManager, queryTable: queryBusinessManager, findManagerName } = handlerManagerList(loading, 1);
-
-        initData(() => {
-            // 获取列表数据
-            queryTable();
-            // 注册表头信息 过滤
-            registerColumn('table_pcweb_delivery', ['contracttype', 'pricetype', 'contractno'], (e: Column, item: ColumnType, filtered: any) => {
-                if (e.columntitle === '对手方') {
-                    item.onFilter = (value: string, record: Ermcp3ContractRsp) => {
-                        if (record.contracttype === 1) {
-                            //采购方
-                            return record.sellusername.includes(value);
-                        } else {
-                            // 销售
-                            return record.buyusername.includes(value);
-                        }
-                    };
-                    item.filteredValue = filtered.negative || null;
-                }
-            });
+        const { loading, tableList, queryTable } = queryTableList<Ermcp3ContractRsp>();
+        // 获取列表数据
+        const queryTableAction = () => {
+            queryTable(QuerySpotContract, { querytype: 4 });
+            // 获取 业务账户
             queryBusinessManager();
-        });
-        return {
-            columns,
+        };
+        // 表格通用逻辑
+        const param: ComposeTableParam = {
+            queryFn: queryTableAction,
+            menuType: 'spot_contract_finished',
+            tableName: 'table_pcweb_delivery',
+            tableFilterKey: ['contracttype', 'pricetype', 'contractno'],
+            tableFilterCB,
+            isDetail: true,
+        };
 
-            expandedRowKeys,
-            selectedRow,
-            Rowclick,
-            commonBtn,
-            forDataBtn,
+        return {
+            ...handleComposeTable<Ermcp3ContractRsp>(param),
             loading,
             tableList,
-            updateColumn,
             getBizTypeName,
             getPriceTypeName,
             getContractStatusName,
@@ -137,7 +125,6 @@ export default defineComponent({
             formatTime,
             formatValue,
             findManagerName,
-            businessManager,
         };
     },
 });

src/views/information/spot-contract/list/performance/index.vue

@@ -3,146 +3,131 @@
   <div class="spot-contract-performance">
     <filterCustomTable @search="updateColumn"
                        :loading="loading">
-      <BtnList :btnList="commonBtn" />
+      <BtnList :btnList="firstBtn"
+               @click="openComponent" />
     </filterCustomTable>
-    <contextMenu :contextMenuList="forDataBtn">
-      <a-table :columns="columns"
-               class="topTable"
-               :pagination="false"
-               :expandedRowKeys="expandedRowKeys"
-               :customRow="Rowclick"
-               rowKey="key"
-               :data-source="tableList"
-               :scroll="{ x: 'calc(100% - 180px)', y: 'calc(100vh - 163px)' }">
-        <!-- 额外的展开行 -->
-        <template #expandedRowRender="{  }">
-          <BtnList :btnList="forDataBtn" />
-        </template>
-        <!-- <template #userinfotype="{ text }">
-                  <a>{{ text === '2' ? '企业' : '个人'}}</a>
-                </template> -->
-        <template #biztype="{ text }">
-          <a>{{ getBizTypeName(text) }}</a>
-        </template>
+    <a-table :columns="columns"
+             class="topTable"
+             :pagination="false"
+             :expandedRowKeys="expandedRowKeys"
+             :customRow="Rowclick"
+             rowKey="key"
+             :data-source="tableList"
+             :scroll="{ x: 'calc(100% - 180px)', y: 'calc(100vh - 163px)' }">
+      <!-- 额外的展开行 -->
+      <template #expandedRowRender="{ record }">
+        <BtnList :btnList="secondBtn"
+                 :record="record"
+                 @click="openComponent" />
+      </template>
+      <template #biztype="{ text }">
+        <a>{{ getBizTypeName(text) }}</a>
+      </template>
 
-        <template #pricetype="{ text }">
-          <a>{{ getPriceTypeName(text) }}</a>
-        </template>
+      <template #pricetype="{ text }">
+        <a>{{ getPriceTypeName(text) }}</a>
+      </template>
 
-        <template #contracctstatus="{ text }">
-          <a>{{ getContractStatusName(text) }}</a>
-        </template>
+      <template #contracctstatus="{ text }">
+        <a>{{ getContractStatusName(text) }}</a>
+      </template>
 
-        <template #contracttype="{ text }">
-          <a>{{ getContractTypeName(text) }}</a>
-        </template>
-        <!-- 对手方 -->
-        <template #negative="{ record }">
-          <a>{{ record.contracttype === 1 ? record.sellusername : record.buyusername }}</a>
-        </template>
-        <!-- 点假期 -->
-        <template #startdate="{ record }">
-          <a>{{ formatValue(formatTime(record.startdate, "d") + '--' + formatTime(record.enddate, "d")) }}</a>
-        </template>
-        <!-- 交收期 -->
-        <template #deliverystartdate="{ record }">
-          <a>{{ formatValue(formatTime(record.deliverystartdate, "d") + '--' +
+      <template #contracttype="{ text }">
+        <a>{{ getContractTypeName(text) }}</a>
+      </template>
+      <!-- 对手方 -->
+      <template #negative="{ record }">
+        <a>{{ record.contracttype === 1 ? record.sellusername : record.buyusername }}</a>
+      </template>
+      <!-- 点假期 -->
+      <template #startdate="{ record }">
+        <a>{{ formatValue(formatTime(record.startdate, "d") + '--' + formatTime(record.enddate, "d")) }}</a>
+      </template>
+      <!-- 交收期 -->
+      <template #deliverystartdate="{ record }">
+        <a>{{ formatValue(formatTime(record.deliverystartdate, "d") + '--' +
                         formatTime(record.deliveryenddate, "d")) }}</a>
-        </template>
-        <!-- 业务员 -->
-        <template #saleuserid="{ record }">
-          <a>{{ findManagerName(record.saleuserid) }}</a>
-        </template>
+      </template>
+      <!-- 业务员 -->
+      <template #saleuserid="{ record }">
+        <a>{{ findManagerName(record.saleuserid) }}</a>
+      </template>
 
-        <!-- 跟单员 -->
-        <template #meruserid="{ record }">
-          <a>{{ findManagerName(record.meruserid) }}</a>
-        </template>
-      </a-table>
+      <!-- 跟单员 -->
+      <template #meruserid="{ record }">
+        <a>{{ findManagerName(record.meruserid) }}</a>
+      </template>
+    </a-table>
+    <!-- 右键 -->
+    <contextMenu :contextMenu="contextMenu"
+                 @cancel="closeContext"
+                 :list="secondBtn">
     </contextMenu>
-    <!-- 现货合同: 详情 -->
-    <SpotContractDeatil :selectedRow="selectedRow"
-                        :businessManager="businessManager"
-                        @refresh="queryTable" />
-    <!-- 现货合同: 正常完结 -->
-    <Finish :selectedRow="selectedRow"
-            :businessManager="businessManager"
-            @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 { AddSpotContract, SpotContractDeatil, filterCustomTable, Finish } from '../../components';
+import { filterCustomTable } from '../../components';
+import BtnList from '@/common/components/btnList/index.vue';
+import contextMenu from '@/common/components/contextMenu/temp.vue';
+import { defineAsyncComponent, defineComponent } from 'vue';
+import { ModalEnum } from '@/common/constants/modalNameEnum';
+import { ComposeTableParam, handleComposeTable } from '@/common/setup/table/compose';
 
-import { queryTableList, Ermcp3ContractRsp } from '../index';
+import { queryBusinessManager, findManagerName, tableFilterCB } from '../setup';
+import { Ermcp3ContractRsp } from '@/services/go/ermcp/spot-contract/interface';
+import { QuerySpotContract } from '@/services/go/ermcp/spot-contract';
+
+import { queryTableList } from '@/common/setup/table';
 import { getBizTypeName, getContractStatusName, getContractTypeName, getPriceTypeName } from '@/common/constants/enumsName';
-import { Column, ColumnType } from '@/common/setup/table';
 import { formatTime, formatValue } from '@/common/methods';
-import { handlerManagerList } from '@/common/setup/user';
+
+const Detail = defineAsyncComponent(() => import('../../components/detail/index.vue'));
+const Finish = defineAsyncComponent(() => import('../../components/finish/index.vue'));
 
 export default defineComponent({
     name: 'spot-contract-performance',
     components: {
         filterCustomTable,
         contextMenu,
-        AddSpotContract,
-        SpotContractDeatil,
-        Finish,
+        [ModalEnum.detail]: Detail,
+        [ModalEnum.spot_contract_btn_finish]: Finish,
         BtnList,
     },
     setup() {
-        // 表头数据
-        const { columns, registerColumn, updateColumn } = getTableColumns();
-        // 表格事件
-        const { expandedRowKeys, selectedRow, Rowclick } = getTableEvent<Ermcp3ContractRsp>({});
-        // 表格操作按钮列表
-        const { commonBtn, forDataBtn } = getBtnList('spot_contract_performance', true);
         // 表格列表数据
-        const { loading, tableList, queryTable } = queryTableList(3);
-        // 获取 业务账户
-        const { tableList: businessManager, queryTable: queryBusinessManager, findManagerName } = handlerManagerList(loading, 1);
-
-        initData(() => {
-            // 获取列表数据
-            queryTable();
-            // 注册表头信息 过滤
-            registerColumn('table_pcweb_delivery', ['contracttype', 'pricetype', 'contractno'], (e: Column, item: ColumnType, filtered: any) => {
-                if (e.columntitle === '对手方') {
-                    item.onFilter = (value: string, record: Ermcp3ContractRsp) => {
-                        if (record.contracttype === 1) {
-                            //采购方
-                            return record.sellusername.includes(value);
-                        } else {
-                            // 销售
-                            return record.buyusername.includes(value);
-                        }
-                    };
-                    item.filteredValue = filtered.negative || null;
-                }
-            });
+        const { loading, tableList, queryTable } = queryTableList<Ermcp3ContractRsp>();
+        // 获取列表数据
+        const queryTableAction = () => {
+            queryTable(QuerySpotContract, { querytype: 3 });
+            // 获取 业务账户
             queryBusinessManager();
-        });
+        };
+        // 表格通用逻辑
+        const param: ComposeTableParam = {
+            queryFn: queryTableAction,
+            menuType: 'spot_contract_performance',
+            tableName: 'table_pcweb_delivery',
+            tableFilterKey: ['contracttype', 'pricetype', 'contractno'],
+            tableFilterCB,
+            isDetail: true,
+        };
         return {
-            columns,
-
-            expandedRowKeys,
-            selectedRow,
-            Rowclick,
-            commonBtn,
-            forDataBtn,
+            ...handleComposeTable<Ermcp3ContractRsp>(param),
             loading,
             tableList,
-            updateColumn,
+            queryTable,
             getBizTypeName,
             getPriceTypeName,
             getContractStatusName,
             getContractTypeName,
-            queryTable,
             formatTime,
             formatValue,
             findManagerName,
-            businessManager,
         };
     },
 });

src/views/information/spot-contract/list/setup.ts

@@ -1,3 +1,5 @@
+import { Column, ColumnType } from '@/common/setup/table';
+import { handlerManagerList } from '@/common/setup/user';
 import { QuerySpotContract } from '@/services/go/ermcp/spot-contract/index';
 import { Ermcp3ContractRsp } from '@/services/go/ermcp/spot-contract/interface';
 import { message } from 'ant-design-vue';
@@ -8,8 +10,8 @@ type EnumType = 1 | 2 | 3 | 4;
 
 /**
  * 获取表格列表数据
- * @param type 
- * @returns 
+ * @param type
+ * @returns
  */
 export function queryTableList(type: EnumType) {
     // 加载状态
@@ -33,3 +35,25 @@ export function queryTableList(type: EnumType) {
     return { loading, tableList, queryTable }
 }
 
+// 获取 业务账户
+const { tableList, queryTable, findManagerName } = handlerManagerList(ref<boolean>(false), 1);
+export { tableList as businessManager, queryTable as queryBusinessManager, findManagerName };
+
+// 表格过滤回调函数，处理特殊字段
+export const tableFilterCB = (e: Column, item: ColumnType, filtered: any) => {
+    if (e.columntitle === '对手方') {
+        item.onFilter = (value: string, record: Ermcp3ContractRsp) => {
+            if (record.contracttype === 1) {
+                //采购方
+                return record.sellusername.includes(value);
+            } else {
+                // 销售
+                return record.buyusername.includes(value);
+            }
+        };
+        item.filteredValue = filtered.negative || null;
+    }
+};
+
+
+

src/views/information/spot-contract/list/unsubmitted/index.vue

@@ -3,149 +3,127 @@
   <div class="spot-contract-not-commit"
        :loading="loading">
     <filterCustomTable @search="updateColumn">
-      <BtnList :btnList="commonBtn" />
+      <BtnList :btnList="firstBtn"
+               @click="openComponent" />
     </filterCustomTable>
-    <contextMenu :contextMenuList="forDataBtn">
-      <a-table :columns="columns"
-               class="topOrderTable"
-               :pagination="false"
-               :expandedRowKeys="expandedRowKeys"
-               :customRow="Rowclick"
-               rowKey="key"
-               :data-source="tableList"
-               :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }">
-        <!-- 额外的展开行 -->
-        <template #expandedRowRender="{  }">
-          <BtnList :btnList="forDataBtn" />
-        </template>
-        <!-- <template #userinfotype="{ text }">
-                          <a>{{ text === '2' ? '企业' : '个人'}}</a>
-                        </template> -->
-        <template #biztype="{ text }">
-          <a>{{ getBizTypeName(text) }}</a>
-        </template>
+    <a-table :columns="columns"
+             class="topOrderTable"
+             :pagination="false"
+             :expandedRowKeys="expandedRowKeys"
+             :customRow="Rowclick"
+             rowKey="key"
+             :data-source="tableList"
+             :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }">
+      <!-- 额外的展开行 -->
+      <template #expandedRowRender="{ record }">
+        <BtnList :btnList="secondBtn"
+                 :record="record"
+                 @click="openComponent" />
+      </template>
+      <template #biztype="{ text }">
+        <a>{{ getBizTypeName(text) }}</a>
+      </template>
 
-        <template #pricetype="{ text }">
-          <a>{{ getPriceTypeName(text) }}</a>
-        </template>
+      <template #pricetype="{ text }">
+        <a>{{ getPriceTypeName(text) }}</a>
+      </template>
 
-        <template #contracctstatus="{ text }">
-          <a>{{ getContractStatusName(text) }}</a>
-        </template>
+      <template #contracctstatus="{ text }">
+        <a>{{ getContractStatusName(text) }}</a>
+      </template>
 
-        <template #contracttype="{ text }">
-          <a>{{ getContractTypeName(text) }}</a>
-        </template>
-        <!-- 对手方 -->
-        <template #negative="{ record }">
-          <a>{{ record.contracttype === 1 ? record.sellusername : record.buyusername }}</a>
-        </template>
-        <!-- 点假期 -->
-        <template #startdate="{ record }">
-          <a>{{ formatValue(formatTime(record.startdate, "d") + '--' + formatTime(record.enddate, "d")) }}</a>
-        </template>
-        <!-- 交收期 -->
-        <template #deliverystartdate="{ record }">
-          <a>{{ formatValue(formatTime(record.deliverystartdate, "d") + '--' +
+      <template #contracttype="{ text }">
+        <a>{{ getContractTypeName(text) }}</a>
+      </template>
+      <!-- 对手方 -->
+      <template #negative="{ record }">
+        <a>{{ record.contracttype === 1 ? record.sellusername : record.buyusername }}</a>
+      </template>
+      <!-- 点假期 -->
+      <template #startdate="{ record }">
+        <a>{{ formatValue(formatTime(record.startdate, "d") + '--' + formatTime(record.enddate, "d")) }}</a>
+      </template>
+      <!-- 交收期 -->
+      <template #deliverystartdate="{ record }">
+        <a>{{ formatValue(formatTime(record.deliverystartdate, "d") + '--' +
                         formatTime(record.deliveryenddate, "d")) }}</a>
-        </template>
-        <!-- 业务员 -->
-        <template #saleuserid="{ record }">
-          <a>{{ findManagerName(record.saleuserid) }}</a>
-        </template>
+      </template>
+      <!-- 业务员 -->
+      <template #saleuserid="{ record }">
+        <a>{{ findManagerName(record.saleuserid) }}</a>
+      </template>
 
-        <!-- 跟单员 -->
-        <template #meruserid="{ record }">
-          <a>{{ findManagerName(record.meruserid) }}</a>
-        </template>
-      </a-table>
+      <!-- 跟单员 -->
+      <template #meruserid="{ record }">
+        <a>{{ findManagerName(record.meruserid) }}</a>
+      </template>
+    </a-table>
+    <!-- 右键 -->
+    <contextMenu :contextMenu="contextMenu"
+                 @cancel="closeContext"
+                 :list="secondBtn">
     </contextMenu>
-    <!-- 新增现货合同 -->
-    <AddSpotContract @refresh="queryTable" />
-    <!-- 现货合同: 详情 -->
-    <SpotContractDeatil :selectedRow="selectedRow"
-                        :businessManager="businessManager"
-                        @refresh="queryTable" />
-    <!-- 现货合同: 修改 -->
-    <ModifySpotContract :selectedRow="selectedRow"
-                        @refresh="queryTable" />
-    <!-- 现货合同: 删除 -->
-    <DeleteSpotContract :selectedRow="selectedRow"
-                        :businessManager="businessManager"
-                        @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 { AddSpotContract, SpotContractDeatil, filterCustomTable, ModifySpotContract, DeleteSpotContract } from '../../components';
+import { defineComponent, queryTableList, _getBtnList } from '@/common/export/table';
+import { filterCustomTable } from '../../components';
 
-import { queryTableList, Ermcp3ContractRsp } from '../index';
-import { Column, ColumnType } from '@/common/setup/table';
 import { formatTime, formatValue } from '@/common/methods';
-import { handlerManagerList } from '@/common/setup/user';
-import { reactive } from '@vue/reactivity';
+import { queryBusinessManager, findManagerName, tableFilterCB } from '../setup';
 import { getPriceTypeName, getBizTypeName, getContractStatusName, getContractTypeName } from '@/common/constants/enumsName';
+import BtnList from '@/common/components/btnList/index.vue';
+import contextMenu from '@/common/components/contextMenu/temp.vue';
+import { defineAsyncComponent } from 'vue';
+import { ModalEnum } from '@/common/constants/modalNameEnum';
+import { ComposeTableParam, handleComposeTable } from '@/common/setup/table/compose';
+import { Ermcp3ContractRsp } from '@/services/go/ermcp/spot-contract/interface';
+import { QuerySpotContract } from '@/services/go/ermcp/spot-contract';
+
+const Add = defineAsyncComponent(() => import('../../components/add/index.vue'));
+const Detail = defineAsyncComponent(() => import('../../components/detail/index.vue'));
+const Modify = defineAsyncComponent(() => import('../../components/modify/index.vue'));
+const Delete = defineAsyncComponent(() => import('../../components/delete/index.vue'));
 
 export default defineComponent({
     name: 'spot-contract-not-commit',
     components: {
         filterCustomTable,
         contextMenu,
-        AddSpotContract,
-        SpotContractDeatil,
-        ModifySpotContract,
-        DeleteSpotContract,
+        [ModalEnum.detail]: Detail,
+        [ModalEnum.spot_contract_btn_add]: Add,
+        [ModalEnum.spot_contract_btn_modify]: Modify,
+        [ModalEnum.spot_contract_btn_delete]: Delete,
         BtnList,
     },
     setup() {
-        // 表头数据
-        const { columns, registerColumn, updateColumn } = getTableColumns();
-        // 表格事件
-        const { expandedRowKeys, selectedRow, Rowclick } = getTableEvent<Ermcp3ContractRsp>({});
-        // 表格操作按钮列表
-        const { commonBtn, forDataBtn } = getBtnList('spot_contract_unsubmitted', true);
         // 表格列表数据
-        const { loading, tableList, queryTable } = queryTableList(1);
-        console.log(loading);
-        const a = reactive({ name: 'hello' });
-        console.log(a);
-
-        // 获取 业务账户
-        const { tableList: businessManager, queryTable: queryBusinessManager, findManagerName } = handlerManagerList(loading, 1);
-
-        initData(() => {
-            // 获取列表数据
-            queryTable();
-            // 注册表头信息 过滤
-            registerColumn('table_pcweb_delivery', ['contracttype', 'pricetype', 'contractno'], (e: Column, item: ColumnType, filtered: any) => {
-                if (e.columntitle === '对手方') {
-                    item.onFilter = (value: string, record: Ermcp3ContractRsp) => {
-                        if (record.contracttype === 1) {
-                            //采购方
-                            return record.sellusername.includes(value);
-                        } else {
-                            // 销售
-                            return record.buyusername.includes(value);
-                        }
-                    };
-                    item.filteredValue = filtered.negative || null;
-                }
-            });
+        const { loading, tableList, queryTable } = queryTableList<Ermcp3ContractRsp>();
+        // 获取列表数据
+        const queryTableAction = () => {
+            queryTable(QuerySpotContract, { querytype: 1 });
+            // 获取 业务账户
             queryBusinessManager();
-        });
-        return {
-            columns,
+        };
+        // 表格通用逻辑
+        const param: ComposeTableParam = {
+            queryFn: queryTableAction,
+            menuType: 'spot_contract_unsubmitted',
+            tableName: 'table_pcweb_delivery',
+            tableFilterKey: ['contracttype', 'pricetype', 'contractno'],
+            tableFilterCB,
+            isDetail: true,
+        };
 
-            expandedRowKeys,
-            selectedRow,
-            Rowclick,
-            commonBtn,
-            forDataBtn,
+        return {
+            ...handleComposeTable<Ermcp3ContractRsp>(param),
             loading,
             tableList,
-            updateColumn,
-            queryTable,
             getBizTypeName,
             getPriceTypeName,
             getContractStatusName,
@@ -153,7 +131,6 @@ export default defineComponent({
             formatTime,
             formatValue,
             findManagerName,
-            businessManager,
         };
     },
 });