|
@@ -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()
|