<template>
  <el-dialog v-dialogDrag title="选择机构" :visible.sync="JGstatus" :close-on-click-modal="false" :before-close="cancel"
    class="dialogClass">
    <el-tree highlight-current :expand-on-click-node="false" :data="treeList" :props="defaultProps" default-expand-all
      @node-click="handleNodeClick">
      <span slot-scope="{ node, data }" class="custom-tree-node">
        <!--可以根据情况，以数据类型来显示不同的图标或图片-->
        <svg-icon icon-class="wjj" style="margin-right: 5px; color: rgb(255, 207, 92)"
          v-if="data.childClass.length > 0" />
        <svg-icon icon-class="wj" style="margin-right: 5px; color: rgb(255, 207, 92)" v-else />
        <span>{{ node.label }}</span>
      </span>
    </el-tree>
  </el-dialog>
</template>
<script>
  export default {
    props: {
      JGstatus: {
        type: Boolean,
        default: () => false,
      },
      treeList: {
        type: Array,
        default: () => [],
      },
    },
    data() {
      return {
        defaultProps: {
          label: "deptNameMerge",
          children: "childClass",
        },
      };
    },
    methods: {
      cancel() {
        this.$emit("cancel");
      },
      handleNodeClick(item, node) {
        this.$emit('handleNodeClick', item)
      },
    },
  };

</script>
