<script setup>
import { VSelect } from "vuetify/components/VSelect";
import { useLookupListMaster } from "../../composables/lookupListMaster";
const props = defineProps({
  sortBy: { type: String, required: false, default: "itemValue" },
  showCode: { type: Boolean, required: false, default: false },
  groupKey: { type: String, required: true },
  itemCodes: { type: Array, required: false },
  lang: { type: String, required: false, default: "TH" },
  fields: { type: Array, required: false },
  noDataText: { type: String, required: false, default: "\u0E44\u0E21\u0E48\u0E1E\u0E1A\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25" },
  filterText: { type: String, required: false },
  waitForFilter: { type: Boolean, required: false, default: false },
  waitForFilterText: { type: String, required: false },
  cache: { type: [Boolean, Number], required: false, default: false },
  statusField: { type: String, required: false, default: "statusCode" },
  activeValue: { type: null, required: false, default: "active" },
  hideInactiveInList: { type: Boolean, required: false, default: true },
  preventSelectingInactive: { type: Boolean, required: false, default: true }
});
const {
  computedModelName,
  computedModelBy,
  computedFields,
  itemTitleField,
  computedNoDataText,
  computedSortBy,
  formatItemTitle
} = useLookupListMaster(props);
</script>

<template>
  <model-select
      :model-name="computedModelName"
      :model-by="computedModelBy"
      :fields="computedFields"
      :sort-by="computedSortBy"
      :item-title="itemTitleField"
      item-value="itemCode"
      :no-data-text="computedNoDataText"
      :show-code="props.showCode"
      :cache="props.cache"
      :status-field="props.statusField"
      :active-value="props.activeValue"
      :hide-inactive-in-list="props.hideInactiveInList"
      :prevent-selecting-inactive="props.preventSelectingInactive"
  >
    <!-- pass-through slots -->
    <!-- @ts-ignore -->
    <template v-for="(_, name, index) in $slots" :key="index" #[name]="slotData">
      <slot :name="name" v-bind="slotData || {}" :operation="computedModelName" />
    </template>

    <template v-if="!$slots.item" #item="{ props: itemProps, item }">
      <v-list-item v-bind="itemProps" :title="formatItemTitle(item)" />
    </template>

    <template v-if="!$slots.selection && props.showCode" #selection="{ item }">
      {{ formatItemTitle(item) }}
    </template>
  </model-select>
</template>
