期货头寸

src/views/business/exposure/list/futures/index.vue

@@ -2,138 +2,84 @@
   <!-- 敞口: 期货头寸-->
   <div class="exposure-futures  table-height"
        :loading="loading">
-    <filterCustomTable @search="search">
-      <BtnList :btnList="commonBtn" />
+    <filterCustomTable @search="updateColumn">
     </filterCustomTable>
-    <contextMenu :contextMenuList="forDataBtn">
-      <a-table :columns="columns"
-               class="topTable"
-               :expandedRowKeys="expandedRowKeys"
-               :customRow="Rowclick"
-               :pagination="false"
-               rowKey="key"
-               :data-source="tableList">
-      </a-table>
-    </contextMenu>
-    <a-drawer placement="bottom"
-              :closable="false"
-              :visible="visible"
-              :get-container="false"
-              :wrap-style="{ position: 'absolute' }"
-              @close="closeDrawer">
-      <div class="bottomTable">
-        <a-table :columns="detailColumns"
-                 class="topTable"
-                 :pagination="false"
-                 rowKey="key"
-                 :data-source="detailTableList">
-        </a-table>
-        <ThridMenu :list="tabList"
-                   @selectMenu="selectMenu" />
-      </div>
-    </a-drawer>
+    <a-table :columns="columns"
+             class="topTable"
+             :expandedRowKeys="expandedRowKeys"
+             :customRow="Rowclick"
+             :pagination="false"
+             rowKey="key"
+             :data-source="tableList">
+    </a-table>
+    <!-- 明细 -->
+    <Description v-if="visible"
+                 @close="closeDrawer"
+                 :columns="columnsDetail"
+                 :tabList="tabList"
+                 :tableList="detailTableList" />
   </div>
 </template>
 
 <script lang="ts">
-import { defineComponent, Ref, ref } from 'vue';
-import { initData } from '@/common/methods';
+import { defineComponent, watchEffect } from 'vue';
 import filterCustomTable from '../../components/filterTable/index.vue';
-import { getBtnList } from '@/common/setup/contextMenu/index';
-import contextMenu from '@/common/components/contextMenu/index.vue';
-import { getColumsAndSearch } from '../setup';
 import { QueryExposureHedgePositionDetail, QueryExposureHedgePosition } from '@/services/go/ermcp/exposure/index';
-import { ErmcpHedgePosition, ErmcpHedgePositionDetail } from '@/services/go/ermcp/exposure/interface';
-import { message } from 'ant-design-vue';
-import { handleTableEvent } from '@/common/setup/event/index';
-import BtnList from '@/common/components/buttonList/index.vue';
-import ThridMenu from '@/common/components/thirdMenu/index.vue';
-import { ColumnType } from '@/common/methods/table';
-
-// 获取表格数据
-function getExposure() {
-    const loading = ref<boolean>(false);
-    const tableList = ref<ErmcpHedgePosition[]>([]);
-    function queryList() {
-        QueryExposureHedgePosition()
-            .then((res) => {
-                tableList.value = res.map((e, i) => {
-                    return { ...e, key: String(i) };
-                });
-                loading.value = false;
-            })
-            .catch((err) => {
-                message.error(err);
-                loading.value = false;
-            });
-    }
-
-    return { loading, tableList, queryList };
-}
-
-// 控制是否打开明细
-function handleDrawer() {
-    const visible = ref<boolean>(false);
-    function closeDrawer() {
-        visible.value = !visible.value;
-    }
-    return { visible, closeDrawer };
-}
-
-// 明细
-function handleDeatil(loading: Ref<boolean>, selectedRow: ErmcpHedgePosition) {
-    const visible = ref<boolean>(true);
-    const tabList = [{ lable: '期货明细' }];
-    const detailTableList = ref<ErmcpHedgePositionDetail[]>([]);
-    const detailColumns = ref<ColumnType[]>([]);
-    function closeDrawer() {
-        visible.value = false;
-    }
-    // 切换明细
-    function selectMenu(index: number) {
-        ActualExposureDetail();
-        const { columns, getColumns } = getColumsAndSearch('table_pcweb_exposure_futuresposition', false);
-        getColumns();
-        detailColumns.value = columns.value;
-    }
-    selectMenu(0);
-    // 期货明细
-    function ActualExposureDetail() {
-        loading.value = true;
-        const param = { goodsId: selectedRow.goodsid };
-        QueryExposureHedgePositionDetail(param)
-            .then((res) => {
-                detailTableList.value = res.map((e, i) => {
-                    return { ...e, key: String(i) };
-                });
-                loading.value = false;
-            })
-            .catch((err) => {
-                message.error(err);
-                loading.value = false;
-            });
-    }
-    return { tabList, selectMenu, detailTableList, detailColumns };
-}
+import { ErmcpHedgePosition } from '@/services/go/ermcp/exposure/interface';
+import { queryTableList } from '@/common/setup/table';
+import { ComposeTableDetailParam } from '@/common/setup/table/interface';
+import { handleComposeTable_detail } from '@/common/setup/table/compose';
+import { queryResultLoadingAndInfo } from '@/common/methods/request/resultInfo';
+import Description from '@/common/components/description/index.vue';
 
 export default defineComponent({
     name: 'exposure-futures',
     components: {
-        contextMenu,
         filterCustomTable,
-        ThridMenu,
-        BtnList,
+        Description,
     },
     setup() {
-        const { visible, closeDrawer } = handleDrawer();
-        const { columns, search, getColumns } = getColumsAndSearch('table_pcweb_exposure_futuresposition', true);
-        const { expandedRowKeys, selectedRow, Rowclick } = handleTableEvent<ErmcpHedgePosition>(closeDrawer);
-        const { loading, tableList, queryList } = getExposure();
-        initData(() => {
-            queryList();
-            getColumns();
+        // 表格列表数据
+        const { loading, tableList, queryTable } = queryTableList<ErmcpHedgePosition>();
+        // 获取列表数据
+        const queryTableAction = () => queryTable(QueryExposureHedgePosition);
+        const param: ComposeTableDetailParam = {
+            queryFn: queryTableAction, // 查询表格数据
+            tableName: 'table_pcweb_exposure_futuresposition', // 表头key
+            tableFilterKey: ['MiddleGoodsName'], // 表格过滤字段
+        };
+        const {
+            visible,
+            closeDrawer, // 控制 drawer 组件是否显示
+            columns,
+            updateColumn, //  表头数据
+            columnsDetail,
+            registerColumnDetail,
+            detailTableList, // 明细表头数据
+            expandedRowKeys,
+            selectedRow,
+            Rowclick, // 表格事件
+        } = handleComposeTable_detail<ErmcpHedgePosition>(param);
+
+        // 明细
+        const tabList = [{ lable: '期货明细' }];
+        // 期货明细信息
+        function AEDetail() {
+            // 注册表头
+            registerColumnDetail('table_pcweb_exposure_futuresposition', []);
+            const goodsId = selectedRow.value?.goodsid;
+            if (goodsId) {
+                queryResultLoadingAndInfo(QueryExposureHedgePositionDetail, loading, { goodsId }).then((res) => {
+                    detailTableList.value = res;
+                });
+            }
+        }
+        watchEffect(() => {
+            if (visible.value) {
+                AEDetail();
+            }
         });
-        return { columns, search, expandedRowKeys, selectedRow, Rowclick, visible, closeDrawer, ...getBtnList('exposure_futures', false), loading, tableList, ...handleDeatil(loading, (selectedRow as unknown) as ErmcpHedgePosition) };
+        return { loading, tableList, visible, closeDrawer, columns, updateColumn, columnsDetail, detailTableList, expandedRowKeys, selectedRow, Rowclick, tabList };
     },
 });
 </script>

src/views/business/exposure/list/history/index.vue

@@ -2,24 +2,19 @@
   <!-- 采购: 历史敞口-->
   <div class="purchase-history">
     采购:历史敞口
-    <iframe :src="url"></iframe>
   </div>
 </template>
 
 <script lang="ts">
 import { defineComponent } from 'vue';
 import { initData } from '@/common/methods';
-import { getToken } from '@/services/bus/token';
-import { serviceURL } from '@/services/request/serviceURL';
 
 export default defineComponent({
     name: 'purchase-history',
     components: {},
     setup() {
-        const token = getToken();
-        const url = 'http://192.168.31.171:5035/pcmanage/';
         initData(() => {});
-        return { url };
+        return {};
     },
 });
 </script>

src/views/business/exposure/list/spot/index.vue

@@ -59,7 +59,7 @@ export default defineComponent({
             selectedRow,
             Rowclick, // 表格事件
         } = handleComposeTable_detail<Ermcp3AreaSpot>(param);
-        // 现货明细
+        // 明细
         const tabList = [{ lable: '现货明细' }];
         // 现货明细信息
         function AEDetail() {