update

src/assets/styles/mixin.less

@@ -3586,11 +3586,11 @@ input:-internal-autofill-selected {
 
 // 挂牌求购  摘牌弹窗  部分样式
 .inputIconBox {
-    position: relative;
-    float   : left;
-    width   : 425px;
+    position   : relative;
+    // float   : left;
+    // width   : 425px;
 
-    .ant-form-item-children {
+    .ant-form-item-control-input-content {
         width  : 350px;
         display: block;
 
@@ -3613,7 +3613,7 @@ input:-internal-autofill-selected {
         .anticon-plus {
             position: absolute;
             top     : 0px;
-            right   : 98px;
+            right   : 9px;
             z-index : 1;
         }
 

src/common/components/drawer/index.vue

@@ -1,81 +1,72 @@
 <template>
-    <a-drawer
-        placement="right"
-        :closable="false"
-        :visible="visible"
-        :destroyOnClose="true"
-        class="bottomListed"
-        height="405px"
-    >
-        <!-- 摘牌是top  挂牌是bottom 期货交易是tradeDialog -->
-        <div class="collapse" @click="cancel">
-            <DoubleRightOutlined />
+  <a-drawer placement="right" :closable="false" :visible="visible" :destroyOnClose="true" class="bottomListed" height="405px">
+    <!-- 摘牌是top  挂牌是bottom 期货交易是tradeDialog -->
+    <div class="collapse" @click="cancel">
+      <DoubleRightOutlined />
+    </div>
+    <div class="collapseCont">
+      <div class="title">{{ title }}</div>
+      <div class="content highContent">
+        <!-- <Listed></Listed> -->
+        <!-- <Delisting></Delisting> -->
+        <slot></slot>
+        <!-- <Trade></Trade> -->
+      </div>
+    </div>
+
+    <div class="gpDetail" style="display: none">
+      <div class="title">挂牌详情</div>
+      <div class="content">
+        <div class="item">
+          <div class="left">交易账户</div>
+          <div class="right">3237545143</div>
         </div>
-        <div class="collapseCont">
-            <div class="title">{{ title }}</div>
-            <div class="content highContent">
-                <!-- <Listed></Listed> -->
-                <!-- <Delisting></Delisting> -->
-                <slot></slot>
-                <!-- <Trade></Trade> -->
-            </div>
+        <div class="item">
+          <div class="left">挂牌方式</div>
+          <div class="right">贸易圈</div>
         </div>
-
-        <div class="gpDetail" style="display: none">
-            <div class="title">挂牌详情</div>
-            <div class="content">
-                <div class="item">
-                    <div class="left">交易账户</div>
-                    <div class="right">3237545143</div>
-                </div>
-                <div class="item">
-                    <div class="left">挂牌方式</div>
-                    <div class="right">贸易圈</div>
-                </div>
-                <div class="item">
-                    <div class="left">挂牌价格</div>
-                    <div class="right">
-                        <span>1680.00</span>
-                        <span class="grey">(可议价)</span>
-                    </div>
-                </div>
-                <div class="item">
-                    <div class="left">现货仓单</div>
-                    <div class="right">335999666555222222</div>
-                </div>
-                <div class="item">
-                    <div class="left">挂牌数量</div>
-                    <div class="right">
-                        <span>30吨</span>
-                        <span class="grey">整单</span>
-                    </div>
-                </div>
-                <div class="item">
-                    <div class="left">起摘数量</div>
-                    <div class="right">2吨</div>
-                </div>
-                <div
-                    class="someItems"
-                >1000 江**业、1201 *融、1123 南**业、1000 江**业、1201 *融、1123 南**业、1000 江**业、1201 *融、1123 南**业</div>
-                <div class="item">
-                    <div class="left">现货仓单</div>
-                    <div class="right">335999666555222222</div>
-                </div>
-                <div class="item">
-                    <div class="left">指定朋友</div>
-                    <div class="right">1000 江**业、1201 *融、1123 南...</div>
-                </div>
-                <div class="item">
-                    <div class="left">挂牌金额</div>
-                    <div class="right">50400.00</div>
-                </div>
-                <div class="item">
-                    <div class="left">履约保证金</div>
-                    <div class="right">5040.00</div>
-                </div>
-            </div>
+        <div class="item">
+          <div class="left">挂牌价格</div>
+          <div class="right">
+            <span>1680.00</span>
+            <span class="grey">(可议价)</span>
+          </div>
+        </div>
+        <div class="item">
+          <div class="left">现货仓单</div>
+          <div class="right">335999666555222222</div>
+        </div>
+        <div class="item">
+          <div class="left">挂牌数量</div>
+          <div class="right">
+            <span>30吨</span>
+            <span class="grey">整单</span>
+          </div>
+        </div>
+        <div class="item">
+          <div class="left">起摘数量</div>
+          <div class="right">2吨</div>
+        </div>
+        <div class="someItems">1000 江**业、1201 *融、1123 南**业、1000 江**业、1201 *融、1123 南**业、1000 江**业、1201 *融、1123 南**业</div>
+        <div class="item">
+          <div class="left">现货仓单</div>
+          <div class="right">335999666555222222</div>
+        </div>
+        <div class="item">
+          <div class="left">指定朋友</div>
+          <div class="right">1000 江**业、1201 *融、1123 南...</div>
+        </div>
+        <div class="item">
+          <div class="left">挂牌金额</div>
+          <div class="right">50400.00</div>
+        </div>
+        <div class="item">
+          <div class="left">履约保证金</div>
+          <div class="right">5040.00</div>
         </div>
-    </a-drawer>
+      </div>
+    </div>
+  </a-drawer>
 </template>
 
 <script lang="ts">
@@ -296,7 +287,7 @@ export default defineComponent({
         background: @m-black46 !important;
     }
     .ant-drawer-content-wrapper {
-        width: 430px !important;
+        width: min-content !important;
         height: 450px;
         right: 0;
         top: 101px;

src/common/constants/enumsName.ts

@@ -1467,4 +1467,50 @@ export function geRelatedModeName(status: number): string {
         default:
             return '--'
     }
+}
+
+/**
+ * 期货订单-委托类型
+ * @param status
+ */
+export function getChannelOperateName(status: number): string {
+    switch (status) {
+        case 1:
+            return '正常委托';
+        case 2:
+            return '斩仓委托';
+        case 3:
+            return '强平委托';
+        default:
+            return '--'
+    }
+}
+
+/**
+ * 期货订单-委托状态(订单状态)
+ * @param status
+ */
+export function getChannelInnerOrderStatusName(status: number): string {
+    switch (status) {
+        case 1:
+            return '委托请求';
+        case 2:
+            return '冻结成功';
+        case 3:
+            return '委托失败';
+        case 4:
+            return '委托部成部失败';
+        case 5:
+            return '委托成功';
+        case 6:
+            return '全部撤销';
+        case 7:
+            return '部成部撤';
+        case 8:
+            return '部成部撤部失败';
+        case 9:
+            return '全部成交';
+        default:
+            return '--'
+    }
 }

src/common/setup/order/orderData.ts

@@ -1,7 +1,6 @@
-import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
 import { initData } from '@/common/methods';
 import APP from '@/services';
-import { OperationTabMenu } from '@/services/go/commonService/interface';
+import { OperationTabMenu, OperationTabMenuAuth } from '@/services/go/commonService/interface';
 import { ref } from 'vue';
 
 
@@ -9,11 +8,11 @@ import { ref } from 'vue';
 const orderList = ref<OperationTabMenu[]>([])
 
 // 选中的具体tab下的数据
-const recordItemTab = ref<OperationTabMenu[]>([])
+const recordItemTab = ref<OperationTabMenuAuth[]>([])
 const isBottom = ref<boolean>(false)
 // 处理页面下半部分数据
 export function handleOrderData() {
-    const componentId = ref<enumOrderComponents>()
+    const componentId = ref<string>()
     initData(() => {
         const menuList = APP.getRef('menus');
         const findResult = menuList.value.find((e: OperationTabMenu) => e.code === 'bottom');
@@ -34,31 +33,33 @@ export function getHasBottom() {
 }
 
 // 根据 code 获取单据对应子菜单配置数据
-export function handleOrderDetailList(code: enumOrderComponents) {
+export function handleOrderDetailList(code: string) {
     // 选中的组件，默认第一个
-    const componentId = ref<enumOrderComponents>()
+    const componentId = ref<string>()
     const tabList = ref<OperationTabMenu[]>([])
     // 过滤，获取当前tab页配置数据
     function filerAction() {
         const temp = orderList.value.find(e => e.code === code)
         if (temp) {
             tabList.value = temp.children
+            // 判断是否有底部切换菜单
             if (temp.children.length) {
-                recordItemTab.value = temp.children[0].children
-                componentId.value = temp.children[0].code as enumOrderComponents
+                const { code, auth } = temp.children[0]
+                recordItemTab.value = auth ?? []
+                componentId.value = code
             }
         }
     }
     // 切换tab组件
     function changeTab(index: number, item: OperationTabMenu) {
-        recordItemTab.value = item.children
+        recordItemTab.value = item.auth ?? []
         console.log('当前底部组件名：', item.code)
-        componentId.value = item.code as unknown as enumOrderComponents
+        componentId.value = item.code
     }
     filerAction()
     return { tabList, componentId, changeTab }
 }
 
-export function getRecordItemTab(): OperationTabMenu[] {
+export function getRecordItemTab(): OperationTabMenuAuth[] {
     return recordItemTab.value
 }

src/common/setup/table/button.ts

@@ -14,8 +14,10 @@ import router from '@/router'
  */
 export function getClassName(val: string): BtnClassName {
     let result: BtnClassName = 'btnDeafault'
+    // 红色按钮
     const btnDanger = ['disable', 'cancle', 'cancel', 'delete', 'logout', 'locked', 'refuse']
-    const operBtn = ['add', 'modify', 'check', 'reset', 'credit', 'payment', 'confirm_withdrawal', 'complete_stocking', 'upload_logistics', 'buy', 'listed', 'delisting',
+    // 蓝色按钮
+    const operBtn = ['add', 'close', 'modify', 'check', 'reset', 'credit', 'payment', 'confirm_withdrawal', 'complete_stocking', 'upload_logistics', 'buy', 'listed', 'delisting',
         'receipt', 'confirm_pickup']
     const map = new Map<BtnClassName, string[]>([
         ['btnDanger', btnDanger],
@@ -59,7 +61,6 @@ export function handleBtnList(list: OperationTabMenu | undefined, menuType: keyo
         //         }
         //     }
         // })
-        debugger
     } else {
         console.warn(`menuType: ${menuType}未找到`)
     }
@@ -88,7 +89,6 @@ export function _handleBtnList_(list: OperationTabMenu | undefined, hasDetail: b
             //     const item = { lable: title, code, className: getClassName(code) }
             //     result.value[index].push(item)
             // }
-            debugger
         })
         const children = temp[1][0].children
         if (children && children.length) {
@@ -133,7 +133,6 @@ export function _handleBtnList(list: OperationTabMenu | undefined, hasDetail: bo
             //     const item = { lable: title, callback: openAction, className: getClassName(code), code: code }
             //     result.value[index].push(item)
             // }
-            debugger
         })
         const children = temp[1][0].children
         if (children && children.length) {
@@ -162,14 +161,13 @@ export function _handleBtnList(list: OperationTabMenu | undefined, hasDetail: bo
 // 获取单据按钮列表
 export function getOrderBtnList(list: OperationTabMenu[], hasDetail = false) {
     const result = ref<BtnListType[]>([])
-    list.forEach(el => {
-        // const { code, type, title, isshow } = el;
-        // if (type === 2 && isshow) {
-        //     const item = { lable: title, code, className: getClassName(code) }
-        //     result.value.push(item)
-        // }
-        debugger
-    });
+    // list.forEach(el => {
+    //     const { code, type, title, isshow } = el;
+    //     if (type === 2 && isshow) {
+    //         const item = { lable: title, code, className: getClassName(code) }
+    //         result.value.push(item)
+    //     }
+    // });
     // 详情
     if (hasDetail) {
         const item = { lable: '详情', code: 'detail', className: getClassName('') }

src/common/setup/table/compose.ts

@@ -9,6 +9,7 @@ import { getBtnList_, getOrderBtnList, getThirdMenuData } from "./button";
 import { handleTableColums } from './clolumn';
 import { handleTableDrawer } from "./drawer";
 import { ComposeOrderTableParam, ComposeTableDetailParam, ComposeTableParam, TableEventCB, TableParam } from "./interface";
+import { getClassName } from '@/common/setup/table/button'
 
 export type { ComposeTableParam, ComposeTableDetailParam };
 
@@ -120,7 +121,7 @@ export function handleComposeTable_detail<T>({ queryFn, tableName, tableFilterKe
 }
 
 // 获取单据table通用逻辑
-export function handleComposeOrderTable<T>({ queryFn, recordList, isDetail, tableName, }: ComposeOrderTableParam) {
+export function handleComposeOrderTable<T>({ queryFn, recordList, tableName, }: ComposeOrderTableParam) {
     // 右键逻辑
     const { contextMenu, openContext, closeContext: closeContextAction } = handleContextMenu();
     // 表头数据
@@ -134,8 +135,14 @@ export function handleComposeOrderTable<T>({ queryFn, recordList, isDetail, tabl
     }
     // 表格事件
     const { expandedRowKeys, selectedRow, Rowclick } = getTableEvent<T>(eventsCB);
+
     // 表格操作按钮列表
-    const btnList = getOrderBtnList(recordList, isDetail).value;
+    const btnList = recordList.reduce((res, { label, code }) => [...res, {
+        lable: label,
+        code: code,
+        className: getClassName(code),
+    }], [] as BtnListType[]);
+
     console.log('表格操作按钮列表', btnList)
     // 控制异步组件
     const { componentId, closeComponent, openComponent } = handleModalComponent(queryFn, selectedRow);

src/common/setup/table/interface.ts

@@ -1,6 +1,6 @@
 import { EnumRouterName } from "@/common/constants/enumRouterName";
 import { ColumnType, TableKey } from "@/common/methods/table/interface";
-import { OperationTabMenu } from "@/services/go/commonService/interface";
+import { OperationTabMenu, OperationTabMenuAuth } from "@/services/go/commonService/interface";
 import { Ref, UnwrapRef } from 'vue';
 
 /**
@@ -77,7 +77,7 @@ export interface TableParam {
 
 export interface ComposeOrderTableParam {
     queryFn: Function,  // 查询表格数据
-    recordList: OperationTabMenu[], // 当前tab页配置数据
+    recordList: OperationTabMenuAuth[], // 当前tab页配置数据
     tableName?: keyof TableKey, // 表头key
     isDetail?: boolean,  // 是否需要详情
 }

src/layout/components/bottom.vue

@@ -1,29 +1,18 @@
 <template>
   <section :class="['layout-bottom', isShowBottom ? 'layout-bottom-all' : 'layout-bottom-hidden']">
-    <CapitalInfo class="capital-info-container"
-                 v-if="isCapitalLeft"></CapitalInfo>
+    <CapitalInfo class="capital-info-container" v-if="isCapitalLeft"></CapitalInfo>
     <main :class="[isCapitalLeft ? 'main-some' : 'main-all']">
-      <firstMenu :list="orderList"
-                 :value="'title'"
-                 @selectMenu="selectMenu">
+      <firstMenu :list="orderList" :value="'title'" @selectMenu="selectMenu">
         <div class="right-menu-content">
           <!-- 资金信息 -->
-          <a-select class="capitalSelect"
-                    style="width: 180px"
-                    v-if="!isCapitalLeft"
-                    @change="accountChange"
-                    v-model:value="selectedAccountId">
-            <a-select-option v-for="item in getAllTaAccount()"
-                             :value="item.accountid"
-                             :key="item.accountid">{{item.accountid}}</a-select-option>
+          <a-select class="capitalSelect" style="width: 180px" v-if="!isCapitalLeft" @change="accountChange" v-model:value="selectedAccountId">
+            <a-select-option v-for="item in getAllTaAccount()" :value="item.accountid" :key="item.accountid">{{item.accountid}}</a-select-option>
           </a-select>
-          <div class="conditionIcon icon iconfont icon-shouqi"
-               @click="handleShowBottom"></div>
+          <div class="conditionIcon icon iconfont icon-shouqi" @click="handleShowBottom"></div>
         </div>
       </firstMenu>
       <div v-show="isShowBottom">
-        <component :is="componentId"
-                   v-if="componentId"></component>
+        <component :is="componentId" v-if="componentId"></component>
       </div>
     </main>
   </section>
@@ -52,8 +41,9 @@ export default defineComponent({
         firstMenu,
         quoteTable,
         thirdMenu,
+        futures_information: defineAsyncComponent(() => import('@/views/order/futures_information/index.vue')), // 期货订单
+        funding_information: defineAsyncComponent(() => import('@/views/order/funding_information/index.vue')), // 资金信息
         [enumOrderComponents.spot_warrant]: defineAsyncComponent(() => import('@/views/order/spot_warran/index.vue')),
-        [enumOrderComponents.funding_information]: defineAsyncComponent(() => import('@/views/order/funding_information/index.vue')),
         [enumOrderComponents.performance_information]: defineAsyncComponent(() => import('@/views/order/performance_information/index.vue')),
         [enumOrderComponents.pre_sale_warehouse_receipt]: defineAsyncComponent(() => import('@/views/order/pre_sale_warehouse_receipt/index.vue')),
         [enumOrderComponents.financing_manager]: defineAsyncComponent(() => import('@/views/order/financing_manager/index.vue')),
@@ -82,7 +72,7 @@ export default defineComponent({
         });
         // 切换组件
         function selectMenu(value: OperationTabMenu) {
-            componentId.value = value.code as enumOrderComponents;
+            componentId.value = value.code;
         }
         return {
             selectMenu,

src/services/go/ermcp/futures/index.ts

@@ -0,0 +1,46 @@
+/** ================================= 期货订单 ================================**/
+import { commonSearch_go } from '@/services/go/index';
+import { QueryErmcpTradePositionReq, QueryErmcpTradePositionRsp, QueryErmcpOrderDetailsReq, QueryErmcpOrderDetailsRsp, QueryErmcpTradeDetailsReq, QueryErmcpTradeDetailsRsp } from './interface';
+import { getSelectedAccountId } from '@/services/bus/account';
+
+/**
+ * 获取企业风管期货持仓头寸信息
+ */
+export async function queryErmcpTradePosition(params?: QueryErmcpTradePositionReq): Promise<QueryErmcpTradePositionRsp[]> {
+    try {
+        return commonSearch_go('/Ermcp/QueryErmcpTradePosition', {
+            accountID: getSelectedAccountId(),
+            ...params
+        });
+    } catch (err) {
+        throw new Error(`获取企业风管期货持仓头寸信息: ${err}`);
+    }
+}
+
+/**
+ * 获取企业风管期货委托单信息
+ */
+export async function queryErmcpOrderDetails(params?: QueryErmcpOrderDetailsReq): Promise<QueryErmcpOrderDetailsRsp[]> {
+    try {
+        return commonSearch_go('/Ermcp/QueryErmcpOrderDetails', {
+            accountID: getSelectedAccountId(),
+            ...params
+        });
+    } catch (err) {
+        throw new Error(`获取企业风管期货成交单信息: ${err}`);
+    }
+}
+
+/**
+ * 获取企业风管期货成交单信息
+ */
+export async function queryErmcpTradeDetails(params?: QueryErmcpTradeDetailsReq): Promise<QueryErmcpTradeDetailsRsp[]> {
+    try {
+        return commonSearch_go('/Ermcp/QueryErmcpTradeDetails', {
+            accountID: getSelectedAccountId(),
+            ...params
+        });
+    } catch (err) {
+        throw new Error(`获取企业风管期货成交单信息: ${err}`);
+    }
+}

src/services/go/ermcp/futures/interface.ts

@@ -0,0 +1,113 @@
+/**
+ * 获取企业风管期货持仓头寸信息请求
+ */
+export interface QueryErmcpTradePositionReq {
+    accountID: number; // 资金账户ID
+    marketID?: number; // 所属市场ID
+}
+
+/**
+ * 获取企业风管期货持仓头寸信息响应
+ */
+export interface QueryErmcpTradePositionRsp {
+    agreeunit: number; // 合约单位
+    buyorsell: number; // 方向 - 0:买 1:卖
+    curpositionqty: number; // 持仓（总仓数量, 期末头寸）
+    curtdposition: number; // 今仓数量（期末今日头寸）
+    curtdpositionenabled: number; // 今仓可用
+    decimalplace: number; // 报价小数位
+    enableqty: number; // 可用（总仓可用）
+    exexchangename: string; // 外部交易所名称
+    goodscode: string; // 商品代码(内部)
+    goodsid: number; // 商品ID(自增ID SEQ_GOODS)
+    goodsname: string; // 商品名称
+    last: number; // 现价
+    marketid: number; // 所属市场ID
+    openaverageprice: number; // 开仓均价【头寸变化更新】 = 开仓成本 / 期末头寸 / 合约单位
+    opencost: number; // 开仓成本
+    openpl: number; // 逐笔浮盈【实时行情更新】（MTP：开仓盈亏、平仓盈亏） 买方向 = (最新价 - 开仓均价) * 买期末头寸 * 合约单位；卖方向 = (开仓均价 - 最新价) * 卖期末头寸 * 合约单位
+    outgoodscode: string; // 商品代码(外部)
+    positionaverageprice: number; // 持仓均价【头寸变化更新】= 持仓成本 / 期末头寸 / 合约单位
+    positioncost: number; // 持仓成本
+    positionpl: number; // 盯市浮盈【实时行情更新】（MTP：浮动盈亏、持仓盈亏） 买方向 = (最新价 - 持仓均价) * 买期末头寸 * 合约单位；卖方向 = (持仓均价 - 最新价) * 卖期末头寸 * 合约单位
+    positionplrate: number; // 持仓盈亏比例【实时行情更新】 = 持仓盈亏 / 开仓成本
+    usedmargin: number; // 占用保证金
+}
+
+/**
+ * 获取企业风管期货委托单信息请求
+ */
+export interface QueryErmcpOrderDetailsReq {
+    accountID: number; // 资金账户ID
+}
+
+/**
+ * 获取企业风管期货委托单信息响应
+ */
+export interface QueryErmcpOrderDetailsRsp {
+    accountid: number;//账户ID
+    buyorsell: number;//买卖 - 0:买 1:卖
+    cancellogincode: string;//撤单人
+    channelbuildtype: number;//开平标志 - 0:无 1:建仓 2:平仓
+    channelinnerorderstatus: number;//委托状态 - 1:委托请求 2:冻结成功 3:委托失败 4:委托部成部失败 5:委托成功 6:全部撤销 7:部成部撤 8:部成部撤部失败 9:全部成交
+    channeloperatetype: number;//操作类型 - 1:正常委托 2:斩仓委托 3:强平委托
+    closetype: number;//平仓方式 - 0:无 1:平今 2:平昨
+    curexchangerate: number;//当前汇率
+    exchangefullname: string;//外部交易所全称
+    goodscode: string;//商品代码(内部)
+    goodsid: number;//商品ID
+    goodsname: string;//商品名称
+    marketid: number;//市场ID
+    openfreezemargin: number;//冻结保证金(冻结交易金额)
+    orderid: string;//委托单号(107+Unix秒时间戳(10位)+2位(MarketServiceID)+xxxx)
+    orderlogincode: string;//委托人
+    orderprice: number;//委托价格(账户)
+    orderqty: number;//委托数量
+    ordertime: string;//委托时间
+    pricemode: number;//取价方式 - 1:市价 2: 限价
+    tradedate: string;//交易日(yyyyMMdd)
+    tradeqty: number;//成交数量
+}
+
+/**
+ * 获取企业风管期货成交单信息请求
+ */
+export interface QueryErmcpTradeDetailsReq {
+    accountID: number; // 资金账户ID
+    goodsID: number; // 商品ID
+    buyOrSell: number; // 买卖方向，0：买 1：卖
+    orderID: number; // 关联委托单号
+}
+
+/**
+ * 获取企业风管期货成交单信息响应
+ */
+export interface QueryErmcpTradeDetailsRsp {
+    accountid: number;//账号ID
+    buyorsell: number;//方向 - 0:买 1:卖
+    channelbuildtype: number;//委托单据类型 0:无 1:建仓 2:平仓
+    closecharge: number;//平仓手续费(账户)
+    closecharge2: number;//平仓手续费(商品)
+    closepl: number;//平仓盈亏(账户)
+    closepl2: number;//平仓盈亏(商品)
+    closepl3: number;//平仓盈亏(账户)(逐笔)
+    closepl4: number;//平仓盈亏(商品)(逐笔)
+    closetype: number;//平仓方式 - 0:无 1:平今 2:平昨
+    curexchangerate: number;//当前汇率
+    exchangefullname: string;//外部交易所全称
+    goodscode: string;//商品代码(内部)
+    goodsid: number;//商品ID
+    goodsname: string;//商品名称
+    marketid: number;//市场ID
+    opencharge: number;//建仓手续费(账户)
+    opencharge2: number;//建仓手续费(商品)
+    orderid: string;//委托单号
+    orderlogincode: string;//委托人
+    tradeamount: number;//成交金额(账户)
+    tradedate: string;//交易日(yyyyMMdd)
+    tradeid: string;//成交单号(108+Unix秒时间戳(10位)+2位(MarketServiceID)+xxxx)
+    tradeprice: number;//成交价格
+    tradeqty: number;//成交数量
+    tradetime: string;//成交时间
+    tradetype: number;//成交类别 - 1:正常委托成交 2:风控斩仓成交 3:修正持仓成交 4:管理端斩仓成交
+}

src/services/go/index.ts

@@ -8,7 +8,7 @@ import { Method } from 'axios';
  * @param method 请求方式
  * @returns
  */
-export function commonSearch_go(url: string, params: Object, method: Method = 'get'): Promise<any> {
+export function commonSearch_go<T>(url: string, params: T, method: Method = 'get'): Promise<any> {
     return request({
         method,
         url: goCommonSearchUrl(url),

src/views/market/futures/compoments/futures-trade/index.less

@@ -1,168 +1,56 @@
 .futures_trade {
     display: flex;
     height : 100%;
+    padding: 20px;
 
     &__left {
-        flex: 1;
+        flex          : 1;
+        display       : flex;
+        flex-direction: column;
     }
-}
 
-.post_buying {
-    width : 100%;
-    height: 100%;
-    .flex;
-    flex-direction: column;
-    position      : relative;
-    overflow      : hidden;
+    &__form {
+        .ant-form-item-control {
+            flex : auto;
+            width: 250px;
 
-    .ant-form {
-        height: 100%;
-    }
-
-    .condition {
-        width        : 100%;
-        height       : 48px;
-        margin       : 0 16px;
-        padding      : 10px 0;
-        border-bottom: 1px solid @m-black6;
-        .inlineflex;
-
-        .conditionBtn {
-            align-self : center;
-            align-items: center;
-            border     : 0;
-            min-width  : 80px;
-            height     : 28px;
-            line-height: 28px;
-            background : @m-black7;
-            .rounded-corners(3px);
-            font-size: 14px;
-            color    : @m-blue0;
-
-            &:hover {
-                background: @m-black7-hover;
-                color     : @m-blue0-hover;
+            &-input-content {
+                display    : flex;
+                align-items: center;
             }
         }
 
-        .conditionBtn+.conditionBtn {
-            margin-left: 10px;
+        .ant-row {
+            flex-flow: row;
         }
     }
-}
-
-.unit {
-    margin-left: 70px;
-    width      : 260px;
-    .flex;
-    justify-content: space-between;
-    font-size      : 14px;
-    color          : @m-grey41;
-    height         : 14px;
-    line-height    : 14px;
-}
-
-.listedBtn {
-    width        : 120px;
-    height       : 30px;
-    line-height  : 30px;
-    background   : linear-gradient(0deg, @m-blue2 0%, @m-blue0 100%);
-    border-radius: 3px;
-    color        : @m-white0;
-    font-size    : 14px;
-    text-align   : center;
-    border       : 0;
-
-    &:hover {
-        background: linear-gradient(0deg, @m-blue0-hover 0%, @m-blue2-hover 100%);
-        color     : @m-white0-hover;
-    }
-}
-
-.cancelBtn:extend(.listedBtn) {
-    background: linear-gradient(0deg, @m-grey12 0%, @m-grey13 100%) !important;
-
-    &:hover {
-        background: linear-gradient(0deg, @m-grey12-hover 0%, @m-grey13-hover 100%) !important;
-        color     : @m-white0-hover;
-    }
-}
-
-.ml10 {
-    margin-left: 10px;
-}
-
-.ant-form.dialogForm .ant-row.ant-form-item {
-    margin-bottom: 14px;
-}
-
-.mt20 {
-    margin-top: 20px;
-}
 
-.mt-10 {
-    margin-top: -10px;
-}
+    &__submit {
+        display    : flex;
+        align-items: center;
 
-.ant-input-suffix {
-    position: absolute;
-    right   : -25px;
-}
+        .ant-btn {
+            height       : auto;
+            color        : #fff;
+            border       : 0;
+            border-radius: 4px;
+            padding      : 16px 16px;
 
-.minusBtn,
-.plusBtn {
-    width      : 15px;
-    height     : 32px;
-    line-height: 32px;
-    font-size  : 15px;
-    color      : @m-blue15;
-    cursor     : pointer;
-}
-
-.minusBtn {
-    position: absolute;
-    top     : -6px;
-    left    : 14px;
-    z-index : 1;
-}
-
-.plusBtn {
-    position: absolute;
-    top     : -6px;
-    right   : 14px;
-    z-index : 1;
-}
-
-.stepper {
-    padding-left : 30px;
-    padding-right: 30px;
-    text-align   : center;
-    color        : @m-yellow1;
-    font-size    : 16px;
-}
-
-.ant-slider.formSlider {
-    width      : 260px !important;
-    margin-left: 70px;
-
-    .ant-slider-rail {
-        margin-right    : 0;
-        padding-right   : 0;
-        height          : 3px !important;
-        border-radius   : 2px !important;
-        background-color: @m-blue14;
-    }
+            &:not(:last-child) {
+                margin-right: 10px;
+            }
 
-    .ant-slider-track {
-        height          : 3px;
-        background-color: @m-blue0;
-    }
+            &:nth-child(1) {
+                background-color: red;
+            }
 
-    .ant-slider-step {
-        height: 3px;
-    }
+            &:nth-child(2) {
+                background-color: green;
+            }
 
-    .ant-progress-text {
-        display: none;
+            &:nth-child(3) {
+                background-color: blue;
+            }
+        }
     }
 }

src/views/market/futures/compoments/futures-trade/index.vue

@@ -3,47 +3,54 @@
   <Drawer :title="'期货交易'" :placement="'right'" :visible="visible" @cancel="cancel" class="top">
     <div class="futures_trade">
       <div class="futures_trade__left">
-        <a-form class="inlineForm" ref="formRef" :model="formData" :rules="rules">
-          <a-form-item label="账号">
-            <a-select class="inlineFormSelect" placeholder="请选择" v-model:value="formData.AccountID">
-              <a-select-option v-for="item in accountList" :value="item.accountid" :key="item.accountid">{{ item.accountname }}</a-select-option>
-            </a-select>
-          </a-form-item>
-          <a-form-item label="合约">
-            <a-select class="inlineFormSelect" placeholder="请选择" v-model:value="formData.GoodsID" @change="goodsChange">
-              <a-select-option v-for="item in tableList" :value="item.goodsid" :key="item.goodsid">{{ item.goodsname }}</a-select-option>
-            </a-select>
-          </a-form-item>
-          <a-form-item class="inputIconBox" label="交易价格" name="OrderPrice">
-            <!-- 限价类型不可修改 -->
-            <template v-if="formData.PriceMode === PriceType.limit">
-              <a-input-number class="commonInput" :value="selectedGoods.last" disabled />
-            </template>
-            <template v-else>
-              <a-input-number class="commonInput" v-model:value="formData.OrderPrice" />
+        <div class="futures_trade__form">
+          <a-form class="inlineForm" ref="formRef" :model="formData" :rules="rules">
+            <a-form-item label="账号">
+              <a-select class="inlineFormSelect" placeholder="请选择" v-model:value="formData.AccountID">
+                <a-select-option v-for="item in accountList" :value="item.accountid" :key="item.accountid">{{ item.accountname }}</a-select-option>
+              </a-select>
+            </a-form-item>
+            <a-form-item label="合约">
+              <a-select class="inlineFormSelect" placeholder="请选择" v-model:value="formData.GoodsID" @change="goodsChange">
+                <a-select-option v-for="item in tableList" :value="item.goodsid" :key="item.goodsid">{{ item.goodsname }}</a-select-option>
+              </a-select>
+            </a-form-item>
+            <a-form-item label="价格类型">
+              <a-select class="inlineFormSelect" placeholder="请选择" v-model:value="selectedPriceMode" @change="priceModeChange">
+                <a-select-option v-for="item in priceModeList" :value="item.priceType" :key="item.priceType">{{ item.priceName }}</a-select-option>
+              </a-select>
+            </a-form-item>
+            <a-form-item class="inputIconBox" label="交易价格" name="OrderPrice">
+              <!-- 限价类型不可修改 -->
+              <template v-if="formData.PriceMode === PriceType.limit">
+                <a-input-number class="commonInput" :value="selectedGoods.last" style="width:100%" disabled />
+              </template>
+              <template v-else>
+                <a-input-number class="commonInput" v-model:value="formData.OrderPrice" style="width:100%" />
+                <MinusOutlined />
+                <PlusOutlined />
+              </template>
+            </a-form-item>
+            <a-form-item class="inputIconBox" label="交易数量" name="OrderQty">
+              <a-input-number class="commonInput" :min="1" v-model:value="formData.OrderQty" style="width:100%" />
               <MinusOutlined />
               <PlusOutlined />
-            </template>
-            <a-select class="inlineFormSelect" placeholder="请选择" v-model:value="selectedPriceMode" @change="priceModeChange">
-              <a-select-option v-for="item in priceModeList" :value="item.priceType" :key="item.priceType">{{ item.priceName }}</a-select-option>
-            </a-select>
-          </a-form-item>
-          <a-form-item class="inputIconBox" label="交易数量" name="OrderQty">
-            <a-input-number class="commonInput" :min="1" v-model:value="formData.OrderQty" />
-            <MinusOutlined />
-            <PlusOutlined />
-            <a-button @click="formData.OrderQty = 1">复位</a-button>
-          </a-form-item>
-        </a-form>
-        <div v-show="selectedGoods.last">
-          <a-button :loading="loading" @click="submit('buy')">买入</a-button>
-          <a-button :loading="loading" @click="submit('sell')">卖出</a-button>
-          <a-button :loading="loading" @click="submit('close')">平仓</a-button>
+            </a-form-item>
+          </a-form>
+        </div>
+        <div class="futures_trade__submit" v-show="selectedGoods.last">
+          <a-button :loading="loading" @click="submit('buy')">
+            <span>买入</span>
+          </a-button>
+          <a-button :loading="loading" @click="submit('sell')">
+            <span>卖出</span>
+          </a-button>
+          <a-button :loading="loading" @click="submit('close')">
+            <span>平仓</span>
+          </a-button>
         </div>
       </div>
-      <div class="futures_trade__right">
-
-      </div>
+      <div class="futures_trade__right"></div>
     </div>
   </Drawer>
 </template>

src/views/order/funding_information/components/funding_information_funding_summary/index.vue

@@ -1,24 +1,10 @@
 <template>
   <!-- 资金汇总 -->
   <section>
-    <a-table :columns="tableColumns"
-             class="srcollYTable expandLeftTable"
-             :scroll="{ x: '100%', y: '190px' }"
-             :pagination="false"
-             :loading="loading"
-             :expandedRowKeys="expandedRowKeys"
-             :customRow="Rowclick"
-             :expandIcon="expandIcon"
-             :expandIconAsCell="false"
-             rowKey="key"
-             :data-source="tableList">
+    <a-table :columns="tableColumns" class="srcollYTable expandLeftTable" :scroll="{ x: '100%', y: '190px' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :expandIcon="expandIcon" :expandIconAsCell="false" rowKey="key" :data-source="tableList">
       <!-- 额外的展开行 -->
-      <template v-if="btnList.length"
-                #expandedRowRender="{ record }">
-        <BtnList :btnList="btnList"
-                 :record="record"
-                 class="btn-list-sticky"
-                 @click="openComponent" />
+      <template v-if="btnList.length" #expandedRowRender="{ record }">
+        <BtnList :btnList="btnList" :record="record" class="btn-list-sticky" @click="openComponent" />
       </template>
       <template #balance="{record}">
         <span>{{canUseMoney(record)}}</span>
@@ -42,10 +28,7 @@
         <span>{{getTaacountStatus(text)}}</span>
       </template>
     </a-table>
-    <component :is="componentId"
-               v-if="componentId"
-               :selectedRow="selectedRow"
-               @cancel="closeComponent"></component>
+    <component :is="componentId" v-if="componentId" :selectedRow="selectedRow" @cancel="closeComponent"></component>
   </section>
 </template>
 

src/views/order/funding_information/index.vue

@@ -1,29 +1,24 @@
 <template>
   <!-- 资金信息 -->
   <section class="funding_information">
-    <component :is="componentId"
-               v-if="componentId">
+    <component :is="componentId" v-if="componentId">
     </component>
-    <thirdMenu :list="tabList"
-               @selectMenu="changeTab"
-               :value="'title'"></thirdMenu>
+    <thirdMenu :list="tabList" @selectMenu="changeTab" :value="'title'"></thirdMenu>
   </section>
 </template>
 
 <script lang="ts">
 import { defineAsyncComponent, defineComponent } from 'vue';
-import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
 import thirdMenu from '@/common/components/thirdMenu/index.vue';
 import { handleOrderDetailList } from '@/common/setup/order/orderData';
 export default defineComponent({
-    name: enumOrderComponents.funding_information,
     components: {
         thirdMenu,
-        [enumOrderComponents.funding_information_funding_summary]: defineAsyncComponent(() => import('./components/funding_information_funding_summary/index.vue')),
-        [enumOrderComponents.funding_information_funding_log]: defineAsyncComponent(() => import('./components/funding_information_funding_log/index.vue')),
+        funding_information_summary: defineAsyncComponent(() => import('./components/funding_information_funding_summary/index.vue')), // 资金汇总
+        funding_information_log: defineAsyncComponent(() => import('./components/funding_information_funding_log/index.vue')), // 资金流水
     },
     setup() {
-        return { ...handleOrderDetailList(enumOrderComponents.funding_information) };
+        return { ...handleOrderDetailList('funding_information') };
     },
 });
 </script>

src/views/order/futures_information/components/futures_information_entrust/columns.tsx

@@ -0,0 +1,81 @@
+import { QueryErmcpOrderDetailsRsp } from '@/services/go/ermcp/futures/interface';
+import { getChannelBuildName, getBuyOrSellTypeName, getChannelOperateName, getChannelInnerOrderStatusName } from '@/common/constants/enumsName';
+import { formatTime } from '@/common/methods';
+
+export function getColumns() {
+    const columns = [
+        {
+            title: '委托时间',
+            key: 'ordertime',
+            customRender: ({ record }: { record: QueryErmcpOrderDetailsRsp }) => {
+                return formatTime(record.ordertime)
+            }
+        },
+        {
+            title: '合约',
+            key: 'goodscode',
+            customRender: ({ record }: { record: QueryErmcpOrderDetailsRsp }) => {
+                return `${record.goodsname}/${record.goodscode}`
+            }
+        },
+        {
+            title: '订单类型',
+            key: 'channelbuildtype',
+            customRender: ({ record }: { record: QueryErmcpOrderDetailsRsp }) => {
+                return getBuyOrSellTypeName(record.buyorsell) + getChannelBuildName(record.channelbuildtype)
+            }
+        },
+        {
+            title: '委托类型',
+            key: 'channeloperatetype',
+            customRender: ({ record }: { record: QueryErmcpOrderDetailsRsp }) => {
+                return getChannelOperateName(record.channeloperatetype)
+            }
+        },
+        {
+            title: '委托数量',
+            key: 'orderqty'
+        },
+        {
+            title: '成交数量',
+            key: 'tradeqty'
+        },
+        {
+            title: '委托价',
+            key: 'orderprice'
+        },
+        {
+            title: '冻结保证金',
+            key: 'openfreezemargin'
+        },
+        {
+            title: '订单状态',
+            key: 'channelinnerorderstatus',
+            customRender: ({ record }: { record: QueryErmcpOrderDetailsRsp }) => {
+                return getChannelInnerOrderStatusName(record.channelinnerorderstatus)
+            }
+        },
+        {
+            title: '订单号',
+            key: 'orderid',
+        },
+        {
+            title: '委托人',
+            key: 'orderlogincode'
+        },
+        {
+            title: '扯淡人',
+            key: 'cancellogincode'
+        },
+    ];
+
+    return columns.map(el => {
+        return {
+            dataIndex: el.key,
+            width: 100,
+            align: 'center',
+            slots: { customRender: el.key, },
+            ...el
+        }
+    })
+}

src/views/order/futures_information/components/futures_information_entrust/index.vue

@@ -0,0 +1,48 @@
+<template>
+  <!-- 期货订单-委托 -->
+  <section class="futures_information_position">
+    <a-table :columns="getColumns()" class="srcollYTable expandLeftTable" :scroll="{ x: '100%', y: '190px' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :expandIcon="expandIcon" :expandIconAsCell="false" rowKey="key" :data-source="tableList">
+      <!-- 额外的展开行 -->
+      <template v-if="btnList.length" #expandedRowRender="{ record }">
+        <BtnList :btnList="btnList" :record="record" class="btn-list-sticky" @click="openComponent" />
+      </template>
+    </a-table>
+    <component :is="componentId" v-if="componentId" :selectedRow="selectedRow" @cancel="closeComponent"></component>
+  </section>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import { queryTableList, BtnList } from '@/common/export/commonTable';
+import { handleComposeOrderTable } from '@/common/setup/table/compose';
+import { ComposeOrderTableParam } from '@/common/setup/table/interface';
+import { expandIcon } from '@/common/setup/table/clolumn';
+import { getRecordItemTab } from '@/common/setup/order/orderData';
+import { queryErmcpOrderDetails } from '@/services/go/ermcp/futures';
+import { QueryErmcpOrderDetailsRsp } from '@/services/go/ermcp/futures/interface';
+import { getColumns } from './columns';
+
+export default defineComponent({
+    components: {
+        BtnList,
+    },
+    setup() {
+        // 表格列表数据
+        const { loading, tableList, queryTable } = queryTableList<QueryErmcpOrderDetailsRsp>();
+
+        // 表格通用逻辑
+        const param: ComposeOrderTableParam = {
+            queryFn: () => queryTable(queryErmcpOrderDetails),
+            recordList: getRecordItemTab(),
+        };
+
+        return {
+            ...handleComposeOrderTable(param),
+            getColumns,
+            loading,
+            expandIcon,
+            tableList,
+        };
+    },
+});
+</script>

src/views/order/futures_information/components/futures_information_position/columns.tsx

@@ -0,0 +1,56 @@
+import { computed } from 'vue';
+import { QueryErmcpTradePositionRsp } from '@/services/go/ermcp/futures/interface';
+import { getBuyOrSellName } from '@/common/constants/enumsName';
+
+export function getColumns() {
+    const columns = [
+        {
+            title: '合约',
+            key: 'goodscode',
+            customRender: ({ record }: { record: QueryErmcpTradePositionRsp }) => {
+                return `${record.goodsname}/${record.goodscode}`
+            }
+        },
+        {
+            title: '方向',
+            key: 'buyorsell',
+            customRender: ({ record }: { record: QueryErmcpTradePositionRsp }) => {
+                return getBuyOrSellName(record.buyorsell)
+            }
+        },
+        {
+            title: '总持仓',
+            key: 'curpositionqty'
+        },
+        {
+            title: '可用',
+            key: 'enableqty'
+        },
+        {
+            title: '开仓均价',
+            key: 'openaverageprice'
+        },
+        {
+            title: '持仓均价',
+            key: 'positionaverageprice'
+        },
+        {
+            title: '浮动盈亏',
+            key: 'positionpl'
+        },
+        {
+            title: '盈亏比例',
+            key: 'positionplrate'
+        },
+    ];
+
+    return columns.map(el => {
+        return {
+            dataIndex: el.key,
+            width: 100,
+            align: 'center',
+            slots: { customRender: el.key, },
+            ...el
+        }
+    })
+}

src/views/order/futures_information/components/futures_information_position/index.vue

@@ -0,0 +1,48 @@
+<template>
+  <!-- 期货订单-持仓 -->
+  <section class="futures_information_position">
+    <a-table :columns="getColumns()" class="srcollYTable expandLeftTable" :scroll="{ x: '100%', y: '190px' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :expandIcon="expandIcon" :expandIconAsCell="false" rowKey="key" :data-source="tableList">
+      <!-- 额外的展开行 -->
+      <template v-if="btnList.length" #expandedRowRender="{ record }">
+        <BtnList :btnList="btnList" :record="record" class="btn-list-sticky" @click="openComponent" />
+      </template>
+    </a-table>
+    <component :is="componentId" v-if="componentId" :selectedRow="selectedRow" @cancel="closeComponent"></component>
+  </section>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import { queryTableList, BtnList } from '@/common/export/commonTable';
+import { handleComposeOrderTable } from '@/common/setup/table/compose';
+import { ComposeOrderTableParam } from '@/common/setup/table/interface';
+import { expandIcon } from '@/common/setup/table/clolumn';
+import { getRecordItemTab } from '@/common/setup/order/orderData';
+import { queryErmcpTradePosition } from '@/services/go/ermcp/futures';
+import { QueryErmcpTradePositionRsp } from '@/services/go/ermcp/futures/interface';
+import { getColumns } from './columns';
+
+export default defineComponent({
+    components: {
+        BtnList,
+    },
+    setup() {
+        // 表格列表数据
+        const { loading, tableList, queryTable } = queryTableList<QueryErmcpTradePositionRsp>();
+
+        // 表格通用逻辑
+        const param: ComposeOrderTableParam = {
+            queryFn: () => queryTable(queryErmcpTradePosition),
+            recordList: getRecordItemTab(),
+        };
+
+        return {
+            ...handleComposeOrderTable(param),
+            getColumns,
+            loading,
+            expandIcon,
+            tableList,
+        };
+    },
+});
+</script>

src/views/order/futures_information/components/futures_information_success/columns.tsx

@@ -0,0 +1,77 @@
+import { QueryErmcpTradeDetailsRsp } from '@/services/go/ermcp/futures/interface';
+import { getChannelBuildName, getBuyOrSellTypeName, getChannelOperateName } from '@/common/constants/enumsName';
+import { BuildType } from '@/common/constants/enumCommon';
+import { formatTime } from '@/common/methods';
+
+export function getColumns() {
+    const columns = [
+        {
+            title: '合约',
+            key: 'goodscode',
+            customRender: ({ record }: { record: QueryErmcpTradeDetailsRsp }) => {
+                return record.goodscode
+            }
+        },
+        {
+            title: '订单类型',
+            key: 'channelbuildtype',
+            customRender: ({ record }: { record: QueryErmcpTradeDetailsRsp }) => {
+                return getBuyOrSellTypeName(record.buyorsell) + getChannelBuildName(record.channelbuildtype)
+            }
+        },
+        {
+            title: '成交类型',
+            key: 'tradetype',
+            customRender: ({ record }: { record: QueryErmcpTradeDetailsRsp }) => {
+                return getChannelOperateName(record.tradetype)
+            }
+        },
+        {
+            title: '成交数量',
+            key: 'tradeqty'
+        },
+        {
+            title: '成交价格',
+            key: 'tradeprice'
+        },
+        {
+            title: '手续费',
+            key: 'closecharge',
+            customRender: ({ record }: { record: QueryErmcpTradeDetailsRsp }) => {
+                return record.channelbuildtype === BuildType.open ? record.opencharge : record.closecharge
+            }
+        },
+        {
+            title: '成交时间',
+            key: 'tradetime',
+            customRender: ({ record }: { record: QueryErmcpTradeDetailsRsp }) => {
+                return formatTime(record.tradetime)
+            }
+        },
+        {
+            title: '交易所',
+            key: 'exchangefullname',
+            customRender: ({ record }: { record: QueryErmcpTradeDetailsRsp }) => {
+                return record.exchangefullname
+            }
+        },
+        {
+            title: '订单号',
+            key: 'orderid',
+        },
+        {
+            title: '委托人',
+            key: 'orderlogincode'
+        },
+    ];
+
+    return columns.map(el => {
+        return {
+            dataIndex: el.key,
+            width: 100,
+            align: 'center',
+            slots: { customRender: el.key, },
+            ...el
+        }
+    })
+}

src/views/order/futures_information/components/futures_information_success/index.vue

@@ -0,0 +1,48 @@
+<template>
+  <!-- 期货订单-成交 -->
+  <section class="futures_information_position">
+    <a-table :columns="getColumns()" class="srcollYTable expandLeftTable" :scroll="{ x: '100%', y: '190px' }" :pagination="false" :loading="loading" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :expandIcon="expandIcon" :expandIconAsCell="false" rowKey="key" :data-source="tableList">
+      <!-- 额外的展开行 -->
+      <template v-if="btnList.length" #expandedRowRender="{ record }">
+        <BtnList :btnList="btnList" :record="record" class="btn-list-sticky" @click="openComponent" />
+      </template>
+    </a-table>
+    <component :is="componentId" v-if="componentId" :selectedRow="selectedRow" @cancel="closeComponent"></component>
+  </section>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import { queryTableList, BtnList } from '@/common/export/commonTable';
+import { handleComposeOrderTable } from '@/common/setup/table/compose';
+import { ComposeOrderTableParam } from '@/common/setup/table/interface';
+import { expandIcon } from '@/common/setup/table/clolumn';
+import { getRecordItemTab } from '@/common/setup/order/orderData';
+import { queryErmcpTradeDetails } from '@/services/go/ermcp/futures';
+import { QueryErmcpTradeDetailsRsp } from '@/services/go/ermcp/futures/interface';
+import { getColumns } from './columns';
+
+export default defineComponent({
+    components: {
+        BtnList,
+    },
+    setup() {
+        // 表格列表数据
+        const { loading, tableList, queryTable } = queryTableList<QueryErmcpTradeDetailsRsp>();
+
+        // 表格通用逻辑
+        const param: ComposeOrderTableParam = {
+            queryFn: () => queryTable(queryErmcpTradeDetails),
+            recordList: getRecordItemTab(),
+        };
+
+        return {
+            ...handleComposeOrderTable(param),
+            getColumns,
+            loading,
+            expandIcon,
+            tableList,
+        };
+    },
+});
+</script>

src/views/order/futures_information/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <!-- 期货订单 -->
+  <section class="futures_information">
+    <component :is="componentId" v-if="componentId">
+    </component>
+    <thirdMenu :list="tabList" @selectMenu="changeTab" :value="'title'"></thirdMenu>
+  </section>
+</template>
+
+<script lang="ts">
+import { defineAsyncComponent, defineComponent } from 'vue';
+import thirdMenu from '@/common/components/thirdMenu/index.vue';
+import { handleOrderDetailList } from '@/common/setup/order/orderData';
+export default defineComponent({
+    components: {
+        thirdMenu,
+        futures_information_position: defineAsyncComponent(() => import('./components/futures_information_position/index.vue')), // 持仓
+        futures_information_entrust: defineAsyncComponent(() => import('./components/futures_information_entrust/index.vue')), // 委托
+        futures_information_success: defineAsyncComponent(() => import('./components/futures_information_success/index.vue')), // 成交
+    },
+    setup() {
+        return { ...handleOrderDetailList('futures_information') };
+    },
+});
+</script>