<template>
    <el-dialog
        v-model="visible"
        title="修改图书类型"
        width="400px"
        @close="reset"
    >
        <el-form :model="form" label-width="80px">
            <el-form-item label="图书类型">
                <el-select v-model="form.operateType" placeholder="请选择类型">
                    <el-option label="教材库" :value="1" />
                    <el-option label="社科库" :value="2" />
                    <el-option label="中小学" :value="3" />
                </el-select>
            </el-form-item>
        </el-form>
        <template #footer>
            <el-button @click="visible = false">取消</el-button>
            <el-button type="primary" @click="handleSave" :loading="loading"
                >保存</el-button
            >
        </template>
    </el-dialog>
</template>

<script setup>
    import { ref, getCurrentInstance } from 'vue';
    import { ElMessage } from 'element-plus';
    const { proxy } = getCurrentInstance();
    const visible = ref(false);
    const loading = ref(false);
    const form = ref({
        isbn: '',
        operateType: 1
    });
    const emit = defineEmits(['success']);

    function open({ isbn, bookTag }) {
        form.value.isbn = isbn;
        form.value.operateType = Number(bookTag) || '';
        visible.value = true;
    }
    function reset() {
        loading.value = false;
    }
    async function handleSave() {
        loading.value = true;
        try {
            let { data } = await proxy.$http.post(
                '/book/bookInfo/setBookTag',
                form.value
            );
            if (data.code === 200) {
                ElMessage.success('修改成功');
                visible.value = false;
                emit('success');
            } else {
                ElMessage.error(data.msg);
            }
        } catch (e) {
            ElMessage.error('修改失败');
        } finally {
            loading.value = false;
        }
    }

    defineExpose({ open });
</script>
