feat: config global loading and useLoading default value is false

src/components/common/SingleApp.vue

@@ -1,13 +1,15 @@
 <script setup lang="ts">
 import { darkTheme, zhCN, dateZhCN } from 'naive-ui'
 import { useVAdmireConfigStore } from '~/store'
+import BaseSpin from '~/components/common/BaseSpin.vue'
 
 defineOptions({
   name: 'SingleApp',
 })
 
 const { naiveThemeOverrides, themeMode } = storeToRefs(useVAdmireConfigStore())
 
+const { isLoading, loadingText } = inject('loading') as { isLoading: boolean, loadingText: string }
 </script>
 
 <template>
@@ -22,7 +24,12 @@ const { naiveThemeOverrides, themeMode } = storeToRefs(useVAdmireConfigStore())
       <NNotificationProvider placement="bottom-right">
         <NDialogProvider>
           <NMessageProvider>
-            <slot />
+            <BaseSpin
+              :is-loading="isLoading"
+              :loading-text="loadingText"
+            >
+              <slot />
+            </BaseSpin>
           </NMessageProvider>
         </NDialogProvider>
       </NNotificationProvider>

src/composables/useLoading/index.ts

@@ -2,8 +2,8 @@
  * Can configure the loading property of the BaseSpin component or the Button component to implement the Loading effect
  * @returns
  */
-export const useLoading = () => {
-  const isLoading = ref(false)
+export const useLoading = (defaultValue = false) => {
+  const isLoading = ref(defaultValue)
 
   const setLoading = async (value: boolean) => {
     isLoading.value = value

src/modules/index.ts

@@ -3,10 +3,12 @@ import { usePinia } from './pinia'
 import { useVueRouter } from './vue-router'
 import { useI18n } from './i18n'
 import { useClipboard } from './clipboard'
+import { useAppProvide } from './provide'
 
 export default async (app: App) => {
   useVueRouter(app)
   usePinia(app)
   useI18n(app)
   useClipboard(app)
+  useAppProvide(app)
 }

src/modules/provide.ts

@@ -0,0 +1,14 @@
+import { App } from 'vue'
+
+/**
+ * Config app provide global property
+ * @param app
+ */
+export const useAppProvide = (app: App) => {
+  const { isLoading, setLoading } = useLoading(false)
+  app.provide('loading', {
+    isLoading,
+    setLoading,
+    loadingText: '加载中...',
+  })
+}