<template>
  <div class="tree" :style="{ width: width, height: '100%' }">
    

    <el-tree
    :data="treeData"
    show-checkbox
    node-key="id"
    :default-expanded-keys="[1, 2]"
    :default-checked-keys="[3]"
    :props="defaultProps"
  />

  </div>
</template>

<script setup>
  import { defineProps } from 'vue';

  const defaultProps = {
  children: 'children',
  label: 'label',
  }
  const props = defineProps({
    treeData: {
      type: Array
    }
  })
</script>

<style lang="scss" scoped>
  .tree {
    width: 100%;
    overflow: auto;
    height: calc(100% - 50px)!important;
  }
</style>