Ver código fonte

优化
管理后台登录页,输入图片验证码、输入短信验证码。两个都支持回车键,提交表单

loki 3 anos atrás
pai
commit
4fd724c557
1 arquivos alterados com 18 adições e 3 exclusões
  1. 18 3
      src/views/login/index.vue

+ 18 - 3
src/views/login/index.vue

@@ -45,6 +45,7 @@
           type="text"
           tabindex="1"
           prefix-icon="el-icon-chat-dot-round"
+          @keyup.enter.native="handleLogin"
         >
         </el-input>
       </el-form-item>
@@ -73,12 +74,12 @@
         <img :src="info.base64Img" class="info-img" @click="loadCheckImg" />
         <el-input v-model="point" placeholder="请输入验证码" clearable />
       </div>
-      <span slot="footer" class="dialog-footer">
+      <!-- <span slot="footer" class="dialog-footer">
         <el-button @click="dialogVisible = false">取 消</el-button>
         <el-button type="primary" @click="handleGetSMS"
           >获取短信验证码</el-button
         >
-      </span>
+      </span> -->
     </el-dialog>
   </div>
 </template>
@@ -131,7 +132,21 @@ export default {
     },
     dialogVisible: {
       handler(b) {
-        b && this.loadCheckImg();
+        if (b) {
+          this.loadCheckImg();
+          this.point = '';
+        }
+      },
+      immediate: true
+    },
+    point: {
+      handler(str) {
+        if (str.length >= 4) {
+          this.handleGetSMS();
+          this.$nextTick(() => {
+            this.point = '';
+          });
+        }
       },
       immediate: true
     }