Merge branch 'master' of http://47.101.159.18:3000/Muchinfo/MTP2.0_WEB

src/assets/styles/mixin.less

@@ -255,6 +255,84 @@
     }
 }
 
+.expandBottomTable {
+    margin: 0 !important;
+
+    .ant-table {
+        width: calc(100% - 160px);
+
+        table {
+            border: 0;
+        }
+
+        .ant-table-thead {
+            tr {
+                box-shadow: 0px 1px 0px 0px @m-black17;
+
+                th {
+                    line-height: 26px;
+                    background: @m-black34;
+                    padding-top: 0;
+                    padding-bottom: 0;
+                    color: @m-grey17;
+                    font-size: 14px;
+                    border-right: 1px solid @m-black9;
+                    border-bottom: 1px solid @m-black9;
+                }
+            }
+        }
+
+        .ant-table-tbody {
+            tr {
+                td {
+                    height: 30px;
+                    line-height: 30px;
+                    padding: 0 8px;
+                    border-right: 1px solid @m-black9;
+                    border-bottom: 1px solid @m-black9;
+                    font-size: 14px;
+                    color: @m-white1;
+                }
+            }
+
+            tr.ant-table-row:hover {
+
+                //tr.ant-table-expanded-row,
+                td {
+                    background-color: @m-blue3  !important;
+                }
+            }
+
+
+
+            tr.ant-table-expanded-row {
+                td {
+                    text-align: right;
+                }
+            }
+        }
+
+        .ant-table-placeholder {
+            border: 0;
+            background: @m-black2;
+            min-height: 190px;
+        }
+    }
+
+    .ant-table-row-expand-icon {
+        border-color: @m-grey17;
+        background-color: transparent;
+        color: @m-grey17;
+    }
+
+    .operBtn.ant-btn {
+        margin-top: 0;
+        margin-bottom: 0;
+        height: 26px;
+        line-height: 26px;
+    }
+}
+
 .srcollYTable {
     .ant-table {
         width: 100%;
@@ -329,6 +407,18 @@
     }
 }
 
+.srcollYTableExpendBgColor {
+    .ant-table {
+        .ant-table-tbody {
+            tr.ant-table-expanded-row-level-1:hover {
+                td {
+                    background-color: @m-black33 ;
+                }
+            }
+        }
+    }
+}
+
 // 左边菜单展开后 表格展开行操作按钮显示在最右侧
 .expandLeftTable {
     .ant-table {

src/common/setup/table/compose.ts

@@ -116,7 +116,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, isDetail, tableName, clickCB }: ComposeOrderTableParam) {
     // 右键逻辑
     const { contextMenu, openContext, closeContext: closeContextAction } = handleContextMenu();
     // 表头数据
@@ -126,6 +126,9 @@ export function handleComposeOrderTable<T>({ queryFn, recordList, isDetail, tabl
         contextmenuCB: (record: T, value: ContextMenuTemp) => {
             // 控制打开右键
             contextMenu.value = value
+        },
+        clickCB: (record: T) => {
+            clickCB?.(record)
         }
     }
     // 表格事件

src/common/setup/table/interface.ts

@@ -50,6 +50,7 @@ export interface ComposeOrderTableParam {
     recordList: OperationTabMenu[], // 当前tab页配置数据
     tableName?: keyof TableKey, // 表头key
     isDetail?: boolean,  // 是否需要详情
+    clickCB?: Function, // 点击表格行
 }
 
 export interface ButtonListKey {

src/hooks/table/columns.ts

@@ -0,0 +1,23 @@
+import { ItemColumns } from "./interface";
+
+// 设置表头
+export const useSetColumns = (colums: ItemColumns[]) => {
+    return colums.map(el => {
+        if (!el.dataIndex) {
+            el.dataIndex = el.key
+        }
+        if (!el.align) {
+            el.align = 'center'
+        }
+        if (!el.width) {
+            el.width = 120
+        }
+
+        if (!el.slots) {
+            el.slots = {
+                customRender: el.key,
+            }
+        }
+        return el
+    })
+}

src/hooks/table/interface.ts

@@ -0,0 +1,8 @@
+export interface ItemColumns {
+    key: string
+    title: string
+    dataIndex?: string
+    align?: 'left' | 'right' | 'center'
+    slots?: Object
+    width?: number
+}

src/services/bus/holdPosition.ts

@@ -23,6 +23,7 @@ export const useProfitloss = (record: QueryTradePositionRsp, goodscode?: string)
     }
 }
 
+
 // 市值(所有权) = 数量 * 现价 * 合约单位
 export const useHolderprice = (record: QueryTradePositionRsp) => {
     // 最新价

src/views/order/swap_the_order/components/swap_commodity_contract_commission/index.vue

@@ -1,24 +1,27 @@
 <template>
   <!-- 商品订单 - 委托 -->
   <section>
-    <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="key"
-             :data-source="tableList">
+    <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="key"
+      :data-source="tableList"
+    >
       <!-- 额外的展开行 -->
-      <template v-if="btnList.length"
-                #expandedRowRender="{ record }">
-        <BtnList :btnList="filterBtnList(btnList, record)"
-                 :record="record"
-                 class="btn-list-sticky"
-                 @click="openComponent" />
+      <template v-if="btnList.length" #expandedRowRender="{ record }">
+        <BtnList
+          :btnList="filterBtnList(btnList, record)"
+          :record="record"
+          class="btn-list-sticky"
+          @click="openComponent"
+        />
       </template>
       <!-- 类型 -->
       <template #buildtype="{ record }">
@@ -33,15 +36,18 @@
         <a>{{ formatTime(text) }}</a>
       </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>
 
 <script lang="ts">
 import { BtnListType } from '@/common/components/btnList/interface';
+import { TradeMode } from '@/common/constants/enumCommon';
 import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
 import { getBuyOrSellTypeName, getOrderStatusName } from '@/common/constants/enumsName';
 import { BtnList, defineAsyncComponent, defineComponent, queryTableList } from '@/common/export/commonTable';
@@ -56,48 +62,48 @@ import { WrPerformancePlan } from '@/services/go/wrtrade/interface';
 import Bus from '@/utils/eventBus/index';
 
 export default defineComponent({
-    name: enumOrderComponents.commodity_contract_commission,
-    components: {
-        BtnList,
-        commodity_contract_commission_cancel_order: defineAsyncComponent(() => import('./components/cancel/index.vue')),
-    },
-    setup() {
-        // 表格列表数据
-        const { loading, tableList, queryTable } = queryTableList<QueryTradeOrderDetailRsp>();
-        // 获取列表数据
-        const queryTableAction = () => {
-            queryTable(queryTradeOrderDetail, {});
-        };
-        // 表格通用逻辑
-        const param: ComposeOrderTableParam = {
-            queryFn: queryTableAction,
-            tableName: 'table_pcweb_spot_trade_bottom_commodity_contract_commission',
-            recordList: getRecordItemTab(),
-        };
-        function filterBtnList(list: BtnListType[], record: QueryTradeOrderDetailRsp) {
-            //委托状态 - 1:委托请求 2:待冻结 3:委托成功 4:委托失败 5:配对成功 6:已撤 7:已成 8:成交失败 9:委托拒绝 1number;
-            const arr = [3, 7];
-            if (!arr.includes(record.orderstatus)) {
-                return list.filter((e) => e.code !== 'commodity_contract_commission_cancel_order');
-            } else {
-                return list;
-            }
-        }
-        // 挂牌
-        Bus.$on('spotTrade', () => {
-            queryTableAction();
-        });
-        return {
-            ...handleComposeOrderTable<WrPerformancePlan>(param),
-            loading,
-            tableList,
-            formatTime,
-            expandIcon,
-            getBuyOrSellTypeName,
-            getOrderStatusName,
-            filterBtnList,
-        };
-    },
+  name: enumOrderComponents.commodity_contract_commission,
+  components: {
+    BtnList,
+    commodity_contract_commission_cancel_order: defineAsyncComponent(() => import('./components/cancel/index.vue')),
+  },
+  setup() {
+    // 表格列表数据
+    const { loading, tableList, queryTable } = queryTableList<QueryTradeOrderDetailRsp>();
+    // 获取列表数据
+    const queryTableAction = () => {
+      queryTable(queryTradeOrderDetail, { tradeMode: TradeMode.DiaoQi.toString() });
+    };
+    // 表格通用逻辑
+    const param: ComposeOrderTableParam = {
+      queryFn: queryTableAction,
+      tableName: 'table_pcweb_spot_trade_bottom_commodity_contract_commission',
+      recordList: getRecordItemTab(),
+    };
+    function filterBtnList(list: BtnListType[], record: QueryTradeOrderDetailRsp) {
+      //委托状态 - 1:委托请求 2:待冻结 3:委托成功 4:委托失败 5:配对成功 6:已撤 7:已成 8:成交失败 9:委托拒绝 1number;
+      const arr = [3, 7];
+      if (!arr.includes(record.orderstatus)) {
+        return list.filter((e) => e.code !== 'commodity_contract_commission_cancel_order');
+      } else {
+        return list;
+      }
+    }
+    // 挂牌
+    Bus.$on('spotTrade', () => {
+      queryTableAction();
+    });
+    return {
+      ...handleComposeOrderTable<WrPerformancePlan>(param),
+      loading,
+      tableList,
+      formatTime,
+      expandIcon,
+      getBuyOrSellTypeName,
+      getOrderStatusName,
+      filterBtnList,
+    };
+  },
 });
 </script>
 

src/views/order/swap_the_order/components/swap_commodity_contract_make_deal/index.vue

@@ -1,34 +1,37 @@
 <template>
   <!-- 商品订单 - 成交 -->
   <section>
-    <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="key"
-             :data-source="tableList">
+    <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="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 #buyorsell="{ text }">
         <span>{{ getBuyOrSellTypeName(text) }}</span>
       </template>
       <template #tradeprice="{ text, record }">
-        <span>{{ handleType(record, text)}}</span>
+        <span>{{ handleType(record, text) }}</span>
       </template>
       <template #matchaccountid="{ text, record }">
-        <span>{{ handleType(record, text)}}</span>
+        <span>{{ handleType(record, text) }}</span>
       </template>
       <!-- 状态 -->
       <template #orderstatus="{ record }">
@@ -38,10 +41,12 @@
         <a>{{ formatTime(record.createtime) }}</a>
       </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>
 
@@ -58,49 +63,50 @@ import { queryTradeDetail } from '@/services/go/ermcp/order';
 import { QueryTradeDetailRsp } from '@/services/go/ermcp/order/interface';
 import Bus from '@/utils/eventBus/index';
 import { handleNoneValue } from '@/common/setup/table/tableQuote';
+import { TradeMode } from '@/common/constants/enumCommon';
 
 export default defineComponent({
-    name: enumOrderComponents.commodity_contract_make_deal,
-    components: {
-        BtnList,
-    },
-    setup() {
-        // 表格列表数据
-        const { loading, tableList, queryTable } = queryTableList<QueryTradeDetailRsp>();
-        // 获取列表数据
-        const queryTableAction = () => {
-            queryTable(queryTradeDetail, {});
-        };
-        // 表格通用逻辑
-        const param: ComposeOrderTableParam = {
-            queryFn: queryTableAction,
-            tableName: 'table_pcweb_spot_trade_bottom_commodity_contract_make_deal',
-            recordList: getRecordItemTab(),
-        };
-        // fix: #2063
-        function handleType(record: QueryTradeDetailRsp, value: string | number) {
-            let result: number | string = '--';
-            if (value) {
-                result = record.tradetype === 22 ? '--' : value;
-            }
-            return result;
-        }
-        Bus.$on('spotTrade', () => {
-            queryTableAction();
-        });
-        return {
-            ...handleComposeOrderTable<QueryTradeDetailRsp>(param),
-            loading,
-            tableList,
-            formatTime,
-            expandIcon,
-            getBuildTypeName,
-            getOrderStatusName,
-            getBuyOrSellTypeName,
-            handleNoneValue,
-            handleType,
-        };
-    },
+  name: enumOrderComponents.commodity_contract_make_deal,
+  components: {
+    BtnList,
+  },
+  setup() {
+    // 表格列表数据
+    const { loading, tableList, queryTable } = queryTableList<QueryTradeDetailRsp>();
+    // 获取列表数据
+    const queryTableAction = () => {
+      queryTable(queryTradeDetail, { tradeMode: TradeMode.DiaoQi.toString() });
+    };
+    // 表格通用逻辑
+    const param: ComposeOrderTableParam = {
+      queryFn: queryTableAction,
+      tableName: 'table_pcweb_spot_trade_bottom_commodity_contract_make_deal',
+      recordList: getRecordItemTab(),
+    };
+    // fix: #2063
+    function handleType(record: QueryTradeDetailRsp, value: string | number) {
+      let result: number | string = '--';
+      if (value) {
+        result = record.tradetype === 22 ? '--' : value;
+      }
+      return result;
+    }
+    Bus.$on('spotTrade', () => {
+      queryTableAction();
+    });
+    return {
+      ...handleComposeOrderTable<QueryTradeDetailRsp>(param),
+      loading,
+      tableList,
+      formatTime,
+      expandIcon,
+      getBuildTypeName,
+      getOrderStatusName,
+      getBuyOrSellTypeName,
+      handleNoneValue,
+      handleType,
+    };
+  },
 });
 </script>
 

src/views/order/swap_the_order/components/swap_commodity_contract_summary/components/commodity_contract_summary_settlement/index.vue

@@ -1,428 +0,0 @@
-<template>
-  <!-- 交收-->
-  <Drawer :title="'交收'"
-          :placement="'right'"
-          class="bottom486"
-          :visible="visible"
-          @cancel="cancel">
-    <div class="listed c_c_s_s">
-      <a-form class="inlineForm dialogForm"
-              ref="formRef">
-        <div class="formBar">
-          <div class="formtop">
-            <div class="firstTitle">
-              <span>合约 {{selectedRow.goodscode}}&nbsp;&nbsp;</span>
-              <span>合约数量 {{selectedRow.enableqty}}&nbsp;&nbsp;</span>
-              <span>可交收数量 {{getCanSettlementNum()}} {{selectedRow.goodunit}}</span>
-            </div>
-            <div class="secondLine">
-              <div class="left">持有人/商品/仓库</div>
-              <div class="middle">升贴水/数量</div>
-              <div class="right">选择数量</div>
-            </div>
-            <a-checkbox-group class="commonCheckboxGroup"
-                              v-model:value="checked"
-                              @change="checkGroupChange">
-              <div class="lineBar"
-                   v-for="(item, index) in tableList"
-                   :key="index + '11'">
-                <div class="line1">
-                  <div class>
-                    <a-checkbox @change="checkboxChange(item)"
-                                :value="item.ladingbillid"></a-checkbox>
-                  </div>
-                  <div class="name">{{item.username}}</div>
-                </div>
-                <div class="line2">
-                  <div class="left">
-                    <div>{{item.wrtypename}}</div>
-                    <div>{{item.warehousename}}</div>
-                  </div>
-                  <div class="middle">
-                    <div>{{item.pricemove}}</div>
-                    <div>{{toFixed0(item.avalidqty)}}{{item.enumdicname}}</div>
-                  </div>
-                  <div class="right">
-                    <template class="inputNumberBlock"
-                              :class="isChecked(item.ladingbillid) ? '' : 'disabled'">
-                      <a-input-number class="dialogInput dialogInput34"
-                                      v-model:value="item.num"
-                                      style="width: 130px !important; height: 34px;"
-                                      :disabled="!isChecked(item.ladingbillid)"
-                                      :max="toFixed0(item.avalidqty)"
-                                      :min="0"></a-input-number>
-                      <MinusOutlined @click="decrease(item)" />
-                      <PlusOutlined @click="increase(item)" />
-                    </template>
-                  </div>
-                </div>
-              </div>
-            </a-checkbox-group>
-          </div>
-        </div>
-        <div class="fixedBtns">
-          <div class="formbottom">
-            <div class="line1">
-              <div>
-                <span>已点选数量</span>
-                <span class="white">{{selctedNum()}} {{selectedRow.goodunit}}</span>
-                <span>，需合约数量</span>
-                <span class="white">{{getNeedContractNum()}}</span>
-              </div>
-              <div class="yellow">升贴水{{selected ? selected.pricemove * selected.num : '--'}}</div>
-            </div>
-            <div class="line2"
-                 v-if="isBaseSpread()">
-              <div>点价合约</div>
-              <div class="right">
-                <div>{{selected.pgoodscode ? selected.pgoodscode : ''}}</div>
-                <div>{{getDeliveryGoodsPrice()}}</div>
-              </div>
-            </div>
-            <div v-if="isBaseSpread()"
-                 class="line3">预估货款：{{getEstimatedPayment()}}</div>
-          </div>
-
-          <a-form-item class="btnCenter mt10">
-            <a-button class="listedBtn"
-                      :loading="loading"
-                      :disabled="loading"
-                      @click="submit">提交</a-button>
-          </a-form-item>
-        </div>
-      </a-form>
-    </div>
-  </Drawer>
-</template>
-
-<script lang="ts">
-import { defineComponent, PropType, ref } from 'vue';
-import Drawer from '@/common/components/drawer/index.vue';
-import { ModalEnum } from '@/common/constants/modalNameEnum';
-import { _closeModal } from '@/common/setup/modal/modal';
-
-import UploadImg from '@/common/components/uploadImg/index.vue';
-import { getSelectedAccountId } from '@/services/bus/account';
-
-import { BuyOrSell } from '@/common/constants/enumCommon';
-import Long from 'long';
-import { QueryTradePositionRsp } from '@/services/go/ermcp/order/interface';
-import { PlusOutlined, MinusOutlined } from '@ant-design/icons-vue';
-import { handleCheck, getTableList, handleCalculation } from './setup';
-import { DeliveryOrder } from '@/services/proto/warehousetrade';
-import { v4 } from 'uuid';
-import moment from 'moment';
-import { DeliveryOrderReq } from '@/services/proto/warehousetrade/interface';
-import { geLoginID_number } from '@/services/bus/login';
-import { message } from 'ant-design-vue';
-import { getGoodsByCode } from '@/services/bus/goods';
-
-export default defineComponent({
-    name: ModalEnum.commodity_contract_summary_settlement,
-    components: { Drawer, UploadImg, PlusOutlined, MinusOutlined },
-    emits: ['cancel', 'update'],
-    props: {
-        selectedRow: {
-            type: Object as PropType<QueryTradePositionRsp>,
-            default: {},
-        },
-        buyOrSell: {
-            type: Number as PropType<BuyOrSell>,
-            default: BuyOrSell.buy,
-        },
-    },
-    setup(props, context) {
-        const { visible, cancel } = _closeModal(context);
-        const loading = ref<boolean>(false);
-        const { goodsid } = props.selectedRow;
-        // 合约交收可点选仓单
-        const { tableList } = getTableList(goodsid);
-        // check 是否选中逻辑
-        const { checked, selected, deliveryGoods, checkGroupChange, isChecked, checkboxChange, isBaseSpread } = handleCheck();
-        // 各种计算
-        const { getStepValue, getCanSettlementNum, getNeedContractNum, getEstimatedPayment, XQty, PQty, getDeliveryGoodsPrice, increase, decrease, selctedNum } = handleCalculation(props.selectedRow);
-
-        const toFixed0 = (value: number) => +value.toFixed(0);
-
-        function submit() {
-            if (!selected.value) {
-                message.warn('请选择合约');
-                return;
-            }
-            if (!selected.value.num) {
-                message.warn('请输入选择数量');
-                return;
-            }
-
-            if (deliveryGoods.value) {
-                loading.value = true;
-                console.log(deliveryGoods.value);
-                const param: DeliveryOrderReq = {
-                    ClientSerialNo: v4(), // 客户端流水号
-                    ClientOrderTime: moment(new Date()).format('YYYY-MM-DD HH:mm:ss'), // 客户端委托时间
-                    ClientType: 4, // 终端类型
-                    // goodsID: props.selectedRow.goodsid,
-                    // market
-                    AccountID: getSelectedAccountId(),
-                    XGoodsID: getGoodsByCode(selected.value.xgoodscode)!.goodsid,
-                    DeliveryGoodsID: deliveryGoods.value.deliverygoodsid,
-                    XQty: Long.fromNumber(XQty()),
-                    PQty: Long.fromNumber(PQty()),
-                    OperateType: 0,
-                    OrderSrc: 0,
-                    OperatorID: Number(geLoginID_number()),
-                    DeliveryQty: selected.value.num,
-                    DeliveryOrderDetail: {
-                        AccountID: selected.value.accountid,
-                        Qty: selected.value.num,
-                        LadingBillID: Long.fromString(selected.value.ladingbillid),
-                        WRFactorTypeID: Long.fromString(selected.value.wrfactortypeid),
-                        SubNum: selected.value.subnum,
-                    },
-                };
-                if (isBaseSpread()) {
-                    param.PGoodsID = deliveryGoods.value.pgoodsid;
-                } else {
-                    // param.PGoodsID = 0;
-                    param.PQty = 0;
-                }
-                console.log('param', param);
-                DeliveryOrder(param)
-                    .then((res) => {
-                        console.log('res', res);
-                        message.success('提交成功');
-                        cancel(true);
-                    })
-                    .catch((err) => {
-                        console.log('err', err);
-                        message.error(err);
-                    })
-                    .finally(() => {
-                        loading.value = false;
-                    });
-            } else {
-                message.warn('未找到对应的交割商品');
-            }
-        }
-        return {
-            visible,
-            cancel,
-            submit,
-            tableList,
-            loading,
-            checkGroupChange,
-            checkboxChange,
-            checked,
-            isChecked,
-            isBaseSpread,
-            getStepValue,
-            getCanSettlementNum,
-            getNeedContractNum,
-            getEstimatedPayment,
-            getDeliveryGoodsPrice,
-            increase,
-            decrease,
-            selctedNum,
-            selected,
-            toFixed0,
-        };
-    },
-});
-</script>
-
-<style lang="less" scoped>
-.c_c_s_s {
-    background: @m-black40;
-    width: 100%;
-    height: 100%;
-    position: relative;
-    .formBar {
-        padding: 0;
-        height: calc(100% - 172px);
-        background: @m-black41;
-        .formtop {
-            width: 100%;
-            padding: 0 20px;
-            .flex;
-            flex-direction: column;
-            .firstTitle {
-                width: calc(100% + 40px);
-                height: 40px;
-                line-height: 40px;
-                margin-left: -20px;
-                padding: 0 20px;
-                font-size: 14px;
-                color: @m-white6;
-                border-bottom: 1px solid @m-black42;
-            }
-            .secondLine {
-                width: 100%;
-                height: 40px;
-                line-height: 40px;
-                display: inline-flex;
-                > div {
-                    flex: 1;
-                    font-size: 14px;
-                    color: @m-grey1;
-                }
-                .left {
-                    text-align: left;
-                }
-                .middle {
-                    text-align: center;
-                }
-                .right {
-                    text-align: right;
-                }
-            }
-            .lineBar {
-                width: 100%;
-                min-height: 100px;
-                padding-left: 15px;
-                padding-right: 10px;
-                background: @m-blue19;
-                margin-bottom: 10px;
-                .rounded-corners(5px);
-                .line1 {
-                    display: inline-flex;
-                    user-select: none;
-                    width: 100%;
-                    height: 40px;
-                    line-height: 40px;
-                    font-size: 16px;
-                    color: @m-white6;
-                    white-space: nowrap;
-                    text-overflow: ellipsis;
-                    overflow: hidden;
-                    border-bottom: 1px solid @m-blue20;
-                    > div {
-                        align-self: center;
-                        align-items: center;
-                    }
-                    .name {
-                        margin-left: 10px;
-                    }
-                }
-                .line2 {
-                    width: 100%;
-                    user-select: none;
-                    padding: 12px 0 14px 0;
-                    display: inline-flex;
-                    > div {
-                        flex: 2;
-                    }
-                    .left {
-                        .flex;
-                        flex-direction: column;
-                        max-width: 40%;
-                        > div {
-                            width: 100%;
-                            height: 17px;
-                            line-height: 17px;
-                            color: @m-white6;
-                            font-size: 14px;
-                            white-space: nowrap;
-                            text-overflow: ellipsis;
-                            overflow: hidden;
-                        }
-                    }
-                    .middle {
-                        flex: 1;
-                        display: inline-flex;
-                        justify-content: space-between;
-                        padding: 0 10px;
-                        font-size: 16px;
-                        color: @m-white6;
-                        line-height: 34px;
-                        > div {
-                            white-space: nowrap;
-                        }
-                    }
-                    .right {
-                        .inputNumberBlock {
-                            float: right;
-                            display: block;
-                            width: 130px;
-                            position: relative;
-                            .anticon {
-                                color: @m-blue15;
-                                font-size: 15px;
-                                z-index: 2;
-                                line-height: 34px;
-                                cursor: pointer;
-                            }
-                            .anticon-minus {
-                                .position(absolute, 0, auto, 0, 10px);
-                            }
-                            .anticon-plus {
-                                .position(absolute, 0, 10px, 0, auto);
-                            }
-                        }
-                        .disabled {
-                            .anticon {
-                                color: @m-grey51;
-                            }
-                        }
-                    }
-                }
-            }
-        }
-    }
-    .fixedBtns {
-        padding-top: 0;
-        left: 0;
-        right: 0;
-    }
-    .formbottom {
-        width: 100%;
-        .flex;
-        flex-direction: column;
-        background: @m-black40;
-        padding: 0 18px 0 20px;
-        .line1 {
-            width: 100%;
-            padding: 0 12px 0 16px;
-            height: 36px;
-            line-height: 36px;
-            display: inline-flex;
-            justify-content: space-between;
-            color: @m-grey1;
-            font-size: 14px;
-        }
-        .line2 {
-            width: 100%;
-            height: 35px;
-            line-height: 34px;
-            padding-left: 15px;
-            padding-right: 10px;
-            background: @m-black43;
-            .rounded-corners(5px);
-            font-size: 14px;
-            color: @m-grey1;
-            display: inline-flex;
-            justify-content: space-between;
-            > div {
-                align-self: baseline;
-                align-items: baseline;
-            }
-            .right {
-                display: inline-flex;
-                color: @m-yellow6;
-                div:last-child {
-                    font-size: 16px;
-                    margin-left: 2px;
-                }
-            }
-        }
-        .line3 {
-            margin-top: 16px;
-            width: 100%;
-            height: 15px;
-            line-height: 15px;
-            font-size: 14px;
-            text-align: right;
-            color: @m-white6;
-        }
-    }
-}
-</style>;

src/views/order/swap_the_order/components/swap_commodity_contract_summary/components/commodity_contract_summary_settlement/interface.ts

@@ -1,11 +0,0 @@
-import { WrDeliveryAvalidHoldLB } from "@/services/go/wrtrade/interface";
-
-export interface FormState {
-    // price: number,
-    num: number,
-}
-
-export interface DBType extends WrDeliveryAvalidHoldLB {
-    checked: boolean;
-    num: number;
-}

src/views/order/swap_the_order/components/swap_commodity_contract_summary/components/commodity_contract_summary_settlement/setup.ts

@@ -1,209 +0,0 @@
-import { handleDeliveryRelation } from "@/common/setup/deliveryRelation";
-import { getSelectedAccountId } from "@/services/bus/account";
-import { getGoodsByCode, getQuoteDayInfoByCode } from "@/services/bus/goods";
-import { QueryDeliveryRelationRsp } from "@/services/go/delivery/interface";
-import { QueryTradePositionRsp } from "@/services/go/ermcp/order/interface";
-import { queryWrDeliveryAvalidHoldLB } from "@/services/go/wrtrade";
-import { QueryWrDeliveryAvalidHoldLBReq } from "@/services/go/wrtrade/interface";
-import { ref } from "vue";
-import { DBType } from "./interface";
-
-// 选中的交收合约
-const selected = ref<DBType>()
-const checked = ref<string>();
-// 交割商品
-const deliveryGoods = ref<QueryDeliveryRelationRsp | undefined>();
-
-// 查询合约交收可点选仓单
-export function getTableList(goodsid: number) {
-    // 交割商品
-    const { getItemDeliveryRelationByGoodsId } = handleDeliveryRelation()
-    const param: QueryWrDeliveryAvalidHoldLBReq = {
-        goodsid,
-        accountid: getSelectedAccountId(),
-    };
-    const tableList = ref<DBType[]>([]);
-    queryWrDeliveryAvalidHoldLB(param).then((res) => {
-        tableList.value = res.map((e, i) => {
-            if (i) {
-                return { ...e, checked: false, num: 0 };
-            } else {
-                // 默认勾选第一个
-                checked.value = e.ladingbillid
-                const result = { ...e, checked: true, num: 0 };
-                selected.value = result
-                deliveryGoods.value = getItemDeliveryRelationByGoodsId(e.goodsid).value
-                return result
-            }
-        });
-    });
-    return { tableList }
-}
-
-
-
-export function handleCheck() {
-    // 交割商品
-    const { getItemDeliveryRelationByGoodsId } = handleDeliveryRelation()
-
-    function checkGroupChange(checkedValue: string[]) {
-        checked.value = checkedValue[checkedValue.length - 1];
-    }
-    function isChecked(value: string) {
-        return value === checked.value;
-    }
-    function checkboxChange(item: DBType) {
-        selected.value = item;
-        deliveryGoods.value = getItemDeliveryRelationByGoodsId(item.goodsid).value
-    }
-    // true 基差点价; false 挂牌点选
-    function isBaseSpread() {
-        if (deliveryGoods.value) {
-            // 1和3是订单交易 挂牌转让
-            // 2和4是基差点价
-            const arr = [2, 4]
-            return arr.includes(deliveryGoods.value.deliverytype)
-        } else {
-            return false
-        }
-    }
-    return { checked, selected, deliveryGoods, checkGroupChange, isChecked, checkboxChange, isBaseSpread }
-}
-
-export function handleCalculation(selectedRow: QueryTradePositionRsp) {
-    // 商品合约单位
-    const { enableqty } = selectedRow
-    function getDecimalplace() {
-        let result = 2;
-        const goods = selected.value?.pgoodscode
-        if (goods) {
-            const item = getGoodsByCode(goods)
-            item && (result = item.decimalplace)
-        }
-        return result
-    }
-    function getAgreeunit(goodscode: string) {
-        let result = 1
-        // const goodscode = selectedRow.goodscode
-        // if (goodscode) {
-        const item = getGoodsByCode(goodscode)
-        if (item) {
-            result = item.agreeunit
-        }
-        // }
-        return result
-    }
-
-
-    function selctedNum() {
-        return selected.value ? selected.value.num.toFixed(0) : '--'
-    }
-    // 选中数量的 最小变动值 = 合约单位 * 最小交割系数 * 仓单商品的单位r2
-    function getStepValue() {
-        const agreeunit = getAgreeunit(selectedRow.goodscode)
-        if (deliveryGoods.value) {
-            const { rratio2, mindeliveryqty } = deliveryGoods.value
-            return agreeunit * mindeliveryqty * rratio2
-        } else {
-            return agreeunit
-        }
-    }
-    // 可交收数量 = 合约可用手数 * 合约单位 * 最小交割系数 * (仓单商品的单位r2/合约商品的单位r1)
-    function getCanSettlementNum() {
-        if (deliveryGoods.value) {
-            const agreeunit = getAgreeunit(selectedRow.goodscode)
-            const { rratio1, rratio2, mindeliveryqty } = deliveryGoods.value
-            const result = enableqty * agreeunit * mindeliveryqty * (rratio2 / rratio1)
-            return result.toFixed(0)
-        } else {
-            return '--'
-        }
-    }
-    // (选中的数量 / (合约单位 * 最小交割系数 * (仓单商品的单位r2/合约商品的单位r1)))
-    function XQty() {
-        let result = 0
-        if (selected.value?.num) {
-            if (deliveryGoods.value) {
-                const agreeunit = getAgreeunit(selectedRow.goodscode)
-                const { rratio1, rratio2, mindeliveryqty, xdeliveryratio, pdeliveryratio } = deliveryGoods.value
-                result = selected.value.num / (agreeunit * mindeliveryqty * (rratio2 / rratio1))
-            }
-        }
-        return result
-    }
-    // 需要合约手数 = (选中的数量 / (合约单位 * 最小交割系数 * (仓单商品的单位r2/合约商品的单位r1))) / (p1合约系数 / x合约系数)
-    function PQty() {
-        let result = XQty()
-        if (result) {
-            if (deliveryGoods.value) {
-                const { xdeliveryratio, pdeliveryratio } = deliveryGoods.value
-                result = result / pdeliveryratio / xdeliveryratio
-            }
-        }
-        return result
-    }
-    // 需要合约手数 = (选中的数量 / (合约单位 * 最小交割系数 * (仓单商品的单位r2/合约商品的单位r1))) / (p1合约系数 / x合约系数)
-    function getNeedContractNum() {
-        const result = PQty()
-        return result ? result.toFixed(0) : '--'
-    }
-    // 预估货款 = 需要合约手数  * 合约交割价 * 合约单位 + 升贴水
-    function getEstimatedPayment() {
-        const num = getNeedContractNum()
-        const price = getDeliveryGoodsPrice()
-        let result = 0
-        if (selected.value) {
-            if (num !== '--' && price !== '--') {
-                if (deliveryGoods.value) {
-                    const agreeunit = getAgreeunit(selected.value.pgoodscode)
-                    result = (Number(num) * Number(price) * agreeunit) + (selected.value.pricemove * selected.value.num)
-                }
-            }
-        }
-        return result ? result.toFixed(getDecimalplace()) : '--'
-    }
-    /**
-     * 合约交割价取价规则
-     * 1.优先实时结算价
-     * 2.其次卖一价
-     * 3.再次是买一价与成交价中的最高价
-     * 4.最后取昨日结算价
-     * 所有权(X): 不取交割价，默认设为0，不影响交割流程
-     */
-    function getDeliveryGoodsPrice() {
-        const goodscode = selected.value?.pgoodscode
-        if (!goodscode) return '--'
-        const item = getQuoteDayInfoByCode(goodscode);
-        const has = (value: any) => value && value !== '--'
-        let result = 0
-        if (item) {
-            const { settle, ask, bid, last, presettle } = item
-            if (has(settle)) {
-                result = settle
-            } else if (has(ask)) {
-                result = ask
-            } else if (has(bid) && has(last)) {
-                result = Math.max(bid, last)
-            } else if (has(presettle)) {
-                result = presettle
-            }
-        }
-        return has(result) ? result.toFixed(getDecimalplace()) : '--'
-    }
-
-    // 增加
-    function increase(value: DBType) {
-        if (value.num < value.avalidqty) {
-            value.num += getStepValue()
-            value.num = +value.num.toFixed(getDecimalplace())
-        }
-    }
-    // 减少
-    function decrease(value: DBType) {
-        if (value.num > 0) {
-            value.num -= getStepValue()
-            value.num = +value.num.toFixed(getDecimalplace())
-        }
-    }
-    return { getStepValue, getCanSettlementNum, getNeedContractNum, getEstimatedPayment, XQty, PQty, getDeliveryGoodsPrice, increase, decrease, selctedNum }
-}

src/views/order/swap_the_order/components/swap_commodity_contract_summary/components/commodity_contract_summary_transfer/index.vue

@@ -1,200 +0,0 @@
-<template>
-  <!-- 转让-->
-  <Drawer :title="'转让'"
-          :placement="'right'"
-          :visible="visible"
-          class="delistingBottom"
-          @cancel="cancel">
-    <div class="listed">
-      <a-form class="inlineForm dialogForm"
-              ref="formRef"
-              :model="formState"
-              :rules="rules">
-        <div class="formBar">
-          <a-row :gutter="24">
-            <a-col :span="12">
-              <a-form-item label="合约"
-                           name="goodsid">
-                <a-select class="inlineFormSelect"
-                          :default-value="selectedRow.goodsid"
-                          v-model:value="formState.goodsid"
-                          style="width: 100%">
-                  <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-col>
-            <a-col :span="12">
-              <a-form-item label="挂牌价"
-                           name="price">
-                <a-input-number class="commonInput"
-                                v-model:value="formState.price"
-                                style="width: 100%" />
-              </a-form-item>
-            </a-col>
-            <a-col :span="12">
-              <a-form-item label="挂牌数量"
-                           name="num">
-                <a-input-number class="commonInput"
-                                :max="getMax()"
-                                v-model:value="formState.num"
-                                style="width: 100%" />
-                <span class="input-enumdicname">{{selectedRow.enumdicname}}</span>
-              </a-form-item>
-            </a-col>
-            <a-col :span="12">
-              <a-form-item label="挂牌金额">
-                <a-input class="commonInput"
-                         :value="getMoney()"
-                         style="width: 100%" />
-              </a-form-item>
-            </a-col>
-            <a-col :span="24"
-                   class="mt-20">
-              <a-form-item>
-                <a-slider :min="0"
-                          v-model:value="formState.num"
-                          :max="getMax()"
-                          class="formSlider"
-                          style="width: 180px" />
-                <div class="unit">
-                  <span>0</span>
-                  <span>{{getMax()}}{{selectedRow.enumdicname}}</span>
-                </div>
-              </a-form-item>
-            </a-col>
-          </a-row>
-        </div>
-        <a-row :gutter="24">
-          <a-col :span="24"
-                 class="fixedBtns">
-            <a-form-item class="btnCenter">
-              <a-button class="listedBtn"
-                        :loading="loading"
-                        :disabled="loading"
-                        @click="submit">提交</a-button>
-            </a-form-item>
-          </a-col>
-        </a-row>
-      </a-form>
-    </div>
-  </Drawer>
-</template>
-
-<script lang="ts">
-import { defineComponent, PropType, ref } from 'vue';
-import Drawer from '@/common/components/drawer/index.vue';
-import { WrPerformancePlan, WrPosition } from '@/services/go/wrtrade/interface';
-import { ModalEnum } from '@/common/constants/modalNameEnum';
-import { _closeModal } from '@/common/setup/modal/modal';
-import { handleForm } from './setup';
-import { validateAction } from '@/common/setup/form';
-import { FormState } from './interface';
-import UploadImg from '@/common/components/uploadImg/index.vue';
-import { getUploadImg } from '@/common/setup/upload';
-import { PerformanceContractedApplyReq, PerformanceDelayApplyReq } from '@/services/proto/performance/interface';
-import { getSelectedAccount, getSelectedAccountId, getUserId } from '@/services/bus/account';
-import { requestResultLoadingAndInfo } from '@/common/methods/request/resultInfo';
-import { performanceContractedApply, performanceDelayApply } from '@/services/proto/performance';
-import { BuyOrSell, DelistingType, PriceType } from '@/common/constants/enumCommon';
-import Long from 'long';
-import { OrderReq } from '@/services/socket/order/interface';
-import { v4 as uuidv4 } from 'uuid';
-import moment from 'moment';
-import { geLoginID_number } from '@/services/bus/login';
-import { LongType } from '@/services/socket/login/interface';
-import { Order } from '@/services/socket/order';
-import { QueryTradePositionRsp } from '@/services/go/ermcp/order/interface';
-
-export default defineComponent({
-    name: ModalEnum.commodity_contract_summary_transfer,
-    components: { Drawer, UploadImg },
-    emits: ['cancel', 'update'],
-    props: {
-        selectedRow: {
-            type: Object as PropType<QueryTradePositionRsp>,
-            default: {},
-        },
-        tableList: {
-            type: Array as PropType<QueryTradePositionRsp[]>,
-            default: [],
-        },
-    },
-    setup(props, context) {
-        const { visible, cancel } = _closeModal(context);
-        const loading = ref<boolean>(false);
-        const { rules, formState, formRef } = handleForm();
-        formState.goodsid = props.selectedRow.goodsid;
-        function getSelectedGoods() {
-            return props.tableList.find((e) => e.goodsid === formState.goodsid)!;
-        }
-        function getMax() {
-            return getSelectedGoods().enableqty;
-        }
-        function getMoney() {
-            return (formState.price * formState.num).toFixed(getSelectedGoods().decimalplace);
-        }
-        function submit() {
-            // 挂牌请求 通过合约汇总 挂牌转让
-            validateAction<FormState>(formRef, formState).then((res) => {
-                const param: OrderReq = {
-                    ClientSerialNo: uuidv4(), // 客户端流水号
-                    ClientOrderTime: moment(new Date()).format('YYYY-MM-DD HH:mm:ss'), // 客户端委托时间
-                    ClientType: 4, // 终端类型
-                    LoginID: geLoginID_number()!, // 登陆账号
-                    AccountID: getSelectedAccountId(), // 交易账号
-                    GoodsID: res.goodsid, // 商品ID
-                    MarketID: getSelectedGoods().marketid, // 市场ID
-                    ValidType: 1, // 校验类型 当日有效
-                    OperateType: 1, // 操作类型: 申请
-                    OrderSrc: 1, // 单据来源: 客户端下单
-                    OrderPrice: res.price, // 委托价格                      (需要填入)
-                    OperatorID: Number(geLoginID_number()),
-                    // MarketMaxSub: number // 市价允许最大偏差(做市)
-                    OrderQty: res.num, // 委托数量                          (需要填入)
-                    BuyOrSell: 1, // 买卖方向  0 买 1 卖
-                    BuildType: 2, // 下单类型  1 建 2 平
-                    // CurtQuotePrice: 0, // 保留，计算冻结金额使用
-                    // SpPrice: 0 ,// 止盈价格
-                    // SlPrice: 0 , // 止损价格
-                    PriceMode: PriceType.limit, // 取价方式
-                    TimevalidType: 1, // 时间有效类型 单日有效
-                    TriggerType: 1, // 预埋单触发类型
-                    // TriggerPrice: number // 预埋单触发价格
-                    ListingSelectType: 1, // 挂牌点选类型 1：挂牌 2：摘牌 3：先摘后挂
-                    DelistingType: DelistingType.selected, // 摘牌类型 2:点选成交
-                    // RelatedID: number // 关联单号
-                    OptionType: 1, // 期权类型(1:认购(看涨)2:认沽(看跌))
-                    // Premium: number // 权利金
-                    // TriggerOperator: number // 触发条件(1:大于等于2:小于等于)
-                    // ServiceTime: string // 服务端时间
-                    // CouponTypeID: number // 优惠券类型ID(买方)
-                    // UsedQty: number // 使用数量
-                    // ValidTime: string // 指定有效日期
-                    // ReceiveInfoID: number // 收货地址ID
-                    OrderFlag: 1,
-                };
-                requestResultLoadingAndInfo(Order, param, loading, ['挂牌成功', '挂牌失败:']).then(() => {
-                    cancel(true);
-                });
-            });
-        }
-        return {
-            visible,
-            cancel,
-            submit,
-            loading,
-            rules,
-            formState,
-            formRef,
-            getMoney,
-            getMax,
-        };
-    },
-});
-</script>
-
-<style lang="less" scoped>
-</style>;

src/views/order/swap_the_order/components/swap_commodity_contract_summary/components/commodity_contract_summary_transfer/interface.ts

@@ -1,5 +0,0 @@
-export interface FormState {
-    price: number,
-    num: number,
-    goodsid: number,
-}

src/views/order/swap_the_order/components/swap_commodity_contract_summary/components/commodity_contract_summary_transfer/setup.ts

@@ -1,26 +0,0 @@
-import { validateCommon } from "@/common/setup/validate";
-import { RuleObject } from "ant-design-vue/lib/form/interface";
-import { reactive, ref, UnwrapRef } from "vue";
-import { FormState } from "./interface";
-
-export function handleForm() {
-    const formRef = ref();
-    const formState: UnwrapRef<FormState> = reactive({
-        price: 0,
-        num: 0,
-        goodsid: 0,
-    })
-    const v_num = async (rule: RuleObject, value: number) => {
-        return validateCommon(value, '请输入挂牌价');
-    };
-    const rules = {
-        price: [
-            { require, trigger: 'blur', type: 'number', validator: v_num },
-        ],
-        num: [
-            { require, message: '请输入挂牌数量', trigger: 'blur', type: 'number' },
-            { message: '挂牌数量小于1', min: 1, type: 'number' }
-        ],
-    }
-    return { rules, formState, formRef }
-}

src/views/order/swap_the_order/components/swap_commodity_contract_summary/components/setup.ts

@@ -1,13 +1,12 @@
 import { BuyOrSell } from "@/common/constants/enumCommon";
 import { getQuoteDayInfoByCodeFindPrice } from "@/services/bus/goods";
-import { ref } from "vue";
-import { BargainList } from "./commodity_contract_summary_deal_closed/interface";
+import { QueryTradeHolderDetailRsp } from "@/services/go/order/interface";
 
 // 计算盈亏
 // 浮动盈亏	持仓单：
 // 收益权=(最新价-持仓价)*持仓数量*合约单位*方向(买[1]:卖[-1])(*汇率)
 // 所有权=(最新价*持仓数量*合约单位(*汇率) - 持仓金额)
-export function useProfit(item: BargainList, goodcode: string) {
+export function useProfit(item: QueryTradeHolderDetailRsp, goodcode: string) {
     // 最新价
     const lastPrice = getQuoteDayInfoByCodeFindPrice(goodcode);
     if (lastPrice && lastPrice !== '--') {
@@ -18,14 +17,3 @@ export function useProfit(item: BargainList, goodcode: string) {
         return lastPrice
     }
 }
-export function useCheckd() {
-    const checked = ref<string>();
-    const selected = ref<BargainList>()
-    function checkGroupChange(checkedValue: string[]) {
-        checked.value = checkedValue[checkedValue.length - 1];
-    }
-    function checkboxChange(item: BargainList) {
-        selected.value = item;
-    }
-    return { checked, selected, checkGroupChange, checkboxChange }
-}

src/views/order/swap_the_order/components/swap_commodity_contract_summary/components/commodity_contract_summary_deal_closed/index.vue → src/views/order/swap_the_order/components/swap_commodity_contract_summary/components/swap_commodity_contract_summary_deal_closed/index.vue

@@ -20,33 +20,24 @@
               <div class="middle">数量/价格/金额</div>
               <div class="right">到期日/盈亏</div>
             </div>
-            <a-checkbox-group class="commonCheckboxGroup"
-                              v-model:value="checked"
-                              @change="checkGroupChange">
-              <div class="lineBar"
-                   v-for="item in tableList"
-                   :key="item.tradeid">
+
+              <div class="lineBar">
                 <div class="line1">
-                  <div class>
-                    <a-checkbox @change="checkboxChange(item)"
-                                :value="item.tradeid"></a-checkbox>
-                  </div>
-                  <div class="name">{{ item.tradeid }}
+                  <div class="name">{{ selectedRow.tradeid }}
                   </div>
-                  <div class="date">{{formatTime(item.expiredate, 'd')}}</div>
+                  <div class="date">{{formatTime(selectedRow.expiredate, 'd')}}</div>
                 </div>
                 <div class="line2">
-                  <div class="left">{{item.buyorsell === BuyOrSell.buy ? '买入' : '卖出'}}</div>
+                  <div class="left">{{selectedRow.buyorsell === BuyOrSell.buy ? '买入' : '卖出'}}</div>
                   <div class="middle">
-                    <div>{{item.holderqty}}</div>
-                    <div>{{item.holderprice}}</div>
-                    <div>{{item.holderamount}}</div>
+                    <div>{{selectedRow.holderqty}}</div>
+                    <div>{{selectedRow.holderprice}}</div>
+                    <div>{{selectedRow.holderamount}}</div>
                   </div>
                   <div class="right red">
-                    {{useProfit(item, goodscode)}}</div>
+                    {{useProfit(selectedRow, goodscode)}}</div>
                 </div>
               </div>
-            </a-checkbox-group>
           </div>
         </div>
         <div class="fixedBtns">
@@ -89,42 +80,32 @@
 import Drawer from '@/common/components/drawer/index.vue';
 import UploadImg from '@/common/components/uploadImg/index.vue';
 import { BuyOrSell } from '@/common/constants/enumCommon';
-import { ModalEnum } from '@/common/constants/modalNameEnum';
+import { formatTime } from '@/common/methods';
 import { requestResultLoadingAndInfo } from '@/common/methods/request/resultInfo';
 import { validateAction } from '@/common/setup/form';
 import { _closeModal } from '@/common/setup/modal/modal';
-import { queryTableList } from '@/common/setup/table';
-import { getUserId } from '@/services/bus/account';
 import { geLoginID_number } from '@/services/bus/login';
-import { QueryTradePositionRsp } from '@/services/go/ermcp/order/interface';
-import { queryTradeHolderDetail } from '@/services/go/order';
-import { QueryTradeHolderDetailReq } from '@/services/go/order/interface';
+import { QueryTradeHolderDetailRsp } from '@/services/go/order/interface';
+import { QueryQuoteGoodsListRsp } from '@/services/go/Tjmd/interface';
 import { tradeHoldTransferApply } from '@/services/proto/warehousetrade';
 import { TradeHoldTransferApplyReq } from '@/services/proto/warehousetrade/interface';
 import { MinusOutlined, PlusOutlined } from '@ant-design/icons-vue';
-import { message } from 'ant-design-vue';
 import Long from 'long';
-import { defineComponent, PropType } from 'vue';
-import { BargainList, FormState } from './interface';
-import { handleForm, usePrice } from './setup';
-import { formatTime } from '@/common/methods';
-import { useProfit, useCheckd } from '../setup';
-import { QueryQuoteGoodsListRsp } from '@/services/go/Tjmd/interface';
+import { defineComponent, PropType, ref } from 'vue';
 import { findGoodsCode } from '../../setup';
+import { useProfit } from '../setup';
+import { FormState } from './interface';
+import { handleForm, usePrice } from './setup';
 
 export default defineComponent({
-    name: ModalEnum.commodity_contract_summary_settlement,
+    name: 'swap_commodity_contract_summary_deal_closed',
     components: { Drawer, UploadImg, PlusOutlined, MinusOutlined },
     emits: ['cancel', 'update'],
     props: {
         selectedRow: {
-            type: Object as PropType<QueryTradePositionRsp>,
+            type: Object as PropType<QueryTradeHolderDetailRsp>,
             default: {},
         },
-        buyOrSell: {
-            type: Number as PropType<BuyOrSell>,
-            default: BuyOrSell.buy,
-        },
         swapList: {
             type: Array as PropType<QueryQuoteGoodsListRsp[]>,
             default: [],
@@ -134,50 +115,25 @@ export default defineComponent({
         const { visible, cancel } = _closeModal(context);
         const { rules, formState, formRef } = handleForm();
         const goodscode = findGoodsCode(props.selectedRow.goodsid, props.selectedRow.goodscode, props.swapList);
+        const loading = ref<boolean>(false);
 
-        // 选中逻辑
-        const { checked, selected, checkGroupChange, checkboxChange } = useCheckd();
-
-        // 表格列表数据
-        const { loading, tableList, queryTable } = queryTableList<BargainList>();
-        const param: QueryTradeHolderDetailReq = {
-            buyorsell: props.selectedRow.buyorsell,
-            userid: getUserId(),
-            goodsid: props.selectedRow.goodsid,
-        };
         // 平仓金额
         function getMoney() {
             let result = '--';
-            if (selected.value && formState.price) {
-                const { holderqty, agreeunit, decimalplace } = selected.value;
+            if (formState.price) {
+                const { holderqty, agreeunit, decimalplace } = props.selectedRow;
                 result = (+formState.price * holderqty * agreeunit).toFixed(decimalplace);
             }
             return result;
         }
-        queryTable(queryTradeHolderDetail, param).then((res) => {
-            tableList.value = res.map((e, i) => {
-                if (i === 0) {
-                    checked.value = e.tradeid;
-                    const result = { ...e, checked: true };
-                    selected.value = result;
-                    return result;
-                } else {
-                    return { ...e, checked: false };
-                }
-            });
-        });
 
         const toFixed0 = (value: number) => +value.toFixed(0);
 
         function submit() {
-            if (!selected.value) {
-                message.warn('请选择持仓');
-                return;
-            }
             validateAction<FormState>(formRef, formState).then((res) => {
                 const param: TradeHoldTransferApplyReq = {
-                    TradeID: Long.fromString(selected.value!.tradeid),
-                    BuyorSell: selected.value!.buyorsell,
+                    TradeID: Long.fromString(props.selectedRow.tradeid),
+                    BuyorSell: props.selectedRow.buyorsell,
                     TransferPrice: res.price,
                     ApplySrc: 2,
                     ApplicantID: geLoginID_number()!,
@@ -192,16 +148,12 @@ export default defineComponent({
             visible,
             cancel,
             submit,
-            tableList,
             loading,
             toFixed0,
             rules,
             formState,
             formRef,
             ...usePrice(formState),
-            checked,
-            checkGroupChange,
-            checkboxChange,
             BuyOrSell,
             formatTime,
             useProfit,

src/views/order/swap_the_order/components/swap_commodity_contract_summary/components/commodity_contract_summary_order_closed/index.vue → src/views/order/swap_the_order/components/swap_commodity_contract_summary/components/swap_commodity_contract_summary_order_closed/index.vue

@@ -20,37 +20,26 @@
               <div class="middle">数量/价格/金额</div>
               <div class="right">到期日/盈亏</div>
             </div>
-            <a-checkbox-group class="commonCheckboxGroup"
-                              v-model:value="checked"
-                              @change="checkGroupChange">
-              <div class="lineBar"
-                   v-for="item in tableList"
-                   :key="item.tradeid">
+              <div class="lineBar">
                 <div class="line1">
-                  <div class>
-                    <a-checkbox @change="checkboxChange(item)"
-                                :disabled="item.holderdays"
-                                :value="item.tradeid"></a-checkbox>
-                  </div>
-                  <div class="name">{{ item.tradeid }}
-                    <template v-if="item.holderdays">
-                      <span class="red">{{item.holderdays}}</span>天后可平
+                  <div class="name">{{ selectedRow.tradeid }}
+                    <template v-if="selectedRow.holderdays">
+                      <span class="red">{{selectedRow.holderdays}}</span>天后可平
                     </template>
                   </div>
-                  <div class="date">{{ formatTime(item.expiredate, 'd') }}</div>
+                  <div class="date">{{ formatTime(selectedRow.expiredate, 'd') }}</div>
                 </div>
                 <div class="line2">
-                  <div class="left">{{ item.buyorsell === BuyOrSell.buy ? '买入' : '卖出' }}</div>
+                  <div class="left">{{ selectedRow.buyorsell === BuyOrSell.buy ? '买入' : '卖出' }}</div>
                   <div class="middle">
-                    <div>{{ item.holderqty }}</div>
-                    <div>{{ item.holderprice }}</div>
-                    <div>{{ item.holderamount }}</div>
+                    <div>{{ selectedRow.holderqty }}</div>
+                    <div>{{ selectedRow.holderprice }}</div>
+                    <div>{{ selectedRow.holderamount }}</div>
                   </div>
                   <div class="right red">
-                    {{useProfit(item, goodscode)}}</div>
+                    {{useProfit(selectedRow, goodscode)}}</div>
                 </div>
               </div>
-            </a-checkbox-group>
           </div>
         </div>
         <div class="fixedBtns">
@@ -66,7 +55,7 @@
             <a-col :span="24">
               <a-form-item label="估算金额"
                            class="mb10 not-copy">
-                <span class="white">{{selected ? getMoney() : '--'}}</span>
+                <span class="white">{{ getMoney()}}</span>
               </a-form-item>
             </a-col>
           </a-row>
@@ -89,28 +78,24 @@ import Drawer from '@/common/components/drawer/index.vue';
 import UploadImg from '@/common/components/uploadImg/index.vue';
 import { BuyOrSell } from '@/common/constants/enumCommon';
 import { ModalEnum } from '@/common/constants/modalNameEnum';
+import { formatTime } from '@/common/methods';
 import { requestResultLoadingAndInfo } from '@/common/methods/request/resultInfo';
 import { validateAction } from '@/common/setup/form';
 import { _closeModal } from '@/common/setup/modal/modal';
-import { queryTableList } from '@/common/setup/table';
-import { getSelectedAccountId, getUserId } from '@/services/bus/account';
+import { getSelectedAccountId } from '@/services/bus/account';
+import { getQuoteDayInfoByCodeFindPrice } from '@/services/bus/goods';
 import { geLoginID_number } from '@/services/bus/login';
-import { QueryTradePositionRsp } from '@/services/go/ermcp/order/interface';
-import { queryTradeHolderDetail } from '@/services/go/order';
-import { QueryTradeHolderDetailReq } from '@/services/go/order/interface';
+import { QueryTradeHolderDetailRsp } from '@/services/go/order/interface';
+import { QueryQuoteGoodsListRsp } from '@/services/go/Tjmd/interface';
 import { holderClose } from '@/services/proto/warehousetrade';
 import { HolderCloseReq } from '@/services/proto/warehousetrade/interface';
 import { MinusOutlined, PlusOutlined } from '@ant-design/icons-vue';
-import { message } from 'ant-design-vue';
 import Long from 'long';
-import { defineComponent, PropType } from 'vue';
-import { BargainList, FormState } from './interface';
-import { handleForm, usePrice } from './setup';
-import { formatTime } from '@/common/methods';
-import { useProfit, useCheckd } from '../setup';
-import { QueryQuoteGoodsListRsp } from '@/services/go/Tjmd/interface';
+import { defineComponent, PropType, ref } from 'vue';
 import { findGoodsCode } from '../../setup';
-import { getQuoteDayInfoByCodeFindPrice } from '@/services/bus/goods';
+import { useProfit } from '../setup';
+import { FormState } from './interface';
+import { handleForm, usePrice } from './setup';
 
 export default defineComponent({
     name: ModalEnum.commodity_contract_summary_settlement,
@@ -118,13 +103,9 @@ export default defineComponent({
     emits: ['cancel', 'update'],
     props: {
         selectedRow: {
-            type: Object as PropType<QueryTradePositionRsp>,
+            type: Object as PropType<QueryTradeHolderDetailRsp>,
             default: {},
         },
-        buyOrSell: {
-            type: Number as PropType<BuyOrSell>,
-            default: BuyOrSell.buy,
-        },
         swapList: {
             type: Array as PropType<QueryQuoteGoodsListRsp[]>,
             default: [],
@@ -135,67 +116,29 @@ export default defineComponent({
 
         const { visible, cancel } = _closeModal(context);
         const { rules, formState, formRef } = handleForm();
-        // 选中逻辑
-        const { checked, selected, checkGroupChange, checkboxChange } = useCheckd();
-
-        // 表格列表数据
-        const { loading, tableList, queryTable } = queryTableList<BargainList>();
-        const param: QueryTradeHolderDetailReq = {
-            buyorsell: props.selectedRow.buyorsell,
-            userid: getUserId(),
-            goodsid: props.selectedRow.goodsid,
-        };
+        const loading = ref<boolean>(false);
         // 估算金额=估算价*平仓数量*合约单位。
         function getMoney() {
             let result = '--';
             const lastPrice = getQuoteDayInfoByCodeFindPrice(goodscode);
-            if (lastPrice && lastPrice !== '--' && selected.value) {
-                const { holderqty, agreeunit, decimalplace } = selected.value;
+            if (lastPrice && lastPrice !== '--') {
+                const { holderqty, agreeunit, decimalplace } = props.selectedRow;
                 result = (+lastPrice * holderqty * agreeunit).toFixed(decimalplace);
             }
             return result;
         }
 
-        queryTable(queryTradeHolderDetail, param).then((res) => {
-            let index = 0; // 默认勾选
-            tableList.value = res.map((e, i) => {
-                if (index === i) {
-                    if (e.holderdays === 0) {
-                        checked.value = e.tradeid;
-                        const result = { ...e, checked: true };
-                        selected.value = result;
-                        index = -1;
-                        return result;
-                    } else {
-                        index++;
-                        return { ...e, checked: false };
-                    }
-                } else {
-                    return { ...e, checked: false };
-                }
-            });
-        });
-
         const toFixed0 = (value: number) => +value.toFixed(0);
 
         function submit() {
-            if (!selected.value) {
-                message.warn('请选择持仓');
-                return;
-            }
             validateAction<FormState>(formRef, formState).then((res) => {
                 const param: HolderCloseReq = {
-                    TradeID: Long.fromString(selected.value!.tradeid),
-
-                    // ClientSerialNo: 'string', // string 客户端流水号
-                    // ClientOrderTime: 'string', // string 客户端委托时间
-                    // ClientType: 0, // uint32 终端类型
+                    TradeID: Long.fromString(props.selectedRow.tradeid),
                     LoginID: geLoginID_number()!, // uint64 登陆账号
                     AccountID: getSelectedAccountId(), // uint64 交易账号
-                    GoodsID: selected.value!.goodsid,
-                    MarketID: selected.value!.marketid, // uint32 市场ID
-                    BuyOrSell: selected.value!.buyorsell,
-                    // OrderSrc: 0, // uint32 单据来源
+                    GoodsID: props.selectedRow.goodsid,
+                    MarketID: props.selectedRow.marketid, // uint32 市场ID
+                    BuyOrSell: props.selectedRow.buyorsell,
                     OperatorID: geLoginID_number()!, // uint64 操作员账号ID
                 };
                 requestResultLoadingAndInfo(holderClose, param, loading, ['平仓成功', '平仓失败:']).then(() => {
@@ -207,23 +150,18 @@ export default defineComponent({
             visible,
             cancel,
             submit,
-            tableList,
             loading,
             toFixed0,
             rules,
             formState,
             formRef,
             ...usePrice(formState),
-            checked,
-            checkGroupChange,
-            checkboxChange,
             BuyOrSell,
             formatTime,
             useProfit,
             goodscode,
             getQuoteDayInfoByCodeFindPrice,
             getMoney,
-            selected,
         };
     },
 });

src/views/order/swap_the_order/components/swap_commodity_contract_summary/index.vue

@@ -1,24 +1,52 @@
 <template>
   <!-- 商品订单 - 合约汇总 -->
   <section>
-    <a-table :columns="tabColumns"
-             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="getTableColums()"
+      class="srcollYTableExpendBgColor 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="handleBtnList(record,btnList)"
-                 :record="record"
-                 class="btn-list-sticky"
-                 @click="openComponent" />
+      <template #expandedRowRender="{ record }">
+        <a-table
+          :columns="getDetailColums()"
+          class="expandBottomTable"
+          :pagination="false"
+          :loading="detailLoading"
+          :expandedRowKeys="expandedRowKeys"
+          :expandIcon="expandIcon"
+          :expandIconAsCell="false"
+          rowKey="key"
+          :data-source="detailTableList"
+        >
+          <template #operate="sub">
+            <BtnList
+              :btnList="handleBtnList(record, btnList)"
+              :record="sub.record"
+              class="btn-list-sticky"
+              @click="openComponent"
+            />
+          </template>
+          <!-- 持仓盈亏 -->
+          <template #profitloss="{ record }">
+            <span>{{ getDetailProfitloss(record) }}</span>
+          </template>
+          <!-- 市值 -->
+          <template #marketamount="{ record }">
+            <span>{{ getDetailMarketAmount(record) }}</span>
+          </template>
+          <template #expiredate="{ text }">
+            <span>{{ handleNoneValue(text) }}</span>
+          </template>
+        </a-table>
       </template>
       <template #createtime="{ record }">
         <a>{{ formatTime(record.createtime) }}</a>
@@ -29,7 +57,7 @@
       </template>
       <!-- 均价 -->
       <template #averageprice="{ text }">
-        <a>{{ handleNoneValue(text)}}</a>
+        <a>{{ handleNoneValue(text) }}</a>
       </template>
       <!-- 持仓盈亏 -->
       <template #profitloss="{ record }">
@@ -38,16 +66,18 @@
       <template #buyorsell="{ record }">
         <span>{{ getBuyOrSellName(record.buyorsell) }}</span>
       </template>
-      <template #marketamount="{ record, text }">
+      <!-- <template #marketamount="{ record, text }">
         <span>{{ isDiaoQi(record) ? '--' : text }}</span>
-      </template>
+      </template>-->
     </a-table>
-    <component :is="componentId"
-               v-if="componentId"
-               :selectedRow="selectedRow"
-               :tableList="tableList"
-               :swapList="swapList"
-               @cancel="closeComponent"></component>
+    <component
+      :is="componentId"
+      v-if="componentId"
+      :selectedRow="selectedRow"
+      :tableList="tableList"
+      :swapList="swapList"
+      @cancel="closeComponent"
+    ></component>
   </section>
 </template>
 
@@ -55,112 +85,104 @@
 import { BtnListType } from '@/common/components/btnList/interface';
 import { TradeMode } from '@/common/constants/enumCommon';
 import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
-import { BtnList, defineAsyncComponent, defineComponent, ModalEnum, queryTableList } from '@/common/export/commonTable';
+import { getBuyOrSellName } from '@/common/constants/enumsName';
+import { BtnList, defineAsyncComponent, defineComponent, queryTableList } from '@/common/export/commonTable';
 import { formatTime } from '@/common/methods';
 import { handleDeliveryRelation } from '@/common/setup/deliveryRelation';
 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 { handleSubcriteQuote } from '@/common/setup/table/tableQuote';
-import { findGoodsTradeModeById, getQuoteDayInfoByCodeFindPrice, getQutoGoodsByTradeMode } from '@/services/bus/goods';
-import { useHolderprice, useProfitloss } from '@/services/bus/holdPosition';
+import { handleNoneValue, handleSubcriteQuote } from '@/common/setup/table/tableQuote';
+import { getQuoteDayInfoByCodeFindPrice } from '@/services/bus/goods';
+import { useProfitloss, useHolderprice } from '@/services/bus/holdPosition';
 import { queryTradePosition } from '@/services/go/ermcp/order';
 import { QueryTradePositionRsp } from '@/services/go/ermcp/order/interface';
-import { getBuyOrSellName, getChannelBuildName } from '@/common/constants/enumsName';
-import { isInvestment } from '@/views/market/spot_trade/spot_trade_order_transaction/spot_trade_order_transaction_swap/components/setup';
-import { useIsDiaoQi, findGoodsCode } from './setup';
-// import { getSwapList } from '@/views/market/spot_trade/spot_trade_order_transaction/spot_trade_order_transaction_swap/setup';
-import { ref } from 'vue';
 import { QueryQuoteGoodsListRsp } from '@/services/go/Tjmd/interface';
 import Bus from '@/utils/eventBus/index';
-import { tabColumns, getSwapList } from './setup';
-import { handleNoneValue } from '@/common/setup/table/tableQuote';
+import { isInvestment } from '@/views/market/spot_trade/spot_trade_order_transaction/spot_trade_order_transaction_swap/components/setup';
+import { ref } from 'vue';
+import { findGoodsCode, getSwapList, getTableColums, useDetail } from './setup';
 
 export default defineComponent({
-    name: enumOrderComponents.commodity_contract_summary,
-    components: {
-        BtnList,
-        [ModalEnum.commodity_contract_summary_settlement]: defineAsyncComponent(() => import('./components/commodity_contract_summary_settlement/index.vue')),
-        [ModalEnum.commodity_contract_summary_transfer]: defineAsyncComponent(() => import('./components/commodity_contract_summary_transfer/index.vue')),
-        commodity_contract_summary_deal_closed: defineAsyncComponent(() => import('./components/commodity_contract_summary_deal_closed/index.vue')),
-        commodity_contract_summary_order_closed: defineAsyncComponent(() => import('./components/commodity_contract_summary_order_closed/index.vue')),
-    },
-    setup() {
-        // 表格列表数据
-        const { loading, tableList, queryTable } = queryTableList<QueryTradePositionRsp>();
-        const { subscribeAction } = handleSubcriteQuote();
-        // 交割商品
-        handleDeliveryRelation();
-        const swapList = ref<QueryQuoteGoodsListRsp[]>([]);
-        // 挂牌点选商品
-        //         const { deliverGoods, getQuoteList, goodsList, } = handleDeliveryRelation([1, 3]);
-        //         // 参考行情商品
-        // const goodsList = getQutoGoodsByTradeMode(TradeMode.quote99);
+  name: enumOrderComponents.commodity_contract_summary,
+  components: {
+    BtnList,
+    swap_commodity_contract_summary_deal_closed: defineAsyncComponent(() => import('./components/swap_commodity_contract_summary_deal_closed/index.vue')), // 协议平仓
+    swap_commodity_contract_summary_order_closed: defineAsyncComponent(() => import('./components/swap_commodity_contract_summary_order_closed/index.vue')), // 平仓
+  },
+  setup() {
+    // 表格列表数据
+    const { loading, tableList, queryTable } = queryTableList<QueryTradePositionRsp>();
+    const { subscribeAction } = handleSubcriteQuote();
+    // 交割商品
+    handleDeliveryRelation();
+    const swapList = ref<QueryQuoteGoodsListRsp[]>([]);
+
+    // 获取列表数据
+    const queryTableAction = () => {
+      Promise.all([queryTable(queryTradePosition, TradeMode.DiaoQi.toString()), getSwapList()]).then((res) => {
+        swapList.value = res[1];
+        tableList.value = res[0];
+        const goodsSet = new Set<string>();
+        res[0].forEach((el) => {
+          // 商品掉期取参考行情最新价，挂牌点选取自己行情的最新价
+          const goodscode = findGoodsCode(el.goodsid, el.goodscode, swapList.value);
+          if (goodscode) {
+            goodsSet.add(goodscode);
+          }
+        });
+        //  行情订阅
+        subscribeAction([...goodsSet]);
+      });
+    };
+    Bus.$on('spotTrade', queryTableAction);
+    // 明细 逻辑
+    const { getTradeHolderDetail, detailLoading, getDetailColums, detailTableList, getDetailProfitloss, getDetailMarketAmount } = useDetail();
+    // 表格通用逻辑
+    const param: ComposeOrderTableParam = {
+      queryFn: queryTableAction,
+      tableName: 'table_pcweb_spot_trade_bottom_commodity_contract_summary',
+      recordList: getRecordItemTab(),
+      clickCB: getTradeHolderDetail,
+    };
+
+    // 现价
+    function getLastprice(record: QueryTradePositionRsp) {
+      let result: number | string = '--';
+      const goodscode = findGoodsCode(record.goodsid, record.goodscode, swapList.value);
+      if (goodscode) {
+        result = getQuoteDayInfoByCodeFindPrice(goodscode);
+      }
+      return result;
+    }
 
-        // 获取列表数据
-        const queryTableAction = () => {
-            Promise.all([queryTable(queryTradePosition), getSwapList()]).then((res) => {
-                swapList.value = res[1];
-                tableList.value = res[0];
-                const goodsSet = new Set<string>();
-                res[0].forEach((el) => {
-                    // 商品掉期取参考行情最新价，挂牌点选取自己行情的最新价
-                    const goodscode = findGoodsCode(el.goodsid, el.goodscode, swapList.value);
-                    if (goodscode) {
-                        goodsSet.add(goodscode);
-                    }
-                });
-                //  行情订阅
-                subscribeAction([...goodsSet]);
-            });
-        };
-        Bus.$on('spotTrade', queryTableAction);
-        // 表格通用逻辑
-        const param: ComposeOrderTableParam = {
-            queryFn: queryTableAction,
-            tableName: 'table_pcweb_spot_trade_bottom_commodity_contract_summary',
-            recordList: getRecordItemTab(),
-        };
-        // 现价
-        function getLastprice(record: QueryTradePositionRsp) {
-            let result: number | string = '--';
-            const goodscode = findGoodsCode(record.goodsid, record.goodscode, swapList.value);
-            if (goodscode) {
-                result = getQuoteDayInfoByCodeFindPrice(goodscode);
-            }
-            return result;
-        }
-        function isDiaoQi(record: QueryTradePositionRsp) {
-            return findGoodsTradeModeById(record.goodsid) === TradeMode.DiaoQi;
-        }
-        function handleBtnList(record: QueryTradePositionRsp, btnList: BtnListType[]) {
-            // 挂牌点选
-            const listing = ['commodity_contract_summary_transfer', 'commodity_contract_summary_settlement'];
-            // 贸易圈
-            // 只有机构 才有平仓
-            const diaoqi = isInvestment() ? ['commodity_contract_summary_deal_closed', 'commodity_contract_summary_order_closed'] : ['commodity_contract_summary_deal_closed'];
-            const arr = isDiaoQi(record) ? diaoqi : listing;
-            return btnList.filter((e) => arr.includes(e.code));
-        }
-        return {
-            ...handleComposeOrderTable<QueryTradePositionRsp>(param),
-            loading,
-            tableList,
-            formatTime,
-            expandIcon,
-            getLastprice,
-            useHolderprice,
-            useProfitloss,
-            handleBtnList,
-            tabColumns,
-            getBuyOrSellName,
-            swapList,
-            findGoodsCode,
-            isDiaoQi,
-            handleNoneValue,
-        };
-    },
+    function handleBtnList(record: QueryTradePositionRsp, btnList: BtnListType[]) {
+      // 贸易圈
+      // 只有机构 才有平仓
+      const diaoqi = isInvestment() ? ['swap_commodity_contract_summary_deal_closed', 'swap_commodity_contract_summary_order_closed'] : ['swap_commodity_contract_summary_deal_closed'];
+      return btnList.filter((e) => diaoqi.includes(e.code));
+    }
+    return {
+      ...handleComposeOrderTable<QueryTradePositionRsp>(param),
+      loading,
+      tableList,
+      formatTime,
+      expandIcon,
+      getLastprice,
+      useProfitloss,
+      useHolderprice,
+      handleBtnList,
+      getTableColums,
+      getBuyOrSellName,
+      swapList,
+      handleNoneValue,
+      detailLoading,
+      getDetailColums,
+      detailTableList,
+      getDetailProfitloss, getDetailMarketAmount
+    };
+  },
 });
 </script>
 

src/views/order/swap_the_order/components/swap_commodity_contract_summary/setup.ts

@@ -1,12 +1,19 @@
 // 获取最新价
 
-import { TradeMode } from "@/common/constants/enumCommon";
+import { BuyOrSell, TradeMode } from "@/common/constants/enumCommon";
+import { queryResultLoadingAndInfo } from "@/common/methods/request/resultInfo";
 import { queryTableList } from "@/common/setup/table";
-import { findGoodsTradeModeById } from "@/services/bus/goods";
+import { useSetColumns } from "@/hooks/table/columns";
+import { ItemColumns } from "@/hooks/table/interface";
+import { findGoodsTradeModeById, getQuoteDayInfoByCodeFindPrice } from "@/services/bus/goods";
 import { getMarketIdsByTradeMode } from "@/services/bus/market";
-import { getUserAccountType } from "@/services/bus/user";
+import { getUserAccountType, getUsrId } from "@/services/bus/user";
+import { QueryTradePositionRsp } from "@/services/go/ermcp/order/interface";
+import { queryTradeHolderDetail } from "@/services/go/order";
+import { QueryTradeHolderDetailReq, QueryTradeHolderDetailRsp } from "@/services/go/order/interface";
 import { queryQuoteGoodsList } from "@/services/go/Tjmd";
 import { QueryQuoteGoodsListReq, QueryQuoteGoodsListRsp } from "@/services/go/Tjmd/interface";
+import { ref } from "vue";
 
 export const useIsDiaoQi = (goodsid: number) => {
     return findGoodsTradeModeById(goodsid) === TradeMode.DiaoQi
@@ -32,115 +39,90 @@ export function getSwapList() {
     return queryTable(queryQuoteGoodsList, param)
 }
 
-export const tabColumns = [
-    {
-        key: '10th',
-        dataIndex: 'goodsname',
-        title: '订单合约',
-        align: 'center',
-        slots: {
-            customRender: 'goodsname',
-        },
-        width: 120,
-    },
-    {
-        key: '7th',
-        dataIndex: 'buyorsell',
-        title: '方向',
-        align: 'center',
-        slots: {
-            customRender: 'buyorsell',
-        },
-        width: 120,
-    },
-    {
-        key: '8th',
-        dataIndex: 'curpositionqty',
-        title: '持有数量',
-        align: 'center',
-        slots: {
-            customRender: 'curpositionqty',
-        },
-        width: 120,
-    },
-    {
-        key: '9th',
-        dataIndex: 'enableqty',
-        title: '可用数量',
-        align: 'center',
-        slots: {
-            customRender: 'enableqty',
-        },
-        width: 120,
-    },
-    {
-        key: '0th',
-        dataIndex: 'frozenqty',
-        title: '冻结数量',
-        align: 'center',
-        slots: {
-            customRender: 'frozenqty',
-        },
-        width: 120,
-    },
-    {
-        key: '1th',
-        dataIndex: 'averageprice',
-        title: '均价',
-        align: 'center',
-        slots: {
-            customRender: 'averageprice',
-        },
-        width: 120,
-    },
-    {
-        key: '2th',
-        dataIndex: 'lastprice',
-        title: '现价',
-        align: 'center',
-        slots: {
-            customRender: 'lastprice',
-        },
-        width: 120,
-    },
-    {
-        key: '3th',
-        dataIndex: 'curholderamount',
-        title: '持仓金额',
-        align: 'center',
-        slots: {
-            customRender: 'curholderamount',
-        },
-        width: 120,
-    },
-    // {
-    //     key: '4th',
-    //     dataIndex: 'usedmargin',
-    //     title: '占用保证金',
-    //     align: 'center',
-    //     slots: {
-    //         customRender: 'usedmargin',
-    //     },
-    //     width: 130,
-    // },
-    {
-        key: '5th',
-        dataIndex: 'marketamount',
-        title: '市值',
-        align: 'center',
-        slots: {
-            customRender: 'marketamount',
-        },
-        width: 120,
-    },
-    {
-        key: '6th',
-        dataIndex: 'profitloss',
-        title: '浮动盈亏',
-        align: 'center',
-        slots: {
-            customRender: 'profitloss',
-        },
-        width: 120,
-    },
-];
+export function getTableColums() {
+    const list: ItemColumns[] = [
+        { key: 'goodsname', title: '订单合约' },
+        { key: 'buyorsell', title: '方向' },
+        { key: 'curpositionqty', title: '持有数量' },
+        { key: 'enableqty', title: '可用数量' },
+        { key: 'frozenqty', title: '冻结数量' },
+        { key: 'averageprice', title: '均价' },
+        { key: 'lastprice', title: '现价' },
+        { key: 'curholderamount', title: '持仓金额' },
+        { key: 'marketamount', title: '市值' },
+        { key: 'profitloss', title: '浮动盈亏' },
+    ]
+    return useSetColumns(list)
+}
+
+// 明细
+export const useDetail = () => {
+    // 详情列表数据
+    const detailTableList = ref<QueryTradeHolderDetailRsp[]>([])
+    // 详情 loading
+    const detailLoading = ref<boolean>(false)
+    // 获取明细
+    function getTradeHolderDetail({ accountid, trademode, marketid, goodsid, buyorsell }: QueryTradePositionRsp) {
+        const param: QueryTradeHolderDetailReq = {
+            userid: getUsrId(),
+            accids: accountid.toString(),
+            trademodes: trademode.toString(),
+            marketids: marketid.toString(),
+            goodsid,
+            buyorsell,
+        }
+        queryResultLoadingAndInfo(queryTradeHolderDetail, detailLoading, param).then(res => {
+            detailTableList.value = res
+        })
+    }
+
+    // 表头
+    function getDetailColums() {
+        const list: ItemColumns[] = [
+            { key: 'tradetime', title: '建仓时间', width: 140 },
+            { key: 'expiredate', title: '到期日' },
+            { key: 'openqty', title: '建仓数量' },
+            { key: 'holderqty', title: '可用数量' },
+            { key: 'freezeqty', title: '冻结数量' },
+            { key: 'openprice', title: '建仓价' },
+            { key: 'tradeid', title: '持仓单号', width: 160 },
+            { key: 'holderamount', title: '建仓金额' },
+            { key: 'marketamount', title: '市值' },
+            { key: 'profitloss', title: '浮动盈亏' },
+            { key: 'operate', title: '操作' },
+        ]
+        return useSetColumns(list)
+    }
+
+    // 计算 明细列表里 具体一条数据的 市值
+    // 市值(所有权) = 数量 * 现价 * 合约单位
+    function getDetailMarketAmount(record: QueryTradeHolderDetailRsp) {
+        // 最新价
+        const lastPrice = getQuoteDayInfoByCodeFindPrice(record.goodscode);
+        if (lastPrice !== '--') {
+            const { decimalplace, agreeunit, holderqty } = record;
+            return (+lastPrice * holderqty * agreeunit).toFixed(decimalplace);
+        } else {
+            return lastPrice
+        }
+    }
+    // 计算 明细列表里 具体一条数据的 浮动盈亏
+    // 持仓盈亏
+    // 浮动盈亏	持仓单：
+    // 收益权=(最新价-持仓价)*持仓数量*合约单位*方向(买[1]:卖[-1])(*汇率)
+    // 所有权=(最新价*持仓数量*合约单位(*汇率) - 持仓金额)
+    function getDetailProfitloss(record: QueryTradeHolderDetailRsp) {
+        // 最新价
+        const lastPrice = getQuoteDayInfoByCodeFindPrice(record.goodscode);
+        if (lastPrice !== '--') {
+            const { holderprice, decimalplace, agreeunit, holderqty, buyorsell } = record;
+            const temp = buyorsell === BuyOrSell.buy ? 1 : -1
+            const result = ((+lastPrice - holderprice) * holderqty * agreeunit * temp).toFixed(decimalplace);
+            return result === '-0' ? '0' : result
+        } else {
+            return lastPrice;
+        }
+    }
+
+    return { getTradeHolderDetail, detailLoading, getDetailColums, detailTableList, getDetailProfitloss, getDetailMarketAmount }
+}

src/views/order/swap_the_order/index.vue

@@ -9,8 +9,6 @@
       <!-- 议价单 -->
       <div class="goods-apply"
            v-if="componentId === BARGIN">
-        <!-- <span @click="changeBargain(ApplyType.my)">我的议价</span>
-                <span @click="changeBargain(ApplyType.counterpart)">对方议价</span>-->
         <a-radio-group class="conditionCommonRadioGroup"
                        v-model:value="bargainValue">
           <a-radio @focus="changeBargain(ApplyType.my)"