<script lang="ts" setup>
import ADropTable from '@/components/a-drop-table/ADropTable.vue'
import GoodsCategoryApi from '@/pages/gds/goods-category/goods-category-api.ts'
import { bizType } from '@/pages/gds/goods-category/constants.ts'

const props = defineProps<{
  defaultBizType: typeof bizType[number]['val']
  modelValue: string | undefined | null,
}>()

const dropTableColumns = [
  {
    label: '业务类型',
    prop: 'bizTypeTxt',
  },
  {
    label: '分类名称',
    prop: 'categoryName',
  },
]
const dropTableLoader = (param: GoodsCategoryTypes.SearchGoodsCategoryParam) => {
  param.bizType = props.defaultBizType
  return GoodsCategoryApi.paging(param).then(res => res.data)
}

const emits = defineEmits<{
  'update:modelValue': [ value: string | undefined | null ]
}>()

const goodsCategoryId = computed({
  get: () => props.modelValue,
  set: (val) => emits('update:modelValue', val),
})

</script>

<template>
  <ADropTable v-model="goodsCategoryId"
    :columns="dropTableColumns"
    :loader="dropTableLoader"
    display-field="categoryName"/>
</template>
