init3

app/components/PowerStation/Model3D/LoadingOverlay.vue

@@ -0,0 +1,43 @@
+<!--
+  LoadingOverlay.vue
+  加载遮罩层组件
+  用于显示加载状态的动画效果
+-->
+<template>
+  <div
+    v-if="isLoading"
+    class="absolute inset-0 flex items-center justify-center bg-[#0b1120]/80 backdrop-blur-sm z-10"
+  >
+    <div class="flex flex-col items-center gap-4">
+      <!-- 加载动画 -->
+      <div class="relative">
+        <div class="absolute inset-0 rounded-full border-2 border-cyan-500/30 animate-ping"></div>
+        <div class="absolute inset-0 rounded-full border-2 border-cyan-500/50 animate-pulse"></div>
+        <el-icon class="is-loading text-4xl text-cyan-400 relative z-10"><Loading /></el-icon>
+      </div>
+      <!-- 加载文本 -->
+      <span class="text-cyan-400 font-mono tracking-[0.2em] text-sm animate-pulse">
+        {{ text || 'SYSTEM LOADING...' }}
+      </span>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+/**
+ * LoadingOverlay 组件
+ * 显示加载状态的遮罩层，带有动画效果
+ */
+import { Loading } from '@element-plus/icons-vue';
+
+// ============================================================
+// Props 定义
+// ============================================================
+
+defineProps<{
+  /** 是否显示加载状态 */
+  isLoading: boolean
+  /** 自定义加载文本 */
+  text?: string
+}>()
+</script>