<?php
if (!defined('ROOT'))
	exit ;
?>
<!DOCTYPE html>
<html>

	<head>
		<title>手机绑定</title>
		<meta name="description" content="">
		<meta name="keywords" content="">
		<?php
		include 'Inc_files.php';
		?>
		<link rel="stylesheet" type="text/css" href="/static/member/css/wap.1.0.0.css?v=20171117">
	</head>

	<body data-type="index">
		<script src="<?php echo C('TMPL_PARSE_STRING.__TPL__'); ?>/assets/js/theme.js"></script>
		<div class="am-g tpl-g">
			<?php include 'Inc_head.php'?>
			<!-- 侧边导航栏 -->
			<?php
				include 'Inc_left.php';
			?>
			<!-- 内容区域 -->
			<div class="tpl-content-wrapper">
				<div class="row-content am-cf">
					<div class="row">
	                    <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
	                        <div class="widget am-cf">
	                            <div class="widget-head am-cf">
	                                <div class="widget-title am-fl">手机绑定 </span></div>
	                            </div>
	                            <div class="widget-body am-fr">
	                                <form  class="am-form tpl-form-border-form tpl-form-border-br">
	                                	<input type="hidden" name="mobileold" value="<?php echo I('mobileold');?>" />
	                                	<input type="hidden" name="sms_code_old" value="<?php echo I('sms_code_old');?>"" />
	                                	<input type="hidden" name="model_id" value="27" />
	                                	<input type="hidden" name="id" value="<?php echo session('user_auth.id');?>" />
	                                    <div class="am-form-group">
	                                        <label for="user-name" class="am-u-sm-3 am-form-label">新绑定手机 </label>
	                                        <div class="am-u-sm-9">
	                                            <input type="tel"  maxlength="11" name="mobile" style="width: 300px;" class="tpl-form-input mobile" >
	                                            <small></small>
	                                        </div>
	                                    </div>
	                                    <div class="am-form-group">
	                                        <label for="user-name" class="am-u-sm-3 am-form-label">图像验证码 </label>
	                                        <div class="am-u-sm-9">
	                                            <input type="text" maxlength="18" required="required"  name="code_img" style="width: 100px; float: left;" class="tpl-form-input code_img" > <img style="height:33px; margin-left:10px;" class="pointer" title="点击切换" src="/api/verify" onClick="this.src='/api/verify?time='+Math.random()" >
	                                            <small></small>
	                                        </div>
	                                    </div>
	                                    <div class="am-form-group">
	                                        <label for="user-name" class="am-u-sm-3 am-form-label">短信验证码 </label>
	                                        <div class="am-u-sm-9">
	                                            <input type="text" maxlength="18" required="required"  name="sms_code" style="width: 100px; float: left;" class="tpl-form-input" > <a style="float: left; padding-bottom: 8px; margin-left: 10px;" class="am-btn am-btn-danger am-btn-sm btn_code">获取验证码</a>
	                                            <small></small>
	                                        </div>
	                                    </div>
	                                    <div class="am-form-group">
	                                        <div class="am-u-sm-9 am-u-sm-push-3">
	                                            <button type="button" class="am-btn am-btn-primary tpl-btn-bg-color-success btn_submit">
	                                            	提交
	                                            </button>
	                                        </div>
	                                    </div>
	                                </form>
	                            </div>
	                        </div>
	                    </div>
	                </div>
				</div>
			</div>
		</div>
		<?php
		include 'Inc_files_boot.php';
		?>
		<script type="text/javascript">
		jQuery(document).on('click','.btn_submit',function () {
		    var the=jQuery(this);
		    if (jQuery('[name="code_img"]').val()=='') {
		    	wd_alert({msg:'图像验证码不能为空',background:'#f00'});
		    	return false;
		    }
		    if (jQuery('[name="sms_code"]').val()=='') {
		    	wd_alert({msg:'短信验证码不能为空',background:'#f00'});
		    	return false;
		    }
		    jQuery.ajax({
		    	url:"/member/mobile",
		        data:the.closest('form').serializeArray(),
		        dataType: "json",
		        type: "post",
		        timeout: 10000,
		        success: function(data) {
		        	if (data.status==1) {
		        		location.href='/member/safeinfo';
		        	}else{
		        		wd_alert({msg:data.info,background:'#f00'})
		        	}
		        },
		        error: function() {
		        }
		    });          
		});
		jQuery(document).on('click','.btn_code',function () {
		    var the=jQuery(this);
		    if (jQuery('[name="mobile"]').val()=='') {
		    	wd_alert({msg:'手机不能为空',background:'#f00'});
		    	return false;
		    }
		    if (jQuery('[name="code_img"]').val()=='') {
		    	wd_alert({msg:'图像验证码不能为空',background:'#f00'});
		    	return false;
		    }
		    var i=59;
		    if (the.html()=='获取验证码') {
	        	jQuery.ajax({
	        		url:"/api/sms_bind_mobile",
	        	    data:{
	        	    	code_img:jQuery(".code_img").val(),
	        	    	mobile:jQuery(".mobile").val()
	        	    },
	        	    dataType: "json",
	        	    type: "post",
	        	    timeout: 10000,
	        	    success: function(data) {
	        	    	if (data.status==1) {
	        	    		the.html('已获取'+i+'秒');
			        		var cl=setInterval(function () {
			        			i--;
				        		the.html('已获取'+i+'秒');
				        		if (i<0) {
				        			clearInterval(cl);
				        			the.html('获取验证码');
				        		}
				        	},1000);
	        	    	}else{
	        	    		wd_alert({
	        	    			msg:data.info,
	        	    			background:'#f00'
	        	    		});
	        	    	}
	        	    },
	        	    error: function() {
	        	    }
	        	});
        	}
		})
		</script>
	</body>

</html>