<template>
  <div class="filterTable">
    <Filter @update="update" :selectList="selectList">
      <template #default="{ reset }">
        <a-button class="selectBtn" @click="resetAction(reset)">重置</a-button>
      </template>
    </Filter>
  </div>
</template>

<script lang="ts">
import { defineComponent, ref } from 'vue'
import { useFilter } from '@/common/components/filter/setup'
import { handlerManagerList } from '@/common/setup/user'
import { TypeAndTime } from '@/views/report/interface'
import { Ermcp8HedgeditemReportRsp } from '@/services/go/ermcp/report/interface'
import { getHedgedTypeList } from '@/@next/constants/enum/hedgedType'
import { initData } from '@/common/methods'
import Filter from '../../../components/filter/index.vue'

export default defineComponent({
  name: 'exposure-filter-table',
  components: {
    Filter
  },
  setup(props, context) {
    const loading = ref<boolean>(false);
    const { selectList, inputList, search, reset } = useFilter<Ermcp8HedgeditemReportRsp>(context);
    const { queryTable } = handlerManagerList(loading, 2, true);

    selectList.value = [
      {
        key: 'hedgedtype',
        selectedValue: 0,
        options: [
          { label: '全部套期类型', value: 0 },
        ],
        onChange: search
      },
      {
        key: 'tradeuserid',
        alias: 'accountname',
        selectedValue: 0,
        options: [
          { label: '全部套期主体', value: 0 },
        ],
        onChange: search
      },
    ]

    inputList.value = [
      { keys: ['hedgeditemnum'], value: '', placeholder: '模糊搜索项目编号' },
    ]

    const update = (value: TypeAndTime) => {
      context.emit('update', value);
    }

    const resetAction = (parentReset: () => void) => {
      parentReset();
      reset();
    }

    initData(() => {
      const hedgedTypeList = getHedgedTypeList();
      hedgedTypeList.forEach((e) => {
        selectList.value[0].options.push({
          label: e.enumdicname,
          value: e.enumitemname,
        })
      })

      queryTable().then((res) => {
        res.forEach((e) => {
          selectList.value[1].options.push({
            label: e.rolename,
            value: e.roleid,
          })
        })
      })
    })

    return {
      selectList,
      update,
      resetAction,
    }
  }
})
</script>