feat: 评测预加载部分图片资源

src/view/abnormal-pop/index.tsx

@@ -1,10 +1,7 @@
 import { defineComponent } from "vue";
 import styles from "./index.module.less";
 import state from "/src/state";
-import icon_close from './icon_close.svg'
-import icon_bg from './icon_bg.svg'
-import icon_btn from './icon_btn.svg'
-import icon_success from './icon_success.svg'
+import { popImgs } from '/src/view/evaluating'
 import { evaluatingData } from "/src/view/evaluating";
 import { Vue3Lottie } from "vue3-lottie";
 import loading from "./loading.json";
@@ -19,14 +16,14 @@ export default defineComponent({
 				{
 					evaluatingData.socketErrorStatus === 0 && 
 					<div class={styles.fraction}>
-						<img class={styles.close} src={icon_close} onClick={() => emit("close")} />
-						<img class={styles.bg} src={icon_bg} />
+						<img class={styles.close} src={popImgs.icon_close} onClick={() => emit("close")} />
+						<img class={styles.bg} src={popImgs.icon_bg} />
 						<div class={styles.content}>
 							<div class={styles.title}>您的网络连接异常</div>
 							<div class={styles.desc}>请确保网络正常后重新连接</div>
 						</div>
 						<div>
-							<img src={icon_btn} class={styles.btn} onClick={() => emit("confirm", true)} />
+							<img src={popImgs.icon_btn} class={styles.btn} onClick={() => emit("confirm", true)} />
 						</div>
 					</div>				
 				}
@@ -34,14 +31,14 @@ export default defineComponent({
 					evaluatingData.socketErrorStatus === 1 && 
 					<div class={styles.loadColumn}>
 						<Vue3Lottie class={styles.loadIcon} animationData={loading} loop={true}></Vue3Lottie>
-						<img class={styles.close} src={icon_close} onClick={() => emit("close")} />
+						<img class={styles.close} src={popImgs.icon_close} onClick={() => emit("close")} />
 						<p>正在连接服务器，请稍后…</p>
 					</div>
 				}
 				{
 					evaluatingData.socketErrorStatus === 2 && 
 					<div class={styles.loadColumn}>
-						<img class={styles.successIcon} src={icon_success} />
+						<img class={styles.successIcon} src={popImgs.icon_success} />
 						<p>连接成功</p>
 					</div>
 				}

src/view/evaluating/index.module.less

@@ -24,4 +24,10 @@
         line-height: 30px;
         cursor: pointer;
     }
+}
+.hiddenPop {
+    width: 1px;
+    height: 1px;
+    overflow: hidden;
+    opacity: 0;
 }

src/view/evaluating/index.tsx

@@ -44,11 +44,22 @@ import { getAudioCurrentTime, toggleMutePlayAudio } from "../audio-list";
 import { handleStartTick } from "../tick";
 import AbnormalPop from "../abnormal-pop";
 import { storeData } from "../../store";
+import icon_bg from '../abnormal-pop/icon_bg.svg'
+import icon_close from '../abnormal-pop/icon_close.svg'
+import icon_btn from '../abnormal-pop/icon_btn.svg'
+import icon_success from '../abnormal-pop/icon_success.svg'
 
 const browserInfo = browser();
 
 let socketStartTime = 0
 
+export const popImgs = {
+	icon_bg,
+	icon_close,
+	icon_btn,
+	icon_success
+}
+
 export const evaluatingData = reactive({
 	/** 评测数据 */
 	contentData: {} as any,
@@ -650,6 +661,13 @@ export default defineComponent({
 		});
 		return () => (
 			<div>
+				{/** 预加载一下断网需要用到的图片 */}
+				<div class={styles.hiddenPop}>
+					<img src={popImgs.icon_bg} />
+					<img src={popImgs.icon_btn} />
+					<img src={popImgs.icon_success} />
+					<img src={popImgs.icon_close} />
+				</div>
 				<Popup teleport="body" closeOnClickOverlay={false} class={["popup-custom", "van-scale"]} transition="van-scale" v-model:show={evaluatingData.socketErrorPop}>
 					<AbnormalPop 
 						onConfirm={hanldeConfirmPop}

vite.config.ts

@@ -68,8 +68,8 @@ export default defineConfig({
 				// target: "https://test.lexiaoya.cn",
 				// target: "https://dev.kt.colexiu.com",
 				// target: "https://dev.resource.colexiu.com", // 内容平台开发环境
-				target: "https://test.resource.colexiu.com",
-				// target: "https://test.kt.colexiu.com",
+				// target: "https://test.resource.colexiu.com",
+				target: "https://test.kt.colexiu.com",
 				changeOrigin: true,
 				rewrite: (path) => path.replace(/^\/instrument/, ""),
 			},