<template>
  <treeselect v-model="targetId" :options="organLists" :disable-branch-nodes="nodesDisEnable" :normalizer="normalizerOrgan"
              placeholder="选择数据范围" noResultsText="未搜索到相关结果" clearable/>
</template>

<script>
import Treeselect from "@riophae/vue-treeselect";
import store from '@/store'
import "@riophae/vue-treeselect/dist/vue-treeselect.css";

export default {
  name: "ScopeTree",
  components: {Treeselect},
  props: {
    /* 编辑器的内容 */
    bindId: {
      type: Number,
      default: undefined
    },
    /* 父节点是否可选 默认是可选 */
    nodesDisEnable:{
      type: Boolean,
      default: false
    },
    /*显示的模式 0 阶梯式 1 列表式 2 列表式仅包含组织 */
    mode:{
      type:Number,
      default: 0
    },
    /* 图片大小 */
    placeholder: {
      type: String,
      default: "选择数据范围" //kb
    },
    /* 默认选中第一个 */
    selectFirst: {
      type: Boolean,
      default: true
    }
  },
  data() {
    return {
      organLists:[],
      targetId:undefined,
    }
  },
  created() {
    if(this.mode == 0){
      this.organLists = this.handleTree(store.getters.dataScope,"id")
    }
    if(this.mode == 1){
      this.organLists = store.getters.dataScope
    }
    if(this.mode == 2){
      this.organLists = this.filterOrgans(store.getters.dataScope)
    }
    // 如果不存在 就显示第一个
    if((this.bindId == undefined || this.bindId == 0) && this.selectFirst){
      this.targetId = this.organLists[0].id
    }else{
      this.targetId = this.bindId
    }


  },
  watch:{
    targetId(val,olval) {
      this.$emit("onSelect",val)
    },
    bindId(val,olval) {
      this.targetId = this.bindId
    }
  },
  methods: {

    filterOrgans(organs){
      return organs.filter(item => item.type === '003');
    },

    normalizerOrgan(node) {
      if (node.children && !node.children.length) {
        delete node.children;
      }
      return {
        id: node.id,
        label: node.name,
        children: node.children
      };
    },
  }
}
</script>

<style scoped>

</style>
