homemanager-fe/src/components/form/fields/FormSelectField.vue

41 lines
898 B
Vue

<template>
<FormField
:name="name"
:label="label"
:placeholder="placeholder"
:disabled="disabled"
>
<template #input="{ invalid, value, setValue }">
<SelectVue
:for-id="forId"
:invalid="invalid"
:disabled="disabled"
:options="options || []"
:placeholder="placeholder"
:model-value="(value as string)"
@update:model-value="(newValue) => setValue(newValue)"
/>
</template>
<template #default><slot /></template>
</FormField>
</template>
<script setup lang="ts">
import FormField from '../FormField.vue';
import SelectVue, { SelectOption } from '../base/Select.vue';
const props = withDefaults(
defineProps<{
forId?: string;
label: string;
name: string;
options: SelectOption[];
disabled?: boolean;
placeholder?: string;
}>(),
{
disabled: false,
}
);
</script>