yitisheng-mini-app/pages/zyb/article/detail.vue

135 lines
3.5 KiB
Vue

<script>
import StaticConstant from "@/common/StaticConstant";
import ApiConstant from "@/common/ApiConstant";
import Request from "@/common/request";
let request = new Request()
export default {
name: "detail",
components: {},
computed: {
StaticConstant() {
return StaticConstant
}
},
data() {
return {
showFlag: false,
articleId: '',
titleShow:false,
articleInfo: {},
tagStyle: {
table: 'box-sizing: border-box; border-top: 1px solid #dfe2e5; border-left: 1px solid #dfe2e5;',
th: 'border-right: 1px solid #dfe2e5; border-bottom: 1px solid #dfe2e5;',
td: 'border-right: 1px solid #dfe2e5; border-bottom: 1px solid #dfe2e5;',
li: 'margin: 5px 0;'
}
}
},
onLoad(e) {
if (e.articleId) {
this.articleId = e.articleId
this.getContent()
}
},
methods: {
/*招生章程*/
getContent() {
request.get(ApiConstant.Article.articleContent + "/" + this.articleId, {}).then(res => {
console.log(res)
if (res.success) {
this.articleInfo = res.result
if (!this.articleInfo.content.includes(this.articleInfo.title)) {
this.titleShow = true
}
this.showFlag = true
} else {
}
}).catch(err => {
}).finally(() => {
});
},
backHome() {
uni.reLaunch({
url: "/pages/zyb/home"
});
},
load() {
console.log('dom 树加载完毕')
},
ready(e) {
console.log('ready 事件触发:', e)
},
imgtap(e) {
console.log('imgtap 事件触发:', e)
},
linktap(e) {
console.log('linktap 事件触发:', e)
}
}
}
</script>
<template>
<view class="border-top background-white">
<view class="head" v-if="showFlag && titleShow">
<view class="flexWrap marginTopBot20">
<view class="flex-item-10" style="text-align: center">
<text class="font-weight-b font-size-medium">{{ articleInfo.title }}</text>
</view>
</view>
<view class="flexWrap marginTopBot20" style="text-align: center">
<!-- <view class="flex-item-1"></view>-->
<!-- <view class="flex-item-3">
<text>{{articleInfo.contentType ==='1'?'招生章程':'其他'}}</text>
</view>-->
<view class="flex-item-10">
<text>{{ articleInfo.releaseTime }}</text>
</view>
</view>
</view>
<view class="body" v-if="showFlag">
<mp-html container-style="padding:20px" :content="articleInfo.content"
domain="https://mp-html.oss-cn-hangzhou.aliyuncs.com" lazy-load scroll-table selectable use-anchor
:tag-style="tagStyle" @load="load" @ready="ready" @imgtap="imgtap" @linktap="linktap"/>
<!-- <view class="content">
<view v-if="articleInfo && articleInfo.contentType ==='1'">
{{ articleInfo.content }}
</view>
</view>-->
</view>
<view class="bottom" v-if="showFlag">
<!--返回首页-->
<view class="fhsy" @click="backHome">
返回首页
</view>
</view>
</view>
</template>
<style scoped lang="less">
.body {
//padding: 30rpx;
}
.content {
padding: 30rpx 10rpx;
border: 1rpx solid #75c591;
}
/*返回首页按钮 start*/
.fhsy {
margin: 0 auto;
border: 2rpx solid #cbcaca;
text-align: center;
font-size: 25rpx;
line-height: 100rpx;
width: 100rpx;
height: 100rpx;
border-radius: 50%;
padding: 30rpx;
}
/*返回首页按钮 end*/
</style>