nyzy_vue/src/views/gateway/detailedPage.vue

<template>
  <div>
    <headerView/>
    <!-- banner -->
    <div class="er_banner">
      <div class="bannerimg">
        <div class="banneritem">{{$tf(parentData,"name")}}</div>
      </div>
    </div>
    <!-- banner -->
    <div class="er_cont clearfloat">
      <div class="contl left">
        <ul>
          <li v-for="(column,columnIndex) in columnList" :key="columnIndex" :class="thisColumn.id==column.id?'er_active':''">
            <a href="javascript:void(0);" @click="$to('listPage',{pid:column.parent,id:column.id})" :class="thisColumn.id==column.id?'er_active2':''">{{$tf(column,"name")}}</a>
          </li>
          <!-- <li >
            <a href="javascript:void(0);" class="er_active2">通知公告</a>
          </li> -->
        </ul>
      </div>
      <div class="contr right">
        <div class="contrupbox clearfloat">
          <span class="contrupl left">{{$tf(thisColumn,'name')}}</span>
          <div class="contrupr right">
            <span>{{$t('common.currentLocation')}}</span>
            <a href="javascript:void(0);" @click="$to('home')">{{$t('common.homeName')}} </a>
            <a href="javascript:void(0);" @click="$to('listPage',{pid:thisColumn.parent})"> > {{$tf(parentData,"name")}}</a>
            <a href="javascript:void(0);"> > {{$tf(thisColumn,'name')}}</a>
          </div>
        </div>

        <div class="contrdown">
          <h2 class="contitem">{{$tf(articleData,'title')}}</h2>
          <div class="contdate">
            <span style="margin-right: 14px;">{{$t('common.author')}}<span>{{$tf(articleData,'author')}}</span></span>
            <span style="margin-right: 14px;">{{$t('common.source')}}<span>{{$tf(articleData,'source')}}</span></span>
            <span>{{$t('common.publishTime')}}<span>{{articleData.updateTime || articleData.createTime}}</span></span>
          </div>
          <p class="contpp" v-html="$tf(articleData,'content')"></p>
          <template v-if="$tFiles(articleData,'files') && $tFiles(articleData,'files').length">
            <p class="contpp">
              {{$t('common.enclosure')}}
            </p>
            <p class="contpp" v-for="(file,fileIndex) in $tFiles(articleData,'files')" :key="fileIndex">
              <a style="color:#0082f5" :href="file" target="_blank">{{getFileName(file)}}</a>
            </p>
          </template>

        </div>
      </div>
    </div>
    <footerView/>
  </div>
</template>

<script>
import { getwayMixin } from '@/views/gateway/mixins/getwayMixin'
import { getAction } from '@/api/manage'
import headerView from '@/views/gateway/common/header'
import footerView from '@/views/gateway/common/footer'

export default {
  mixins:[getwayMixin],
  components:{
    headerView,
    footerView
  },
  props:{
  },
  data(){
    return {
      parentData:{},
      thisColumn:{},
      columnList:[],
      articleList: [],
      articleData:{},
    }
  },
  computed:{
    id(){
      return this.$route.query.id || '-1';
    }
  },
  mounted(){
    this.loadData();
  },
  watch:{
    id(){
      this.loadData();
    },
  },
  updated(){
  },
  methods:{
    loadData(){
      //查询栏目（包含当前的和候选的）
      getAction('/gateway/gatewayArticle/queryArticleById',{id:this.id}).then((res)=>{
        if(res.success){
          console.log('res =>',res.result);
          let data = res.result;
          this.articleData = data;
          //查出根节点
          this.parentData =data.parentGatewayColumn
          this.thisColumn = data.currentGatewayColumn
          this.columnList = data.gatewayColumnList

          // if(!this.columnId){
          //   let firstColumn = this.columnList[0]
          //   if(firstColumn){
          //     //this.$to('listPage',{pid:firstColumn.parent,id:firstColumn.id},true)
          //   }
          // }
        }
      });
      //如果没有ID自动选中一个
      // if(this.id){
      //   //查询文章列表
      //   getAction('/gateway/gatewayArticle/list',{pageSize:-1,isRelease:'Y',columnId:this.id}).then((res)=>{
      //     if(res.success){
      //       let list = res.result.records||res.result;
      //       this.articleList = list;
      //     }
      //   });
      // }
    },
    getFileName(url){
      if(!url) return '';
      let filePaths = url.split('/');
      let fileAllName = filePaths[filePaths.length-1]
      return fileAllName.substring(0,fileAllName.lastIndexOf('_'));
    },
  },
}
</script>

<style scoped>
</style>