Files
dvcp_v2_webapp/project/oms/apps/AppArticles/components/Detail.vue
2022-03-14 12:21:24 +08:00

78 lines
1.6 KiB
Vue

<template>
<ai-detail class="event-detail">
<template #title>
<ai-title title="村务公开详情" :isShowBack="true" @onBackClick="onBack" isShowBottomBorder>
</ai-title>
</template>
<template #content>
<ai-card :title="info.title" titlePosition="center">
<template #title>
<h2>{{ info.title }}</h2>
<p class="subTitle">{{ info.createDate }} {{ info.unitName || '-' }}</p>
</template>
<template #content>
<img class="cover" :src="info.thumbUrl[0].url" v-if="info.thumbUrl && info.thumbUrl.length">
<ai-article :value="info.content"></ai-article>
</template>
</ai-card>
</template>
</ai-detail>
</template>
<script>
export default {
name: 'detail',
props: {
instance: Function,
dict: Object,
permissions: Function,
},
data() {
return {
info: {}
}
},
computed: {
params() {
return this.$route.query
}
},
mounted() {
this.getInfo()
},
methods: {
getInfo() {
this.instance.post(`/appvillageinfo/queryDetailById?id=${this.params.id}`).then(res => {
if (res?.data) {
this.info = res.data
if (res.data.thumbUrl) {
this.info.thumbUrl = JSON.parse(res.data.thumbUrl)
}
}
})
},
onBack() {
this.$router.push({})
}
}
}
</script>
<style scoped lang="scss">
.cover {
display: block;
width: 300px;
height: 140px;
margin: 20px auto;
}
.subTitle {
text-align: center;
font-size: 12px;
font-weight: normal;
}
</style>