<script setup>
import {computed} from "vue";
import {Message} from "@arco-design/web-vue";

const {api, id} = defineProps({
    api: {
        type: Function,
        default: async () => {
        }
    },
    id: {
        type: Number,
        default: null,
    }
});
const emits = defineEmits(['change']);
const modelValue = defineModel('model-value');

const status = computed({
    get: () => Boolean(Number(modelValue.value)),
    set: (value) => {
        modelValue.value = value ? 1 : 0;
    },
})

const change = async (e) => {
    const {msg} = await api(id, Number(e));
    Message.success(msg);
    emits('change');
}
</script>

<template>
    <a-switch v-bind="$attrs" v-model:model-value="status" @change="change"></a-switch>
</template>

<style scoped lang="scss">

</style>
