<template>
<div class='content'>
  <!--搜索-->
  <div class="search_box">
    <input placeholder="请输入关键字..." class="search" v-model="keywords">
    <navigator class="search_icon"><img src='/static/imgs/search_icon.png'></navigator>
  </div>
  <!--搜索-->
  <!--搜索历史-->
  <div class="history">
    <p>
      <span>搜索历史：</span>
      <img class="delete_icon" src='/static/imgs/delete_icon.png'>
    </p>
    <a>危险驾驶</a>
    <a>交通事故</a>
    <a>离婚</a>
    <!--搜索历史最多显示最近10个-->
  </div>
  <!--搜索历史-->
  <!--选项卡-->
  <div class="tab">
    <div class="tab_item" v-for='(v,i) in typeArray' :key='i'  @click="checkedBox(i,v.type,v.title)" v-bind:class="{ checked:changeOne == i}">{{v.title}}<span class="number">22</span></div>
  </div>
  <!--选项卡-->
  <!--列表-->
  <div class="list_box">
    <navigator v-for='(v,i) in lists' :key='i' :url="'../lawinfo/main?title='+title+'&gid='+v.itemgid+'&lib='+lib">
      <div class="list">
        <p v-if="v.itemvalue =='' || v.itemvalue ==null"><rich-text :nodes="v.itemtitle"></rich-text></p>
        <p v-else><rich-text :nodes="v.itemvalue"></rich-text></p>
        <span>{{v.itemftitle}}</span>
      </div>
    </navigator>
  </div>
  <!--列表-->
</div>
</template>

<script>
  export default {
    data() {
      return {
        keywords: '',
        number: '',
        lib: '',
        changeOne: 0,
        lists: [],
        type: '',
        typeChild: '',
        title: '',
        pagenum: 1,
        pagesize: 10,
        keyTitle: '',
        keyContent: '',
        anyou: '',
        Fdate_b: '',
        Fdate_e: '',
        typeArray: [
          {type:'flfg', title: '法律法规' },
          { type:'cpws',title: '裁判文书' },
          { type:'cpal',title: '裁判案例' }
        ],
        loaded: false
      }
    },
    methods: {
      loadArticles () {
      },
      getList () {
        var path = ''
        // if (this.typeChild == 'gjfl'){
        //   this.lib = 'zyfl'
        // } else if (this.typeChild=='gjfg'){
        //   this.lib = 'dffl'
        // }else if(this.typeChild=='lfzl'){
        //   this.lib = 'lf'
        // }else if(this.typeChild=='sfzl'){
        //   this.lib = 'sf'
        // }
        var typeChild = this.typeChild
        if (typeChild == 'flfg') {
          // this.lib = 'cpws_cp'
          // this.typeChild = 'gjfg'
          path = 'reg/getLawsRegulationsList'
        }else if(typeChild == 'cpws'){
          path = 'reg/getLawReferee'
          // this.typeChild = 'ms'
          this.lib = 'cpws_cp'
        }else if(typeChild == 'cpal'){
          path = 'reg/getLawCase'
          // this.typeChild = 'ms'
          this.lib = 'cpws_al'
        }
        console.log(this.lib)
        wx.showLoading({ title: '正在加载' })
        wx.request({
          url: this.rootUrl + path,
          method: 'get',
          header: {'content-type': 'application/x-www-form-urlencoded'},
          data:{
            pagenum: this.pagenum,
            pagesize: this.pagesize,
            keyTitle: this.keyTitle,
            keyContent: this.keyContent,
            anyou: this.anyou,
            type: this.typeChild,
            Fdate_b: this.Fdate_b,
            Fdate_e: this.Fdate_e,
            sessionID: wx.getStorageSync('sessionID')
          },
          success: res=> {
            if(res.statusCode=='500'){
              this.service.getUnionId(this.rootAvatar,this.rootUrl).then(res=>{
                console.log(res)
                this.loadArticles()
              })
            }else{
              console.log(1,res)
              this.lists = []
              this.lists = res.data.value
              this.loaded = true
              wx.hideLoading()
            }
          },
          fail: res=> {
            console.log(res)
          }
        })
      },
      checkedBox: function (index,typeChild,title) {
        this.changeOne = index
        this.typeChild = typeChild
        this.title = title
        console.log(typeChild)
        this.getList()
      },
      search () {
        this.keyContent = this.keywords
        this.keyTitle = this.keywords
        this.anyou = this.keywords
        this.getList()
      }
    },
    onLoad(){
      this.title = this.$root.$mp.query.title
      this.type = this.$root.$mp.query.type
      wx.setNavigationBarTitle({title: this.title})
    },
    onShow() {
      this.loadArticles()
    },
    onUnload(){
      this.lists = []
      this.loaded = false
    }
  }
</script>
<style lang="stylus" scoped>
.content
  margin 0 3%
  width 94%
  font-size 30rpx
.search_box
  margin 30rpx 0
  height 80rpx
  padding 0 20rpx
  background #eee
  border-radius 40rpx
.search_icon
  float right
  display inline-block
  width 80rpx
  height 80rpx
.search_icon img
  width 100%
  height 100%
.search
  float left
  width 80%
  height 80rpx
  padding 0 10rpx
  line-height 80rpx
  color #333
.history p
  color #333
  line-height 40rpx
  margin-bottom 20rpx
.delete_icon
  float right
  width 40rpx
  height 40rpx
.history a
  margin 0 20rpx 20rpx 0
  display inline-block
  padding 20rpx 25rpx
  background-color #eee
  border-radius 8rpx
.tab
  width 100%
  height 80rpx
  background-color #fff
  border-bottom 1rpx solid #dedede
.tab_item
  display inline-flex
  justify-content center
  align-items center
  width 33%
  text-align center
  line-height 80rpx
.checked
  border-bottom 5rpx solid #aa001a
.number
  margin-left 10rpx
  display inline-block
  width 50rpx
  height 36rpx
  background-color #d9534f
  border-radius 18rpx
  color #fff;
  font-size 24rpx
  line-height 36rpx
.list_box
  width 100%
  background-color #fff
.list
  padding 20rpx 0
  border-bottom 1px solid #dedede
.list p
  margin-bottom 10rpx
  line-height 40rpx
  overflow hidden
  text-overflow ellipsis
  display -webkit-box
  -webkit-line-clamp 2
  -webkit-box-orient vertical
.list span
  font-size 28rpx
  color #999
.line
  margin 0 20rpx
  color #999
</style>

