<template>
  <div class="nodeTag">
    <el-tree
        ref="treeForm"
        :data="nodeBaseLabelsList"
        show-checkbox
        node-key="id"
        :props="defaultProps"
        :default-expanded-keys="[nodeSelectedId]"
        :default-checked-keys="[nodeSelectedId]"
        check-strictly
        @check-change="changeNodeLabel"
      >
      </el-tree>

  </div>
</template>

<script>
export default {
  props: {
    isTheRadio: Boolean// 树结构是否单选 true 为单选  fasle为多选（默认不传为fasle）
  },
  data() {
    return {
      defaultProps: {
        label: 'name'
      },
      nodeBaseLabelsList: [], // 节点树数据
      treeIndex: 0,
      nodeSelectedId:'',//默认选中的id
      labelNodesList: [],//
    }
  },
  mounted() {
    this.getReturnNodeBase(this.objectType)
  },
  methods: {
    // 监听树
    changeNodeLabel(data, checked, node) {
      const checkedIdS = this.$refs.treeForm.getCheckedKeys()//获取选中的值
      if (this.isTheRadio) this.setTheRadio(data, checked, node)// 是否设置单选
    },
    // 设置单选
    setTheRadio(data, checked, node) {
      this.treeIndex++
      if (this.treeIndex % 2 === 0) {
        if (checked) {
          this.nodeSelectedId = ''
          this.$refs.treeForm.setCheckedNodes([])
          this.$refs.treeForm.setCheckedNodes([data])
          // 交叉点击节点
        } else {
          this.$refs.treeForm.setCheckedNodes([])// 点击已经选中的节点，置空
        }
      }
    },
    // 获取节点树数据
    getReturnNodeBase() {
       // 初始赋值
       this.labelNodesList =[]
        if (this.newNode.cname) {
          this.$nextTick(() => {
            this.nodeSelectedId = this.newNode.cname//设置初始值
          })
          //树子结构触发选中
          this.labelNodesList.forEach(item => {
            if (item.cname === this.newNode.cname && item.parentId) {
              this.$refs.treeForm.setCheckedNodes([item])
              this.addNodeLabel()
            }
          })
        }
    },
  }
}
</script>