forked from unjs/unstorage
-
Notifications
You must be signed in to change notification settings - Fork 0
/
FileTree.vue
57 lines (53 loc) · 1.23 KB
/
FileTree.vue
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
<template>
<div class="filetree">
<file-tree-node
:item="tree"
@open="path => $emit('open', path)"
/>
</div>
</template>
<script>
import { defineComponent, inject, ref } from 'vue'
import FileTreeNode from './FileTreeNode.vue'
function unflattenArray (items, toplevelKey = 'root') {
const res = { name: toplevelKey, path: '', children: [] }
for (const item of items) {
const split = item.split(':')
let target = res
for (const name of split) {
let child = target.children.find(c => c.name === name)
if (!child) {
child = {
name,
path: target.path + ':' + name,
children: []
}
target.children.push(child)
target.children = target.children.sort((c1, c2) => c1.name.localeCompare(c2.name))
}
target = child
}
target.path = item
}
return res
}
export default defineComponent({
components: { FileTreeNode },
async setup () {
const storage = inject('storage')
const tree = ref([])
await storage.getKeys().then((_keys) => {
tree.value = unflattenArray(_keys, 'workspace')
})
return {
tree
}
}
})
</script>
<style scoped>
.filetree {
min-width: 300px;
overflow-y: scroll;
}
</style>