<template>
  <div class="drawer-container">
    <div>
      <!-- <h3 class="drawer-title">Page style setting</h3> -->

      <el-tree
        :data="msg"
        :props="defaultProps"
        @node-click="handleNodeClick"
        :highlight-current="true"
        node-key="id"
      ></el-tree>
    </div>
  </div>
</template>

<script>
import ThemePicker from "@/components/ThemePicker"
import bus from "../../../utils/bus"

export default {
  name: "Settings",
  components: { ThemePicker },
   props:["msg"],
  data() {
    return {
      id:'',
     
      defaultProps: {
        children: "children",
        label: "depotName"
      }
    }
  },
  created() {
   
  },

  methods: {
    handleNodeClick(data) {
      // console.log(data);
      this.$emit("handClick", data)
    }
  }
  // mounted(){
  //   var that=this;
  //    bus.$on("leftTree",function(){
  //         that.handleNodeClick(value);
  //       })

  // }
}
</script>

<style lang="scss" scoped>
.drawer-container {
  font-size: 14px;
  line-height: 1.5;
  word-wrap: break-word;

  .drawer-title {
    margin-bottom: 12px;
    color: rgba(0, 0, 0, 0.85);
    font-size: 14px;
    line-height: 22px;
  }

  .drawer-item {
    color: rgba(0, 0, 0, 0.65);
    font-size: 14px;
    padding: 12px 0;
  }

  .drawer-switch {
    float: right;
  }
}
</style>
