<template>
  <div class="notice-detail">
    <div class="common-body">
      <arrow-nav-bread :menuData="menuData"></arrow-nav-bread>
      <div class="notice-detail-body">
        <h2>【{{ noticeData.groupName }}】{{ noticeData.title }}</h2>
        <div class="notice-detail-content">
          <div class="markdown-content" v-html="noticeData.content"></div>
        </div>
        <p class="notice-oprate font-14 color-0a1633">{{ noticeData.operatorName }}</p>
        <p class="notice-date font-14 color-0a1633">{{ noticeData.effectiveTime | timeStampToLineYmd }}</p>
      </div>
    </div>
  </div>
</template>
<script>
import arrowNavBread from '@/components/nav/arrow-nav-bread.vue';
import { getNoticeDetail } from '@/api/notice';
import errMsg from '@/assets/js/error';
import marked from 'marked';
export default {
  components: {
    arrowNavBread
  },
  data() {
    return {
      menuData: [
        {
          path: '/noticeList',
          name: '公告列表'
        },
        {
          path: '',
          name: '公告详情'
        }
      ],
      noticeData: {
        groupName: '',
        title: ''
      }
    };
  },
  methods: {
    getData() {
      const that = this;
      let para = {
        noticeId: that.$route.query.noticeId
      };
      getNoticeDetail(para)
        .then(res => {
          let resData = res.data;
          if (resData.code == '0000') {
            resData.result.content = marked(resData.result.content);
            that.noticeData = resData.result || {};
            return;
          }
          errMsg.errorMsg(resData);
        })
        .catch(function(error) {
          that.$message.error({
            duration: 1000,
            message: error.message
          });
        });
    }
  },
  mounted() {
    const that = this;
    that.getData();
  }
};
</script>
<style lang="less" scoped>
.notice-detail {
  margin: 126px 0 210px 0;
  .common-body {
    width: 1180px;
    margin: 0 auto;
    h2 {
      margin-top: 48px;
      height: 80px;
      line-height: 80px;
      font-size: 24px;
      color: #0a1633;
      border-bottom: 1px solid #c3cad9;
    }
    .markdown-content {
      padding-top: 16px;
      font-size: 14px;
      color: #0a1633;
      line-height: 24px;
    }
    .notice-oprate {
      margin-top: 24px;
      text-align: right;
      line-height: 24px;
    }
    .notice-date {
      margin-top: 8px;
      text-align: right;
      line-height: 24px;
    }
  }
}
</style>
