<template>
  <a-checkbox v-model:checked="checked" @change="change" :disabled="disabled">
    <slot></slot>
  </a-checkbox>
</template>
<script setup>
import {defineEmits, defineProps, ref, watchEffect} from "vue";

const props = defineProps({
  modelValue: {
    type: [Boolean, Number, String],
    default: false
  },
  checkValue: {
    type: [Boolean, Number, String],
    default: false
  },
  unCheckValue: {
    type: [Boolean, Number, String],
    default: false
  },
  disabled:{
    type:Boolean,
    default:false
  }
});
const emit = defineEmits(["update:modelValue"]);
const checked = ref(props.modelValue);
watchEffect(() => checked.value = props.modelValue);

const change = ({ target: { checked } }) => emit("update:modelValue", checked ? props.checkValue : props.unCheckValue);

</script>
