<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort() + path+"/";
	request.setAttribute("contextPath", basePath);
	
	String redirectUrl= request.getParameter("redirectUrl");
	request.setAttribute("redirectUrl", redirectUrl);
%> 
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
	<title>银行卡信息</title>
	<script src="${contextPath }res/js/jquery.min.js" type="text/javascript"></script>
<%-- 	<script src="${contextPath }res/js/bootstrap.min.js" type="text/javascript"></script> --%>
	<script type="text/javascript" src="${contextPath }res/js/layer/layer.min.js"></script>
	<script src="${contextPath }app/lib/flexible.js"></script>
    <link rel="stylesheet" href="${contextPath }app/lib/flexible.css">
	<link rel="stylesheet" href="${contextPath }app/css/basem.css">
	<link rel="stylesheet" href="${contextPath }app/css/logome.css">
	<link rel="stylesheet" href="${contextPath }app/css/index.css"> 
<%-- 	<link href="${contextPath }res/css/bootstrap.min.css" rel="stylesheet"> --%>
	<script type="text/javascript">
	$(function(){
		$('#button').click(function(){ 
			var userId="${USER_ID}";
			var bankNo=$("input[name='bankNo']").val();
			var username=$("input[name='username']").val();
			var bankName=$("input[name='bankName']").val();
			var province=$("#province").val();
			var city=$("#city").val();
			var area=$("#area").val(); 
			var bankBranch=$("input[name='bankBranch']").val(); 
			if(bankNo=="" && username=="" && bankName=="" && province==""&&city==""&&bankBranch==""){
				//window.location.href = '${contextPath }web/mgmUserCtl/index.cs?userId='+userId;
				layer.msg('请填写银行卡信息！');
			}else{
				var pram='{"userId":"'+userId+'","bankNo":"'+bankNo+'","username":"'+username+'","bankName":"'+bankName+'","province":"'+province+'","city":"'+city+'","area":"'+area+'","bankBranch":"'+bankBranch+'"}';
				console.log(pram);
				$.post('${contextPath}web/mgmUserBankCtl/updateUserBank.cs', {
					"data" : pram
				}, function(data) {
					var datas=eval(data.data);
					if (data.ret == 1) {
						 layer.msg('修改成功！', {
							  time: 1000
							}, function(){
								window.location.href = '${contextPath }web/meWebCtl/me.cs';
							});
					}else{
						layer.msg(data.msg);
					}
				}, "json"); 
			}
		});
	});
	</script>
	<style type="text/css">
		.megroup > div {
			margin: 0.15rem 0;
		}
		.megroup > div select {
			height:1rem;
			color:#626262;
			font-size:0.35rem;
		}
	</style>
</head>
<body>
<div class="show" id="tj_client">
	<div class="titbox">
		<a class="titreturn left" href="${contextPath }web/meWebCtl/me.cs"><img src="${contextPath }app/img/return1@2x.png" alt=""></a>
		<h1>银行卡信息</h1>
	</div>
	<div class="forgetbox top50">
		<div class="safe">
			<form action="#" name="loginForm" id="loginForm" method="post">
			<ul class="logul">
				<li>
					<div><img class="logicon" src="${contextPath }app/img/id@2x.png" alt=""><span>银行卡号</span></div>
					<input type="text" name="bankNo" placeholder="请输入您的银行卡号" value="${USER_BANK.bankNo}">
				</li>
				<li>
					<div><img class="logicon" src="${contextPath }app/img/my@2x.png" alt=""><span>持卡人姓名</span></div>
					<input type="text" name="username" placeholder="请输入持卡人姓名" value="${USER_BANK.username}">
				</li>
				<li>
					<div><img class="logicon" src="${contextPath }app/img/bank@2x.png" alt=""><span>开户行</span></div>
					<input type="text" name="bankName" placeholder="请输入您的开户行" value="${USER_BANK.bankName}">
				</li>
				<li>
					<div><img class="logicon" src="${contextPath }app/img/address@2x.png" alt=""><span>开户省份</span></div>
					<input id="pcarea" name="attributionArea"  readonly="readonly" type="text"  placeholder="请选择客户所在区域" value="${USER_BANK.province}${USER_BANK.city}${USER_BANK.area}"> 
					<input id="province" name="province"  type="hidden" value="${USER_BANK.province}">
					<input id="city" name="city"  type="hidden" value="${USER_BANK.city}"> 
					<input id="area" name="area"  type="hidden" value="${USER_BANK.area}">
				</li>
				<li>
					<div><img class="logicon" src="${contextPath }app/img/bank@2x.png" alt=""><span>支行名称</span></div>
					<input type="text" name="bankBranch" placeholder="请输入您的支行名称"  value="${USER_BANK.bankBranch}">
				</li>
			</ul>
			<a class="redbtn" href="javascript:void(0);" id="button">修改</a>
			</form>
		</div>
	</div>
</div>
		<!-- 城市弹窗 -->
        <div class="cityMask hide">
            <div class="titbox blubg">
                <a class="titreturn left" href="javascript:void(0)" onclick="backper()"><img src="<%=basePath %>app/img/fanhui16@2x.png" alt=""></a>
                <h1>选择城市</h1>
            </div>
            <div class="top50">
                <ul class="cityul">
                    <li>
                        <a href="#">
                            北京
                            <img src="<%=basePath %>app/img/fanh3@2x.png" alt="">
                        </a>
                    </li>
                   
                </ul>
                
            </div>

        </div>
</body>
  
<script type="text/javascript" src="<%=basePath %>app/lib/jquery.min.js"></script>
 <script type="text/javascript" src="<%=basePath %>res/js/layer/layer.min.js"></script>
 <script type="text/javascript" src="<%=basePath %>app/js/public.js"></script>
  <script type="text/javascript">
		$("#pcarea").click(function(){
        	$(".cityul").html('');
        	$.get('<%=basePath%>area/getProvice.cs',function(data){
        		var html = "";
        		for(var i in data){
        			html += "<li onclick='proclick(\""+data[i].code+"\",\""+data[i].name+"\")'>";
        			html += "<a href='javascript:void(0)'>";
        			html += data[i].name;
        			html += " <img src='<%=basePath %>app/img/fanh3@2x.png' alt=''>";
        			html += "</a>";    
        			html += "</li>";    
        		}
        		$(".cityul").html(html);
        	}); 
            $("#tj_client").hide();
            $(".cityMask").show();
        })
        
        function proclick(code, name){
        	var html = "";
        	$.get('<%=basePath%>area/getByParentCode.cs',{'param': code}, function(data){
        		for(var i in data){
        			html += "<li onclick='cityclick(\""+data[i].code+"\",\""+data[i].name+"\")'>";
        			html += "<a href='javascript:void(0)'>";
        			html += data[i].name;
        			html += " <img src='<%=basePath %>app/img/fanh3@2x.png' alt=''>";
        			html += "</a>";    
        			html += "</li>"; 
        		}
        		$(".cityul").html(html);
        	}); 
        	$('#province').val(name);
        }
        
		function cityclick(code, name){
        	var html = "";
        	$.get('<%=basePath%>area/getByParentCode.cs',{'param': code}, function(data){
        		for(var i in data){
        			html += "<li onclick='countyclick(\""+data[i].code+"\",\""+data[i].name+"\")'>";
        			html += "<a href='javascript:void(0)'>";
        			html += data[i].name;
        			html += " <img src='<%=basePath %>app/img/fanh3@2x.png' alt=''>";
        			html += "</a>";    
        			html += "</li>"; 
        		}
        		$(".cityul").html(html);
        	}); 
        	$('#city').val(name);
        }
		
        function countyclick(code, name){
        	$("#tj_client").show();
            $(".cityMask").hide();
            
            $('#area').val(name);
            $('#pcarea').val($('#province').val() + " " + $('#city').val() + " " + $('#area').val());

        }
        
        function backper(){
        	$("#tj_client").show();
            $(".cityMask").hide();
        }
		</script>
</html>