<template>
    <div class="filterTable">
        <FilterOption :selectList="selectList" :inputList="inputList" :buttonList="buttonList" />
        <slot></slot>
    </div>
</template>

<script lang="ts">
import { defineComponent } from 'vue';
import { InternalUncorrelatedTradeDetailRsp } from '@/services/go/ermcp/hedgedItem/interface'
import { useFilter } from '@/common/components/filter/setup'
import FilterOption from '@/common/components/filter/index.vue'

export default defineComponent({
    name: 'filter-custom-table',
    components: {
        FilterOption
    },
    setup(props, context) {
        const { selectList, inputList, buttonList, search } = useFilter<InternalUncorrelatedTradeDetailRsp>(context);

        selectList.value = [
            {
                key: 'buyorsell',
                selectedValue: -1,
                options: [
                    { label: '全部方向', value: -1 },
                    { label: '买', value: 0 },
                    { label: '卖', value: 1 },
                ],
                onChange: search
            },
        ]

        inputList.value = [
            { keys: ['accountname'], value: '', placeholder: '模糊搜索期货子账号' },
            { keys: ['goodsid', 'goodscode'], value: '', placeholder: '模糊搜索期货合约' },
            { keys: ['tradeid'], value: '', placeholder: '模糊搜索成交单号' },
        ]

        return {
            selectList,
            inputList,
            buttonList,
        }
    },
})
</script>