交易中心功能搬迁

public/config/app.config.json

@@ -1,3 +1,3 @@
 {
-    "apiUrl": "http://47.104.141.54:38280/cfg?key=mtp_20"
+    "apiUrl": "http://192.168.31.204:8080/cfg?key=test_204"
 }

src/@next/components/base/tabbar/index.less

@@ -44,6 +44,7 @@
 
     &--bottom {
         background-color: #121415;
+        margin-top      : auto;
 
         .tabs {
             &-item {

src/@next/components/base/tabbar/index.vue

@@ -1,8 +1,8 @@
 <!-- 标签栏组件 -->
 <template>
   <div class="mtp-tabbar">
-    <ul class="tabs">
-      <li :class="['tabs-item', dataIndex === index && 'active']" v-for="(item,index) in dataSource" :key="index" @click="onChange(item,index)">
+    <ul class="tabs" v-if="dataSource.length">
+      <li :class="['tabs-item', dataIndex === index && 'active']" v-for="(item,index) in dataSource" :key="index" @click="onChange(index)">
         {{ label ? item[label] : '标签' + index }}
       </li>
     </ul>
@@ -11,7 +11,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref } from 'vue';
+import { defineComponent, ref, watch } from 'vue';
 
 export default defineComponent({
   emits: ['update:selectedIndex', 'change'],
@@ -31,14 +31,18 @@ export default defineComponent({
   setup(props, { emit }) {
     const dataIndex = ref(props.selectedIndex);
 
-    const onChange = (item: unknown, index: number) => {
+    const onChange = (index: number) => {
       if (dataIndex.value !== index) {
         dataIndex.value = index;
         emit('update:selectedIndex', index);
-        emit('change', item, index);
+        emit('change', props.dataSource[index], index);
       }
     }
 
+    watch(() => props.selectedIndex, (val) => {
+      dataIndex.value = val;
+    })
+
     return {
       dataIndex,
       onChange

src/@next/hooks/common/index.ts

@@ -1,4 +1,4 @@
-import { defineAsyncComponent, shallowRef, Ref } from 'vue'
+import { defineAsyncComponent, shallowRef, computed } from 'vue'
 import { OperationTabMenu } from '@/services/go/commonService/interface'
 import { initData } from '@/common/methods'
 import { DynamicComponent } from './interface'
@@ -6,9 +6,36 @@ import { getClassName } from '@/common/setup/table/button'
 import APP from '@/services'
 
 /**
- * 动态组件
+ * 路由菜单
+ */
+export function useMenu() {
+    const menus = computed<OperationTabMenu[]>(() => APP.getRef('menus').value);
+
+    // 通过code获取对应的子菜单
+    const getChildrenMenus = (items: OperationTabMenu[], name: string) => {
+        let result: OperationTabMenu[] = [];
+        for (let i = 0; i < items.length; i++) {
+            const { code, children } = items[i];
+            if (code === name) return children ?? result;
+            if (children) {
+                result = getChildrenMenus(children, name)
+                if (result.length) return result;
+            }
+        }
+        return result;
+    }
+
+    return {
+        menus,
+        getChildrenMenus
+    }
+}
+
+/**
+ * 底部动态组件
  */
 export function useDynamicComponent(code?: string) {
+    const { menus, getChildrenMenus } = useMenu();
     const components = shallowRef<DynamicComponent[]>([]);
     const currentComponent = shallowRef<DynamicComponent>(); // 当前选中的组件
 
@@ -17,25 +44,6 @@ export function useDynamicComponent(code?: string) {
         currentComponent.value = selected;
     }
 
-    // 通过code找出对应的子菜单
-    const getChildrenMenu = (code: string, items: OperationTabMenu[]) => {
-        let result: OperationTabMenu[] = [];
-        for (const i in items) {
-            const item = items[i];
-            if (item.code === code) {
-                if (item.children) {
-                    result = item.children;
-                }
-                break;
-            } else {
-                if (item.children) {
-                    result = getChildrenMenu(code, item.children);
-                }
-            }
-        }
-        return result;
-    }
-
     // 处理动态组件
     const parseComponent = (treeMenu: OperationTabMenu[]) => {
         let result: DynamicComponent[] = [];
@@ -76,12 +84,11 @@ export function useDynamicComponent(code?: string) {
     }
 
     initData(() => {
-        const menus = APP.getRef('menus') as Ref<OperationTabMenu[]>;
         const bottom = menus.value.find((e) => e.code === 'bottom');
         const bottomMenus = bottom?.children;
 
         if (bottomMenus) {
-            const children = code ? getChildrenMenu(code, bottomMenus) : bottomMenus;
+            const children = code ? getChildrenMenus(bottomMenus, code) : bottomMenus;
             const result = parseComponent(children);
 
             if (result.length) {

src/layout/components/container.vue

@@ -0,0 +1,61 @@
+
+<template>
+  <!-- 四级路由布局页，关联父级 main.vue -->
+  <router-view :key="$route.fullPath"></router-view>
+  <mtp-tabbar class="mtp-tabbar--bottom" :data-source="tabList" :selectedIndex="tabIndex" label="title" @change="tabChange" />
+</template>
+
+<script lang="ts">
+import { defineComponent, inject, ref, Ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router'
+import { initData } from '@/common/methods';
+import { OperationTabMenu } from '@/services/go/commonService/interface'
+import { useMenu } from '@/@next/hooks/common'
+import MtpTabbar from '@/@next/components/base/tabbar/index.vue'
+
+export default defineComponent({
+  components: {
+    MtpTabbar,
+  },
+  setup() {
+    const { menus, getChildrenMenus } = useMenu();
+
+    const route = useRoute();
+    const router = useRouter();
+    const parentTabList = inject<Ref<OperationTabMenu[]>>('thirdMenuList'); // 父级菜单(上边tab栏)
+    const parentTabIndex = inject<Ref<string[]>>('index'); // 父级选中的菜单
+    const tabList = ref<OperationTabMenu[]>([]);
+    const tabIndex = ref(0);
+
+    const tabChange = (item: OperationTabMenu) => {
+      router.push({ name: item.code });
+    }
+
+    initData(() => {
+      if (parentTabList?.value && parentTabIndex?.value) {
+        const i = Number(parentTabIndex.value[0]);
+        const code = parentTabList.value[i].code;
+
+        const tmpList = getChildrenMenus(menus.value, code);
+        if (tmpList.length) {
+          tabList.value = tmpList;
+          const index = tmpList.findIndex((e) => e.code === route.name);
+
+          if (index > -1) {
+            tabIndex.value = index;
+            router.push({ name: tmpList[index].code });
+          } else {
+            router.push({ name: tmpList[0].code });
+          }
+        }
+      }
+    })
+
+    return {
+      tabList,
+      tabIndex,
+      tabChange,
+    }
+  }
+})
+</script>

src/layout/components/main.vue

@@ -1,39 +1,61 @@
 <template>
+  <!-- 三级路由布局页，关联父级 top.vue -->
   <div class="exposure">
-    <div class="first-menu">
-      <a-menu class="a-menu_container" theme="dark" v-model:selectedKeys="selectedKey" @click="selectMenu" mode="horizontal">
-        <a-menu-item :key="String(index)" v-for="(item, index) in list">{{ item.title }}</a-menu-item>
-      </a-menu>
-      <div class="menu_right">
-        <!-- <slot></slot> -->
-      </div>
-    </div>
-    <router-view :key="$route.fullPath" />
+    <mtp-tabbar class="mtp-tabbar--top" :data-source="list" v-model:selectedIndex="selectedIndex" label="title" @change="selectMenu" />
+    <router-view :key="routerKey" />
   </div>
 </template>
 
 <script lang="ts">
-import { defineComponent, inject, Ref } from 'vue';
-import { useRouter } from 'vue-router';
-import { OperationTabMenu } from '@/services/go/commonService/interface';
+import { defineComponent, inject, Ref, computed } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
+import { OperationTabMenu } from '@/services/go/commonService/interface'
+import MtpTabbar from '@/@next/components/base/tabbar/index.vue'
 
 export default defineComponent({
-  name: 'MAIN',
-  components: {},
+  components: {
+    MtpTabbar
+  },
   setup() {
     const router = useRouter();
-    const list = inject('thirdMenuList') as Ref<OperationTabMenu[]>;
-    const selectedKey = inject('index');
-    // 切换路由
-    function selectMenu(value: any) {
-      if ((selectedKey as unknown as any).value[0] !== value.key) {
-        const index = +value.key;
-        router.push({ name: list.value[index].code });
+    const route = useRoute();
+    const list = inject<Ref<OperationTabMenu[]>>('thirdMenuList');
+    const index = inject<Ref<string[]>>('index');
+
+    // 当前选中的标签
+    const selectedIndex = computed({
+      get: () => Number(index?.value[0]),
+      set: (val) => {
+        if (index) {
+          index.value = [val.toString()];
+        }
       }
+    })
+
+    // 处理当路由跳转时页面不刷新的问题
+    // 有两种情况判断是否刷新，1.当前标签code中不存在子路由时刷新，2.当前标签code中存在子路由时不刷新
+    const routerKey = computed(() => {
+      const currentTab = list?.value[selectedIndex.value];
+      // 通过当前标签code和当前路由name做比较，如果相同说明无子路由
+      if (currentTab?.code === route.name) {
+        return route.fullPath;
+      }
+      return 'default';
+    })
+
+    // 切换路由
+    function selectMenu(value: OperationTabMenu) {
+      router.push({ name: value.code });
     }
-    return { selectMenu, list, selectedKey };
-  },
-});
+
+    return {
+      selectMenu,
+      list,
+      routerKey,
+      selectedIndex
+    }
+  }
+})
 </script>
 
 <style lang="less">
@@ -42,51 +64,9 @@ export default defineComponent({
     flex-direction: column;
     height: 100%;
     position: relative;
-}
-.noBorderBottom {
-    border-bottom: none;
-}
-.first-menu {
-    width: 100%;
-    border-bottom: 1px solid @m-blue0 !important;
-    background-color: @m-black1;
-    .flex;
-    justify-content: space-between;
-    .a-menu_container {
-        flex: 1;
-        margin-top: 2px;
-        .flex();
-        height: 32px;
-        line-height: 32px;
-        text-align: center;
-        background: transparent;
-        .ant-menu-item {
-            min-width: 120px;
-            height: 32px;
-            line-height: 32px;
-            background: linear-gradient(0deg, @m-grey35 0%, @m-grey36 100%);
-            margin-left: 3px;
-            font-size: 14px;
-            color: @m-grey38;
-            border-radius: 5px 5px 0px 0px;
-            cursor: pointer;
-            font-family: Adobe Heiti Std;
-            border: 1px solid @m-grey37;
-            &:hover {
-                .noBorderBottom;
-            }
-        }
-        .ant-menu-item-active {
-            .noBorderBottom;
-        }
-        .ant-menu-item-selected {
-            .noBorderBottom;
-            color: @m-white0;
-            background: linear-gradient(0deg, @m-blue31 0%, @m-blue32 100%);
-            &:hover {
-                color: @m-white0;
-            }
-        }
+
+    .mtp-tabbar--bottom {
+        padding-bottom: 0 !important;
     }
 }
 </style>

src/layout/components/top.vue

@@ -1,4 +1,5 @@
 <template>
+  <!-- 二级路由布局页，关联父级 App.vue -->
   <a-layout :class="['layout-top', isBottom ? 'layout-top-bottom' : 'layout-top-no-bottom']">
     <a-layout-header class="m-layout-header">
       <Header />
@@ -54,12 +55,21 @@ export default defineComponent({
     // 选中菜单
     function chooseMenu(value: OperationTabMenu) {
       let name = 'home';
+      const matched = route.matched;
+
+      if (matched.length > 2) {
+        // 右边上部分tab是固定的三级菜单
+        name = matched[2].name!.toString();
+      } else {
+        name = matched[matched.length - 1].name!.toString();
+      }
+
       if (value.children && value.children.length) {
-        if (route.name === 'home') {
+        if (name === 'home') {
           name = value.children[0].code;
           index.value = ['0'];
         } else {
-          const i = value.children.findIndex((e) => e.code === route.name);
+          const i = value.children.findIndex((e) => e.code === name);
           if (i === -1) {
             // 切换左边菜单栏
             // 默认第一个tab页
@@ -71,11 +81,12 @@ export default defineComponent({
             index.value = [i.toString()];
           }
         }
+        list.value = value.children;
       } else {
         name = value.code;
         index.value = ['0'];
       }
-      list.value = value.children;
+
       setShowBottomPart(value.code);
       router.push({ name: name as string });
     }

src/router/dynamic.ts

@@ -28,6 +28,9 @@ const addRoutes = (routes: OperationTabMenu[], parentName = ''): void => {
                 case 'Main':
                     component = () => import('@/layout/components/main.vue');
                     break;
+                case 'Container':
+                    component = () => import('@/layout/components/container.vue');
+                    break;
                 default:
                     const componentString = item.component.replace(/^\/+/, ''); // 过滤字符串前面所有 '/' 字符
                     const componentPath = componentString.replace(/\.\w+$/, ''); // 过滤后缀名，为了让 import 加入 .vue ，不然会有警告提示...

src/services/go/TaAccount/index.ts

@@ -30,6 +30,17 @@ export function queryAmountLog(req: QueryAmountLogReq): Promise<QueryAmountLogRs
 }
 
 /**
+ * /TaAccount/QueryHisAmountLog'
+ * 资金流水查询（历史）
+ * @param req
+ */
+export function QueryHisAmountLog(req: QueryAmountLogReq): Promise<QueryAmountLogRsp> {
+    return commonSearch_go('/TaAccount/QueryHisAmountLog', req).catch((err) => {
+        throw new Error(`资金流水查询（历史）: ${err}`);
+    });
+}
+
+/**
  * /TaAccount/GetTaAccounts
  * 获取资金账户信息
  * @param req

src/views/market/market-spot/index.vue

@@ -1,14 +1,12 @@
 <template>
   <div class="exposure">
-    <FristMenu :list="marketsSetion" :value="'marketsectionname'" @selectMenu="selectSection" />
+    <mtp-tabbar class="mtp-tabbar--top" :data-source="marketsSetion" label="marketsectionname" @change="selectSection" />
     <component :is="componentId" v-if="componentId"></component>
-    <ThirdMenu :list="markets" :value="'marketname'" @selectMenu="onSelectMarket" />
+    <mtp-tabbar class="mtp-tabbar--bottom" :data-source="markets" v-model:selectedIndex="selctedMarketIndex" label="marketname" @change="onSelectMarket" />
   </div>
 </template>
 
 <script lang="ts">
-import FristMenu from '@/common/components/firstMenu/index.vue';
-import ThirdMenu from '@/common/components/thirdMenu/index.vue';
 import { TradeMode, ListingMode, AuctionwrType } from '@/common/constants/enumCommon';
 import { contextMenu, defineAsyncComponent, defineComponent } from '@/common/export/commonTable';
 import { initData } from '@/common/methods';
@@ -16,11 +14,11 @@ import APP from '@/services';
 import { TjmdMarketSection, TjmdMarketSectionConfig } from '@/services/go/Tjmd/interface';
 import { ref } from 'vue';
 import { setMarketId } from './setup'
+import MtpTabbar from '@/@next/components/base/tabbar/index.vue'
 
 export default defineComponent({
   components: {
-    FristMenu,
-    ThirdMenu,
+    MtpTabbar,
     contextMenu,
     // 仓单贸易 有仓单 一口价
     [`${TradeMode.WarehouseReceiptTrade}-${AuctionwrType.hasWr}-${ListingMode.fix}`]: defineAsyncComponent(() => import('./warehouse_receipt_trade/warehouse_receipt_trade_price/index.vue')),
@@ -51,23 +49,27 @@ export default defineComponent({
     // 市场
     const markets = ref<TjmdMarketSectionConfig[]>([])
     // 选中的市场
-    const selctedMarket = ref<TjmdMarketSectionConfig | null>(null)
+    const selctedMarketIndex = ref(0)
+
     const componentId = ref<string>('')
     initData(() => {
       if (marketsSetion.value.length) {
         selectSection(marketsSetion.value[0])
       }
     })
+
     // 切换市场板块
     function selectSection(value: TjmdMarketSection) {
       markets.value = value.mlist
       const index = marketsSetion.value.findIndex((el: TjmdMarketSection) => el.marketsectionid === value.marketsectionid)
       if (index > -1 && value.mlist.length) {
-        onSelectMarket(index, value.mlist[0])
+        selctedMarketIndex.value = 0
+        onSelectMarket(value.mlist[0])
       }
     }
+
     // 切换市场
-    function onSelectMarket(index: number, value: TjmdMarketSectionConfig) {
+    function onSelectMarket(value: TjmdMarketSectionConfig) {
       const { trademode, auctionwrtype, listingmode } = value
       // 仓单贸易
       if (value.trademode === TradeMode.WarehouseReceiptTrade) {
@@ -77,12 +79,18 @@ export default defineComponent({
       }
       // 缓存 当前市场 交易模式 是否有仓单，挂牌方式信息
       setMarketId(componentId.value)
-      selctedMarket.value = value
     }
 
-    return { marketsSetion, selectSection, markets, onSelectMarket, componentId };
-  },
-});
+    return {
+      marketsSetion,
+      selectSection,
+      markets,
+      selctedMarketIndex,
+      onSelectMarket,
+      componentId
+    }
+  }
+})
 </script>
 
 <style lang="less">

src/views/market/market-spot/warehouse_pre_sale/warehouse_pre_sale_floating_price/index.vue

@@ -1,31 +1,20 @@
 <template>
-    <!-- 仓单预售 浮动价预售-->
-    <div class="topTableHeight">
-        <Filter :enumName="name" @buy="buyOpen" @filterGoods="filterGoods" @search="search" />
-        <a-table
-            :columns="columns"
-            :class="['srcollYTable', isBottom ? 'condSecondTabTable' : 'condSecondTabTableNoBottom', tableList.length ? 'noPlaceHolder' : 'hasPlaceHolder']"
-            :scroll="{ x: '100%', y: isBottom ? 'calc(100vh- 443px)' : 'calc(100vh - 196px)' }"
-            :pagination="false"
-            :loading="loading"
-            :expandedRowKeys="expandedRowKeys"
-            :customRow="Rowclick"
-            rowKey="key"
-            :data-source="tableList"
-        ></a-table>
-        <!-- 右键 -->
-        <contextMenu :contextMenu="contextMenu" @cancel="closeContext" :list="firstBtn"></contextMenu>
-        <component
-            :is="componentId"
-            v-if="componentId"
-            :enumName="name"
-            :selectedRow="selectedRow"
-            @cancel="closeComponent"
-        ></component>
-    </div>
+  <!-- 仓单预售 浮动价预售-->
+  <mtp-table-scroll>
+    <template #header>
+      <Filter :enumName="name" @buy="buyOpen" @filterGoods="filterGoods" @search="search" />
+    </template>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList"></a-table>
+    </template>
+  </mtp-table-scroll>
+  <!-- 右键 -->
+  <contextMenu :contextMenu="contextMenu" @cancel="closeContext" :list="firstBtn"></contextMenu>
+  <component :is="componentId" v-if="componentId" :enumName="name" :selectedRow="selectedRow" @cancel="closeComponent"></component>
 </template>
 
 <script lang="ts">
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
 import { EnumRouterName } from '@/common/constants/enumRouterName';
 import { queryTableList, contextMenu, defineAsyncComponent, defineComponent, ModalEnum, ComposeTableParam } from '@/common/export/commonTable';
 import { QueryOrderQuoteReq, WrOrderQuote } from '@/services/go/wrtrade/interface';
@@ -38,97 +27,98 @@ import { getShowBottomValue } from '@/common/config/constrolBottom';
 import Bus from '@/utils/eventBus/index';
 
 export default defineComponent({
-    name: EnumRouterName.warehouse_pre_sale_floating_price,
-    components: {
-        contextMenu,
-        Filter,
-        warehouse_pre_sale_floating_price_spot_trade_warehouse_detail: defineAsyncComponent(() => import('../../components/detail/index.vue')),
-        warehouse_pre_sale_floating_price_spot_trade_warehouse_post_buying: defineAsyncComponent(() => import('../../components/post_buying/index.vue')),
-        buyAndSell: defineAsyncComponent(() => import('../../components/buy-sell-market/index.vue')),
-        postBuying: defineAsyncComponent(() => import('../../components/post_buying/index.vue')),
-    },
-    setup() {
-        const isBottom = getShowBottomValue();
-        let cacheID: number | null = null;
-        // 表格列表数据
-        const { loading, tableList, queryTable } = queryTableList<WrOrderQuote>();
-        const cacheList = ref<WrOrderQuote[]>([]);
-        // 获取列表数据
-        const queryTableAction = () => {
-            const param: QueryOrderQuoteReq = {
-                wrpricetype: 2,
-                haswr: 0,
-            };
-            queryTable(queryOrderQuote, param).then((res) => {
-                cacheList.value = res;
-            });
-        };
-        Bus.$on('spotTrade', queryTableAction);
-        // 表格通用逻辑
-        const param: ComposeTableParam = {
-            queryFn: queryTableAction,
-            tableName: 'table_pcweb_spot_trade_warehouse_sale_float',
-        };
-        const {
-            contextMenu,
-            openContext,
-            closeContext, // 右键
-            columns,
-            registerColumn,
-            updateColumn, // 表头
-            expandedRowKeys,
-            selectedRow,
-            Rowclick, // 表格折腾面板数据与单击、双击事件
-            componentId,
-            closeComponent, // 控制异步组件
-            firstBtn, // 表格按钮
-        } = handleComposeTable<WrOrderQuote>(param);
-        function search(value: Object) {
-            const param: QueryOrderQuoteReq = {
-                wrpricetype: 2,
-                haswr: 0,
-            };
-            Object.assign(param, value);
-            queryTable(queryOrderQuote, param).then((res) => {
-                cacheList.value = res;
-                if (cacheID) {
-                    filterGoods(cacheID);
-                }
-            });
+  name: EnumRouterName.warehouse_pre_sale_floating_price,
+  components: {
+    MtpTableScroll,
+    contextMenu,
+    Filter,
+    warehouse_pre_sale_floating_price_spot_trade_warehouse_detail: defineAsyncComponent(() => import('../../components/detail/index.vue')),
+    warehouse_pre_sale_floating_price_spot_trade_warehouse_post_buying: defineAsyncComponent(() => import('../../components/post_buying/index.vue')),
+    buyAndSell: defineAsyncComponent(() => import('../../components/buy-sell-market/index.vue')),
+    postBuying: defineAsyncComponent(() => import('../../components/post_buying/index.vue')),
+  },
+  setup() {
+    const isBottom = getShowBottomValue();
+    let cacheID: number | null = null;
+    // 表格列表数据
+    const { loading, tableList, queryTable } = queryTableList<WrOrderQuote>();
+    const cacheList = ref<WrOrderQuote[]>([]);
+    // 获取列表数据
+    const queryTableAction = () => {
+      const param: QueryOrderQuoteReq = {
+        wrpricetype: 2,
+        haswr: 0,
+      };
+      queryTable(queryOrderQuote, param).then((res) => {
+        cacheList.value = res;
+      });
+    };
+    Bus.$on('spotTrade', queryTableAction);
+    // 表格通用逻辑
+    const param: ComposeTableParam = {
+      queryFn: queryTableAction,
+      tableName: 'table_pcweb_spot_trade_warehouse_sale_float',
+    };
+    const {
+      contextMenu,
+      openContext,
+      closeContext, // 右键
+      columns,
+      registerColumn,
+      updateColumn, // 表头
+      expandedRowKeys,
+      selectedRow,
+      Rowclick, // 表格折腾面板数据与单击、双击事件
+      componentId,
+      closeComponent, // 控制异步组件
+      firstBtn, // 表格按钮
+    } = handleComposeTable<WrOrderQuote>(param);
+    function search(value: Object) {
+      const param: QueryOrderQuoteReq = {
+        wrpricetype: 2,
+        haswr: 0,
+      };
+      Object.assign(param, value);
+      queryTable(queryOrderQuote, param).then((res) => {
+        cacheList.value = res;
+        if (cacheID) {
+          filterGoods(cacheID);
         }
-        // 过滤期货合约商品
-        function filterGoods(id: number) {
-            cacheID = id;
-            tableList.value = cacheList.value.filter((el) => el.goodsid === id);
-        }
-        function buyOpen(value: any, goods: Goods) {
-            componentId.value = 'postBuying';
-            value.goodsid = goods.goodsid;
-            value.goodscode = goods.goodscode;
-            selectedRow.value = value;
-        }
-        return {
-            isBottom,
-            contextMenu,
-            openContext,
-            closeContext, // 右键
-            columns,
-            registerColumn,
-            updateColumn, // 表头
-            expandedRowKeys,
-            selectedRow,
-            Rowclick, // 表格折腾面板数据与单击、双击事件
-            componentId,
-            closeComponent, // 控制异步组件
-            firstBtn, // 表格按钮
-            name: EnumRouterName.warehouse_pre_sale_floating_price,
-            loading,
-            tableList,
-            search,
-            buyOpen,
-            filterGoods,
-        };
-    },
+      });
+    }
+    // 过滤期货合约商品
+    function filterGoods(id: number) {
+      cacheID = id;
+      tableList.value = cacheList.value.filter((el) => el.goodsid === id);
+    }
+    function buyOpen(value: any, goods: Goods) {
+      componentId.value = 'postBuying';
+      value.goodsid = goods.goodsid;
+      value.goodscode = goods.goodscode;
+      selectedRow.value = value;
+    }
+    return {
+      isBottom,
+      contextMenu,
+      openContext,
+      closeContext, // 右键
+      columns,
+      registerColumn,
+      updateColumn, // 表头
+      expandedRowKeys,
+      selectedRow,
+      Rowclick, // 表格折腾面板数据与单击、双击事件
+      componentId,
+      closeComponent, // 控制异步组件
+      firstBtn, // 表格按钮
+      name: EnumRouterName.warehouse_pre_sale_floating_price,
+      loading,
+      tableList,
+      search,
+      buyOpen,
+      filterGoods,
+    };
+  },
 });
 </script>
 <style lang="less">

src/views/market/market-spot/warehouse_pre_sale/warehouse_pre_sale_price/index.vue

@@ -1,15 +1,20 @@
 <template>
   <!-- 仓单预售 一口价预售-->
-  <div class="topTableHeight">
-    <Filter :enumName="name" @search="search" @buy="buyOpen" />
-    <a-table :columns="columns" :class="['srcollYTable', isBottom ? 'condSecondTabTable' : 'condSecondTabTableNoBottom', tableList.length ? 'noPlaceHolder' : 'hasPlaceHolder']" :scroll="{ x: '100%', y: isBottom ? 'calc(100vh- 443px)' : 'calc(100vh - 196px)' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" rowKey="key" :data-source="tableList"></a-table>
-    <!-- 右键 -->
-    <contextMenu :contextMenu="contextMenu" @cancel="closeContext" :list="firstBtn"></contextMenu>
-    <component :is="componentId" v-if="componentId" :enumName="name" :selectedRow="selectedRow" @cancel="closeComponent"></component>
-  </div>
+  <mtp-table-scroll>
+    <template #header>
+      <Filter :enumName="name" @search="search" @buy="buyOpen" />
+    </template>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList"></a-table>
+    </template>
+  </mtp-table-scroll>
+  <!-- 右键 -->
+  <contextMenu :contextMenu="contextMenu" @cancel="closeContext" :list="firstBtn"></contextMenu>
+  <component :is="componentId" v-if="componentId" :enumName="name" :selectedRow="selectedRow" @cancel="closeComponent"></component>
 </template>
 
 <script lang="ts">
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
 import { EnumRouterName } from '@/common/constants/enumRouterName';
 import { queryTableList, contextMenu, defineAsyncComponent, defineComponent, ModalEnum, ComposeTableParam } from '@/common/export/commonTable';
 import { QueryOrderQuoteReq, WrOrderQuote } from '@/services/go/wrtrade/interface';
@@ -22,6 +27,7 @@ import Bus from '@/utils/eventBus/index';
 export default defineComponent({
   name: EnumRouterName.warehouse_pre_sale_price,
   components: {
+    MtpTableScroll,
     contextMenu,
     Filter,
     warehouse_pre_sale_price_spot_trade_warehouse_detail: defineAsyncComponent(() => import('../../components/detail/index.vue')),

src/views/order/spot_warran/components/spot_warrant_in_and_out_warehouse/index.vue

@@ -47,8 +47,8 @@ export default defineComponent({
   components: {
     BtnList,
     MtpTableScroll,
-    pick_up: defineAsyncComponent(() => import('./components/pick_up/index.vue')),
-    cacel: defineAsyncComponent(() => import('./components/cancel/index.vue')),
+    confirm: defineAsyncComponent(() => import('./components/pick_up/index.vue')), // 确认提货
+    cacel: defineAsyncComponent(() => import('./components/cancel/index.vue')), // 撤销
   },
   setup(props) {
     const { buttons } = props.parentComponent;

src/views/order/spot_warran/components/spot_warrant_spot_details/index.vue

@@ -36,7 +36,7 @@ export default defineComponent({
     MtpTableScroll,
     BtnList,
     listed: defineAsyncComponent(() => import('./components/listing/index.vue')), // 挂牌
-    pick_up: defineAsyncComponent(() => import('./components/pick_up/index.vue')), // 摘牌
+    pickup: defineAsyncComponent(() => import('./components/pick_up/index.vue')), // 摘牌
   },
   setup(props) {
     const { buttons } = props.parentComponent;

src/views/search/search_capital_flow/search_capital_flow_tab/search_capital_flow_tab_history/index.vue

@@ -0,0 +1,64 @@
+<template>
+  <!-- 资金流水-历史记录 -->
+  <mtp-table-scroll>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :expandIcon="expandIcon" :expandIconAsCell="false" rowKey="key" :data-source="tableList">
+        <template #createtime="{ record }">
+          <a>{{ formatTime(record.createtime) }}</a>
+        </template>
+      </a-table>
+    </template>
+  </mtp-table-scroll>
+</template>
+
+<script lang="ts">
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
+import { defineComponent, queryTableList } from '@/common/export/commonTable';
+import { formatTime } from '@/common/methods';
+import { getRecordItemTab } from '@/common/setup/order/orderData';
+import { expandIcon } from '@/common/setup/table/clolumn';
+import { handleComposeOrderTable } from '@/common/setup/table/compose';
+import { ComposeOrderTableParam } from '@/common/setup/table/interface';
+import { getSelectedAccountId } from '@/services/bus/account';
+import { QueryHisAmountLog } from '@/services/go/TaAccount';
+import { WrPerformancePlan } from '@/services/go/wrtrade/interface';
+//import Filter from '@/views/search/search_document_records_commission_record_sub/components/filter/index.vue';
+import { Moment } from 'moment';
+
+export default defineComponent({
+  components: {
+    MtpTableScroll,
+    //Filter,
+  },
+  setup() {
+    // 表格列表数据
+    const { loading, tableList, queryTable } = queryTableList<WrPerformancePlan>();
+
+    // 查询数据
+    const search = (value: Moment[]) => {
+      const param = {
+        endDate: value[1].format('YYYY-MM-DD'),
+        startDate: value[0].format('YYYY-MM-DD'),
+        accountID: getSelectedAccountId().toString(),
+      };
+      queryTable(QueryHisAmountLog, param);
+    }
+
+    // 表格通用逻辑
+    const param: ComposeOrderTableParam = {
+      queryFn: () => { },
+      tableName: 'table_pcweb_spot_trade_bottom_funding_info_log',
+      recordList: getRecordItemTab(),
+    }
+
+    return {
+      ...handleComposeOrderTable<WrPerformancePlan>(param),
+      search,
+      loading,
+      tableList,
+      formatTime,
+      expandIcon,
+    }
+  }
+})
+</script>

src/views/search/search_capital_flow/search_capital_flow_tab/index.vue → src/views/search/search_capital_flow/search_capital_flow_tab/search_capital_flow_tab_today/index.vue

@@ -1,36 +1,38 @@
 <template>
-  <!-- 资金流水 -->
-  <section>
-    <a-table :columns="columns" class="srcollYTable expandLeftTable" :scroll="{ x: '100%', y: 'calc(100vh - 163px)'}" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :expandIcon="expandIcon" :expandIconAsCell="false" :rowKey="(record,index)=>index" :data-source="tableList">
-      <template #createtime="{ record }">
-        <a>{{ formatTime(record.createtime) }}</a>
-      </template>
-    </a-table>
-  </section>
+  <!-- 资金流水-当前记录 -->
+  <mtp-table-scroll>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :expandIcon="expandIcon" :expandIconAsCell="false" rowKey="key" :data-source="tableList">
+        <template #createtime="{ record }">
+          <a>{{ formatTime(record.createtime) }}</a>
+        </template>
+      </a-table>
+    </template>
+  </mtp-table-scroll>
 </template>
 
 <script lang="ts">
-import { queryTableList, BtnList, defineComponent } from '@/common/export/commonTable';
-import { WrPerformancePlan } from '@/services/go/wrtrade/interface';
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
+import { defineComponent, queryTableList } from '@/common/export/commonTable';
+import { formatTime } from '@/common/methods';
 import { getRecordItemTab } from '@/common/setup/order/orderData';
+import { expandIcon } from '@/common/setup/table/clolumn';
 import { handleComposeOrderTable } from '@/common/setup/table/compose';
 import { ComposeOrderTableParam } from '@/common/setup/table/interface';
+import { getSelectedAccountId } from '@/services/bus/account';
 import { queryAmountLog } from '@/services/go/TaAccount';
 import { QueryAmountLogReq } from '@/services/go/TaAccount/interface';
-import { getSelectedAccountId } from '@/services/bus/account';
-import { formatTime } from '@/common/methods';
+import { WrPerformancePlan } from '@/services/go/wrtrade/interface';
 import Bus from '@/utils/eventBus/index';
-import { expandIcon } from '@/common/setup/table/clolumn';
-import { EnumRouterName } from '@/common/constants/enumRouterName';
 
 export default defineComponent({
-  name: EnumRouterName.search_capital_flow_tab,
   components: {
-    BtnList,
+    MtpTableScroll
   },
   setup() {
     // 表格列表数据
     const { loading, tableList, queryTable } = queryTableList<WrPerformancePlan>();
+
     // 获取列表数据
     const queryTableAction = () => {
       const param: QueryAmountLogReq = {
@@ -38,24 +40,27 @@ export default defineComponent({
       };
 
       queryTable(queryAmountLog, param);
-    };
+    }
+
     // 表格通用逻辑
     const param: ComposeOrderTableParam = {
       queryFn: queryTableAction,
       tableName: 'table_pcweb_spot_trade_bottom_funding_info_log',
       recordList: getRecordItemTab(),
-    };
+    }
+
     // 资金变化，重新加载数据
     Bus.$on('moneyChangedNtf_UI', () => {
       queryTableAction();
-    });
+    })
+
     return {
       ...handleComposeOrderTable<WrPerformancePlan>(param),
       loading,
       tableList,
       formatTime,
       expandIcon,
-    };
-  },
-});
+    }
+  }
+})
 </script>

src/views/search/search_document_records/search_commodity_contract/index.vue

@@ -1,29 +0,0 @@
-
-<template>
-  <!-- 单据记录 商品合约 -->
-  <div class="topTableHeight40">
-    <router-view></router-view>
-    <ThridMenu :list="tabList"
-               :selectedKey="index"
-               @selectMenu="changeTab" />
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue';
-import ThridMenu from '@/common/components/thirdMenu/index.vue';
-import { EnumRouterName } from '@/common/constants/enumRouterName';
-import { handleMartketThirdRouter } from '@/common/setup/matket/router';
-
-export default defineComponent({
-    name: EnumRouterName.search_commodity_contract,
-    components: {
-        ThridMenu,
-    },
-    setup() {
-        return { ...handleMartketThirdRouter(EnumRouterName.search_commodity_contract) };
-    },
-});
-</script>
-<style lang="less">
-</style>

src/views/search/search_document_records/search_commodity_contract/search_document_records_commission_record/index.vue

@@ -1,22 +1,27 @@
 <template>
-  <!-- 单据记录 商品合约-->
-  <div class="topTableHeight">
-    <a-table :columns="columns" class="srcollYTable" :scroll="{ x: '100%', y: 'calc(100vh - 405px)' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :rowKey="(record,index)=>index" :data-source="tableList"></a-table>
-  </div>
+  <!-- 单据记录 商品合约 委托记录 -->
+  <mtp-table-scroll>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList"></a-table>
+    </template>
+  </mtp-table-scroll>
 </template>
 
 <script lang="ts">
-import { EnumRouterName } from '@/common/constants/enumRouterName';
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
 import { queryTableList, defineComponent, ComposeTableParam } from '@/common/export/commonTable';
 import { QueryOrderQuoteReq, WrOrderQuote } from '@/services/go/wrtrade/interface';
 import { queryOrderQuote } from '@/services/go/wrtrade';
 import { handleComposeTable } from '@/views/market/market-spot/setup';
 
 export default defineComponent({
-  name: EnumRouterName.search_document_records_commission_record,
+  components: {
+    MtpTableScroll
+  },
   setup() {
     // 表格列表数据
     const { loading, tableList, queryTable } = queryTableList<WrOrderQuote>();
+
     // 获取列表数据
     const queryTableAction = () => {
       const param: QueryOrderQuoteReq = {
@@ -24,20 +29,19 @@ export default defineComponent({
         haswr: 0,
       };
       queryTable(queryOrderQuote, param);
-    };
+    }
+
     // 表格通用逻辑
     const param: ComposeTableParam = {
       queryFn: queryTableAction,
       tableName: 'table_pcweb_spot_trade_warehouse_sale_price',
-    };
+    }
 
     return {
       ...handleComposeTable<WrOrderQuote>(param),
       loading,
       tableList,
-    };
-  },
-});
-</script>
-<style lang="less">
-</style>
+    }
+  }
+})
+</script>

src/views/search/search_document_records/search_commodity_contract/search_document_records_contract_summary/index.vue

@@ -1,22 +1,27 @@
 <template>
-  <!-- 单据记录 商品合约-->
-  <div class="topTableHeight">
-    <a-table :columns="columns" class="srcollYTable" :scroll="{ x: '100%', y: 'calc(100vh - 405px)' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :rowKey="(record,index)=>index" :data-source="tableList"></a-table>
-  </div>
+  <!-- 单据记录 商品合约 合约汇总-->
+  <mtp-table-scroll>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList"></a-table>
+    </template>
+  </mtp-table-scroll>
 </template>
 
 <script lang="ts">
-import { EnumRouterName } from '@/common/constants/enumRouterName';
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
 import { queryTableList, defineComponent, ComposeTableParam } from '@/common/export/commonTable';
 import { QueryOrderQuoteReq, WrOrderQuote } from '@/services/go/wrtrade/interface';
 import { queryOrderQuote } from '@/services/go/wrtrade';
 import { handleComposeTable } from '@/views/market/market-spot/setup';
 
 export default defineComponent({
-  name: EnumRouterName.search_document_records_contract_summary,
+  components: {
+    MtpTableScroll
+  },
   setup() {
     // 表格列表数据
     const { loading, tableList, queryTable } = queryTableList<WrOrderQuote>();
+
     // 获取列表数据
     const queryTableAction = () => {
       const param: QueryOrderQuoteReq = {
@@ -24,20 +29,19 @@ export default defineComponent({
         haswr: 0,
       };
       queryTable(queryOrderQuote, param);
-    };
+    }
+
     // 表格通用逻辑
     const param: ComposeTableParam = {
       queryFn: queryTableAction,
       tableName: 'table_pcweb_spot_trade_warehouse_sale_price',
-    };
+    }
 
     return {
       ...handleComposeTable<WrOrderQuote>(param),
       loading,
       tableList,
-    };
-  },
-});
-</script>
-<style lang="less">
-</style>
+    }
+  }
+})
+</script>

src/views/search/search_document_records/search_commodity_contract/search_document_records_delivery_record/index.vue

@@ -1,22 +1,27 @@
 <template>
-  <!-- 单据记录 商品合约-->
-  <div class="topTableHeight">
-    <a-table :columns="columns" class="srcollYTable" :scroll="{ x: '100%', y: 'calc(100vh - 405px)' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :rowKey="(record,index)=>index" :data-source="tableList"></a-table>
-  </div>
+  <!-- 单据记录 商品合约 交收记录 -->
+  <mtp-table-scroll>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList"></a-table>
+    </template>
+  </mtp-table-scroll>
 </template>
 
 <script lang="ts">
-import { EnumRouterName } from '@/common/constants/enumRouterName';
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
 import { queryTableList, defineComponent, ComposeTableParam } from '@/common/export/commonTable';
 import { QueryOrderQuoteReq, WrOrderQuote } from '@/services/go/wrtrade/interface';
 import { queryOrderQuote } from '@/services/go/wrtrade';
 import { handleComposeTable } from '@/views/market/market-spot/setup';
 
 export default defineComponent({
-  name: EnumRouterName.search_document_records_delivery_record,
+  components: {
+    MtpTableScroll
+  },
   setup() {
     // 表格列表数据
     const { loading, tableList, queryTable } = queryTableList<WrOrderQuote>();
+
     // 获取列表数据
     const queryTableAction = () => {
       const param: QueryOrderQuoteReq = {
@@ -24,20 +29,19 @@ export default defineComponent({
         haswr: 0,
       };
       queryTable(queryOrderQuote, param);
-    };
+    }
+
     // 表格通用逻辑
     const param: ComposeTableParam = {
       queryFn: queryTableAction,
       tableName: 'table_pcweb_spot_trade_warehouse_sale_price',
-    };
+    }
 
     return {
       ...handleComposeTable<WrOrderQuote>(param),
       loading,
       tableList,
-    };
-  },
-});
-</script>
-<style lang="less">
-</style>
+    }
+  }
+})
+</script>

src/views/search/search_document_records/search_commodity_contract/search_document_records_transaction_record/index.vue

@@ -1,22 +1,27 @@
 <template>
-  <!-- 单据记录 商品合约-->
-  <div class="topTableHeight">
-    <a-table :columns="columns" class="srcollYTable" :scroll="{ x: '100%', y: 'calc(100vh - 405px)' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :rowKey="(record,index)=>index" :data-source="tableList"></a-table>
-  </div>
+  <!-- 单据记录 商品合约 成交记录 -->
+  <mtp-table-scroll>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList"></a-table>
+    </template>
+  </mtp-table-scroll>
 </template>
 
 <script lang="ts">
-import { EnumRouterName } from '@/common/constants/enumRouterName';
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
 import { queryTableList, defineComponent, ComposeTableParam } from '@/common/export/commonTable';
 import { QueryOrderQuoteReq, WrOrderQuote } from '@/services/go/wrtrade/interface';
 import { queryOrderQuote } from '@/services/go/wrtrade';
 import { handleComposeTable } from '@/views/market/market-spot/setup';
 
 export default defineComponent({
-  name: EnumRouterName.search_document_records_transaction_record,
+  components: {
+    MtpTableScroll
+  },
   setup() {
     // 表格列表数据
     const { loading, tableList, queryTable } = queryTableList<WrOrderQuote>();
+
     // 获取列表数据
     const queryTableAction = () => {
       const param: QueryOrderQuoteReq = {
@@ -24,20 +29,19 @@ export default defineComponent({
         haswr: 0,
       };
       queryTable(queryOrderQuote, param);
-    };
+    }
+
     // 表格通用逻辑
     const param: ComposeTableParam = {
       queryFn: queryTableAction,
       tableName: 'table_pcweb_spot_trade_warehouse_sale_price',
-    };
+    }
 
     return {
       ...handleComposeTable<WrOrderQuote>(param),
       loading,
       tableList,
-    };
-  },
-});
-</script>
-<style lang="less">
-</style>
+    }
+  }
+})
+</script>

src/views/search/search_document_records/search_pre_sale_warehouse_receipt/index.vue

@@ -1,29 +0,0 @@
-
-<template>
-  <!-- 单据记录 -->
-  <div class="topTableHeight40">
-    <router-view></router-view>
-    <ThridMenu :list="tabList"
-               :selectedKey="index"
-               @selectMenu="changeTab" />
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue';
-import ThridMenu from '@/common/components/thirdMenu/index.vue';
-import { EnumRouterName } from '@/common/constants/enumRouterName';
-import { handleMartketThirdRouter } from '@/common/setup/matket/router';
-
-export default defineComponent({
-    name: EnumRouterName.search_pre_sale_warehouse_receipt,
-    components: {
-        ThridMenu,
-    },
-    setup() {
-        return { ...handleMartketThirdRouter(EnumRouterName.search_pre_sale_warehouse_receipt) };
-    },
-});
-</script>
-<style lang="less">
-</style>

src/views/search/search_document_records/search_pre_sale_warehouse_receipt/search_pre_sale_warehouse_receipt_commission_record/index.vue

@@ -1,50 +1,55 @@
 <template>
   <!--  单据记录 预售仓单 委托记录 -->
-  <div class="topTableHeight">
-    <a-table :columns="columns" class="srcollYTable expandLeftTable" :scroll="{ x: '100%', y: '190px' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :expandIcon="expandIcon" :expandIconAsCell="false" :rowKey="(record,index)=>index" :data-source="tableList">
-      <!--  委托状态-->
-      <template #wrtradeorderstatus="{ record }">
-        <a>{{ getWrTradeOrderStatusName(record.wrtradeorderstatus) }}</a>
-      </template>
-      <!-- 挂牌类型 -->
-      <template #wrtradetype="{ record }">
-        <a>{{ getWrOrderTypeName(record.buyorsell, record.wrtradetype) }}</a>
-      </template>
-    </a-table>
-  </div>
+  <mtp-table-scroll>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList">
+        <!--  委托状态-->
+        <template #wrtradeorderstatus="{ record }">
+          <a>{{ getWrTradeOrderStatusName(record.wrtradeorderstatus) }}</a>
+        </template>
+        <!-- 挂牌类型 -->
+        <template #wrtradetype="{ record }">
+          <a>{{ getWrOrderTypeName(record.buyorsell, record.wrtradetype) }}</a>
+        </template>
+      </a-table>
+    </template>
+  </mtp-table-scroll>
 </template>
 
 <script lang="ts">
-import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
-import { queryTableList, BtnList, defineAsyncComponent, defineComponent, ModalEnum } from '@/common/export/commonTable';
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
+import { queryTableList, defineComponent } from '@/common/export/commonTable';
 import { queryWrOrderDetail } from '@/services/go/wrtrade';
 import { QueryWrOrderDetailReq, WrOrderDetail } from '@/services/go/wrtrade/interface';
 import { getRecordItemTab } from '@/common/setup/order/orderData';
 import { handleComposeOrderTable } from '@/common/setup/table/compose';
 import { ComposeOrderTableParam } from '@/common/setup/table/interface';
 import { getWrOrderTypeName, getWrTradeOrderStatusName } from '@/common/constants/enumsName';
-import { BtnListType } from '@/common/components/btnList/interface';
 import { expandIcon } from '@/common/setup/table/clolumn';
-import { EnumRouterName } from '@/common/constants/enumRouterName';
 
 export default defineComponent({
-  name: EnumRouterName.search_pre_sale_warehouse_receipt_commission_record,
+  components: {
+    MtpTableScroll
+  },
   setup() {
     // 表格列表数据
     const { loading, tableList, queryTable } = queryTableList<WrOrderDetail>();
+
     // 获取列表数据
     const queryTableAction = () => {
       const param: QueryWrOrderDetailReq = {
         haswr: 0,
       };
       queryTable(queryWrOrderDetail, param);
-    };
+    }
+
     // 表格通用逻辑
     const param: ComposeOrderTableParam = {
       queryFn: queryTableAction,
       tableName: 'table_pcweb_spot_trade_bottom_pre_sale_pending_order',
       recordList: getRecordItemTab(),
-    };
+    }
+
     return {
       ...handleComposeOrderTable<WrOrderDetail>(param),
       loading,
@@ -52,7 +57,7 @@ export default defineComponent({
       expandIcon,
       getWrTradeOrderStatusName,
       getWrOrderTypeName,
-    };
-  },
-});
+    }
+  }
+})
 </script>

src/views/search/search_document_records/search_pre_sale_warehouse_receipt/search_pre_sale_warehouse_receipt_order_summary/index.vue

@@ -1,25 +1,30 @@
 <template>
   <!-- 单据记录 预售仓单 订单汇总 -->
-  <div class="topTableHeight">
-    <a-table :columns="columns" class="srcollYTable expandLeftTable" :scroll="{ x: '100%', y: '190px' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :expandIcon="expandIcon" :expandIconAsCell="false" :rowKey="(record,index)=>index" :data-source="tableList"></a-table>
-  </div>
+  <mtp-table-scroll>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList"></a-table>
+    </template>
+  </mtp-table-scroll>
 </template>
 
 <script lang="ts">
-import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
-import { queryTableList, BtnList, defineAsyncComponent, defineComponent, ModalEnum } from '@/common/export/commonTable';
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
+import { queryTableList, defineComponent } from '@/common/export/commonTable';
 import { queryWrPosition } from '@/services/go/wrtrade';
 import { QueryWrPositionReq, WrPosition } from '@/services/go/wrtrade/interface';
 import { getRecordItemTab } from '@/common/setup/order/orderData';
 import { handleComposeOrderTable } from '@/common/setup/table/compose';
 import { ComposeOrderTableParam } from '@/common/setup/table/interface';
 import { expandIcon } from '@/common/setup/table/clolumn';
-import { EnumRouterName } from '@/common/constants/enumRouterName';
+
 export default defineComponent({
-  name: EnumRouterName.search_pre_sale_warehouse_receipt_order_summary,
+  components: {
+    MtpTableScroll
+  },
   setup() {
     // 表格列表数据
     const { loading, tableList, queryTable } = queryTableList<WrPosition>();
+
     // 获取列表数据
     const queryTableAction = () => {
       const param: QueryWrPositionReq = {
@@ -27,19 +32,21 @@ export default defineComponent({
         querytype: 2,
       };
       queryTable(queryWrPosition, param);
-    };
+    }
+
     // 表格通用逻辑
     const param: ComposeOrderTableParam = {
       queryFn: queryTableAction,
       tableName: 'table_pcweb_spot_trade_bottom_pre_sale_order_summary',
       recordList: getRecordItemTab(),
-    };
+    }
+
     return {
       ...handleComposeOrderTable<WrPosition>(param),
       loading,
       tableList,
       expandIcon,
-    };
-  },
-});
+    }
+  }
+})
 </script>

src/views/search/search_document_records/search_pre_sale_warehouse_receipt/search_pre_sale_warehouse_receipt_protocol_specified_record/index.vue

@@ -1,22 +1,27 @@
 <template>
-  <!-- 单据记录 商品合约-->
-  <div class="topTableHeight">
-    <a-table :columns="columns" class="srcollYTable" :scroll="{ x: '100%', y: 'calc(100vh - 405px)' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList"></a-table>
-  </div>
+  <!-- 单据记录 预售仓单 协议指定记录-->
+  <mtp-table-scroll>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList"></a-table>
+    </template>
+  </mtp-table-scroll>
 </template>
 
 <script lang="ts">
-import { EnumRouterName } from '@/common/constants/enumRouterName';
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
 import { queryTableList, defineComponent, ComposeTableParam } from '@/common/export/commonTable';
 import { QueryOrderQuoteReq, WrOrderQuote } from '@/services/go/wrtrade/interface';
 import { queryOrderQuote } from '@/services/go/wrtrade';
 import { handleComposeTable } from '@/views/market/market-spot/setup';
 
 export default defineComponent({
-  name: EnumRouterName.search_pre_sale_warehouse_receipt_protocol_specified_record,
+  components: {
+    MtpTableScroll
+  },
   setup() {
     // 表格列表数据
     const { loading, tableList, queryTable } = queryTableList<WrOrderQuote>();
+
     // 获取列表数据
     const queryTableAction = () => {
       const param: QueryOrderQuoteReq = {
@@ -24,20 +29,19 @@ export default defineComponent({
         haswr: 0,
       };
       queryTable(queryOrderQuote, param);
-    };
+    }
+
     // 表格通用逻辑
     const param: ComposeTableParam = {
       queryFn: queryTableAction,
       tableName: 'table_pcweb_spot_trade_warehouse_sale_price',
-    };
+    }
 
     return {
       ...handleComposeTable<WrOrderQuote>(param),
       loading,
       tableList,
-    };
-  },
-});
-</script>
-<style lang="less">
-</style>
+    }
+  }
+})
+</script>

src/views/search/search_document_records/search_pre_sale_warehouse_receipt/search_pre_sale_warehouse_receipt_transaction_record/index.vue

@@ -1,45 +1,51 @@
 <template>
   <!--  单据记录 预售仓单 成交记录 -->
-  <div class="topTableHeight">
-    <a-table :columns="columns" class="srcollYTable expandLeftTable" :scroll="{ x: '100%', y: '190px' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :expandIcon="expandIcon" :expandIconAsCell="false" :rowKey="(record,index)=>index" :data-source="tableList"></a-table>
-  </div>
+  <mtp-table-scroll>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList"></a-table>
+    </template>
+  </mtp-table-scroll>
 </template>
 
 <script lang="ts">
-import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
-import { queryTableList, BtnList, defineAsyncComponent, defineComponent } from '@/common/export/commonTable';
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
+import { queryTableList, defineComponent } from '@/common/export/commonTable';
 import { queryWrTradeDetail } from '@/services/go/wrtrade';
 import { QueryWrSpecialMatchOrderReq, WrSpecialMatchOrder } from '@/services/go/wrtrade/interface';
 import { getRecordItemTab } from '@/common/setup/order/orderData';
 import { handleComposeOrderTable } from '@/common/setup/table/compose';
 import { ComposeOrderTableParam } from '@/common/setup/table/interface';
 import { expandIcon } from '@/common/setup/table/clolumn';
-import { EnumRouterName } from '@/common/constants/enumRouterName';
 
 export default defineComponent({
-  name: EnumRouterName.search_pre_sale_warehouse_receipt_transaction_record,
+  components: {
+    MtpTableScroll
+  },
   setup() {
     // 表格列表数据
     const { loading, tableList, queryTable } = queryTableList<WrSpecialMatchOrder>();
+
     // 获取列表数据
     const queryTableAction = () => {
       const param: QueryWrSpecialMatchOrderReq = {
         haswr: 0,
       };
       queryTable(queryWrTradeDetail, param);
-    };
+    }
+
     // 表格通用逻辑
     const param: ComposeOrderTableParam = {
       queryFn: queryTableAction,
       tableName: 'table_pcweb_spot_trade_bottom_pre_sale_make_deal',
       recordList: getRecordItemTab(),
-    };
+    }
+
     return {
       ...handleComposeOrderTable<WrSpecialMatchOrder>(param),
       loading,
       tableList,
       expandIcon,
-    };
-  },
-});
+    }
+  }
+})
 </script>

src/views/search/search_document_records/search_spot_warrant/index.vue

@@ -1,29 +0,0 @@
-
-<template>
-  <!-- 单据记录 -->
-  <div class="topTableHeight40">
-    <router-view></router-view>
-    <ThridMenu :list="tabList"
-               :selectedKey="index"
-               @selectMenu="changeTab" />
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue';
-import ThridMenu from '@/common/components/thirdMenu/index.vue';
-import { EnumRouterName } from '@/common/constants/enumRouterName';
-import { handleMartketThirdRouter } from '@/common/setup/matket/router';
-
-export default defineComponent({
-    name: EnumRouterName.search_spot_warrant,
-    components: {
-        ThridMenu,
-    },
-    setup() {
-        return { ...handleMartketThirdRouter(EnumRouterName.search_spot_warrant) };
-    },
-});
-</script>
-<style lang="less">
-</style>

src/views/search/search_document_records/search_spot_warrant/search_spot_warrant_listing_record/index.vue

@@ -1,51 +1,55 @@
 <template>
   <!-- 单据记录 现货仓单 挂牌记录 -->
-  <div class="topTableHeight">
-    <a-table :columns="columns" class="srcollYTable expandLeftTable" :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :expandIcon="expandIcon" :expandIconAsCell="false" :rowKey="(record,index)=>index" :data-source="tableList">
-      <!--  委托状态-->
-      <template #wrtradeorderstatus="{ record }">
-        <a>{{ getWrTradeOrderStatusName(record.wrtradeorderstatus) }}</a>
-      </template>
-      <!-- 挂牌类型 -->
-      <template #wrtradetype="{ record }">
-        <a>{{ getWrOrderTypeName(record.buyorsell, record.wrtradetype) }}</a>
-      </template>
-      <!-- 挂牌价格 -->
-    </a-table>
-  </div>
+  <mtp-table-scroll>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList">
+        <!--  委托状态-->
+        <template #wrtradeorderstatus="{ record }">
+          <a>{{ getWrTradeOrderStatusName(record.wrtradeorderstatus) }}</a>
+        </template>
+        <!-- 挂牌类型 -->
+        <template #wrtradetype="{ record }">
+          <a>{{ getWrOrderTypeName(record.buyorsell, record.wrtradetype) }}</a>
+        </template>
+        <!-- 挂牌价格 -->
+      </a-table>
+    </template>
+  </mtp-table-scroll>
 </template>
 
 <script lang="ts">
-import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
-import { queryTableList, BtnList, defineAsyncComponent, defineComponent, ModalEnum } from '@/common/export/commonTable';
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
+import { queryTableList, defineComponent } from '@/common/export/commonTable';
 import { queryWrOrderDetail } from '@/services/go/wrtrade';
 import { QueryWrOrderDetailReq, WrOrderDetail } from '@/services/go/wrtrade/interface';
 import { getRecordItemTab } from '@/common/setup/order/orderData';
 import { handleComposeOrderTable } from '@/common/setup/table/compose';
 import { ComposeOrderTableParam } from '@/common/setup/table/interface';
 import { getWrOrderTypeName, getWrTradeOrderStatusName } from '@/common/constants/enumsName';
-import { BtnListType } from '@/common/components/btnList/interface';
 import { expandIcon } from '@/common/setup/table/clolumn';
-import { EnumRouterName } from '@/common/constants/enumRouterName';
 
 export default defineComponent({
-  name: EnumRouterName.search_spot_warrant_listing_record,
+  components: {
+    MtpTableScroll
+  },
   setup() {
     // 表格列表数据
     const { loading, tableList, queryTable } = queryTableList<WrOrderDetail>();
+
     // 获取列表数据
     const queryTableAction = () => {
       const param: QueryWrOrderDetailReq = {
         haswr: 1,
       };
       queryTable(queryWrOrderDetail, param);
-    };
+    }
+
     // 表格通用逻辑
     const param: ComposeOrderTableParam = {
       queryFn: queryTableAction,
       tableName: 'table_pcweb_spot_trade_bottom_spot_warrant_pending_order',
       recordList: getRecordItemTab(),
-    };
+    }
 
     return {
       ...handleComposeOrderTable<WrOrderDetail>(param),
@@ -54,7 +58,7 @@ export default defineComponent({
       getWrTradeOrderStatusName,
       getWrOrderTypeName,
       expandIcon,
-    };
-  },
-});
+    }
+  }
+})
 </script>

src/views/search/search_document_records/search_spot_warrant/search_spot_warrant_protocol_specified_record/index.vue

@@ -1,22 +1,27 @@
 <template>
-  <!-- 单据记录 商品合约-->
-  <div class="topTableHeight">
-    <a-table :columns="columns" class="srcollYTable" :scroll="{ x: '100%', y: 'calc(100vh - 405px)' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList"></a-table>
-  </div>
+  <!-- 单据记录 现货仓单 协议指定记录 -->
+  <mtp-table-scroll>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList"></a-table>
+    </template>
+  </mtp-table-scroll>
 </template>
 
 <script lang="ts">
-import { EnumRouterName } from '@/common/constants/enumRouterName';
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
 import { queryTableList, defineComponent, ComposeTableParam } from '@/common/export/commonTable';
 import { QueryOrderQuoteReq, WrOrderQuote } from '@/services/go/wrtrade/interface';
 import { queryOrderQuote } from '@/services/go/wrtrade';
 import { handleComposeTable } from '@/views/market/market-spot/setup';
 
 export default defineComponent({
-  name: EnumRouterName.search_spot_warrant_protocol_specified_record,
+  components: {
+    MtpTableScroll
+  },
   setup() {
     // 表格列表数据
     const { loading, tableList, queryTable } = queryTableList<WrOrderQuote>();
+
     // 获取列表数据
     const queryTableAction = () => {
       const param: QueryOrderQuoteReq = {
@@ -24,21 +29,19 @@ export default defineComponent({
         haswr: 0,
       };
       queryTable(queryOrderQuote, param);
-    };
+    }
+
     // 表格通用逻辑
     const param: ComposeTableParam = {
       queryFn: queryTableAction,
       tableName: 'table_pcweb_spot_trade_warehouse_sale_price',
-    };
+    }
 
     return {
       ...handleComposeTable<WrOrderQuote>(param),
-      name: EnumRouterName.warehouse_pre_sale_price,
       loading,
       tableList,
-    };
-  },
-});
-</script>
-<style lang="less">
-</style>
+    }
+  }
+})
+</script>

src/views/search/search_document_records/search_spot_warrant/search_spot_warrant_transaction_record/index.vue

@@ -1,24 +1,24 @@
 <template>
   <!-- 单据记录 现货仓单 成交记录 -->
-  <div class="topTableHeight">
-    <a-table :columns="columns" class="srcollYTable expandLeftTable" :scroll="{ x: '100%', y:'calc(100vh - 163px)'}" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :expandIcon="expandIcon" :expandIconAsCell="false" :rowKey="(record,index)=>index" :data-source="tableList">
-
-      <!-- 成交金额 -->
-      <template #amount="{ record }">
-        <a>{{ record.tradeqty * record.tradeprice }}</a>
-      </template>
-
-      <!-- 挂牌类型 -->
-      <template #wrtradetype="{ record }">
-        <a>{{ getWrOrderTypeName(record.buyorsell, record.wrtradetype) }}</a>
-      </template>
-    </a-table>
-  </div>
+  <mtp-table-scroll>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList">
+        <!-- 成交金额 -->
+        <template #amount="{ record }">
+          <a>{{ record.tradeqty * record.tradeprice }}</a>
+        </template>
+        <!-- 挂牌类型 -->
+        <template #wrtradetype="{ record }">
+          <a>{{ getWrOrderTypeName(record.buyorsell, record.wrtradetype) }}</a>
+        </template>
+      </a-table>
+    </template>
+  </mtp-table-scroll>
 </template>
 
 <script lang="ts">
-import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
-import { queryTableList, BtnList, defineAsyncComponent, defineComponent } from '@/common/export/commonTable';
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
+import { queryTableList, defineComponent } from '@/common/export/commonTable';
 import { queryWrTradeDetail } from '@/services/go/wrtrade';
 import { QueryWrSpecialMatchOrderReq, WrSpecialMatchOrder } from '@/services/go/wrtrade/interface';
 import { getRecordItemTab } from '@/common/setup/order/orderData';
@@ -26,33 +26,37 @@ import { handleComposeOrderTable } from '@/common/setup/table/compose';
 import { ComposeOrderTableParam } from '@/common/setup/table/interface';
 import { expandIcon } from '@/common/setup/table/clolumn';
 import { getWrOrderTypeName } from '@/common/constants/enumsName';
-import { EnumRouterName } from '@/common/constants/enumRouterName';
 
 export default defineComponent({
-  name: EnumRouterName.search_spot_warrant_transaction_record,
+  components: {
+    MtpTableScroll
+  },
   setup() {
     // 表格列表数据
     const { loading, tableList, queryTable } = queryTableList<WrSpecialMatchOrder>();
+
     // 获取列表数据
     const queryTableAction = () => {
       const param: QueryWrSpecialMatchOrderReq = {
         haswr: 1,
       };
       queryTable(queryWrTradeDetail, param);
-    };
+    }
+
     // 表格通用逻辑
     const param: ComposeOrderTableParam = {
       queryFn: queryTableAction,
       tableName: 'table_pcweb_spot_trade_bottom_spot_warrant_deal',
       recordList: getRecordItemTab(),
-    };
+    }
+
     return {
       ...handleComposeOrderTable<WrSpecialMatchOrder>(param),
       loading,
       tableList,
       expandIcon,
       getWrOrderTypeName,
-    };
-  },
-});
+    }
+  }
+})
 </script>

src/views/search/search_document_records/search_spot_warrant/search_spot_warrant_warehouse_receipt_details/index.vue

@@ -1,41 +1,48 @@
 <template>
   <!-- 单据记录 现货仓单 现货明细 -->
-  <div class="topTableHeight">
-    <a-table :columns="columns" class="srcollYTable expandLeftTable" :scroll="{ x: '100%', y: '190px' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :expandIcon="expandIcon" :expandIconAsCell="false" :rowKey="(record,index)=>index" :data-source="tableList"></a-table>
-  </div>
+  <mtp-table-scroll>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList"></a-table>
+    </template>
+  </mtp-table-scroll>
 </template>
 
 <script lang="ts">
-import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
-import { EnumRouterName } from '@/common/constants/enumRouterName';
-import { queryTableList, BtnList, contextMenu, defineAsyncComponent, defineComponent, ModalEnum, ComposeTableParam, handleComposeTable } from '@/common/export/commonTable';
-import { queryHoldLB, queryWrOrderDetail, queryWrPosition } from '@/services/go/wrtrade';
-import { QueryHoldLBReq, QueryWrOrderDetailReq, QueryWrPositionReq, WrHoldLB, WrOrderDetail, WrPosition } from '@/services/go/wrtrade/interface';
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
+import { queryTableList, defineComponent, } from '@/common/export/commonTable';
+import { queryHoldLB } from '@/services/go/wrtrade';
+import { WrHoldLB } from '@/services/go/wrtrade/interface';
 import { getRecordItemTab } from '@/common/setup/order/orderData';
 import { handleComposeOrderTable } from '@/common/setup/table/compose';
 import { ComposeOrderTableParam } from '@/common/setup/table/interface';
 import { expandIcon } from '@/common/setup/table/clolumn';
+
 export default defineComponent({
-  name: EnumRouterName.search_spot_warrant_warehouse_receipt_details,
+  components: {
+    MtpTableScroll
+  },
   setup() {
     // 表格列表数据
     const { loading, tableList, queryTable } = queryTableList<WrHoldLB>();
+
     // 获取列表数据
     const queryTableAction = () => {
       queryTable(queryHoldLB);
-    };
+    }
+
     // 表格通用逻辑
     const param: ComposeOrderTableParam = {
       queryFn: queryTableAction,
       tableName: 'table_pcweb_spot_trade_bottom_spot_warrant_spot_detail',
       recordList: getRecordItemTab(),
-    };
+    }
+
     return {
       ...handleComposeOrderTable<WrHoldLB>(param),
       loading,
       tableList,
       expandIcon,
-    };
-  },
-});
+    }
+  }
+})
 </script>

src/views/search/search_financing_inquiry/search_financing_inquiry_apply_order/index.vue

@@ -1,35 +1,34 @@
 <template>
   <!-- 融资查询 申请单 -->
-  <section>
-    <a-table :columns="columns" class="srcollYTable expandLeftTable" :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :expandIcon="expandIcon" :expandIconAsCell="false" :rowKey="(record,index)=>index" :data-source="tableList">
-      <!-- 类型 -->
-      <template #financetype="{ record }">
-        <a>{{ getFinanceTypeName(record.financetype) }}</a>
-      </template>
-
-      <!-- 状态 -->
-      <template #applystatus="{ text }">
-        <a>{{ getApplyStatusFinanceName(text) }}</a>
-      </template>
-
-      <template #createtime="{ record }">
-        <a>{{ formatTime(record.createtime) }}</a>
-      </template>
-
-      <!-- 结算方式 1:按日结息 3:按月结息-->
-      <template #interestsettlemode="{ record }">
-        <a>{{ getInterestSettleModeName(record.interestsettlemode) }}</a>
-      </template>
-      <!-- 费用 -->
-      <template #interestsettlevalue="{ record }">
-        <a>{{ getInterestrateModeName(record.interestratemode, record.interestrate) }}</a>
-      </template>
-
-    </a-table>
-  </section>
+  <mtp-table-scroll>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList">
+        <!-- 类型 -->
+        <template #financetype="{ record }">
+          <a>{{ getFinanceTypeName(record.financetype) }}</a>
+        </template>
+        <!-- 状态 -->
+        <template #applystatus="{ text }">
+          <a>{{ getApplyStatusFinanceName(text) }}</a>
+        </template>
+        <template #createtime="{ record }">
+          <a>{{ formatTime(record.createtime) }}</a>
+        </template>
+        <!-- 结算方式 1:按日结息 3:按月结息-->
+        <template #interestsettlemode="{ record }">
+          <a>{{ getInterestSettleModeName(record.interestsettlemode) }}</a>
+        </template>
+        <!-- 费用 -->
+        <template #interestsettlevalue="{ record }">
+          <a>{{ getInterestrateModeName(record.interestratemode, record.interestrate) }}</a>
+        </template>
+      </a-table>
+    </template>
+  </mtp-table-scroll>
 </template>
 
 <script lang="ts">
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
 import { queryTableList, defineComponent } from '@/common/export/commonTable';
 import { queryWrFinanceBuyApply } from '@/services/go/wrtrade';
 import { WrFinanceBuyApply } from '@/services/go/wrtrade/interface';
@@ -39,23 +38,27 @@ import { ComposeOrderTableParam } from '@/common/setup/table/interface';
 import { formatTime } from '@/common/methods';
 import { expandIcon } from '@/common/setup/table/clolumn';
 import { getApplyStatusFinanceName, getFinanceTypeName, getInterestrateModeName, getInterestSettleModeName } from '@/common/constants/enumsName';
-import { EnumRouterName } from '@/common/constants/enumRouterName';
 
 export default defineComponent({
-  name: EnumRouterName.search_financing_inquiry_apply_order,
+  components: {
+    MtpTableScroll
+  },
   setup() {
     // 表格列表数据
     const { loading, tableList, queryTable } = queryTableList<WrFinanceBuyApply>();
+
     // 获取列表数据
     const queryTableAction = () => {
       queryTable(queryWrFinanceBuyApply);
-    };
+    }
+
     // 表格通用逻辑
     const param: ComposeOrderTableParam = {
       queryFn: queryTableAction,
       tableName: 'table_pcweb_financing_manage_bottom_apply_order',
       recordList: getRecordItemTab(),
-    };
+    }
+
     return {
       ...handleComposeOrderTable<WrFinanceBuyApply>(param),
       loading,
@@ -66,7 +69,7 @@ export default defineComponent({
       getApplyStatusFinanceName,
       getInterestrateModeName,
       getInterestSettleModeName,
-    };
-  },
-});
+    }
+  }
+})
 </script>

src/views/search/search_financing_inquiry/search_financing_inquiry_contract/index.vue

@@ -1,39 +1,40 @@
 <template>
   <!-- 融资查询 合同 -->
-  <section>
-    <a-table :columns="columns" class="srcollYTable expandLeftTable" :scroll="{ x: '100%', y: 'calc(100vh - 163px)'}" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :expandIcon="expandIcon" :expandIconAsCell="false" :rowKey="(record,index)=>index" :data-source="tableList">
-      <!-- 类型 -->
-      <template #financetype="{ record }">
-        <a>{{ getFinanceTypeName(record.financetype) }}</a>
-      </template>
-
-      <!-- 状态 -->
-      <template #scfcontractstatus="{ text }">
-        <a>{{ getContractName(text) }}</a>
-      </template>
-      <template #createtime="{ record }">
-        <a>{{ formatTime(record.createtime) }}</a>
-      </template>
-      <template #scfcontracttype="{ record }">
-        <a>{{ getScfContractTypeName(record.scfcontracttype) }}</a>
-      </template>
-
-    </a-table>
-    <!-- 明细 -->
-    <Description v-if="visible" @close="closeDrawer" :tabList="tabList">
-      <a-table :columns="FeeColumns" class="topTable" :pagination="false" :rowKey="(record,index)=>index" :data-source="feeList" :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }">
-        <template #updatetime="{ text }">
-          <span>{{ text === '--' ? text :  formatTime(text)}}</span>
+  <mtp-table-scroll>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList">
+        <!-- 类型 -->
+        <template #financetype="{ record }">
+          <a>{{ getFinanceTypeName(record.financetype) }}</a>
+        </template>
+        <!-- 状态 -->
+        <template #scfcontractstatus="{ text }">
+          <a>{{ getContractName(text) }}</a>
         </template>
-        <template #closeintereststatus="{ text }">
-          <span>{{ getCloseInterRestStatus(text)}}</span>
+        <template #createtime="{ record }">
+          <a>{{ formatTime(record.createtime) }}</a>
+        </template>
+        <template #scfcontracttype="{ record }">
+          <a>{{ getScfContractTypeName(record.scfcontracttype) }}</a>
         </template>
       </a-table>
-    </Description>
-  </section>
+    </template>
+  </mtp-table-scroll>
+  <!-- 明细 -->
+  <Description v-if="visible" @close="closeDrawer" :tabList="tabList">
+    <a-table :columns="FeeColumns" class="topTable" :pagination="false" :rowKey="(record,index)=>index" :data-source="feeList" :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }">
+      <template #updatetime="{ text }">
+        <span>{{ text === '--' ? text :  formatTime(text)}}</span>
+      </template>
+      <template #closeintereststatus="{ text }">
+        <span>{{ getCloseInterRestStatus(text)}}</span>
+      </template>
+    </a-table>
+  </Description>
 </template>
 
 <script lang="ts">
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
 import Description from '@/common/components/description/index.vue';
 import { EnumRouterName } from '@/common/constants/enumRouterName';
 import { getContractName, getFinanceTypeName, getScfContractTypeName } from '@/common/constants/enumsName';
@@ -47,24 +48,26 @@ import { watchEffect } from 'vue';
 import { useFeeDetail } from './setup';
 
 export default defineComponent({
-  name: EnumRouterName.search_financing_inquiry_contract,
   components: {
+    MtpTableScroll,
     Description,
   },
   setup() {
+    const { FeeColumns, feeList, tabList, queryFeeDetail, getCloseInterRestStatus } = useFeeDetail();
     // 表格列表数据
     const { loading, tableList, queryTable } = queryTableList<WrScfContract>();
+
     // 获取列表数据
     const queryTableAction = () => {
       queryTable(queryWrScfContract);
     };
-    const { FeeColumns, feeList, tabList, queryFeeDetail, getCloseInterRestStatus } = useFeeDetail();
 
     const param: ComposeTableDetailParam = {
       queryFn: queryTableAction,
       tableName: 'table_pcweb_financing_manage_bottom_contract',
       menuType: EnumRouterName.search_financing_inquiry_apply_order, // 当前tab页对应的code
     };
+
     const {
       visible,
       closeDrawer, // 控制 drawer 组件是否显示
@@ -79,7 +82,8 @@ export default defineComponent({
       if (visible.value) {
         queryFeeDetail(selectedRow.value!.scfcontractid);
       }
-    });
+    })
+
     return {
       visible,
       closeDrawer, // 控制 drawer 组件是否显示
@@ -97,7 +101,7 @@ export default defineComponent({
       getFinanceTypeName,
       getScfContractTypeName,
       getCloseInterRestStatus,
-    };
-  },
-});
+    }
+  }
+})
 </script>

src/views/search/search_performance_query/search_performance_query_buy_performance/index.vue

@@ -1,60 +1,63 @@
 <template>
   <!-- 履约查询 买履约 -->
-  <section>
-    <a-table :columns="columns" class="srcollYTable expandLeftTable" :scroll="{ x: '100%', y: 'calc(100vh - 163px)'}" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :expandIcon="expandIcon" :expandIconAsCell="false" :rowKey="(record,index)=>index" :data-source="tableList">
-      <!-- 履约类型 -->
-      <template #performancetype="{ record }">
-        <a>{{ getPerformanceTypeName(record.performancetype) }}</a>
-      </template>
-
-      <!-- 付款方式 -->
-      <template #paymenttype="{ record }">
-        <a>{{ getPaymentTypeName(record.paymenttype) }}</a>
-      </template>
-
-      <!-- 履约状态 -->
-      <template #performancestatus="{ record }">
-        <a>{{ getPerformanceStatusName(record.performancestatus) }}</a>
-      </template>
-
-      <!-- 当前步骤 -->
-      <template #curstepname="{ record }">
-        <a>{{ record.curstepname }}</a>
-      </template>
-    </a-table>
-  </section>
+  <mtp-table-scroll>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList">
+        <!-- 履约类型 -->
+        <template #performancetype="{ record }">
+          <a>{{ getPerformanceTypeName(record.performancetype) }}</a>
+        </template>
+        <!-- 付款方式 -->
+        <template #paymenttype="{ record }">
+          <a>{{ getPaymentTypeName(record.paymenttype) }}</a>
+        </template>
+        <!-- 履约状态 -->
+        <template #performancestatus="{ record }">
+          <a>{{ getPerformanceStatusName(record.performancestatus) }}</a>
+        </template>
+        <!-- 当前步骤 -->
+        <template #curstepname="{ record }">
+          <a>{{ record.curstepname }}</a>
+        </template>
+      </a-table>
+    </template>
+  </mtp-table-scroll>
 </template>
 
 <script lang="ts">
-import { queryTableList, defineComponent, ModalEnum } from '@/common/export/commonTable';
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
+import { queryTableList, defineComponent } from '@/common/export/commonTable';
 import { QueryPerformancePlan } from '@/services/go/wrtrade';
 import { QueryPerformancePlanReq, WrPerformancePlan } from '@/services/go/wrtrade/interface';
 import { getRecordItemTab } from '@/common/setup/order/orderData';
 import { handleComposeOrderTable } from '@/common/setup/table/compose';
 import { ComposeOrderTableParam } from '@/common/setup/table/interface';
 import { expandIcon } from '@/common/setup/table/clolumn';
-import { BtnListType } from '@/common/components/btnList/interface';
 import { BuyOrSell } from '@/common/constants/enumCommon';
 import { getPaymentTypeName, getPerformanceStatusName, getPerformanceTypeName } from '@/common/constants/enumsName';
-import { EnumRouterName } from '@/common/constants/enumRouterName';
+
 export default defineComponent({
-  name: EnumRouterName.search_performance_query_buy_performance,
+  components: {
+    MtpTableScroll
+  },
   setup() {
     // 表格列表数据
     const { loading, tableList, queryTable } = queryTableList<WrPerformancePlan>();
+
     // 获取列表数据
     const queryTableAction = () => {
       const param: QueryPerformancePlanReq = {
         buyorsell: 0,
       };
       queryTable(QueryPerformancePlan, param);
-    };
+    }
+
     // 表格通用逻辑
     const param: ComposeOrderTableParam = {
       queryFn: queryTableAction,
       tableName: 'table_pcweb_spot_trade_bottom_performance_info_buy',
       recordList: getRecordItemTab(),
-    };
+    }
 
     return {
       ...handleComposeOrderTable<WrPerformancePlan>(param),
@@ -65,7 +68,7 @@ export default defineComponent({
       getPaymentTypeName,
       expandIcon,
       BuyOrSell,
-    };
-  },
-});
+    }
+  }
+})
 </script>

src/views/search/search_performance_query/search_performance_query_sell_performance/index.vue

@@ -1,31 +1,31 @@
 <template>
   <!-- 履约查询 卖履约 -->
-  <section>
-    <a-table :columns="columns" class="srcollYTable expandLeftTable" :scroll="{ x: '100%', y: 'calc(100vh - 163px)'}" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :expandIcon="expandIcon" :expandIconAsCell="false" :rowKey="(record,index)=>index" :data-source="tableList">
-      <!-- 履约类型 -->
-      <template #performancetype="{ record }">
-        <a>{{ getPerformanceTypeName(record.performancetype) }}</a>
-      </template>
-
-      <!-- 付款方式 -->
-      <template #paymenttype="{ record }">
-        <a>{{ getPaymentTypeName(record.paymenttype) }}</a>
-      </template>
-
-      <!-- 履约状态 -->
-      <template #performancestatus="{ record }">
-        <a>{{ getPerformanceStatusName(record.performancestatus) }}</a>
-      </template>
-
-      <!-- 当前步骤 -->
-      <template #curstepname="{ record }">
-        <a>{{ record.curstepname }}</a>
-      </template>
-    </a-table>
-  </section>
+  <mtp-table-scroll>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList">
+        <!-- 履约类型 -->
+        <template #performancetype="{ record }">
+          <a>{{ getPerformanceTypeName(record.performancetype) }}</a>
+        </template>
+        <!-- 付款方式 -->
+        <template #paymenttype="{ record }">
+          <a>{{ getPaymentTypeName(record.paymenttype) }}</a>
+        </template>
+        <!-- 履约状态 -->
+        <template #performancestatus="{ record }">
+          <a>{{ getPerformanceStatusName(record.performancestatus) }}</a>
+        </template>
+        <!-- 当前步骤 -->
+        <template #curstepname="{ record }">
+          <a>{{ record.curstepname }}</a>
+        </template>
+      </a-table>
+    </template>
+  </mtp-table-scroll>
 </template>
 
 <script lang="ts">
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
 import { queryTableList, defineComponent } from '@/common/export/commonTable';
 import { QueryPerformancePlan } from '@/services/go/wrtrade';
 import { QueryPerformancePlanReq, WrPerformancePlan } from '@/services/go/wrtrade/interface';
@@ -35,26 +35,30 @@ import { expandIcon } from '@/common/setup/table/clolumn';
 import { ComposeOrderTableParam } from '@/common/setup/table/interface';
 import { BuyOrSell } from '@/common/constants/enumCommon';
 import { getPaymentTypeName, getPerformanceStatusName, getPerformanceTypeName } from '@/common/constants/enumsName';
-import { EnumRouterName } from '@/common/constants/enumRouterName';
 
 export default defineComponent({
-  name: EnumRouterName.search_performance_query_sell_performance,
+  components: {
+    MtpTableScroll
+  },
   setup() {
     // 表格列表数据
     const { loading, tableList, queryTable } = queryTableList<WrPerformancePlan>();
+
     // 获取列表数据
     const queryTableAction = () => {
       const param: QueryPerformancePlanReq = {
         buyorsell: 1,
       };
       queryTable(QueryPerformancePlan, param);
-    };
+    }
+
     // 表格通用逻辑
     const param: ComposeOrderTableParam = {
       queryFn: queryTableAction,
       tableName: 'table_pcweb_spot_trade_bottom_performance_info_sale',
       recordList: getRecordItemTab(),
-    };
+    }
+
     return {
       ...handleComposeOrderTable<WrPerformancePlan>(param),
       loading,
@@ -64,7 +68,7 @@ export default defineComponent({
       getPerformanceStatusName,
       expandIcon,
       BuyOrSell,
-    };
-  },
-});
+    }
+  }
+})
 </script>

src/views/search/search_performance_template/search_performance_template_sub/index.vue

@@ -1,32 +1,36 @@
 <template>
   <!-- 履约模板查询 -->
-  <div class="tltRight">
-    <BtnList :btnList="headBtns" @click="openComponent" />
-  </div>
-  <section>
-    <a-table :columns="columns" class="srcollYTable expandLeftTable" :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :expandIcon="expandIcon" :expandIconAsCell="false" :rowKey="(record,index)=>index" :data-source="tableList">
-      <!-- 状态 -->
-      <template #handle="{ record }">
-        <BtnList :btnList="tableBtns" :record="record" class="btn-list-sticky" @click="openComponent" />
-      </template>
-
-      <template #createtime="{ record }">
-        <span>{{ formatTime(record.createtime) }}</span>
-      </template>
-    </a-table>
-    <!-- 明细 -->
-    <Description v-if="visible" @close="closeDrawer" :tabList="tabList">
-      <a-table :columns="detailColumns" class="topTable" :pagination="false" :rowKey="(record,index)=>index" :data-source="getDetailTalbeList()" :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }">
-        <template #stepvalue="{ text }">
-          <span>{{ text ? (text * 100).toFixed(0) : text }}</span>
+  <mtp-table-scroll>
+    <template #header>
+      <div class="tltRight">
+        <BtnList :btnList="headBtns" @click="openComponent" />
+      </div>
+    </template>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList">
+        <!-- 状态 -->
+        <template #handle="{ record }">
+          <BtnList :btnList="tableBtns" :record="record" class="btn-list-sticky" @click="openComponent" />
+        </template>
+        <template #createtime="{ record }">
+          <span>{{ formatTime(record.createtime) }}</span>
         </template>
       </a-table>
-    </Description>
-    <component :is="componentId" v-if="componentId" :selectedRow="selectedRow" @cancel="closeComponent"></component>
-  </section>
+    </template>
+  </mtp-table-scroll>
+  <!-- 明细 -->
+  <Description v-if="visible" @close="closeDrawer" :tabList="tabList">
+    <a-table :columns="detailColumns" class="topTable" :pagination="false" :rowKey="(record,index)=>index" :data-source="getDetailTalbeList()" :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }">
+      <template #stepvalue="{ text }">
+        <span>{{ text ? (text * 100).toFixed(0) : text }}</span>
+      </template>
+    </a-table>
+  </Description>
+  <component :is="componentId" v-if="componentId" :selectedRow="selectedRow" @cancel="closeComponent"></component>
 </template>
 
 <script lang="ts">
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
 import { queryTableList, defineComponent, BtnList, defineAsyncComponent } from '@/common/export/commonTable';
 import { queryQueryPermancePlanTmp } from '@/services/go/wrtrade';
 import { QueryPermancePlanTmpReq, QueryPermancePlanTmpRsp } from '@/services/go/wrtrade/interface';
@@ -37,21 +41,17 @@ import { expandIcon } from '@/common/setup/table/clolumn';
 import { EnumRouterName } from '@/common/constants/enumRouterName';
 import { getColumns } from './setup';
 import { getUserId } from '@/services/bus/user';
-import { getButtonList, getOrderBtnList } from '@/common/setup/table/button';
+import { getTableButton } from '@/common/setup/table/button';
 import { handleModalComponent } from '@/common/setup/asyncComponent';
 import Description from '@/common/components/description/index.vue';
 import { Ref } from 'vue';
 
-const addCode = 'search_performance_template_add';
-const updateCode = 'search_performance_template_modiy';
-const deleteCode = 'search_performance_template_delete';
-
 const useButton = () => {
   // 表格操作按钮列表
-  const btnList = getButtonList(EnumRouterName.search_performance_template_sub, false);
+  const btnList = getTableButton();
   // 表格 头部 上面按钮
-  const headBtns = btnList.filter((e) => e.code === addCode);
-  const tableBtns = btnList.filter((e) => e.code !== addCode);
+  const headBtns = btnList.filter((e) => e.code === 'add');
+  const tableBtns = btnList.filter((e) => e.code !== 'add');
   return { headBtns, tableBtns };
 };
 
@@ -77,13 +77,13 @@ const useStepDetail = (selectedRow: Ref<QueryPermancePlanTmpRsp | undefined>) =>
 };
 
 export default defineComponent({
-  name: EnumRouterName.search_performance_template_sub,
   components: {
+    MtpTableScroll,
     BtnList,
     Description,
-    [addCode]: defineAsyncComponent(() => import('@/common/components/permanceTemp/addPermanceTemp.vue')),
-    [updateCode]: defineAsyncComponent(() => import('@/common/components/permanceTemp/addPermanceTemp.vue')),
-    [deleteCode]: defineAsyncComponent(() => import('./delete.vue')),
+    add: defineAsyncComponent(() => import('@/common/components/permanceTemp/addPermanceTemp.vue')),
+    modify: defineAsyncComponent(() => import('@/common/components/permanceTemp/addPermanceTemp.vue')),
+    delete: defineAsyncComponent(() => import('./delete.vue')),
   },
   setup() {
     // 表格列表数据
@@ -103,6 +103,7 @@ export default defineComponent({
       queryFn: loadData, // 查询表格数据
       menuType: EnumRouterName.search_performance_template_sub, // 当前tab页对应的code
     };
+
     const {
       visible,
       closeDrawer, // 控制 drawer 组件是否显示
@@ -112,8 +113,6 @@ export default defineComponent({
       tabList,
     } = handleComposeTable_detail<QueryPermancePlanTmpRsp>(param);
 
-    // 表格操作按钮列表
-    const btnList = getButtonList(EnumRouterName.search_performance_template_sub, false);
     return {
       loading,
       tableList,
@@ -131,7 +130,7 @@ export default defineComponent({
 
       formatTime,
       expandIcon,
-    };
-  },
-});
+    }
+  }
+})
 </script>

src/views/search/search_pickup_query/search_pickup_query_tab/index.vue

@@ -1,22 +1,23 @@
 <template>
   <!-- 提货查询 -->
-  <section>
-    <a-table :columns="columns" class="srcollYTable expandLeftTable" :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :expandIcon="expandIcon" :expandIconAsCell="false" :rowKey="(record,index)=>index" :data-source="tableList">
-      <!-- applytype 类型-->
-      <template #applytype="{ record }">
-        <span>{{ getPickUpStatusName(record.applytype) }}</span>
-      </template>
-
-      <!-- applystatus 状态 -->
-      <template #applystatus="{ record }">
-        <span>{{ getPickUpTypeName(record.applystatus) }}</span>
-      </template>
-
-    </a-table>
-  </section>
+  <mtp-table-scroll>
+    <template #default="{ scroll }">
+      <a-table :columns="columns" class="srcollYTable" :scroll="scroll" :pagination="false" :loading="loading" :customRow="Rowclick" :rowKey="(record, index) => index" :data-source="tableList">
+        <!-- applytype 类型-->
+        <template #applytype="{ record }">
+          <span>{{ getPickUpStatusName(record.applytype) }}</span>
+        </template>
+        <!-- applystatus 状态 -->
+        <template #applystatus="{ record }">
+          <span>{{ getPickUpTypeName(record.applystatus) }}</span>
+        </template>
+      </a-table>
+    </template>
+  </mtp-table-scroll>
 </template>
 
 <script lang="ts">
+import MtpTableScroll from '@/common/components/tableScroll/index.vue';
 import { queryTableList, defineComponent } from '@/common/export/commonTable';
 import { queryWrOutInApply } from '@/services/go/wrtrade';
 import { WrOutInApply } from '@/services/go/wrtrade/interface';
@@ -25,23 +26,27 @@ import { handleComposeOrderTable } from '@/common/setup/table/compose';
 import { ComposeOrderTableParam } from '@/common/setup/table/interface';
 import { expandIcon } from '@/common/setup/table/clolumn';
 import { getPickUpStatusName, getPickUpTypeName } from '@/common/constants/enumsName';
-import { EnumRouterName } from '@/common/constants/enumRouterName';
 
 export default defineComponent({
-  name: EnumRouterName.search_pickup_query_tab,
+  components: {
+    MtpTableScroll
+  },
   setup() {
     // 表格列表数据
     const { loading, tableList, queryTable } = queryTableList<WrOutInApply>();
+
     // 获取列表数据
     const queryTableAction = () => {
       queryTable(queryWrOutInApply);
-    };
+    }
+
     // 表格通用逻辑
     const param: ComposeOrderTableParam = {
       queryFn: queryTableAction,
       tableName: 'table_pcweb_spot_trade_bottom_spot_warrant_pick_up',
       recordList: getRecordItemTab(),
-    };
+    }
+
     return {
       ...handleComposeOrderTable<WrOutInApply>(param),
       loading,
@@ -49,7 +54,7 @@ export default defineComponent({
       expandIcon,
       getPickUpStatusName,
       getPickUpTypeName,
-    };
-  },
-});
+    }
+  }
+})
 </script>