<%@ page language="java" contentType="text/html;charset=UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib uri="/WEB-INF/tld/fns.tld" prefix="fns" %>
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1" /><meta http-equiv="X-UA-Compatible" content="IE=9" />
	<meta name="keywords" content="保险保函、电子保函、保证保险、保函开具、工程投标保证保险、建设合同履约保证保险、业主合同款支付保证保险、建设工程质量保证保险、建筑业企业人工工资支付保证保险、海关税保险、诉讼财产保全责任保险">
	<meta name="description" content="百联保是百川信（厦门）网络信息服务有限公司基于金融创新并响应“互联网＋”计划搭建的第三方金融服务平台。 ">
	<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
	<title>百联保-我的账户</title>
</head>

<body>
<jsp:include page="../index/multi_h.jsp"/>
<div class="container">
	<%--<div class="addr">
		<span>当前位置：</span>
		<span class="current">首页 > </span>
		<a class="active" href="#">我的账户</a>
	</div>--%>
	<jsp:include page="../index/multi_pc_l.jsp"/>

	<!--右边常用联系人内容区开始-->
	<div class="right contacts">

		<div class="container real">
			<%--<div class="addr">
				<span>当前位置：</span>
				<span>首页 > </span>
				<span>我的账户 </span>
				<a class="active" href="#">> 修改密码</a>
			</div>--%>
			<div class="step-title change">
				<h1 class="title">修改登录密码</h1>
				<ul class="real-step" style="margin-left: 35%;">
					<li class="active">
						<span class="step-name">验证方式</span>
						<i class="step-left"></i>
						<span class="step-num">1</span>
						<i class="step-left step-left"></i>
					</li>
					<li>
						<span class="step-name">修改登录密码</span>
						<i class="step-left"></i>
						<span class="step-num">2</span>
						<i class="step-left step-left"></i>
					</li>
					<li>
						<span class="step-name">修改成功</span>
						<i class="step-left"></i>
						<span class="step-num">3</span>
						<i class="step-left step-left"></i>
					</li>
				</ul>
			</div>
			<div class="real-name change-method" style="width: auto">

				<ul class="step-list">
					<li>
						<span>账户：</span>
						<span class="tel-phone">
							${userdetail.login_name}
                    </span>
					</li>
					<li class="no-border">
						<div class="real-num">
							<label for="currentPwd">当前登录密码：</label>
							<input   type="password" placeholder="请输入当前登录密码" id="currentPwd" name ="oldpassword"  class="inp sm-inp">
						</div>
						<button class="btn next-btn" type="button" onclick="checkPwd()">下一步</button>
					</li>
				</ul>
			</div>
			<div class="real-name change-method change-pwd" style="width: auto">

				<ul class="step-list">
					<li>
						<span>账户：</span>
						<span class="tel-phone">
						${userdetail.login_name}
                    </span>
					</li>
					<li class="no-border">
						<div class="real-num">
							<label for="newPwd">新登录密码：</label>
							<input  type="password" placeholder="请输入新的登录密码"  id="newPwd" name="newPwd" class="inp sm-inp">
						</div>
						<div class="real-num">
							<label for="surePwd">确认新登录密码：</label>
							<input  type="password" placeholder="两次登录的密码必须相同"   id="surePwd" name="surePwd" class="inp sm-inp">
						</div>
						<button class="btn next-btn" type="button" onclick="savePwd()">下一步</button>
					</li>
				</ul>
			</div>
			<div class="real-name real-succ change-succ" style="width: 600px">
				<div class="real-text">修改密码成功！</div>
				<a href="<c:url value='/pc/myAccount?ACCESS_TOKEN=${ACCESS_TOKEN}' />" class="btn my-btn" style="height: 40px;line-height: 25px">我的资料</a>
				<a href="<c:url value='/?ACCESS_TOKEN=${ACCESS_TOKEN}' />" class="btn index-btn" style="height: 40px;line-height: 25px">首页</a>
			</div>
		</div>
	</div>
	<!--右边编辑常用联系人结束  企业用户-->

</div>
<jsp:include page="../index/multi_f.jsp"/>

</body>

</html>
<%--<script src="<c:url value='/resources/version_new/js/jquery-1.8.3.min.js' />"></script>--%>
<%--<script type="text/javascript" src="<c:url value='/resources/js/layer/layer.js'/>"></script>--%>

<script type="text/javascript">
	function checkPwd() {
		var currentPwd= $("#currentPwd").val();
		if(currentPwd==''){
			layer.msg("当前密码不能为空");
			return ;
		}

		var index = layer.load(0, {shade: [0.3,'#808080']});
		$.ajax({
			type : 'POST',
			url : baseUrl + "/pc/pwd/checkOldPwd",
			data:{oldPwd:currentPwd},
			async: false,
			dataType : "json",
			cache : false,
			success : function(json) {
				layer.close(index);
				if (json.statusCode == '200') {
					//修改密码验证方式
					nextStep('change-method','next-btn','change-pwd',2);
					layer.close(index);
				}else{
					layer.msg("密码错误！");
					layer.close(index);

				}
			},
			error : function(XMLHttpRequest, textStatus, errorThrown) {
				layer.msg("密码错误服务器未响应！！");
//	// 修改密码  nextStep('change-pwd','next-btn','change-succ',3);
				layer.close(index);
			}
		});
		
	}
	function savePwd() {
		var currentPwd= $("#newPwd").val();
		var surePwd= $("#surePwd").val();
		var pwd_reg = /^(?![A-Z]+$)(?![a-z]+$)(?!\d+$)(?![\W_]+$)\S{6,20}$/;
		if(currentPwd==''){
			layer.msg("密码不能为空");
			return ;
		}
		if(surePwd==''){
			layer.msg("请再次输入密码");
			return ;
		}
		if(currentPwd!=surePwd){
			layer.msg("密码填写要一致！");
			return ;
		}
		if(!pwd_reg.test(surePwd)){
			layer.msg("密码需为字母和数字的组合（6-20）！");
			return ;
		}

		var index = layer.load(0, {shade: [0.3,'#808080']});
		$.ajax({
			type : 'POST',
			url : baseUrl + "/pc/pwd/savePwd",
			data:{newPwd:currentPwd},
			async: false,
			dataType : "json",
			cache : false,
			success : function(json) {

				if (json.statusCode == '200') {
					//修改密码验证方式
					nextStep('change-pwd','next-btn','change-succ',3);
					layer.close(index);
				}else{
					layer.msg("密码错误！");
					layer.close(index);

				}
			},
			error : function(XMLHttpRequest, textStatus, errorThrown) {
				layer.msg("密码错误服务器未响应！！");
				layer.close(index);
//	// 修改密码  nextStep('change-pwd','next-btn','change-succ',3);
			}
		});
	}
	function nextStep(now, btn, next, num) {
		$('.' + now).on('click', '.' + btn, function () {
			$('.' + now).css('display', 'none');
			$('.' + next).css('display', 'block');
			$('.real-step li:nth-child(' + num + ')').addClass('active');
		});
	}
</script>
<script>
	$('ul.aside-list li').removeClass('on');
	$("#myAcountInfo").addClass('on');
</script>