<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>
