<template>
  <a-switch v-bind="$attrs">
    <template #checkedChildren>
      {{ checkType ? '' : checkInfo.checked }}
      <ns-icon v-if="checkType" :name="checkInfo.checked" :size="iconSize"
    /></template>
    <template #unCheckedChildren
      >{{ checkType ? '' : checkInfo.unChecked
      }}<ns-icon v-if="checkType" :name="checkInfo.unChecked" :size="iconSize"
    /></template>
  </a-switch>
</template>

<script lang="ts">
  import { defineComponent } from 'vue';

  export default defineComponent({
    name: 'NsSwitch',
    props: {
      checkInfo: {
        type: Object,
        default: () => ({
          checked: '',
          unChecked: '',
        }),
      },
      checkType: {
        type: String,
      },
      iconSize: {
        type: Number,
        default: 10,
      },
    },
    setup(props) {
      // eslint-disable-next-line vue/no-setup-props-destructure
      const { checkInfo, checkType, iconSize } = props;
      // eslint-disable-next-line vue/no-dupe-keys
      return { checkInfo, checkType, iconSize };
    },
  });
</script>
<style lang="less" scoped></style>
