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

const emits = defineEmits(['success']);
const {detail} = defineProps({
    detail: {
        type: Object,
        default: {}
    }
});

const visible = ref(false);
const form = reactive({
    qrcode: null,
    position_text: null,
});
watch(
    () => visible.value,
    (val) => {
        if (val) Object.assign(form, detail)
    }
)
const edit = async () => {
    const {msg} = await Api.admin.editQRList(form);
    Message.success(msg);
    emits('success');
}
</script>

<template>
    <a-link :hoverable="false" @click="visible=true">编辑</a-link>

    <a-modal
        ok-text="提交"
        @ok="edit"
        title="二维码"
        title-align="start"
        v-model:visible="visible">
        <a-form>
            <a-form-item label="位置">
                <a-input v-model:model-value="form.position_text" disabled></a-input>
            </a-form-item>
            <a-form-item label="二维码">
                <upload-one size="100px" v-model:file="form.qrcode"></upload-one>
            </a-form-item>
        </a-form>
    </a-modal>
</template>

<style scoped lang="scss">

</style>
