|
|
@@ -3,7 +3,11 @@
|
|
|
|
|
|
<template #title><div @click="handleSettingClick" v-log="{ describe: { action: '点击首页标题' } }">首页</div></template>
|
|
|
</headerBar>
|
|
|
- <div class="home-container" v-loading="loading || !syncCompleted" :element-loading-text="!syncCompleted ? '正在同步配置...' : '正在加载...'">
|
|
|
+ <div
|
|
|
+ class="home-container"
|
|
|
+ v-loading="loading || !healthReady || !syncCompleted"
|
|
|
+ :element-loading-text="loadingText"
|
|
|
+ >
|
|
|
<!-- 背景图片 -->
|
|
|
<img src="@/assets/images/home/bg.png" alt="背景图片" class="background-image" />
|
|
|
|
|
|
@@ -25,7 +29,7 @@
|
|
|
import headerBar from "@/components/header-bar/index.vue";
|
|
|
import { useRouter } from "vue-router";
|
|
|
import configInfo from '@/stores/modules/config';
|
|
|
-import { ref, onMounted, onUnmounted } from 'vue';
|
|
|
+import { ref, onMounted, onUnmounted, computed } from 'vue';
|
|
|
import axios from 'axios';
|
|
|
import client from "@/stores/modules/client";
|
|
|
import icpList from '@/utils/ipc';
|
|
|
@@ -36,8 +40,18 @@ import tokenInfo from "@/stores/modules/token";
|
|
|
|
|
|
const router = useRouter();
|
|
|
const loading = ref(true);
|
|
|
+const healthReady = ref(false); // 程序是否已完成自检
|
|
|
const syncLoading = ref(false); // 同步配置的loading状态
|
|
|
const syncCompleted = ref(false); // 同步是否完成
|
|
|
+const loadingText = computed(() => {
|
|
|
+ if (!healthReady.value) {
|
|
|
+ return '程序启动中...';
|
|
|
+ }
|
|
|
+ if (!syncCompleted.value) {
|
|
|
+ return '正在同步配置...';
|
|
|
+ }
|
|
|
+ return '正在加载...';
|
|
|
+});
|
|
|
|
|
|
// 用户状态管理 - 在 onMounted 中初始化
|
|
|
let configInfoStore: any;
|
|
|
@@ -118,6 +132,7 @@ const checkHealth = async () => {
|
|
|
const response = await axios.get(healthUrl);
|
|
|
if (response.status === 200) {
|
|
|
loading.value = false; // 健康检查成功,关闭 loading
|
|
|
+ healthReady.value = true;
|
|
|
|
|
|
// 健康检查成功后,如果用户已登录则执行数据同步
|
|
|
if (tokenInfoStore && tokenInfoStore.getToken) {
|
|
|
@@ -151,6 +166,7 @@ const checkHealth = async () => {
|
|
|
}
|
|
|
} catch (error) {
|
|
|
console.error('健康检查失败:', error);
|
|
|
+ healthReady.value = false;
|
|
|
setTimeout(() => {
|
|
|
checkHealth(); // 延迟检查
|
|
|
}, 2000);
|