✨ async load AnnotationSkeleton

anucvml · Feb 28, 2022 · 68d9cd3 · 68d9cd3
1 parent f6e2b3d
commit 68d9cd3
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/src/pages/annotation/Annotation.vue b/src/pages/annotation/Annotation.vue
@@ -1,6 +1,9 @@
 <template>
   <AnnotationSkeleton v-if="!annotationStore.hasVideo"/>
-    <q-card flat v-else>
+  <q-card
+      flat
+      v-else
+  >
     <KeyframePanel/>
     <div class="row justify-center">
       <div class="col-12 col-md">
@@ -19,16 +22,18 @@
 </template>
 
 <script setup>
+import { defineAsyncComponent } from 'vue'
 import ActionTable from '~/pages/annotation/ActionTable.vue'
 import CanvasPanel from '~/pages/annotation/CanvasPanel.vue'
 import ControlPanel from '~/pages/annotation/ControlPanel.vue'
 import { useAnnotationStore } from '~/store/annotation.js'
 import { useConfigurationStore } from '~/store/configuration.js'
 import { useMainStore } from '~/store/index.js'
 import { usePreferenceStore } from '~/store/preference.js'
-import AnnotationSkeleton from './AnnotationSkeleton.vue'
 import KeyframePanel from './KeyframePanel.vue'
 
+const AnnotationSkeleton = defineAsyncComponent(() => import('./components/AnnotationSkeleton.vue'))
+
 const annotationStore = useAnnotationStore()
 const configurationStore = useConfigurationStore()
 const preferenceStore = usePreferenceStore()

diff --git a/src/pages/annotation/AnnotationSkeleton.vue → ...otation/components/AnnotationSkeleton.vue b/src/pages/annotation/AnnotationSkeleton.vue → ...otation/components/AnnotationSkeleton.vue