|
|
@@ -0,0 +1,142 @@
|
|
|
+<template>
|
|
|
+ <view class="content">
|
|
|
+ <pcNav></pcNav>
|
|
|
+ <view style="height: 72px;"></view>
|
|
|
+ <view class="top">
|
|
|
+ <view class="topline">首页</view>
|
|
|
+ <view class="topjt">></view>
|
|
|
+ <view class="topline">{{topName}}</view>
|
|
|
+ <view class="topjt">></view>
|
|
|
+ <view class="topline">{{twoName}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="htmlBox">
|
|
|
+ <view class="htmlTitle">{{detailData.name}}</view>
|
|
|
+ <view class="time">{{detailData.publishTime}}</view>
|
|
|
+ <view class="html" v-html="detailData.contents"></view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import pcNav from '../../components/pcNav/pcNav.vue'
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ pcNav,
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ id: '',
|
|
|
+ detailData: {},
|
|
|
+ couContent: '',
|
|
|
+ itemArr: [],
|
|
|
+ topName:'',
|
|
|
+ twoName:'',
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(opt) {
|
|
|
+ console.log('opt', opt);
|
|
|
+ this.id = opt.id
|
|
|
+ this.topName=opt.topName;
|
|
|
+ this.twoName=opt.twoName;
|
|
|
+ this.getDetailData()
|
|
|
+ // uni.setNavigationBarTitle({
|
|
|
+ // title: this.topName
|
|
|
+ // })
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+
|
|
|
+ getDetailData() {
|
|
|
+ uni.showLoading({
|
|
|
+ title: '加载中'
|
|
|
+ })
|
|
|
+
|
|
|
+ let url = '/trainingOpenApi/articleDetail',
|
|
|
+ params = {
|
|
|
+ id: this.id,
|
|
|
+ }
|
|
|
+ this.$http(url, params, 'GET').then(res => {
|
|
|
+ uni.hideLoading();
|
|
|
+ var data = res.data
|
|
|
+
|
|
|
+
|
|
|
+ // 处理 undefined和null转为空白字符串
|
|
|
+
|
|
|
+ for (const key in data) {
|
|
|
+ data[key] = this.$praseStrEmpty(data[key])
|
|
|
+ }
|
|
|
+
|
|
|
+ this.detailData = data;
|
|
|
+ if (this.detailData.contents) {
|
|
|
+ var replaceStr = "application/x-shockwave-flash"
|
|
|
+ this.detailData.contents=this.detailData.contents.replace(new RegExp(replaceStr,'gm'),'video/webm')//(/''/g,"video/webm")
|
|
|
+ this.detailData.contents=this.detailData.contents.replace(/<embed([\s\w"-=\/\.:;]+)/ig, '<embed style="width: 100%;height:500px;" $1');
|
|
|
+ }
|
|
|
+
|
|
|
+ if (this.detailData.contents) {
|
|
|
+ this.detailData.contents = this.detailData.contents.replace(
|
|
|
+ /<p([\s\w"=\/\.:;]+)((?:(style="[^"]+")))/ig, '<p')
|
|
|
+ .replace(/<p>/ig, '<p style="font-size: 15px; line-height: 25px;">')
|
|
|
+ .replace(/<img([\s\w"-=\/\.:;]+)((?:(height="[^"]+")))/ig, '<img$1')
|
|
|
+ .replace(/<img([\s\w"-=\/\.:;]+)((?:(width="[^"]+")))/ig, '<img$1')
|
|
|
+ .replace(/<img([\s\w"-=\/\.:;]+)((?:(style="[^"]+")))/ig, '<img$1')
|
|
|
+ .replace(/<img([\s\w"-=\/\.:;]+)((?:(alt="[^"]+")))/ig, '<img$1')
|
|
|
+ .replace(/<img([\s\w"-=\/\.:;]+)/ig, '<img style="width: 100%;" $1');
|
|
|
+ }
|
|
|
+
|
|
|
+ this.itemArr = this.detailData.fileList
|
|
|
+
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ // }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+ .top{
|
|
|
+ width: 1200px;
|
|
|
+ margin: 0 auto;
|
|
|
+ display: flex;
|
|
|
+ padding: 30px 0;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ .htmlBox{
|
|
|
+ width: 720px;
|
|
|
+ margin: 0 auto;
|
|
|
+ }
|
|
|
+ .topline{
|
|
|
+ padding-right: 10px;
|
|
|
+ cursor: pointer;
|
|
|
+ color: #3C3C3C;
|
|
|
+
|
|
|
+ }
|
|
|
+ .topjt{
|
|
|
+ color: #AAAAAA;
|
|
|
+ padding-right: 10px;
|
|
|
+ }
|
|
|
+ .htmlTitle{
|
|
|
+ font-size: 24px;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #3C3C3C;
|
|
|
+ line-height: 33px;
|
|
|
+ }
|
|
|
+ .time{
|
|
|
+ font-size: 14px;
|
|
|
+ padding-top: 16px;
|
|
|
+ color: #999999;
|
|
|
+ line-height: 20px;
|
|
|
+ border-bottom: 1px solid #EEEEEE;
|
|
|
+ padding-bottom: 19px;
|
|
|
+ }
|
|
|
+ .html{
|
|
|
+ padding-top: 18px;
|
|
|
+ }
|
|
|
+ .html img{
|
|
|
+ width: 100% !important;
|
|
|
+ }
|
|
|
+</style>
|
