diff --git a/src/components/tree.component.vue b/src/components/tree.component.vue
new file mode 100644
index 0000000..60779ab
--- /dev/null
+++ b/src/components/tree.component.vue
@@ -0,0 +1,36 @@
+<template>
+    
+    <el-tree :data="treeData" :props="{children:'children',label:'name'}" :expand-on-click-node="false" default-expand-all highlight-current @node-click="handleNodeClick">
+        </el-tree>
+</template>
+<script lang="ts">
+import { Component, Emit, Prop, Vue } from 'vue-property-decorator';
+import mapboxgl from "mapbox-gl";
+import "mapbox-gl/dist/mapbox-gl.css"
+import UnitService from '@/service/unit.service';
+@Component
+export default class UnitTreeComponent extends Vue {
+    public unitService:UnitService = new UnitService();
+    public treeData = [] as any;
+
+    @Emit("callback")
+    handleNodeClick(data){
+        // 
+    }
+
+    created(){
+        this.unitService.getUnitTree().then(res=>{
+            this.treeData = res.data;
+        })
+    }
+    beforeDestory(){
+
+    }
+}
+</script>
+<style lang="scss" scoped>
+.map{
+    width: 100%;
+    height: 100%;
+}
+</style>
\ No newline at end of file