<template>
    <!-- 现货贸易 - 买卖大厅 - 买报价牌 -->
    <a-table
        :columns="handleColumn(columns)"
        :class="['sellHallTable', isBottom ? '' : 'sellHallTableHigh', tableList.length ? '' : 'noDataTable']"
        :scroll="{ x: '100%', y: isBottom ? 'calc(100vh- 378px)' : 'calc(100vh - 135px)' }"
        :pagination="false"
        :loading="loading"
        :expandedRowKeys="expandedRowKeys"
        :customRow="Rowclick"
        :expandIcon="expandIcon"
        :expandIconAsCell="false"
        rowKey="key"
        :data-source="tableList"
    >
        <!-- 额外的展开行 -->
        <template #expandedRowRender="{ record }">
            <BtnList :btnList="btnList" :record="record" @click="openComponent" />
        </template>
        <template #username="{text, record }">
            <span>{{record.userid + " " }}{{text}}</span>
        </template>
    </a-table>
    <component
        :is="componentId"
        v-if="componentId"
        :selectedRow="selectedRow"
        :enumName="enumName"
        :buyOrSell="BuyOrSell.sell"
        :parantSelectedRow="parantSelectedRow"
        @cancel="closeComponent"
    ></component>
</template>

<script lang="ts">
import { EnumRouterName } from '@/common/constants/enumRouterName';
import { ComposeTableParam, BtnList, defineComponent, handleComposeTable, queryTableList, ModalEnum } from '@/common/export/commonTable';
import { _closeModal } from '@/common/setup/modal/modal';
import { queryOrderQuoteDetail } from '@/services/go/wrtrade';
import { QueryOrderQuoteDetailReq, WrOrderQuote, WrOrderQuoteDetail } from '@/services/go/wrtrade/interface';
import { defineAsyncComponent, PropType } from 'vue';
import { BtnListType } from '@/common/components/btnList/interface';
import { getSellMarketParam } from '../../setup';
import { BuyOrSell } from '@/common/constants/enumCommon';
import { expandIcon } from '@/common/setup/table/clolumn';
import { ColumnType } from '@/common/methods/table/interface';
import { Moment } from 'moment';
import moment from 'moment';
import { getShowBottomValue } from '@/common/config/constrolBottom';

export default defineComponent({
    emits: ['cancel', 'openComponent'],
    name: 'warehouse_receipt_trade_price_delisting_sell',
    props: {
        enumName: {
            default: '',
            type: String as PropType<EnumRouterName>,
        },
        btnList: {
            default: [],
            type: Array as PropType<BtnListType[]>,
        },
        parantSelectedRow: {
            type: Object as PropType<WrOrderQuote>,
            default: {},
        },
        time: {
            type: Object as PropType<Moment>,
            default: moment(),
        },
    },
    components: {
        BtnList,
        [ModalEnum.spot_trade_warehouse_delisting]: defineAsyncComponent(() => import('../delisting/index.vue')),
        [ModalEnum.spot_trade_warehouse_financing_delisting]: defineAsyncComponent(() => import('../financing_delisting/index.vue')),
    },
    setup(props, context) {
        const isBottom = getShowBottomValue();
        console.log(isBottom.value, 'isBottom');
        // 表格列表数据
        const { loading, tableList, queryTable } = queryTableList<WrOrderQuoteDetail>();

        const { wrpricetype, haswr, tableKey } = getSellMarketParam(props.enumName);
        // 获取列表数据
        const queryTableAction = () => {
            const param: QueryOrderQuoteDetailReq = {
                buyorsell: 1,
                wrpricetype,
                haswr,
                wrfactortypeid: props.parantSelectedRow.wrfactortypeid,
                goodsid: props.parantSelectedRow.goodsid,
            };
            if (!haswr) {
                // 无仓单 需要交收月过滤数据
                param.deliverymonth = moment(props.time).format('YYYY-MM');
            }
            queryTable(queryOrderQuoteDetail, param);
        };
        // 表格通用逻辑
        const param: ComposeTableParam = {
            queryFn: queryTableAction,
            menuType: EnumRouterName.warehouse_receipt_trade_floating_price,
            tableName: tableKey,
            tableFilterKey: [],
            isDetail: false,
        };
        function handleColumn(columns: ColumnType[]) {
            columns.forEach((item) => {
                columns.forEach((item) => {
                    if (item.dataIndex == 'username') {
                        delete item.width;
                    }
                });
            });
            return columns;
        }
        return {
            isBottom,
            ...handleComposeTable<WrOrderQuoteDetail>(param),
            queryTableAction,
            loading,
            tableList,
            BuyOrSell,
            enumName: props.enumName,
            expandIcon,
            handleColumn,
        };
    },
});
</script>
<style lang="less">
.buy-sell-market {
    .btnDeafault.ant-btn {
        height: 28px;
        line-height: 28px;
    }
}
</style>