提交

1

src/components/layout/layoutTop.tsx

@@ -1,7 +1,7 @@
 import { defineComponent, ref, onMounted, onBeforeMount, nextTick } from 'vue';
 import styles from './index.module.less';
 import { NImage, NBadge, NPopover, NIcon, NModal, NTooltip } from 'naive-ui';
-import styles2 from './suggestion-option.module.less';
+import styles2 from './modals/suggestion-option.module.less';
 import schoolIcon from './images/schoolIcon.png';
 import teacherIcon from './images/teacherIcon.png';
 import messageIcon from './images/messageIcon.png';
@@ -87,6 +87,23 @@ export default defineComponent({
     onBeforeMount(() => {
       window.removeEventListener('message', onImMessage);
     });
+
+
+    const imglist = [inFront,inBack,submitBtn,sealing,boxBg]
+    const loadImg = (imgList:any) => {
+      for (let i = 0; i < imgList.length; i++) {
+        const img = new Image()
+        // let currentSrc = ''
+        img.src = imgList[i]
+        img.onload = function (e) {
+          console.log('加载完毕', e,img.complete );
+        }
+        img.onerror = function (e) {
+          console.log('加载错误', e);
+        }
+      }
+    }
+    loadImg(imglist)
     return () => (
       <>
         <div class={styles.layoutTop}>
@@ -233,6 +250,7 @@ export default defineComponent({
                 </div>
               </div>
             </NPopover>
+            <div class={styles2.isHidden}></div>
           </div>
           <NModal
             class={styles.changePwdModal}

src/components/layout/modals/suggestion-option.module.less

@@ -11,15 +11,12 @@
     url(../images/inBack3.png) no-repeat,
     url(../images/inBack4.png) no-repeat,
     url(../images/inBack5.png) no-repeat,
-
-    url('../images/inBack.png') no-repeat,
     url('../images/submitBtn.png') no-repeat,
     url('../images/sealing.png') no-repeat,
     url('../images/boxBg.png') no-repeat;
-
-
-
-  opacity: 0;
+  position: absolute;
+  left: -999999px;
+  top: -9999px;
   background-size: 754px 672px;
 }
 
@@ -131,7 +128,6 @@
     50% {
       background: url(../images/inBack3.png) no-repeat;
       background-size: 754px 672px;
-      opacity: .1;
       z-index: 0;
     }
 
@@ -178,7 +174,7 @@
   }
 
   .inBack.isAni {
-    animation: reversal .3s 1s forwards;
+    animation: reversal .25s 1s forwards steps(1);
   }
 
   .inBackBottom {
@@ -417,4 +413,4 @@
       // margin-right: 40px;
     }
   }
-}
+}

src/components/layout/modals/suggestion-option.tsx

@@ -12,7 +12,6 @@ import {
   UploadFileInfo,
   NImage
 } from 'naive-ui';
-
 import { useUserStore } from '/src/store/modules/users';
 import bgLine from '../images/bg-line.png';
 import chioseAdd from '../images/chioseAdd.png';
@@ -29,7 +28,9 @@ import {
   getSuggestionList,
   sysParamConfigPage
 } from '../modals/api';
-import { nextTick } from 'process';
+
+
+
 
 export default defineComponent({
   name: 'train-update',
@@ -209,27 +210,15 @@ export default defineComponent({
       }
     };
 
-    const imglist = [inFront,inBack,submitBtn,sealing,boxBg]
-    const loadImg = (imgList:any) => {
-      for (let i = 0; i < imgList.length; i++) {
-        const img = new Image()
-        // let currentSrc = ''
-        img.src = imgList[i]
-        img.onload = function (e) {
-          console.log('加载完毕', e,img.complete );
-        }
-        img.onerror = function (e) {
-          console.log('加载错误', e);
-        }
-      }
-    }
-    loadImg(imglist)
+
     onMounted(() => {
+
       getTypeList();
       getPhoneInfo();
     });
     return () => (
       <div class={[styles.suggestOption]}>
+
       <div class={[styles.updatePassword,isubmit.value?styles.isAni:'',ishidden.value?styles.isend:null]}>
         <div class={[styles.formWrap,isubmit.value?styles.isAni:'']}>
           <NImage
@@ -343,11 +332,11 @@ export default defineComponent({
             </NForm>
           </div>
         </div>
-        <div class={[styles.inBack,isubmit.value?styles.isAni:'']}>
+        <div class={[styles.inBack,isubmit.value?styles.isAni:'']} id='inBack'>
 
         </div>
         {/* <div class={styles.inBackBottom}></div>  boxBg */}
-        <NImage src={boxBg} class={styles.inBackBottom} previewDisabled></NImage>
+        <NImage src={boxBg}  class={styles.inBackBottom} previewDisabled></NImage>
         <NImage src={inFront} class={styles.inFront} previewDisabled></NImage>
         <NImage src={sealing} class={[styles.sealing,isubmit.value?styles.isAni:'']} previewDisabled></NImage>
         {!isubmit.value?<>
@@ -359,8 +348,7 @@ export default defineComponent({
         </>:null}
 
       </div>
-
       </div>
-    );
+    )
   }
 });