From 9a8f75d6d0857debcd246ad1204ea48d487d0ef6 Mon Sep 17 00:00:00 2001
From: ivamp <im@ivampiresp.com>
Date: Thu, 7 Dec 2023 21:28:17 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=20Loading?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/documents/View.vue | 53 ++++++++++++++++++++----------------
 1 file changed, 30 insertions(+), 23 deletions(-)

diff --git a/src/views/documents/View.vue b/src/views/documents/View.vue
index 65345c8..a6c8fc6 100644
--- a/src/views/documents/View.vue
+++ b/src/views/documents/View.vue
@@ -1,35 +1,42 @@
 <script setup>
+import router from "@/router";
+import { ref } from "vue";
+import { document } from "@/plugins/api";
+import { MdPreview } from "md-editor-v3";
+import LoadingComponent from "@/components/Loading.vue";
 
-import router from '@/router';
-import { ref } from 'vue'
-import { document } from '@/plugins/api';
-import { MdPreview } from 'md-editor-v3';
-
-
-const libraryId = parseInt(router.currentRoute.value.params.LibraryId)
-const documentId = parseInt(router.currentRoute.value.params.DocumentId)
+const libraryId = parseInt(router.currentRoute.value.params.LibraryId);
+const documentId = parseInt(router.currentRoute.value.params.DocumentId);
+const loading = ref(true);
 
 const docu = ref({
-    Title: "",
-    Content: ""
-})
-
-document.libraryLibraryIdDocumentDocumentIdGet(libraryId, documentId).then((r) => {
-    docu.value = r.data
-
-    console.log(r.data)
-})
+  Title: "",
+  Content: "",
+});
 
+document
+  .libraryLibraryIdDocumentDocumentIdGet(libraryId, documentId)
+  .then((r) => {
+    docu.value = r.data;
 
+    console.log(r.data);
+  })
+  .finally(() => {
+    loading.value = false;
+  });
 </script>
 
-
 <template>
-
+  <div>
     <v-btn @click="router.back(0)">返回</v-btn>
 
-    <h2>{{ docu.Title }}</h2>
+    <div v-if="loading">
+        <LoadingComponent> </LoadingComponent>
+    </div>
+    <div v-else>
+      <h2>{{ docu.Title }}</h2>
 
-    <MdPreview  :modelValue="docu.Content" />
-
-</template>
\ No newline at end of file
+      <MdPreview :modelValue="docu.Content" />
+    </div>
+  </div>
+</template>