优化登录注册页面

ruoyi-admin/src/main/resources/static/css/login.css

@@ -150,12 +150,26 @@ body.signin {
     box-shadow: none;
 }
 
-.form-control{
-	border-radius: 1px!important;
-	padding: 6px 12px!important;
-	height: 34px!important;
+.form-control {
+    border-radius: 1px!important;
+    padding: 6px 12px!important;
+    height: 34px!important;
 }
 
-.form-control:focus{
+.form-control:focus {
     border-color: #1ab394 !important;
+}
+
+body .layer-ext-moon-msg[type="dialog"]{
+    min-width: 100px !important;
+}
+body .layer-ext-moon-msg { 
+    background-color: rgba(0,0,0,0.6);
+    color: #fff;
+    border: none;
+}
+
+body .layer-ext-moon-msg .layui-layer-content{ 
+    padding: 12px 25px;
+    text-align: center;
 }

ruoyi-admin/src/main/resources/static/ruoyi/login.js

@@ -15,11 +15,14 @@ $.validator.setDefaults({
 });
 
 function login() {
-    $.modal.loading($("#btnSubmit").data("loading"));
     var username = $.common.trim($("input[name='username']").val());
     var password = $.common.trim($("input[name='password']").val());
     var validateCode = $("input[name='validateCode']").val();
     var rememberMe = $("input[name='rememberme']").is(':checked');
+    if($.common.isEmpty(validateCode) && captchaEnabled) {
+        $.modal.msg("请输入验证码");
+        return false;
+    }
     $.ajax({
         type: "post",
         url: ctx + "login",
@@ -29,13 +32,16 @@ function login() {
             "validateCode": validateCode,
             "rememberMe": rememberMe
         },
+        beforeSend: function () {
+            $.modal.loading($("#btnSubmit").data("loading"));
+        },
         success: function(r) {
             if (r.code == web_status.SUCCESS) {
                 location.href = ctx + 'index';
             } else {
-            	$('.imgcode').click();
-            	$(".code").val("");
-            	$.modal.msg(r.msg);
+                $('.imgcode').click();
+                $(".code").val("");
+                $.modal.msg(r.msg);
             }
             $.modal.closeLoading();
         }

ruoyi-admin/src/main/resources/static/ruoyi/register.js

@@ -5,6 +5,7 @@ $(function() {
         var url = ctx + "captcha/captchaImage?type=" + captchaType + "&s=" + Math.random();
         $(".imgcode").attr("src", url);
     });
+    layer.config({ extend: 'moon/style.css', skin: 'layer-ext-moon' });
 });
 
 $.validator.setDefaults({
@@ -14,10 +15,13 @@ $.validator.setDefaults({
 });
 
 function register() {
-    $.modal.loading($("#btnSubmit").data("loading"));
     var username = $.common.trim($("input[name='username']").val());
     var password = $.common.trim($("input[name='password']").val());
     var validateCode = $("input[name='validateCode']").val();
+    if($.common.isEmpty(validateCode) && captchaEnabled) {
+        $.modal.msg("请输入验证码");
+        return false;
+    }
     $.ajax({
         type: "post",
         url: ctx + "register",
@@ -26,6 +30,9 @@ function register() {
             "password": password,
             "validateCode": validateCode
         },
+        beforeSend: function () {
+            $.modal.loading($("#btnSubmit").data("loading"));
+        },
         success: function(r) {
             if (r.code == web_status.SUCCESS) {
             	layer.alert("<font color='red'>恭喜你，您的账号 " + username + " 注册成功！</font>", {

ruoyi-admin/src/main/resources/templates/login.html

@@ -69,7 +69,7 @@
             </div>
         </div>
     </div>
-<script th:inline="javascript"> var ctx = [[@{/}]]; var captchaType = [[${captchaType}]]; </script>
+<script th:inline="javascript"> var ctx = [[@{/}]]; var captchaType = [[${captchaType}]]; var captchaEnabled = [[${captchaEnabled}]];</script>
 <!--[if lte IE 8]><script>window.location.href=ctx+'html/ie.html';</script><![endif]-->
 <!-- 全局js -->
 <script src="../static/js/jquery.min.js" th:src="@{/js/jquery.min.js}"></script>

ruoyi-admin/src/main/resources/templates/register.html

@@ -68,7 +68,7 @@
             </div>
         </div>
     </div>
-<script th:inline="javascript"> var ctx = [[@{/}]]; var captchaType = [[${captchaType}]]; </script>
+<script th:inline="javascript"> var ctx = [[@{/}]]; var captchaType = [[${captchaType}]]; var captchaEnabled = [[${captchaEnabled}]];</script>
 <!-- 全局js -->
 <script src="../static/js/jquery.min.js" th:src="@{/js/jquery.min.js}"></script>
 <script src="../static/ajax/libs/validate/jquery.validate.min.js" th:src="@{/ajax/libs/validate/jquery.validate.min.js}"></script>