Files
dvcp_v2_webapp/packages/publicity/AppVillageInfo/components/Detail.vue
2022-05-10 20:02:37 +08:00

79 lines
1.8 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>
<ai-file-list v-if="info.files && info.files.length" :fileList="info.files" :fileOps="{name: 'fileName', size: 'postfix'}"></ai-file-list>
</template>
</ai-card>
</template>
</ai-detail>
</template>
<script>
export default {
name: 'detail',
props: {
instance: Function,
dict: Object,
permissions: Function,
params: Object
},
data () {
return {
info: {}
}
},
mounted () {
this.getInfo()
},
methods: {
getInfo () {
this.instance.post(`/app/appvillageinfo/queryDetailById?id=${this.params.id}`).then(res => {
if (res.code === 0) {
this.info = res.data
if (res.data.thumbUrl) {
this.info.thumbUrl = JSON.parse(res.data.thumbUrl)
}
}
})
},
onBack () {
this.$emit('change', {
type: 'list'
})
}
}
}
</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>