53 lines
1.3 KiB
Vue
53 lines
1.3 KiB
Vue
|
<script lang="ts" setup>
|
||
|
|
import { ref } from 'vue';
|
||
|
|
import { selectFilterOptionRefMod } from 'src/stores/utils';
|
||
|
|
|
||
|
|
const model = defineModel<string | Date | null>();
|
||
|
|
const option = defineModel<[]>('option', { default: [] });
|
||
|
|
|
||
|
|
const props = defineProps<{
|
||
|
|
id?: string;
|
||
|
|
readonly?: boolean;
|
||
|
|
clearable?: boolean;
|
||
|
|
label?: string;
|
||
|
|
rules?: ((value: string) => string | true)[];
|
||
|
|
disabledDates?: string[] | Date[] | ((date: Date) => boolean);
|
||
|
|
}>();
|
||
|
|
|
||
|
|
const options = ref<Record<string, unknown>[]>([]);
|
||
|
|
let typeBusinessFilter = selectFilterOptionRefMod(option, options, 'label');
|
||
|
|
</script>
|
||
|
|
<template>
|
||
|
|
<q-select
|
||
|
|
outlined
|
||
|
|
clearable
|
||
|
|
use-input
|
||
|
|
fill-input
|
||
|
|
emit-value
|
||
|
|
map-options
|
||
|
|
hide-selected
|
||
|
|
hide-bottom-space
|
||
|
|
:hide-dropdown-icon="readonly"
|
||
|
|
input-debounce="0"
|
||
|
|
option-value="value"
|
||
|
|
option-label="label"
|
||
|
|
v-model="model"
|
||
|
|
class="col-md-6 col-12"
|
||
|
|
dense
|
||
|
|
:readonly="readonly"
|
||
|
|
:label="label"
|
||
|
|
:options="options"
|
||
|
|
:for="`${prefixId}-select-business-type`"
|
||
|
|
@filter="typeBusinessFilter"
|
||
|
|
:rules="[(val: string) => !!val || $t('form.error.required')]"
|
||
|
|
>
|
||
|
|
<template v-slot:no-option>
|
||
|
|
<q-item>
|
||
|
|
<q-item-section class="text-grey">
|
||
|
|
{{ $t('general.noData') }}
|
||
|
|
</q-item-section>
|
||
|
|
</q-item>
|
||
|
|
</template>
|
||
|
|
</q-select>
|
||
|
|
</template>
|