dengzhiguo %!s(int64=7) %!d(string=hai) anos
pai
achega
4289811ba6
Modificáronse 5 ficheiros con 98 adicións e 29 borrados
  1. BIN=BIN
      img/checked.jpg
  2. BIN=BIN
      img/unchecked.jpg
  3. 11 6
      src/css/registered.css
  4. 67 10
      src/js/registered.js
  5. 20 13
      template/registered.html

BIN=BIN
img/checked.jpg


BIN=BIN
img/unchecked.jpg


+ 11 - 6
src/css/registered.css

@@ -23,7 +23,7 @@ ul,ol{padding: 0;margin: 0;list-style: none;}
 .reg_con{width:1200px;height:973px;margin:0 auto;
     background-image:url(../../img/zhucebg5.jpg);}
 .clear_first{width:100%;height:1px;}
-.zhuce{width:775px;height:505px;margin:0 auto;margin-top:80px;
+.zhuce{width:775px;height:515px;margin:0 auto;margin-top:80px;
     background: #fff; position: relative;}
 .title{width:100%;height:50px;font-size: 2rem;color:#5C5C5D;
 line-height:50px;padding-left:50px;}
@@ -39,26 +39,31 @@ margin-bottom:10px;line-height:38px;}
     line-height: 38px;display:inline-block;margin-right:10px;}
 .yanzhengma>input{border:none;padding-left:10px;}
 .yanzhengma_cont{display:inline-block;width:80px;height:40px;line-height: 38px;
-    position: absolute;top:0;right:0;background: red;}
+    position: absolute;top:0;right:0;}
 .cellcode{width:255px;height:40px;position: relative;margin-bottom:10px;}
 .cellcode>div{width:165px;height:40px;border:1px solid #E5E5E5;
     line-height: 38px;display:inline-block;margin-right:10px;}
 input{border:none;padding-left:10px;}
 .cellcode>a{color:#F18101;}
-.leibie{width:120px;height:40px;display:inline-block;color:#F18101;font-size: 1.4rem;
-    line-height: 38px;font-weight: bold;}
-.leibie>input{display:inline-block;width:15px;height:15px;margin-right: 5px;}
+#photo{color:#ccc;display: inline-block;padding-left: 0;background: none;}
+#photo_num{display: inline-block;}
+.leibie{width:120px;height:30px;display:inline-block;color:#F18101;font-size: 1.4rem;
+    line-height: 28px;font-weight: bold;padding-left: 20px;position: relative;}
+.leibie>input{display:inline-block;width:15px;height:15px;margin-right: 5px;position: absolute;
+    top:5px;left:0;background: transparent;}
 .businessName{width:255px;height:40px;border:1px solid #E5E5E5;
     margin-bottom:10px;line-height:38px;}
 .linkmanName{width:255px;height:40px;border:1px solid #E5E5E5;
     margin-bottom:10px;line-height:38px;}
 .zhuangjiaName{width:255px;height:40px;border:1px solid #E5E5E5;
     margin-bottom:10px;line-height:38px;display:none;}
+#business,#linkman,#man{width:250px;}
 .submit{width:255px;height:40px;border:1px solid #E5E5E5;
     margin-bottom:10px;line-height:38px;}
 .submit>input{width:100%;height:100%;background-color: #F18101;color:#fff;
 font-size: 1.8rem;font-weight: bold;letter-spacing:20px;}
-
+.protocol{width:255px;height:30px;line-height: 20px;}
+.protocol a{color:#F18101;font-weight: 400;}
 .picture{width:420px;height:420px;border-left:1px solid #E5E5E5;
     display: inline-block;position: absolute;top:50px;left:350px;}
 .denglu{width:400px;height:20px;text-align: right;display: inline-block;

+ 67 - 10
src/js/registered.js

@@ -1,8 +1,8 @@
-import '../css/bootstrap.less';
-import 'bootstrap/dist/js/bootstrap.js';
-import '../css/public.css';
-import '../css/registered.css';
-import './public.js'
+//import '../css/bootstrap.less';
+//import 'bootstrap/dist/js/bootstrap.js';
+//import '../css/public.css';
+//import '../css/registered.css';
+//import './public.js'
 (function(){
     //选择专家和企业时要切换
     var panduan;
@@ -23,14 +23,23 @@ import './public.js'
             $(".zhuangjiaName").css("display","block");
         }
     });
+    //点击账号后面那个×,清空账号
+    $(".log_del").click(function(){
+        $("#username").val("");
+    });
     //修改单选框的样式
-    $('#checks').attr('checked',false)
-    $('.login_check label input').click(function(){
-        var Cheack=$(this).prop('checked')
+    //$('.leibie input').css("display","none");
+    $(".leibie").css({"background":"url(../img/unchecked.jpg) no-repeat center left","background-size":"13px 13px"});
+    $('.leibie input').click(function(){
+        var Cheack=$(this).prop('checked');
         if(Cheack){
-            $(this).parent().css({"background":"url(../imgeck_lo.png) no-repeat center left","background-size":"25% 40%"})
+            //$(this).css("display","none");
+            $(".leibie").css({"background":"url(../img/unchecked.jpg) no-repeat center left","background-size":"13px 13px"});
+            $(this).parent().css({"background":"url(../img/checked.jpg) no-repeat center left","background-size":"13px 13px"})
         }else{
-            $(this).parent().css({"background":"url(../imgeck_lono.png) no-repeat center left","background-size":"25% 40%"})
+           // $(this).css("display","none");
+            $(".leibie").css({"background":"url(../img/unchecked.jpg) no-repeat center left","background-size":"13px 13px"});
+            $(this).parent().css({"background":"url(../img/unchecked.jpg) no-repeat center left","background-size":"13px 13px"})
         }
     });
     //表单验证
@@ -111,9 +120,14 @@ import './public.js'
             if (pho=='') {
                 $(this).val('');
                 $(this).attr('placeholder', '请输入您的手机号码');
+
             } else if (!pho_pattern.test(pho)) {
                 $(this).val('');
                 $(this).attr('placeholder', '请输入正确的手机号码');
+
+            }else if(pho_pattern.test(pho)){
+                $('#photo').attr('disabled', false);
+                $("#photo").css("color","#F18101");
             }
         })
     }
@@ -216,6 +230,49 @@ import './public.js'
             }
         })
     })
+    var tt = 30;
+    $('#photo').click(function () {
+        //手机验证功能
+        var ophoto = $('#username').val();
+        var types = $('#zhuangjia').prop("checked") ? '1' : '0';
+        var phott = $('#piccode').val();
+        //验证码倒计时
+        $('#photo').attr('disabled', true);
+        $(this).attr('disabled', true);
+        var timer = setInterval(function () {
+            tt -= 1;
+            $('#photo').attr('disabled', true);
+            $(this).val(tt + ' s');
+            if (tt == 0) {
+                clearInterval(timer);
+                $('#photo').attr('disabled', false);
+                $(this).attr('disabled', false);
+                tt=30;
+                $(this).val('重新发送');
+            }
+        }.bind(this), 1000);
+
+        $.ajax({
+            type: "GET",
+            url: globalConfig.context + "/open/getMCode",
+            data: {
+                "mobile": ophoto,
+                "sign": false,
+                "type": types,
+                "verificationCode": phott
+            },
+            success: function (data) {
+                if (data.error && data.error.length) {
+                    $('.msg span').html(data.error[0].message);
+                    console.log(data.error[0].message);
+                } else {
+                    console.log(data);
+                    $('#photo').html("发送成功!")
+                }
+                return true
+            }
+        });
+    })
 })();
 
 

+ 20 - 13
template/registered.html

@@ -9,10 +9,10 @@
 	<meta name="viewport" content="width=device-width,initial-scale=1, minimum-scale=1, maximum-scale=1,user-scalable=no">
 	<meta http-equiv="x-ua-compatible" content="ie=edge">
     <title>登陆/注册</title>
-    <!--<link rel="stylesheet" href="../src/css/bootstrap.css" />-->
-    <!--<link rel="stylesheet" href="../src/css/public.css" />-->
-    <!--<link rel="stylesheet" type="text/css" href="../src/css/index_home.css"/>-->
-	<!--<link rel="stylesheet" href="../src/css/registered.css"/>-->
+    <link rel="stylesheet" href="../src/css/bootstrap.css" />
+    <link rel="stylesheet" href="../src/css/public.css" />
+    <link rel="stylesheet" type="text/css" href="../src/css/index_home.css"/>
+	<link rel="stylesheet" href="../src/css/registered.css"/>
 </head>
 <body>  	
   	<header>
@@ -117,19 +117,22 @@
 							<div class="yanzhengma">
 								<input type="text" name="picCode" placeholder="验证码" id="piccode"/>
 							</div>
-							<div class="yanzhengma_cont"></div>
+							<div class="yanzhengma_cont">
+								<img th:src="${basePath+'/open/getVCode'}"/>
+							</div>
 						</div>
 						<div class="cellcode">
 							<div>
 								<input type="text" name="cellCode" placeholder="手机验证码" id="photo_num"/>
+
 							</div>
-							<a href="#">获取验证码</a>
+							<input type="button" id="photo" value="获取验证码" disabled/>
 						</div>
-						<div class="leibie">
+						<div class="leibie zj">
 							<input type="radio" name="leibie" id="zhuangjia" value="0" checked/>
 							<label for="zhuangjia">我是专家</label>
 						</div>
-						<div class="leibie">
+						<div class="leibie qy">
 							<input type="radio" name="leibie" id="qiye" value="1"/>
 							<label for="qiye">我是企业</label>
 						</div>
@@ -142,12 +145,16 @@
 						<div class="zhuangjiaName">
 							<input type="text" name="manName" placeholder="您的姓名" id="man"/>
 						</div>
+						<div class="protocol">
+							<input type="checkbox" name="pro" id="protocol"/>
+							<label for="protocol"><a href="#">同意技淘网会员服务协议条款</a></label>
+						</div>
 						<div class="submit">
 							<input type="submit" class="sub"/>
 						</div>
 					</div>
 					<div class="picture">
-						<div class="denglu">已有账号?去 <a href="#">登陆</a></div>
+						<div class="denglu">已有账号?去 <a href="javascript:;" class="head_login">登陆</a></div>
 						<a href="#" class="clear huodong">
 							<img src="../img/huodong.jpg" alt=""/>
 						</a>
@@ -211,9 +218,9 @@
 
 	</div>
 </body>
-<!--<script type="text/javascript" src="../src/js/jquery-2.1.0.js"></script>-->
-<!--&lt;!&ndash;<script type="text/javascript" src="../src/js/index.js"></script>&ndash;&gt;-->
-<!--<script type="text/javascript" src="../src/js/public.js"></script>-->
-<!--<script type="text/javascript" src="../src/js/registered.js"></script>-->
+<script type="text/javascript" src="../src/js/jquery-2.1.0.js"></script>
+<!--<script type="text/javascript" src="../src/js/index.js"></script>-->
+<script type="text/javascript" src="../src/js/public.js"></script>
+<script type="text/javascript" src="../src/js/registered.js"></script>
 
 </html>