<script setup>
import {reactive, ref} from "vue";
import Api from "../../../../../api/index.js";
import {Message} from "@arco-design/web-vue";

const {id, api, disabled} = defineProps({
    id: {
        type: Number,
        default: 0
    },
    api: {
        type: Function,
        default: Api.admin.refuseTask
    },
    disabled: {
        type: Boolean,
        default: false,
    }
});
const emits = defineEmits(['success']);
const visible = ref(false);
const form = reactive({
    content: ''
});

const success = async () => {
    const {code, msg} = await api({
        id: id,
        ...form
    });
    if (code === 1) Message.success(msg);
    emits('success');
}
</script>

<template>
    <a-link v-if="!$slots.default" :hoverable="false" status="danger" @click="visible=true" :disabled="disabled">拒绝
    </a-link>
    <div v-else @click="visible=true">
        <slot></slot>
    </div>

    <a-modal
        title-align="start"
        title="任务审核拒绝"
        @ok="success"
        v-model:visible="visible">
        <a-form :model="form">
            <a-form-item label="拒绝原因">
                <a-input v-model:model-value="form.content" placeholder="请输入拒绝原因"></a-input>
            </a-form-item>
        </a-form>
    </a-modal>
</template>

<style scoped>

</style>
