Browse Source

feat: 异常弹窗修改

TIANYONG 8 months ago
parent
commit
10ee32adfd

BIN
src/view/abnormal-pop/icon_btn.png


+ 30 - 0
src/view/abnormal-pop/index.module.less

@@ -130,4 +130,34 @@
             opacity: 0.8;
             opacity: 0.8;
         }
         }
     }
     }
+}
+
+.loadingCssBox{
+    width: 27px;
+    height: 27px;
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    align-content: space-between;
+    margin-bottom: 24px;
+    animation: rotate 1.5s linear infinite;
+    .loadingCssItem{
+        width: 11px;
+        height: 11px;
+        border-radius: 50%;
+        background: #11FFD4;
+        opacity: 0.5;
+        &:nth-child(2){
+            opacity:1;
+        }
+    }
+}
+
+@keyframes rotate {
+    from {
+        transform: rotate(0deg);
+    }
+    to {
+        transform: rotate(360deg);
+    }
 }
 }

+ 6 - 4
src/view/abnormal-pop/index.tsx

@@ -3,9 +3,6 @@ import styles from "./index.module.less";
 import state from "/src/state";
 import state from "/src/state";
 import { popImgs } from "/src/view/evaluating";
 import { popImgs } from "/src/view/evaluating";
 import { evaluatingData } from "/src/view/evaluating";
 import { evaluatingData } from "/src/view/evaluating";
-import { Vue3Lottie } from "vue3-lottie";
-import loading from "./loading.json";
-import animBg from "/src/page-instrument/view-detail/images/refresh_anim.gif";
 
 
 export default defineComponent({
 export default defineComponent({
   name: "abnormal-pop",
   name: "abnormal-pop",
@@ -33,7 +30,12 @@ export default defineComponent({
           // 	<p>正在连接服务器,请稍后…</p>
           // 	<p>正在连接服务器,请稍后…</p>
           // </div>
           // </div>
           <div class={styles.loadingPop}>
           <div class={styles.loadingPop}>
-            <img class={styles.loadingIcon} src={animBg} />
+            <div class={styles.loadingCssBox}>
+                <div class={styles.loadingCssItem}></div>
+                <div class={styles.loadingCssItem}></div>
+                <div class={styles.loadingCssItem}></div>
+                <div class={styles.loadingCssItem}></div>
+            </div>            
             {/* <Vue3Lottie animationData={animBg} class={styles.loadingIcon}></Vue3Lottie> */}
             {/* <Vue3Lottie animationData={animBg} class={styles.loadingIcon}></Vue3Lottie> */}
             <div class={styles.loadingTip}>正在连接中,请稍等…</div>
             <div class={styles.loadingTip}>正在连接中,请稍等…</div>
             <div class={styles.loadingClose} onClick={() => emit("close")}>
             <div class={styles.loadingClose} onClick={() => emit("close")}>