<template>
  <div class="el-resource_show_list_pc_2">

    <div class="resource_show_list_pc_2">
   <div class="container">
      <div class="row">
         <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
            <div class="resource-big-title">
               <span class="sp1">{{names}}</span>
               <span class="sp2">共<i>{{totals}}</i>{{names}}</span>
            </div>
         </div>
      </div>
      <div class="row">
           <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
              <div class="screening-body">
                 <div class="screening-body-bd">
                    <div class="screening-body-part">
                       <div v-for="(list,i) in treeList" :key="i" class="screening-body-list clearfix"><!--条目-->
                          <span class="tit">{{list.catName}}</span>
                          <ul>
                            <!-- <li class="ili" @click="getList('全部',$event)"> 全部 </li>-->
                             <li class="ili" @click="getList(item,$event)" v-for="(item,j) in list.children" :key="j">
                               <span v-if="j!=0">|</span>  {{item.catName}}
                             </li>

                          </ul>
                       </div>


                    </div>
                 </div>
              </div>
           </div>
        </div>
      <div class="row">
         <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
            <div class="resource-tab">
              <ul class="ul1">
                  <li :class="{active:fileType=='1'}"><a  @click="swipe('1')" href="javascript:void(0)">视频</a></li>
                  <li :class="{active:fileType=='2'}"><a  @click="swipe('2')" href="javascript:void(0)">音频</a></li>
                  <li :class="{active:fileType=='3'}"><a  @click="swipe('3')" href="javascript:void(0)">文档</a></li>
                  <li :class="{active:fileType=='0'}"><a  @click="swipe('0')" href="javascript:void(0)">其他</a></li>
               </ul>
              <!-- <div class="resource-tab-right">
                  <span class="search">
                     <input type="text" class="inp1" placeholder="在结果中搜索">
                     <input type="button" class="btn1">
                  </span>
                  <span class="resource-tab-style">
                     <a href="" class="active"><span class="iconfont icon-liebiao"></span></a>
                     <a href=""><span class="iconfont icon-kuai"></span></a>
                  </span>
               </div>-->
            </div>
         </div>
      </div>
      <div class="row">
         <div v-for="(list,i) in resArr" :key="i" class="col-lg-3 col-md-4 col-sm-6 col-xs-12"><!--循环-->
            <div class="resource-videolist">
               <span class="sp1">
                  <a target="_bank"  :href="'/resourcedetail?id='+list.id" class="play-btn">

                  <img v-if="list.photo" class="cover" :src="list.photo" alt="">
                  <img v-else class="cover" src="../../theme-chalk/src/images/resource-pic.png" alt="">
                  </a>
               </span>
               <span class="sp2"><a target="_bank" :href="'/resourcedetail?id='+list.id">{{list.title}}</a></span>
               <span class="sp3">
                  <span class="spp1">{{list.siteName}}</span>
                  <span class="spp2">{{Number(list.browseNum)}}</span>
               </span>
            </div>
         </div>

      </div>
      <div class="row">
         <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
            <div class="search-result-page">
               <el-pagination
                    background
                    layout="total, sizes, prev, pager, next, jumper"
                    :page-sizes="[8, 16, 32, 64]"
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="currentPage4"
                    :total="totalCount">
                    </el-pagination>
            </div>
         </div>
      </div>
   </div>
</div>
  </div>
</template>

<script>
  import $ from 'fy-kit';
  import formMixin from '../../../src/mixins/formMixin';
  import lenye_base from 'lenye_base';
  import msg from '../../message';
  import pagination from "../../pagination";
export default {
  name: 'ElResourceShowListPc2',
  mixins: [formMixin],
  model: {},
  created() {
    //if($.util.getCookie('userData')){
      this.siteId =  lenye_base.site_data.getsiteData().siteId
   // }
    this.names = $.util.urlParams('name');
  },
  data(){
    return {
      name:'',
      siteId:'',
      treeList:[],
      rows:8,
      page:1,
      totalCount:0,
      currentPage4:1,
      title:'',
      resArr:[],
      totals:0,
      fileType:'1',
      names:''
    }
   },
   mounted() {
     this.$nextTick(function(){
       this.init();
       this.getIndex()
     })

   },
    components: {
      msg,
      pagination
    },
   computed: {},
   methods: {
     swipe(str){
       this.fileType = str;
       this.getIndex();
     },
      handleSizeChange(val) {
        this.rows = val;
         this.getIndex();
    },
    handleCurrentChange(val) {
        this.page = val;
        this.getIndex();
    },
     getList(list,ev){
       /*if(list=='全部'){
          this.title = "";
       }else{
         this.title = list.catName;
       }*/
        var ele =  $._.default(ev.target);
        if(ele.hasClass('active')){
          ele.removeClass('active');
          this.title = '';
        }else{
           ele.parents('.screening-body-part').find('.ili').removeClass('active');
           ele.addClass('active');
           this.title = list.catName;
        }

        this.getIndex();


     },
     getIndex(){
       var obj = {
              resType:'资源',
               fileType:this.fileType
            }
       if(this.title){
         obj['csName'] = this.title;

       }
        $.util
        .ajax(
          lenye_base.base_data.getapiUrl() +
            "/lucene-service/common/pageQuery.do",
          lenye_base.base_data.getformatting({
            indexName: 'res-center',

            queryType: 1,
            rows: this.rows,
            page:this.page,
            sorts: '',
            queryParams:JSON.stringify(obj)
          })
        )
        .then(res => {
          if (res.success == "1") {

              this.resArr = res.data;
              if(!this.title){
                this.totals = res.totalCount;
              }
              this.totalCount = res.totalCount;
          } else {
            msg.error(res.message);
          }
        });
     },
     init(){
        $.util
        .ajax(
          lenye_base.base_data.getapiUrl() +
            "/resource-service/common/resCategory/queryUsableTree.do",
          lenye_base.base_data.getformatting({
            siteId:this.siteId,
            cascade:2,
            parentName:this.names
          })
        )
        .then(res => {
            if(res.success == '1'){
                this.treeList = res.data;
            }else{
                msg.error(res.message);
            }
        })
     }
   },
};
</script>

