31 lines
918 B
Vue
31 lines
918 B
Vue
<script setup lang="ts">
|
|
import { computed } from 'vue';
|
|
import Switch from '@/components/ui/Switch.vue';
|
|
|
|
const props = defineProps<{
|
|
/** Stored as 1/0 to match the values the Blade forms submitted. */
|
|
modelValue: number | boolean;
|
|
label: string;
|
|
description?: string;
|
|
inputId: string;
|
|
}>();
|
|
|
|
const emit = defineEmits<{ 'update:modelValue': [value: number] }>();
|
|
|
|
const checked = computed({
|
|
get: () => Boolean(Number(props.modelValue)),
|
|
set: (value: boolean) => emit('update:modelValue', value ? 1 : 0),
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div class="flex items-start gap-3">
|
|
<Switch v-model="checked" :id="inputId" class="mt-1" />
|
|
|
|
<div class="flex flex-col">
|
|
<label :for="inputId" class="cursor-pointer text-slate-700">{{ label }}</label>
|
|
<small v-if="description" class="text-slate-500">{{ description }}</small>
|
|
</div>
|
|
</div>
|
|
</template>
|