<template><page-meta :root-font-size="fontSize+'px'"></page-meta>
    <home-base :show="false"><view class="div distributor-article-list">
      <view class="div common-header-wrap">
        <view :style="'height:'+navHeight+'px'"></view>
        <view class="common-header-holder"></view>
        <view class="common-header-fixed">
        <title-header />
        <uni-nav-bar :title="article_title" class="common-header" left-icon="back" @clickLeft="goBack()">
        </uni-nav-bar>
      </view>
      </view>
	  <view class='main-content'>
		<rich-text class="div article_content" :nodes='article_content'></rich-text>
	  </view>
    </view></home-base>
</template>
<script>
import {getFontSize} from '@/util/common'
import TitleHeader from '../../TitleHeader'
import HomeBase from '../HomeBase'
import { getArticleDetail } from '../../../api/homeArticle'
export default {

  name:'HomeDocument',
  mounted(){
  // #ifdef  MP-WEIXIN
  this.navHeight = uni.getMenuButtonBoundingClientRect().top
  // #endif
  },
  computed:{
  fontSize(){
    return getFontSize()
  },
  },
  data(){
    return {
      navHeight: 0,
      article_title: '',
      article_content: ''
    }
  },
  components:{
    TitleHeader,
    HomeBase,
  },
  onLoad: function (option) {
    let article_id = option.article_id
    getArticleDetail(article_id).then(res => {
      this.article_title = res.result.article_title
      this.article_content = res.result.article_content
    }).catch(function (error) {
      uni.showToast({icon:'none',title: error.message})
    })
  },
  methods:{
    goBack(){
      uni.navigateBack({delta:1})
    }
  }

}
</script>
<style  lang="scss" >
.main-content{padding: 0 $pageSpace;box-sizing: border-box;}
.article_content{padding:.5rem;font-size:$subFontSize;line-height:1rem;}
.article_content .img{width: 100%}
</style>
