71 lines
1.8 KiB
Vue
71 lines
1.8 KiB
Vue
<template>
|
|
<div v-loading="loading" class="article-detail">
|
|
<baseTitle title="文章详情"></baseTitle>
|
|
<el-form :model="formData" >
|
|
<el-row gutter="20" style="margin-left: 5px">
|
|
<el-col :span="6">
|
|
<el-form-item label="文章标题">
|
|
<span>{{ formData.articleTitle }}</span>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="6">
|
|
<el-form-item label="文章类型">
|
|
<Tag dictType="article_type" :value="formData.articleType"/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="6">
|
|
<el-form-item label="创建时间">
|
|
<span>{{ formData.articleTime }}</span>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="6">
|
|
<el-form-item label="备注">
|
|
<span>{{ formData.remarks }}</span>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<el-form-item label="文章内容">
|
|
<div v-html="formData.articleContent"></div>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {ElNotification} from "element-plus";
|
|
import {getArticleDetail} from "@/api/article";
|
|
const loading=ref(false)
|
|
const formData=ref({})
|
|
const route = useRoute()
|
|
const getDetailInfo = async () => {
|
|
loading.value = true
|
|
getArticleDetail(route.query.id).then(res => {
|
|
if (res.code === 1000) {
|
|
formData.value = res.data
|
|
loading.value = false
|
|
}else{
|
|
ElNotification({
|
|
title: '提示',
|
|
message: res.msg,
|
|
type: 'error'
|
|
})
|
|
}
|
|
})
|
|
}
|
|
onMounted(async () => {
|
|
if (route.query.id) {
|
|
await getDetailInfo()
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
.article-detail{
|
|
padding: 0 30px;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
</style>
|