update library views

src/pages/library/CardMap.vue

@@ -1,9 +1,8 @@
 <template>
-  <b-overlay :show="loading" class="h-100">
+  <b-overlay :show="texts === undefined" class="h-100">
     <svg
       width="100%" height="100%"
       ref="svg" id="vis"
-      v-if="textsDepart"
       :view-box.camel="viewBox"
     >
       <g id="cards">
@@ -14,8 +13,8 @@
           :transform="`rotate(${node.rotate})`"
         >
           <text-mini-card
-            :id="textsDepart[i].id"
-            :text-data="textsDepart[i]"
+            :id="texts[i].id"
+            :text-data="texts[i]"
           />
         </foreignObject>
       </g>
@@ -44,12 +43,12 @@ export default {
 
   data () {
     return {
-      loading: true,
       width: 100,
       height: 100,
-      nodes: new Array(20).fill().map((_, i) => ({ x: i, rotate: randomUniform(-25, 25)() })),
+      nodes: undefined,
       simulation: forceSimulation(),
-      viewBox: null
+      viewBox: null,
+      texts: undefined
     }
   },
 
@@ -65,8 +64,11 @@ export default {
   },
 
   created () {
-    this.$store.dispatch('GET_TEXTS_DEPART').then(() => {
-      this.loading = false
+    this.$store.dispatch('INIT_LIBRARY_MAP').then(data => {
+      this.texts = data
+      this.nodes = data.map((node, i) => {
+        return { x: i, rotate: randomUniform(-25, 25)() }
+      })
 
       this.$nextTick(() => {
         this.updateSize()