瀏覽代碼

等待页面调整

wang_xy 2 年之前
父節點
當前提交
8a6d6dc623
共有 2 個文件被更改,包括 84 次插入7 次删除
  1. 83 5
      public/index.html
  2. 1 2
      src/views/system/login.vue

+ 83 - 5
public/index.html

@@ -193,6 +193,78 @@
       color: #FFF;
       opacity: 0.5;
     }
+    .loading {
+      width: 40px;
+      height: 40px;
+      margin: 0 auto;
+      position: relative;
+      top: 40%;
+      position: relative;
+      -webkit-animation: load 1.5s linear infinite;
+    }
+
+    .loading div {
+      width: 100%;
+      height: 100%;
+      position: absolute;
+    }
+
+    .loading span {
+      display: inline-block;
+      width: 20px;
+      height: 20px;
+      border-radius: 50%;
+      background: #99CC66;
+      position: absolute;
+      left: 50%;
+      margin-top: -10px;
+      margin-left: -10px;
+      -webkit-animation: changeBgColor 3s ease infinite;
+    }
+
+    @-webkit-keyframes load {
+      0% {
+        -webkit-transform: rotate(0deg);
+      }
+      33.3% {
+        -webkit-transform: rotate(120deg);
+      }
+      66.6% {
+        -webkit-transform: rotate(240deg);
+      }
+      100% {
+        -webkit-transform: rotate(360deg);
+      }
+    }
+
+    @-webkit-keyframes changeBgColor {
+      0%, 100% {
+        background: #2db2cc;
+      }
+      33.3% {
+        background: #FFFF66;
+      }
+      66.6% {
+        background: #FF6666;
+      }
+    }
+
+    .loading div:nth-child(2) {
+      -webkit-transform: rotate(120deg);
+    }
+
+    .loading div:nth-child(3) {
+      -webkit-transform: rotate(240deg);
+    }
+
+    .loading div:nth-child(2) span {
+      -webkit-animation-delay: 1s;
+    }
+
+    .loading div:nth-child(3) span {
+      -webkit-animation-delay: 2s;
+    }
+
   </style>
   </head>
   <body>
@@ -215,12 +287,18 @@
   <script type="text/javascript" include="PlotPanel,StylePanel,SMLInfosPanel,iPortalStylePanel"
           src="./supermap/examples/js/plottingPanel/PlottingPanel.Include.js"></script>
   <div id="app">
-    <div id="loader-wrapper">
-      <div id="loader"></div>
-      <div class="loader-section section-left"></div>
-      <div class="loader-section section-right"></div>
-      <div class="load_title">正在加载系统资源,请耐心等待</div>
+    <div class="loading">
+      <div><span></span></div>
+      <div><span></span></div>
+      <div><span></span></div>
     </div>
+    <div style="top: 48%; position: absolute; left: 50%; transform: translateX(-50%);">正在努力加载中,请稍候...</div>
+    <!--<div id="loader-wrapper">-->
+      <!--<div id="loader"></div>-->
+      <!--<div class="loader-section section-left"></div>-->
+      <!--<div class="loader-section section-right"></div>-->
+      <!--<div class="load_title">正在加载系统资源,请耐心等待</div>-->
+    <!--</div>-->
   </div>
   </body>
 </html>

+ 1 - 2
src/views/system/login.vue

@@ -4,7 +4,7 @@
 		<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
 			<h3 class="sub-title" v-if="systemTitle.subTitle">{{systemTitle.subTitle}}</h3>
 			<h3 class="title">{{systemTitle.title}}</h3>
-			
+
 			<div class="login-container">
 				<h4>请登录</h4>
 				<el-form-item prop="username">
@@ -69,7 +69,6 @@
 			    systemTitle:{
 					title:'通榆县乡村振兴综合监管平台',  //标题
 					subTitle:'数字农业'  ,//副标题
-					
 				},
 				codeUrl: '',
 				loginForm: {