nyzy_vue/src/views/gateway/detailedPage.vue

<template>
  <div style="background-color: #f7f7f7;">
    <headerView/>

		<div class="weizhibox">
			<div class="weizhi">
				<span><img src="img/shouye.png" style="width: 16px;margin: 11px 4px 0 0;"></span>
				<span>当前位置：</span>
				<a href="javascript:void(0);" @click="$to('home')">首页></a>
				<a href="javascript:void(0);" v-show="parentData.name!='首页' && parentData.name!='其他' && parentData.name!=thisColumn.name" @click="$to('listPage',{pid:thisColumn.parent?thisColumn.parent:thisColumn.id,id:thisColumn.parent?thisColumn.id:null})">{{parentData.name}} > </a>
				<a href="javascript:void(0);"  @click="$to('listPage',{pid:thisColumn.parent?thisColumn.parent:thisColumn.id,id:thisColumn.parent?thisColumn.id:null})">{{thisColumn.name}}</a>
			</div>
		</div>
		<div class="er_contant clearfloat">
			<div class="cyh_contr " style="width:100%;">
				<div class="xqer_cont">
					<h3>{{articleData.title}}</h3>
					<div class="xqer_date">
						<span>发布日期：<span>{{articleData.updateTime || articleData.createTime}}</span></span>
						<span v-show="articleData.author">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;作者：<span>{{articleData.author}}</span></span>
					</div>
					<p v-html="linkOpenToNewPage(articleData.content)"></p>
					<div v-if="articleData.files" style="cursor:pointer;">
						<span>附件：</span>
						<div v-if="articleData.files.indexOf(',')>-1">
							<div v-for="(fj,index) in articleData.files.split(',')" :key="index">
								<span  @click="downloadFile(fj)">{{fujian(fj)}}</span>
							</div>
						</div>
						<div v-else>
						<span  @click="downloadFile(articleData.files)">{{fujian(articleData.files)}}</span>
						</div>
					</div>
				</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:{
    fujian(record){
      var arr = record.split("/");
      return arr[1];
    },
    linkOpenToNewPage(v){
      if(v && v.indexOf("<a ")>-1){
        v = v.replaceAll("<a ",'<a target="_blank"')
      }
      return v;
    },
    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.thisColumn = data.currentGatewayColumn
          //查出根节点
          if(data.parentGatewayColumn){
            this.parentData = data.parentGatewayColumn
          }else{
            this.parentData = data.currentGatewayColumn
          }

          if(data.gatewayColumnList && data.gatewayColumnList.length > 0){
            this.columnList = data.gatewayColumnList
          }else{
            this.columnList = [];
            this.columnList.push(data.currentGatewayColumn);

          }
          
          console.log('columnList', this.columnList );

          // 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 lang="less">
/deep/ img{
  width: auto !important;
}
</style>