style: 完成进度条加载

2025-07-20 16:40:54 +08:00
parent cbe93b9f7e
commit 991a970d6a
3 changed files with 40 additions and 13 deletions
--- a/Yi.Ai.Vue3/index.html
+++ b/Yi.Ai.Vue3/index.html
@@ -16,6 +16,9 @@
  <title>%VITE_WEB_TITLE%</title>
  <meta name="viewport"
        content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
+
+
+
 </head>

 <body>
@@ -33,8 +36,8 @@
 </div>

 <div id="app"></div>
-<script type="module" src="/src/main.ts"></script>
-</body>
+
+
 <style>
  /* 全局样式 */
  * {
@@ -124,7 +127,7 @@
 </style>
 <script>
  // 加载动画逻辑
-  document.addEventListener('DOMContentLoaded', function () {
+  // document.addEventListener('DOMContentLoaded', function () {
    const loader = document.getElementById('loader');
    const progressBar = document.getElementById('progress-bar');
    const progressText = document.getElementById('progress-text');
@@ -133,7 +136,7 @@
    let loadingInterval = null;
    let isVueReady = false;

-    // 注册全局事件监听器，用于接收Vue的加载完成信号
+    // 注册全局事件监听器，用于接收Vue的加载完成信号（生产环境没有用，所以放到app.vue处理）
    window.addEventListener('vue-ready', function () {
      isVueReady = true;
      completeLoading();
@@ -158,12 +161,12 @@

        // 如果进度达到95%或者Vue已经准备好
        if (isVueReady) {
-          progress = 100;
+          // progress = 100;
          clearInterval(loadingInterval);
          completeLoading();
        }

-        updateProgress(progress);
+        // updateProgress(progress);
      }, intervalTime);
    }

@@ -187,7 +190,7 @@
    // 完成加载并隐藏动画
    function completeLoading() {
      // 确保进度是100%
-      updateProgress(100);
+      // updateProgress(100);

      // 淡出加载动画
      setTimeout(() => {
@@ -200,6 +203,10 @@

    // 启动加载动画
    startLoading();
-  });
+  // });
 </script>
+
+<script type="module" src="/src/main.ts"></script>
+</body>
+
 </html>