<template>
  <t-select v-model="selected" clearable filterable @change="onChange">
    <t-option
      v-for="item in optionList"
      :key="item.id"
      :value="item.id"
      :label="item.value"
    />
  </t-select>
</template>

<script setup name="SelectFilterUserDjr">
import { ref, watch, computed, onMounted } from 'vue';
import { getUserListDjr } from '@/api/user';

const emit = defineEmits(['update:modelValue', 'change']);
const props = defineProps({
  modelValue: { type: [Number, String, Array], default: '' },
  defaultList: {
    type: Array,
    default() {
      return [];
    },
  },
  isDjr: { type: Boolean, default: false },
});
const isMultiple = computed(() => {
  const multiple = attrs.multiple;
  return multiple === '' || multiple;
});

let optionList = ref([]);
let selected = ref('');
let loading = ref(false);

async function search(userInfo) {
  const res = await getUserListDjr().catch(() => {});
  if (!res) return;

  optionList.value = res || [];
}
onMounted(() => {
  search();
});
const onChange = (id) => {
  emit('update:modelValue', id);
};

watch(
  () => props.modelValue,
  (val) => {
    selected.value = val;
  },
  {
    immediate: true,
  }
);
</script>
