/home/edulekha/crm.edulekha.com/resources/js/components/filters/AppFiltersCheckboxRule.vue
<template>
<div
class="checkbox checkbox-primary checkbox-inline"
v-for="option in rule.options"
:key="option.value"
>
<input
type="checkbox"
:id="`opt_1_${rule.id}_${option.value}`"
:name="`rule_${rule.id}_${option.value}`"
:value="option.value"
v-model="localValue"
/>
<label :for="`opt_1_${rule.id}_${option.value}`"> {{ option.label }}</label>
</div>
</template>
<script setup>
import { ref, watch } from "vue";
const props = defineProps({ rule: { type: Object, required: true } });
const emit = defineEmits(["update-rule-value"]);
const localValue = ref(props.rule.value || []);
watch(
localValue,
(newVal) => {
emit("update-rule-value", newVal);
},
{ deep: true }
);
</script>