|
@@ -1,24 +1,26 @@
|
|
|
<template>
|
|
|
- <div class="library-list">
|
|
|
- <div class="library-list-container" @click="onContainerClick">
|
|
|
- <div v-for="([char, nodes]) in filteredNodes" :key="char">
|
|
|
- <h3>{{ char }}</h3>
|
|
|
-
|
|
|
- <div class="library-list-nodes-group">
|
|
|
- <node-view
|
|
|
- v-for="node in nodes" :key="char + '-' + node.id"
|
|
|
- :node="node"
|
|
|
- mode="card"
|
|
|
- @click.native.capture="previewNode = node"
|
|
|
- :preview="previewNode === node"
|
|
|
- @open-node="$emit('open-node', $event)"
|
|
|
- @open-child="$emit('open-node', { parentId: node.id, ...$event })"
|
|
|
- :style="`--opacity: ${getStrangenessOpacity(strangeness, node)};`"
|
|
|
- />
|
|
|
+ <b-overlay :show="filteredNodes === undefined" class="h-100">
|
|
|
+ <div class="library-list">
|
|
|
+ <div class="library-list-container" @click="onContainerClick">
|
|
|
+ <div v-for="([char, nodes]) in filteredNodes" :key="char">
|
|
|
+ <h3>{{ char }}</h3>
|
|
|
+
|
|
|
+ <div class="library-list-nodes-group">
|
|
|
+ <node-view
|
|
|
+ v-for="node in nodes" :key="char + '-' + node.id"
|
|
|
+ :node="node"
|
|
|
+ mode="card"
|
|
|
+ @click.native.capture="previewNode = node"
|
|
|
+ :preview="previewNode === node"
|
|
|
+ @open-node="$emit('open-node', $event)"
|
|
|
+ @open-child="$emit('open-node', { parentId: node.id, ...$event })"
|
|
|
+ :style="`--opacity: ${getStrangenessOpacity(strangeness, node)};`"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
+ </b-overlay>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
@@ -45,7 +47,7 @@ export default {
|
|
|
...mapGetters(['orderedTextsDepart', 'search', 'tags', 'strangeness']),
|
|
|
|
|
|
filteredNodes () {
|
|
|
- if (!this.orderedTextsDepart) return {}
|
|
|
+ if (!this.orderedTextsDepart) return
|
|
|
const nodesGroups = []
|
|
|
const search = this.search.toLowerCase()
|
|
|
this.orderedTextsDepart.forEach(([char, nodes]) => {
|