<template>
  <!-- 成交明细  -->
  <a-row>
    <a-col :span="8">
      <a-table :columns="columnsList"
               class="srcollYTable"
               :pagination="false"
               :loading="loading"
               rowKey="key"
               ref="tableRef"
               :data-source="tableList[0]">
      </a-table>
    </a-col>
    <a-col :span="8">
      <a-table :columns="columnsList"
               class="srcollYTable"
               :pagination="false"
               :loading="loading"
               rowKey="key"
               ref="tableRef"
               :data-source="tableList[1]">
      </a-table>
    </a-col>
    <a-col :span="8">
      <a-table :columns="columnsList"
               class="srcollYTable"
               :pagination="false"
               :loading="loading"
               rowKey="key"
               ref="tableRef"
               :data-source="tableList[2]">
      </a-table>
    </a-col>
  </a-row>
</template>

<script lang="ts">
import { defineAsyncComponent, defineComponent } from '@/common/export/commonTable';
import { _closeModal } from '@/common/setup/modal/modal';
import { PropType, ref } from 'vue';

import { QueryHistoryTikDatasRsp, QueryQuoteDayRsp } from '@/services/go/quote/interface';
import { QueryDeliveryRelationRsp } from '@/services/go/delivery/interface';
import { QueryHistoryTikDatas } from '@/services/go/quote';
import { formatTime } from '@/common/methods';

const columnsList = [
    { title: '时间', key: 'TS', dataIndex: 'TS', align: 'center' },
    { title: '成交价', key: 'Vol', dataIndex: 'Vol', align: 'center' },
    { title: '成交量', key: 'PE', dataIndex: 'PE', align: 'center' },
];

export default defineComponent({
    emits: ['cancel', 'update'],
    name: 'stock-exchange',
    props: {
        selectedRow: {
            type: Object as PropType<QueryQuoteDayRsp>,
            default: {},
        },
    },

    setup(props, context) {
        const loading = ref<boolean>(false);
        const { visible, cancel } = _closeModal(context);
        const param = {
            goodsCode: props.selectedRow.goodscode,
        };
        const tableList = ref<QueryHistoryTikDatasRsp[][]>([]);
        QueryHistoryTikDatas(param).then((res) => {
            res.forEach((el) => (el.TS = formatTime(el.TS)));
            tableList.value = getHisList(res);
        });
        function getHisList(list: QueryHistoryTikDatasRsp[]) {
            const len = list.length;
            const result: QueryHistoryTikDatasRsp[][] = [[], [], []];
            if (len) {
                if (len === 1) {
                    result[0] = list;
                } else if (len === 2) {
                    result[0].push(list[0]);
                    result[1].push(list[1]);
                } else {
                    const temp = Math.floor(len / 3);
                    result[0] = list.slice(0, temp);
                    result[1] = list.slice(temp, 2 * temp);
                    result[2] = list.slice(temp * 2, temp * 3);
                    const last = len - temp;
                    if (last) {
                        if (last === 1) {
                            result[0].push(list[len - 1]);
                        } else {
                            result[0].push(list[len - 2]);
                            result[1].push(list[len - 1]);
                        }
                    }
                }
            }
            return result;
        }
        return {
            cancel,
            visible,
            tableList,
            columnsList,
            loading,
        };
    },
});
</script>
<style lang="less">
</style>