<template>
  <div class='content'>
    <!--分类跳转-->
    <div class="classify">
      <navigator v-for='(v,i) in typeArray' :key='i'  @click="checkedBox(i,v.type,v.title)" v-bind:class="{ checked:changeOne == i}">{{v.title}}</navigator>
    </div>
    <!--分类跳转-->
    <!--搜索-->
    <div class="search_box">
      <input placeholder="请输入关键词..." class="search" v-model="keywords">
      <span class="search_icon" @click="searchOf()"><img src='/static/imgs/search_icon.png'></span>
    </div>
    <!--搜索-->
  </div>
</template>

<script>
  import NoData from '@/components/NoData'
  export default {
    components:{NoData},
    data() {
      return {
        keywords: '',
        lists: [],
        type: 'flfg',
        title: '法律法规',
        changeOne: 0,
        typeArray: [
          {type:'flfg', title: '法律法规' },
          { type:'cpws',title: '裁判文书' },
          { type:'cpal',title: '裁判案例' }
        ],
        valid: false,
        loaded: false
      }
    },
    methods: {
      loadArticles () {
        wx.request({
          url: this.rootUrl + 'reg/getAll',
          method: 'get',
          header: { 'content-type': 'application/x-www-form-urlencoded' },
          data: { sessionID: wx.getStorageSync('sessionID') },
          success: res => {
            console.log(res.data)
            if (res.statusCode == '500') {
              this.service.getUnionId(this.rootAvatar, this.rootUrl).then(res => this.getSchedule(showLoading))
            } else {
              this.valid = res.data
            }
          }
        })
      },
      checkedBox: function (index,type,title) {
        this.changeOne = index
        this.type = type
        this.title = title
        console.log(this.keywords)
        // this.getList()
      },
      searchOf: function () {
        let valid = this.valid
        if(valid === true){
          wx.navigateTo({
            url: '../lawlist/main?keywords='+this.keywords+'&title='+this.title+'&type='+this.type,
            events: {
              // 为指定事件添加一个监听器，获取被打开页面传送到当前页面的数据
              acceptDataFromOpenedPage: function(data) {
                console.log(data)
              },
              someEvent: function(data) {
                console.log(data)
              }
            },
            success: function(res) {
              // 通过eventChannel向被打开页面传送数据
            }
          })
        }else{
          wx.showModal({
            title:'',
            content: '该功能试用期已到,请联系管理员',
            showCancel: false,
            confirmText: '知道了'
          })
        }
      }
    },
    onLoad(){
      // this.title = this.$root.$mp.query.title
      // this.type = this.$root.$mp.query.type
      // wx.setNavigationBarTitle({title: this.title})
      this.keywords = ''
      this.changeOne = 0
      this.lib = ''
    },
    onShow() {
      this.loadArticles()
    },
    onUnload(){
      this.lists = []
      this.keywords = ''
      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
  .classify
    margin 50rpx 10%
    width 80%
    padding 25rpx 0
  .classify navigator
    margin-right 1%
    display inline-block
    width 32%
    height 80rpx
    background-color #eee
    color #333
    line-height 80rpx
    text-align center
    border-radius 8rpx
  .classify navigator.checked
    background-color #aa001a !important
    color #fff !important
  .classify navigator:last-child
    border-right none !important
</style>

