<!-- eslint-disable vue/require-default-prop -->
<script setup lang="ts">
defineOptions({ name: 'MjCheck' })

const props = withDefaults(
  defineProps<{
    checked?: boolean
    disabled?: boolean
    indeterminate?: boolean
    label?: string
    modelValue?: any
    value?: any
  }>(),
  {},
)

const emit = defineEmits(['update:modelValue'])

const _value = computed({
  // 这个false很关键
  get: () => props.modelValue || false,
  set: (val) => emit('update:modelValue', val),
})
</script>

<template>
  <el-checkbox
    v-model="_value"
    class="mj-check"
    :disabled="disabled"
    :label="label"
    :value="value"
    :checked="checked"
    :indeterminate="indeterminate"
  >
    {{ props.label }}
  </el-checkbox>
</template>

<style lang="scss" scoped>
.mj-check {
  // :deep(.el-checkbox__label) {
  //   font-family: $font-text;
  //   font-size: 2.33vh;
  //   color: $font-color;
  // }
}
</style>
