<template>
  <span>
    <dropdown :model='model' class="auto" id="vc-chooser" v-if="!islist">
      <button type="button" class="btn btn-default dropdown-toggle auto" data-toggle="dropdown" :id="'vc-chooser-button-'+attach">
        <span>{{ textContent }}</span>
        <span class="caret"></span>
      </button>
      <tree :model='model' :is-click="false" slot="dropdown-menu" class="dropdown-menu auto" role="menu">
        <span partial>
          <span class="glyphicon glyphicon-chevron-up" v-show="row.open&&row.data.children.length>0" style="color:balck;"></span>
          <span class="glyphicon glyphicon-chevron-down" v-show="!row.open&&row.data.children.length>0" style="color:balck;"></span>
          <span class="RightTreeCanSelect" v-if="row.data.hasright || $parent.$parent.$parent.permissions" @click.stop="$parent.$parent.$parent.selectclick(row.data)">{{row.data.name}}</span>
          <span class="RightTreeCanNotSelect" v-else>{{row.data.name}}</span>
          <span class="glyphicon glyphicon-ok " v-show="$parent.$parent.$parent.isInStr(row.data.name)" style="color:balck;"></span>
        </span>
      </tree>
    </dropdown>
    <v-select v-if="islist"
              placeholder='请选择'
              :options='childrenOptions'
              @change="selectclick"
              :value-single="true"
              close-on-select clear-button></v-select>
  </span>
</template>
<script>
  import co from 'co'
  import { PagedList, HttpResetClass } from 'vue-client'
  import * as ldapHelper from '../../utils/LdapHelper'

  let saveGen = function * (self) {
    //获取分公司树
    let data = {
      source: self.source,
      userid: self.userid
    }
    let http = new HttpResetClass()
    let ret = yield http.load('POST', `${self.Url}/rs/search`, data, {resolveMsg: null, rejectMsg: null})
    // 去掉前面的两层节点
    ret.data[0].children[0].children.forEach((item) => {
      self.model.push(item)
  })
    // 给资源添加父关系
    ldapHelper.procParent(self.model)
    if (self.islist) {
      self.getOptions()
    }
  }

  export default {
    title: '选择器',
    props: {
      userid: {
        type: String,
        require: true
      },
      // 选中的数据的id号串
      selectData: {
        type: String,
      },
      source: {
        type: String,
        require: true
      },
      textContent: {
        default: '请选择组织'
      },
      attach: {
        type: String,
        default: 'name'
      },
      islist: {
        type: Boolean,
        default: false
      },
      //是否有查看上级的权限
      permissions: {
        type: Boolean,
        default: false
      },
      Url:{
        type: String,
        default:''
      }
    },
    data () {
      return {
        model: [

        ],
        childrenOptions: []
      }
    },
    methods: {
      init () {
        if(this.userid !== undefined) {
          let gen = saveGen(this)
          return co(gen)
        }
      },
      // 当外面传入的选中对象发生变化时调用
      selectDataChange () {
        if (this.selectData) {
          // 当外面传入了新的选中数据后，根据外面传入的数据进行选择
          let str = this.selectData
          let res = ldapHelper.find(this.model, str.substring(0, str.length - 1))
          this.selectclick(res)
        }
      },
      //点击分公司方法
      selectclick (row) {
        this.textContent = row.name
        //tag
        let newobj={
          "res": ldapHelper.getFullName(row, 'name'),
          "resids": ldapHelper.getFullName(row, 'id') + '.',
        }
        this.$emit('re-res', newobj)
      },
      //检查是否显示对勾
      isInStr(val) {
        if(this.textContent==val){
          return true
        }else{
          return false
        }
      },
      getOptions () {
        //tag
        this.toList(this.model)
      },
      toList(val) {
        for (let value of val) {
          this.minNodeList(value)
        }
      },
      minNodeList (val) {
        val.children.length > 0 ? this.toList(val.children) : this.childrenOptions.push({label: val.name, value: val})
      }
    },
    events: {
      'select-changed': function (data) {
        // 事件回调内的 `this` 自动绑定到注册它的实例上
        //this.open(data.val)
      }
    },
    ready () {
      this.init().then(() => {
        this.selectDataChange()
      this.$emit('ready')
    })
    },
    watch: {
      'userid' () {
        let gen = saveGen(this)
        co(gen)
      },
      selectData (curVal, oldVal) {
        this.selectDataChange()
      }
    }
  }
</script>
<style lang="less">
  #vc-chooser {
    .list-group-item {
      background-color: #FFF;
      color: #000;
    }
  }
  #vc-chooser .list-group {
    width: 300px;
  }
</style>
