<template>
    <div class="detail-popup">
        <popup ref="popupRef" title="文章详情" :async="true" width="60vw" @confirm="handleSubmit" @close="handleClose">
            <h1 style="font-size:32px; margin-bottom: 20px;font-weight:700"> {{ formData.title }} </h1>
            <h4 style="margin:20px 0"> {{ formData.desc }} </h4>
            <div v-html="formData.content"> </div>
            <div style="text-align: right;margin-top: 20px">
                本文由{{ formData.author }}于{{ (formData.create_time) }}发布
            </div>

            <!-- {{ formData }} -->
        </popup>
    </div>
</template>

<script lang="ts" setup name="customdetail">

import type { FormInstance } from 'element-plus'
import Popup from '@/components/popup/index.vue'
import { timeFormat } from '@/utils/util'
import type { PropType } from 'vue'

const emit = defineEmits(['success', 'close'])
const popupRef = shallowRef<InstanceType<typeof Popup>>()


// 表单数据
const formData = ref({

})


// 提交按钮
const handleSubmit = async () => {
    popupRef.value?.close()

}

//打开弹窗
const open = (data) => {
    popupRef.value?.open()
    formData.value = data
}

// 关闭回调
const handleClose = () => {
    emit('close')
}


defineExpose({
    open,
})
</script>

<style lang="scss" scoped>
.tit {
    font-size: 1.2em;
    margin-bottom: 10px;
}

:deep(.my-label) {
    width: 150px;
}
</style>
