<template>
    <!-- 仓单贸易 贸易圈挂牌-->
    <div class="topTableHeight topTableHeight_413">
        <Filter :enumName="name" @search="search" @buy="buyOpen" />
        <div>
            <Sell isWR="1" IsSpecified="1" />
            <Buy isWR="1" IsSpecified="1" />
        </div>
        <component
            :is="componentId"
            v-if="componentId"
            isWR="1"
            IsSpecified="1"
            :selectedRow="selectedRow"
            @cancel="closeComponent"
        ></component>
    </div>
</template>

<script lang="ts">
import { getShowBottomValue } from '@/common/config/constrolBottom';
import { EnumRouterName } from '@/common/constants/enumRouterName';
import { defineAsyncComponent, defineComponent } from '@/common/export/commonTable';
import { handleModalComponent } from '@/common/setup/asyncComponent';
import Bus from '@/utils/eventBus';
import Buy from '@/views/market/market-spot/components/designate-buy/index.vue';
import Sell from '@/views/market/market-spot/components/designate-sell/index.vue';
import { ref } from 'vue';
import Filter from '../../components/filter/index.vue';

export default defineComponent({
    name: EnumRouterName.warehouse_receipt_trade_blocs,
    components: {
        Filter,
        Buy,
        Sell,
        postBuying: defineAsyncComponent(() => import('@/views/market/market-spot/components/designate-post-buying/index.vue')),
    },
    setup() {
        const isBottom = getShowBottomValue();
        const selectedRow = ref();
        function queryFn() {
            Bus.$emit('spotTrade', true);
        }
        // 控制异步组件
        const { componentId, closeComponent } = handleModalComponent(queryFn, selectedRow);
        function search() { }
        function buyOpen(value: any) {
            componentId.value = 'postBuying';
            selectedRow.value = value;
        }
        return {
            isBottom,
            search,
            buyOpen,
            componentId,
            closeComponent,
            selectedRow,
            name: EnumRouterName.warehouse_receipt_trade_blocs,
        };
    },
});
</script>
<style lang="less">
</style>