<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="(record,index)=>index" :data-source="tableList">
      <!-- 额外的展开行 -->
      <template v-if="btnList.length" #expandedRowRender="{ record }">
        <BtnList :btnList="handleBtnList(record,btnList)" :record="record" class="btn-list-sticky" @click="openComponent" />
      </template>
      <template #createtime="{ record }">
        <a>{{ formatTime(record.createtime) }}</a>
      </template>
      <!-- 现价 -->
      <template #lastprice="{ record }">
        <a>{{ getLastprice(record) }}</a>
      </template>
      <!-- 均价 -->
      <template #averageprice="{ text }">
        <a>{{ text ? text : 0 }}</a>
      </template>
      <!-- 持仓金额  -->
      <!-- <template #holderprice="{ record }">
        <a>{{ useHolderprice(record) }}</a>
      </template> -->
      <!-- 持仓盈亏 -->
      <template #profitloss="{ record }">
        <span>{{ record.averageprice ? useProfitloss(record) : '--' }}</span>
      </template>
      <template #buyorsell="{ record }">
        <span>{{ getBuyOrSellName(record.buyorsell) }}</span>
      </template>
    </a-table>
    <component :is="componentId" v-if="componentId" :selectedRow="selectedRow" :tableList="tableList" @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 { BtnList, defineAsyncComponent, defineComponent, ModalEnum, 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 { queryTradePosition } from '@/services/go/ermcp/order';
import { QueryTradePositionRsp } from '@/services/go/ermcp/order/interface';
import { getBuyOrSellName, getChannelBuildName } from '@/common/constants/enumsName';

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 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 { deliverGoods, getQuoteList, goodsList, } = handleDeliveryRelation([1, 3]);
    //         // 参考行情商品
    // const goodsList = getQutoGoodsByTradeMode(TradeMode.quote99);
    // 获取列表数据
    const queryTableAction = () => {
      queryTable(queryTradePosition).then((res) => {
        const result: string[] = [];
        res.forEach((el) => { });
        const goodsList = res.map((el) => {
          return el.goodscode;
        });
        //  行情订阅
        subscribeAction(goodsList);
      });
    };
    // 表格通用逻辑
    const param: ComposeOrderTableParam = {
      queryFn: queryTableAction,
      tableName: 'table_pcweb_spot_trade_bottom_commodity_contract_summary',
      recordList: getRecordItemTab(),
    };
    // 现价
    function getLastprice({ goodscode, decimalplace }: QueryTradePositionRsp) {
      const lastPrice = getQuoteDayInfoByCodeFindPrice(goodscode);
      return lastPrice === '--' ? lastPrice : Number(lastPrice).toFixed(decimalplace);
    }

    function handleBtnList(record: QueryTradePositionRsp, btnList: BtnListType[]) {
      // 挂牌点选
      const listing = ['commodity_contract_summary_transfer', 'commodity_contract_summary_settlement'];
      // 贸易圈
      const diaoqi = ['commodity_contract_summary_deal_closed', 'commodity_contract_summary_order_closed'];
      const arr = findGoodsTradeModeById(record.goodsid) === TradeMode.DiaoQi ? diaoqi : listing;
      return btnList.filter((e) => arr.includes(e.code));
    }
    return {
      ...handleComposeOrderTable<QueryTradePositionRsp>(param),
      loading,
      tableList,
      formatTime,
      expandIcon,
      getLastprice,
      useHolderprice,
      useProfitloss,
      handleBtnList,
      tabColumns,
      getBuyOrSellName,
    };
  },
});
</script>