103 lines
2.0 KiB
Vue
103 lines
2.0 KiB
Vue
<template>
|
|
<div class="AppCommunityInfo" v-if="pageShow">
|
|
<h2>{{ info.title }}</h2>
|
|
<div class="info-info">
|
|
<span>{{ info.areaName }}</span>
|
|
<span>{{ info.createDate }}</span>
|
|
</div>
|
|
<image class="banner" @click="preview(banner)" v-if="banner" mode="widthFix" :src="banner"/>
|
|
<div class="rich-content">
|
|
<u-parse :html="info.content"></u-parse>
|
|
</div>
|
|
<AiEmpty v-if="!info.title"></AiEmpty>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: "AppCommunityInfo",
|
|
appName: "社区简介",
|
|
data() {
|
|
return {
|
|
pageShow: false,
|
|
info: {},
|
|
banner: ''
|
|
}
|
|
},
|
|
|
|
onLoad(query) {
|
|
if (query.type !== '0') {
|
|
uni.setNavigationBarTitle({
|
|
title: query.type == 4 ? '社区公约' : '党员阵地'
|
|
})
|
|
}
|
|
|
|
this.$loading()
|
|
this.getInfo(query.type)
|
|
},
|
|
|
|
methods: {
|
|
getInfo(type) {
|
|
this.$instance.post(`/app/appcountrysidetourism/queryDetailByAreaIdForWX?areaId=${uni.getStorageSync('areaId')}&type=${type}`).then(res => {
|
|
if (res.code === 0 && res.data) {
|
|
this.info = res.data
|
|
this.banner = res.data.thumbUrl ? JSON.parse(res.data.thumbUrl)[0].url : ''
|
|
}
|
|
|
|
this.$nextTick(() => {
|
|
this.pageShow = true
|
|
})
|
|
})
|
|
},
|
|
|
|
preview(url) {
|
|
uni.previewImage({
|
|
urls: [url],
|
|
current: url
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.AppCommunityInfo {
|
|
min-height: 100vh;
|
|
padding: 0 32px 40px;
|
|
box-sizing: border-box;
|
|
background-color: #fff;
|
|
|
|
.banner {
|
|
width: 100%;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
h2 {
|
|
line-height: 1.3;
|
|
padding: 32px 0 16px;
|
|
font-size: 48px;
|
|
font-weight: 600;
|
|
color: #333;
|
|
}
|
|
|
|
.info-info {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: 30px;
|
|
|
|
span {
|
|
color: #999999;
|
|
font-size: 30px;
|
|
|
|
&:last-child {
|
|
margin-left: 32px;
|
|
}
|
|
}
|
|
}
|
|
|
|
::v-deep.emptyWrap {
|
|
width: 100%;
|
|
}
|
|
}
|
|
</style>
|