adrema-form/src/components/fields/Checkbox.vue

38 lines
1.1 KiB
Vue

<template>
<v-checkbox :id="innerId" v-model="inner" :label="field.name" :description="field.description" :name="field.key" :required="field.required" :intro="field.intro" :hint="field.hint"></v-checkbox>
</template>
<script setup>
import {computed} from 'vue';
import VCheckbox from './VCheckbox.vue';
const emit = defineEmits(['update:modelValue']);
const props = defineProps({
modelValue: {
required: true,
validator: (value) => value === true || value === false,
},
field: {
required: true,
validator: (value) =>
hasKeys(value, [...globalFieldRules(), 'required', 'description']) &&
typeof value.required === 'boolean' &&
typeof value.key === 'string' &&
value.key.length > 0 &&
typeof value.name === 'string' &&
typeof value.description === 'string' &&
value.name.length > 0,
},
id: {
required: false,
},
});
const innerId = computed(() => (props.id ? props.id : props.field.key));
const inner = computed({
get: () => props.modelValue,
set: (v) => emit('update:modelValue', v),
});
</script>