<template>
    <van-popup v-model:show="show" position="bottom" round @close="handleClose">
        <div class="more">
            <!-- <div class="item" @click="handleUpdate">编辑图组</div> -->
            <!-- <div class="item delete" @click="handleDelete">删除图组</div> -->
            <div class="item" @click="handleClose">取消</div>
        </div>
    </van-popup>
</template>

<script setup>
import { ref } from 'vue'
import { deleteAppCatalog } from '@/api/publish'
import { showConfirmDialog } from 'vant'
import useUserStore from '@/store/user'
const userStore = useUserStore()

const emits = defineEmits(["refresh"])

const catalog = reactive({
    userId: null,
    materialId: '',
    delBy: ''
})

const handleClose = () => {
    show.value = false
}

const handleDelete = () => {
    showConfirmDialog({
        title: '删除图组',
        message: '确定删除该图组吗？',
    })
        .then(() => {
            catalog.userId = userStore.userinfo.user.id
            catalog.materialId = pictrueInfo.value.materialId
            catalog.delBy = userStore.userinfo.user.name
            deleteAppCatalog(catalog).then(res => {
                showToast('删除成功')
                emits('refresh')
                handleClose()
            })
        })
}

const handleUpdate = () => {
    console.log('编辑')
}

const pictrueInfo = ref(null)
const show = ref(false)
const open = (e) => {
    console.log(e)
    pictrueInfo.value = e
    show.value = true
}
const close = () => {
    show.value = false
}
defineExpose({
    open,
    close
})
</script>

<style lang="scss" scoped>
.more {
    padding: 10px;

    .delete {
        color: #E23535;
    }

    .item {
        padding: 10px 0;
        text-align: center;
        border-bottom: 1px solid #eee;

        &:last-child {
            border-bottom: none;
        }
    }
}
</style>