From b485d27acf7502d1e7d0f30414931f322cbf83ac Mon Sep 17 00:00:00 2001
From: ivamp <im@ivampiresp.com>
Date: Wed, 6 Dec 2023 23:00:44 +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/components/Loading.vue   | 22 ++++++++++++++++++++++
 src/views/libraries/List.vue | 14 +++++++++++---
 2 files changed, 33 insertions(+), 3 deletions(-)
 create mode 100644 src/components/Loading.vue

diff --git a/src/components/Loading.vue b/src/components/Loading.vue
new file mode 100644
index 0000000..94dfb77
--- /dev/null
+++ b/src/components/Loading.vue
@@ -0,0 +1,22 @@
+<template>
+    <div
+    class="d-flex text-center"
+    style="
+      width: 100%;
+      height: 60%;
+      justify-content: center;
+      align-items: center;
+    "
+  >
+    <div>
+      <div>
+        <v-progress-circular
+          indeterminate
+        ></v-progress-circular>
+      </div>
+      <div class="mt-5">
+        <p>请稍后...</p>
+      </div>
+    </div>
+  </div>
+</template>
\ No newline at end of file
diff --git a/src/views/libraries/List.vue b/src/views/libraries/List.vue
index f74044b..70ce907 100644
--- a/src/views/libraries/List.vue
+++ b/src/views/libraries/List.vue
@@ -1,5 +1,8 @@
 <template>
-  <v-container v-if="libraries.Data">
+  <LoadingComponent v-if="loading">
+
+  </LoadingComponent>
+  <v-container v-else>
     <h1>资料库</h1>
 
     {{ selected_ids }}
@@ -53,17 +56,22 @@
 
 <script setup>
 import { library } from "@/plugins/api";
-import { watch } from "vue";
 import { ref } from "vue";
+import LoadingComponent from "@/components/Loading.vue";
+
+const loading = ref(false)
 
 const page = ref(1);
 const libraries = ref({});
 
 const load = () => {
+  loading.value = true
   library.librariesGet(page.value).then((r) => {
     libraries.value = r.data;
     console.log(r.data.Data);
-  });
+  }).finally(() => {
+    loading.value = false
+  })
 };
 
 load();