vue-apps/com.actionsoft.apps.kms.mobile/pages/sub-knwldir1.vue

<template>
  <div class="knwldir">
    <van-search v-model="value" placeholder="请输入文件内容关键词" @allSearch="getDimensionCardList"/>
    <div class="content">
      <div class="top">
        <span v-html="tabPath"></span>
      </div>
      <div class="item">
        <van-cell v-for="(item,index) in list" :key="index" is-link :to="{name:'knwlborrow', params: {id:item.id,path:(path+'>'+item.name)}}">
          <i class="awsui-iconfont" :class="item.default">&#58913;</i>{{item.name}}
        </van-cell>
      </div>
		<div class="divide"></div>
		<ul class="list">
			<li v-for="(item,index) in cardlist" :key="index" @click="showDialog = true">
				<div class="left">
					<div class="title">{{item.cardName}}</div>
					<div class="description">
						<label>
							{{item.publishUsername}}
						</label>
						<label v-if="item.cardContext!=''" class="line">|</label>
						<label>
							{{item.publishTime}}
						</label>
						<label class="line">|</label>
						<label>阅读次数：
							<font>{{item.readCount}}</font>
						</label>
						<label class="line">|</label>
						<label>级别：
							<font>{{item.rdoSL}}</font>
						</label>
					</div>
				</div>
				<div class="right">
					<i class="awsui-iconfont">&#xe878;</i>
				</div>
			</li>
		</ul>
    </div>
  </div>
</template>

<script>
  import awsuiAxios from "../awsuiAxios";
  export default {
    name: 'sub-knwldir1',
    data() {
      return {
        value: '',
        id: 0,
        name: '',
        list: [],
		path:"",
		tabPath:""
      }
    },
	  methods:{
		  getDimensionList(){
			  let that = this;
			  awsuiAxios.post({
				  url: "jd",
				  data: {
					  cmd: "com.actionsoft.apps.kms_mobile_center_dimension_tree_json",
					  parentId:this.$route.params.id,
					  isDimensionKnwlPage:false

				  },
			  }).then(function (r) {
				  that.loading = false;
				  if (r.result == "error") {
					  alert(r.msg);
				  } else {
					  that.list = r.data.dimensionJA;
				  }
			  });
		  },
		  getDimensionCardList(){
			  let that = this;
			  awsuiAxios.post({
				  url: "jd",
				  data: {
					  cmd: "com.actionsoft.apps.kms_knwl_center_dimension_card_list_json",
					  dimensionId: this.$route.params.id,
					  curPage: 1,
					  rowsPerPage: 50,
					  sortIndx: "publishTime",
					  sortDir: "down",
					  filter: encodeURIComponent(this.value)

				  },
			  }).then(function (r) {
				  that.loading = false;
				  if (r.result == "error") {
					  alert(r.msg);
				  } else {
					  that.list = r.data.data;
				  }
			  });
		  },

	  },
    created() {
		let path1 = this.$route.params.path.split(">");
    	let pathName = `<span style="color:#378DEC;">知识目录</span>` ;
    	let path1L = path1.length;
    	for(let i=0;i<path1L;i++){
    		if(i<path1L-1){
				pathName+='&gt;'+'<span style="color:#378DEC;">'+path1[i]+'</span>';
			}else{
				pathName+='&gt;'+path1[i];
			}
		}
		this.name= pathName;
    	this.path=this.$route.params.path;
		this.getDimensionList();
    }
  }
</script>

<style scoped>
	.path_title{
		color:#378DEC;
	}
  .knwldir {
    height: 100%;
  }

  .knwldir .content {
    border-top: 0.33px solid #e9e9e9;
    height: calc(100% - 105px);
    overflow-y: auto;
  }

  .knwldir .content .item {
    padding: 0 12px;
    background: #fff;
  }

  .knwldir .content .divide {
    background: #e9e9e9;
    width: 100%;
    height: 12px;
  }

  .knwldir .content .van-cell {
    padding: 8px 0;
    border-bottom: 1px solid #efefef;
  }

  .knwldir .content .van-cell:last-child {
    border-bottom: 0;
  }

  .knwldir .content .van-cell .awsui-iconfont {
    color: #03A76B;
    margin-right: 8px;
  }

  .knwldir .content .van-cell .default {
    color: #CCCCCC;
  }

  .top {
    padding: 9px 12px 7px;
    line-height: 18px;
    border-bottom: 0.33px solid #e9e9e9;
    font-size: 12px;
  }
	.list li {
		float: left;
		padding: 11px 0;
		width: 100%;
		position: relative;
		border-bottom: 0.33px solid #e9e9e9;
	}

	.list li:not(:last-child) {
		border-bottom: 0.33px solid #e9e9e9;
	}

	.list li .left {
		width: calc(100% - 20px);
		white-space: nowrap;
		text-overflow: ellipsis;
		overflow: hidden;
		float: left;
	}

	.list li .left .title {
		font-size: 13px;
		color: #333;
		line-height: 18px;
		margin-bottom: 4px;
	}

	.list li .left .description {
		color: #999999;
		line-height: 15px;
		font-size: 12px;
	}

	.list li .left .description .line {
		display: inline-block;
		margin: 0 8px;
		color: #E8E8E8;
	}

	.list li .right {
		width: 20px;
		text-align: right;
		float: right;
		margin-top: 18px;
	}

	.list li .right .awsui-iconfont {
		color: #a4a4a4;
	}
	.list {
		padding: 0 12px;
		float: left;
		height: calc(100% - 86px);
		overflow-y: auto;
		width: calc(100% - 24px);
	}

	.list span, .list label {
		display: inline-block;
	}
</style>