<!-- 编辑 -->
<template>
    <app-drawer class="quote-edit" title="编辑" width="55%" v-model:show="show">
        <template #default>
            <el-form>
                <el-form-item label="商品名称">
                    <el-input />
                </el-form-item>
                <el-form-item label="所属类别">
                    <el-checkbox-group>
                        <el-checkbox label="钻石" name="type" />
                        <el-checkbox label="黄金" name="type" />
                        <el-checkbox label="蓝宝石" name="type" />
                        <el-checkbox label="银" name="type" />
                    </el-checkbox-group>
                </el-form-item>
                <el-form-item>
                    <app-editor />
                </el-form-item>
            </el-form>
        </template>
        <template #footer>
            <el-button @click="cancel">取消</el-button>
            <el-button @click="submit" type="primary">提交</el-button>
        </template>
    </app-drawer>
</template>

<script lang="ts" setup>
import { ref } from 'vue'
import { ElMessageBox } from 'element-plus'
import AppDrawer from '@pc/components/base/drawer/index.vue'
import AppEditor from '@pc/components/base/editor/index.vue'

const show = ref(true);

const cancel = () => {
    ElMessageBox.confirm(
        '编辑未保存，是否关闭？',
        '提示',
        {
            type: 'warning',
        }
    ).then(() => {
        show.value = false;
    })
}

const submit = () => {
    show.value = false;
}
</script>