<#-- 修改会员 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<base href="${baseURL}">
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>修改会员 - ${title}</title>
	<meta name="keywords" content="${keywords}"/>
	<meta name="description" content="${description}"/>
	<meta name="commonPath" content="${commonPath}"/>
	<link rel="shortcut icon" type="image/x-icon" href="${baseURL}${commonPath}images/favicon.ico" media="screen" />
	<link href="${commonPath}css/common.css" type="text/css" rel="stylesheet" >
	<link href="${commonPath}css/themify-icons/style.css" type="text/css" rel="stylesheet">
	<script language="javascript" src="${commonPath}js/tool.js" type="text/javascript"></script>
	<script language="javascript" src="${commonPath}js/ajax.js" type="text/javascript"></script>
	<script language="javascript" src="${commonPath}js/json2.js" type="text/javascript"></script>
	<script src="${commonPath}js/cryptoJS/core.js" language="javascript" type="text/javascript"></script>
	<script src="${commonPath}js/cryptoJS/sha256.js" language="javascript" type="text/javascript"></script>
	<script src="${commonPath}js/jquery/jquery.min.js" language="javascript" type="text/javascript"></script>
	<script src="${commonPath}js/jquery/jquery.form.js" language="javascript" type="text/javascript"></script>
	<link href="${commonPath}js/jcrop/css/jquery.Jcrop.min.css" type="text/css" rel="stylesheet" >
	<script src="${commonPath}js/jcrop/js/jquery.Jcrop.min.js" language="javascript" type="text/javascript"></script>
	
	<script type="text/javascript" src="${commonPath}js/jquery/jquery.letterAvatar.js" language="javascript"></script>
	
	<link href="${commonPath}js/layer/skin/default/layer.css"  type="text/css" rel="stylesheet"/>
	<script type="text/javascript" src="${commonPath}js/layer/layer.js" language="javascript"></script>
</head>


<script type="text/javascript" language="javascript"> 
	var commonPath = "";

	//html文件要加入<meta name="commonPath" content="${commonPath}"/>标签
	//从meta标签获取模板路径
	var meta = document.getElementsByTagName("meta");
	for(var i=0;i <meta.length;i++){  
		if(meta[i].name == "commonPath"){
			commonPath = meta[i].getAttribute("content");
		}
	}  
	//空白图片
	var blankImage = commonPath+"images/null.gif";
	//头像图层
	var avatarDiv = "<div id='avatarTag'>";
		avatarDiv += "        <div id='originalImage_box' class='original-box'><div id='image_crop_original_div' class='image-crop-original-div'></div><img id='originalImage' src='"+blankImage+"' alt='原图'></div>";
		avatarDiv += "        <div id='preview-pane' class='preview-pane'>";
		avatarDiv += "            <div id='previewImage_box' class='preview-container'>";
		avatarDiv += "                <div id='image_crop_preview_div' class='image-crop-preview-div'></div>";
		avatarDiv += "                <img id='previewImage' src='"+blankImage+"' alt='缩略图'>";
		avatarDiv += "            </div>";
		avatarDiv += "        </div>";
		avatarDiv += "        <div id='preview-pane2' class='preview-pane2'>";
		avatarDiv += "            <div id='previewImage_box2' class='preview-container2'>";
		avatarDiv += "                <div id='image_crop_preview_div2' class='image-crop-preview-div'></div>";
		avatarDiv += "                <img id='previewImage2' src='"+blankImage+"' alt='缩略图'>";
		avatarDiv += "            </div>";
		avatarDiv += "        </div>";
		avatarDiv += "</div>";



	//头像表单
	var avatarForm = "<form id='uploadImageForm' enctype='multipart/form-data'>";
		avatarForm += "    <div class='avatarModule '>";
		avatarForm +=          avatarDiv;
		
		avatarForm += "        <div class='bottomInfo'>";
		avatarForm += "            <div class='button-box'>";
		avatarForm += "                <i id='progressBar' class='progressBar'></i>&nbsp;&nbsp;";
		avatarForm += "                <span>选择图片<input type='file' style='width: 104px;' id='imgFile' name='imgFile' onchange='imgForm(this)'/></span>";
		avatarForm += "                <span class='on' id='uploadSubmit' onClick='javascript:uploadImageSubmit();'>上传</span>";
		avatarForm += "            </div>";
		avatarForm += "        </div>";
		avatarForm += "   </div>";
		avatarForm += "</form>";

    
    //显示/隐藏 更改头像层
    $(function(){
	    $("#updateAvatarLink").hide(); // 默认隐藏所有内层元素
	    $(".updateAvatar").hover(function() {  // 鼠标经过事件
	        $(this).find("#updateAvatarLink").toggle();  // 切换显示和隐藏
	    }, function() {
	        $(this).find("#updateAvatarLink").toggle();  // 切换显示和隐藏
	
	    });
	});

    
    //更换头像弹出层
	function avatarLayer(){
		var div = avatarForm;
		layer.open({
		    type: 1, 
		    title:"更换头像",
		    content: div, //这里content是一个普通的String
		    moveOut:true,//是否允许拖拽到窗口外
		    area: ['666px', '518px'],//宽高
			success: function(layero, index){
			}
		});
	}
    
    
    var width;// 裁剪框的宽度  
    var height;// 裁剪框的高度  
    var x;// 相对于裁剪图片x左边  
    var y;// 相对于裁剪图片y左边  
    
    //创建变量(在这个生命周期)的API和图像大小  
	var jcrop_api,
		boundx,//原图的宽
		boundy,//原图的高
		originalImage_realSrc,//原图路径 IE7-IE9使用
		$preview,
		$pcnt,
		$pimg,
		xsize,//预览窗口的宽
		ysize,//预览窗口的高
		
		$preview2,
		$pcnt2,
		$pimg2,
		xsize2,//预览窗口的宽
		ysize2,//预览窗口的高
		scaleFactor;//缩放比例
		
    //图像裁剪
	function imageCropp(bgColor){
		//获取预览窗格相关信息  
		$preview = $('#preview-pane'),
		$pcnt = $('#preview-pane .preview-container'),
		$pimg = $('#preview-pane .preview-container img'),
		xsize = $pcnt.width(),
		ysize = $pcnt.height();
		
		$preview2 = $('#preview-pane2'),
		$pcnt2 = $('#preview-pane2 .preview-container2'),
		$pimg2 = $('#preview-pane2 .preview-container2 img'),
		xsize2 = $pcnt2.width(),
		ysize2 = $pcnt2.height();
		$('#originalImage').Jcrop({
			onChange: updatePreview,//选框改变时的事件
		//	onSelect: updatePreview,//创建选框，参数格式为：[x,y,x2,y2]
			setSelect:[0,0,200,200],//创建默认选框，参数格式为：[x,y,x2,y2]
			aspectRatio: 1,//选框宽高比。说明：width/height
			boxWidth: 400,//画布宽度
			boxHeight: 400,//画布高度
			minSize: [200,200],//选框最小尺寸 格式： [0,0]
			bgColor: bgColor,//背景颜色  默认"black"	 透明#00000000
			allowSelect :false,//允许新选框
			allowResize :true//允许选框缩放
			
		} ,function(){
			//使用API来获得真实的图像大小  
			var bounds = this.getBounds();//获取图片实际尺寸，格式为：[w,h]
			boundx = bounds[0];
			boundy = bounds[1];
			
			//初始化预览图
			updatePreview(this.tellSelect());//tellSelect()获取选框的值（实际尺寸）。例子：console.log(jcrop_api.tellSelect())
				
				
			scaleFactor = this.getScaleFactor();//获取图片缩放的比例，格式为：[w,h]
			//jcrop_api变量中存储API  
			jcrop_api = this;
			//预览进入jcrop容器css定位  
			$preview.appendTo(jcrop_api.ui.holder);
			$preview2.appendTo(jcrop_api.ui.holder);
		});
		
	
	}

	
	/**
	 * 更新预览
	 * @param select 选区 选框的值（实际尺寸）
	 */
    function updatePreview(select){
		var browserVersion = window.navigator.userAgent.toUpperCase();
		if (browserVersion.indexOf("MSIE") > -1 && browserVersion.indexOf("MSIE 6") <= -1) {//IE7-IE9
			thumbnailPreview(select);
		}else{
			//设置预览
			if (parseInt(select.w) > 0) {
			 
				var rx = xsize / select.w;//select.w 代表选区的宽
				var ry = ysize / select.h;//select.h 代表选区的高
				$pimg.css({
					width: Math.round(rx * boundx) + 'px',
					height: Math.round(ry * boundy) + 'px', 
					marginLeft: '-' + Math.round(rx * select.x) + 'px',
					marginTop: '-' + Math.round(ry * select.y) + 'px'
				});
				
				var rx2 = xsize2 / select.w;//select.w 代表选区的宽
				var ry2 = ysize2 / select.h;//select.h 代表选区的高
				$pimg2.css({
					width: Math.round(rx2 * boundx) + 'px',
					height: Math.round(ry2 * boundy) + 'px', 
					marginLeft: '-' + Math.round(rx2 * select.x) + 'px',
					marginTop: '-' + Math.round(ry2 * select.y) + 'px'
				});
				
			}
		}


    	
		// 赋值  
        x = select.x;  
		y = select.y;  
        width = select.w;  
        height = select.h;  
	};
	/**
	 * ie7+缩略图预览
	 * @param select 选区
	 * @param bounds 实际内容
	 */
	function thumbnailPreview(select){
	
		//设置预览
		if (parseInt(select.w) > 0) {
			var rx = xsize / select.w;//select.w 代表选区的宽
			var ry = ysize / select.h;//select.h 代表选区的高
			$("#image_crop_preview_div").css(
				"filter",
				"progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale',src='" + originalImage_realSrc + "')"
			);
			
			$("#image_crop_preview_div").css({
				width: Math.round(rx * boundx) + 'px',
				height: Math.round(ry * boundy) + 'px', 
				marginLeft: '-' + Math.round(rx * select.x) + 'px',
				marginTop: '-' + Math.round(ry * select.y) + 'px'
			});
			
			var rx2 = xsize2 / select.w;//select.w 代表选区的宽
			var ry2 = ysize2 / select.h;//select.h 代表选区的高
			
			$("#image_crop_preview_div2").css(
				"filter",
				"progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale',src='" + originalImage_realSrc + "')"
			);

			$("#image_crop_preview_div2").css({
				width: Math.round(rx2 * boundx) + 'px',
				height: Math.round(ry2 * boundy) + 'px', 
				marginLeft: '-' + Math.round(rx2 * select.x) + 'px',
				marginTop: '-' + Math.round(ry2 * select.y) + 'px'
			});
		}
	}
	
	
	//选择文件
	function imgForm(file) { 
		if(!verificationImageFormat(file)){
			return;
		}
		if(jcrop_api){
			jcrop_api.destroy();//移除 Jcrop
		}
		
		readImagePath(file, function(src) {

			$("#avatarTag").html(avatarDiv); 

			var browserVersion = window.navigator.userAgent.toUpperCase();
			if (browserVersion.indexOf("MSIE") > -1 && browserVersion.indexOf("MSIE 6") <= -1) {//IE7-IE9
				originalImage_realSrc = src;
				
				//设置原图预览滤镜
				$("#image_crop_original_div").css(
						"filter",
						"progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale',src='" + src + "')"
					);
				//获取图片实际大小（由于使用缩放滤镜scale必须指定div宽高，无法做到自适应，因此先通过image滤镜获取实际大小）
				var bounds = getImageBounds(src);
				//按比例缩放图片
				var param = clacImgZoomParam(400, 400, bounds.w, bounds.h);
				
			 	$("#image_crop_original_div").width(param.width);
				$("#image_crop_original_div").height(param.height);
				
				//需要对透明的img使用绝对定位并设置offset为预览div的offset，避免jcrop无法覆盖在预览div上面
				$("#originalImage").css("position","absolute");
				$("#originalImage").css("display","inline-block");
				$("#originalImage").offset($("#image_crop_original_div").offset());
				$("#originalImage").width(bounds.w);
				$("#originalImage").height(bounds.h);
				$("#originalImage").attr("src", blankImage);
				$("#originalImage").attr("realSrc", src);

				imageCropp("#00000000");
			}else{//支持html5浏览器
				$('#originalImage').attr('src', src);  
				$('#previewImage').attr('src', src);  
				$('#previewImage2').attr('src', src); 
				
				imageCropp("black");
			}
		});
	}

	/**
	 * 获取图片的实际大小
	 * @param tmpSrc 图片源
	 * @return {w,h} 宽和高
	 */
	function getImageBounds(tmpSrc){
		var imgObj = new Image();
		imgObj.src = tmpSrc;
		var width = imgObj.width;
		var height = imgObj.height;
		if((typeof width=="undefined" || width==0) && (typeof height=="undefined" || height==0)){
			var picpreview=document.getElementById("originalImage_box");
		    var tempDiv=document.createElement("div");
		    picpreview.appendChild(tempDiv);
		    tempDiv.style.width="10px";
		    tempDiv.style.height="10px";
		    tempDiv.style.diplay="none";
		    tempDiv.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image',src='" + tmpSrc + "');";
		    tempDiv.ID="previewTemp" + new Date().getTime();
		    width=tempDiv.offsetWidth;
		    height=tempDiv.offsetHeight;
		    picpreview.removeChild(tempDiv);
		}
		return {w:width,h:height};
	};
	
	/**
	 * 按比例缩放图片
	 * @param maxWidth 图片最大宽度
	 * @param maxHeight 图片最大高度
	 * @param width 图片实际宽度
	 * @param height 图片实际高度
	 * @return {width,height} 宽和高
	 */
	function clacImgZoomParam (maxWidth, maxHeight, width, height) {
		var param = {
			width : width,
			height : height
		};
		if (width > maxWidth || height > maxHeight) {
			var rateWidth = width / maxWidth;
			var rateHeight = height / maxHeight;

			if (rateWidth > rateHeight) {
				param.width = maxWidth;
				param.height = Math.round(height / rateWidth);
			} else {
				param.width = Math.round(width / rateHeight);
				param.height = maxHeight;
			}
		}

		param.left = Math.round((maxWidth - param.width) / 2);
		param.top = Math.round((maxHeight - param.height) / 2);
		return param;
	}
	
	
	//读取图片路径  file：file控件 prvid: 图片预览容器
	function readImagePath(file, callback) {
		var supportHTML5 = false;
		var browserVersion = window.navigator.userAgent.toUpperCase();
		if(file.files){
			supportHTML5 = true;
		}else{
			supportHTML5 = false;
		}
		//进行浏览器判断，选择对应的实现方式
		if(supportHTML5){
			for (var i = 0, f; f = file.files[i]; i++) {
				var fr = new FileReader();
				fr.onload = function(e) {
					var src = e.target.result;
					showPrvImg(src);
				}
				fr.readAsDataURL(f);
			}

		} else if (browserVersion.indexOf("MSIE") > -1 && browserVersion.indexOf("MSIE 6") > -1) {//IE6
			showPrvImg(file.value);
		} else if (browserVersion.indexOf("MSIE") > -1 && browserVersion.indexOf("MSIE 6") <= -1) {//IE7-IE9
			file.select();
			//如果是ie9需要触发blur事件，避免被安全规则阻拦
            if (browserVersion.indexOf("MSIE 9") > -1) {
                file.blur(); //不加上document.selection.createRange().text在ie9会拒绝访问
             
            }
			
			var reallocalpath = document.selection.createRange().text//IE下获取实际的本地文件路径
			showPrvImg(reallocalpath);
		} else if (browserVersion.indexOf("FIREFOX") > -1) {//FIREFOX
			var firefoxVersion = parseFloat(browserVersion.toLowerCase().match(/firefox\/([\d.]+)/)[1]);
			var src;
			if (firefoxVersion < 7) {// firefox7以下版本
				src = file.files[0].getAsDataURL();
			
			} else {// firefox7.0+
				src = window.URL.createObjectURL(file.files[0]);
			}
			showPrvImg(src);
		}

		function showPrvImg(src) {
			callback(src);
		}
	}
	
	
	
	//验证图片格式
    function verificationImageFormat(file) {
        var array = new Array('gif','jpg', 'jpeg', 'png', 'bmp'); //可以上传的文件类型
        if (file.value == '') {
	        layer.open({
			    type: 1, 
			    title:"错误",
			    content: "文件不能为空", 
			    area: ['260px', '120px'],//宽高
				success: function(layero, index){
					 return false;
				}
			});
        }else {
        	//获取最后一个.的位置
			var index= file.value.lastIndexOf(".");
			//获取后缀
			var ext = file.value.substr(index+1);
			
            //循环判断图片的格式是否正确
            for (var i in array) {
                if (ext.toLowerCase() == array[i].toLowerCase()) {
                    return true;
                }
            }
            layer.open({
			    type: 1, 
			    title:"错误",
			    content: "<div style='line-height: 30px; font-size: 14px; margin-left: 8px;margin-right: 8px;'>只允许上传gif、jpg、jpeg、bmp、png格式</div>", 
			    area: ['260px', '120px'],//宽高
				success: function(layero, index){
					 return false;
				}
			});
           
        }
    }

    //提交上传图片
	function uploadImageSubmit(){
		
		//按钮设置 disabled="disabled"
		document.getElementById("uploadSubmit").disabled=true;
		if(width == null){
			layer.open({
			    type: 1, 
			    title:"错误",
			    content: "<div style='line-height: 30px; font-size: 14px; margin-left: 8px;margin-right: 8px;'>请先选择图片</div>", 
			    area: ['260px', '120px'],//宽高
				success: function(layero, index){
					 
				}
			});
			//按钮设置 disabled="disabled"
			document.getElementById("uploadSubmit").disabled=false;
			return false;
			
		}
		//Math.round(number)四舍五入取整
		var _width = Math.round(width);
		var _height = Math.round(height);
		var _x = Math.round(x);
		var _y = Math.round(y);
		if(_x <0){
		 	_x =0;
		}
		if(_y <0){
			_y =0;
		}
		
		var context = "?width="+_width +"&height="+_height+"&x="+_x+"&y="+_y;

		$("#uploadImageForm").ajaxSubmit({
	        dataType:'json',//提交成功后返回的数据格式，可选值包括xml，json或者script
	        type:'POST',// 提交类型可以是"GET"或者"POST"
	        url:'user/control/updateAvatar'+context,// 表单提交的路径
	        beforeSend: function() {//表单提交前做表单验证

	        },
	        //进度条的监听器
	        xhr: function(){
	        	
				var xhr = $.ajaxSettings.xhr();
	            if(onprogress && xhr.upload) {
	            	xhr.upload.addEventListener("progress" , onprogress, false);
	                return xhr;
	            }
	        },
	        success: function(data) {//提交成功后调用  
	        	var returnValue = JSON.parse(data);//JSON转为对象   	
	        	for(var key in returnValue){
	        		if(key == "success"){
	        			if(returnValue[key] == "true"){
	        				layer.msg('更新头像成功,3秒后刷新页面', 
								{
								  time: 3000 //3秒关闭（如果不配置，默认是3秒）
								},function(){
									//关闭后的操作
						        	document.location.reload();//刷新页面
								}
							);
	        			}
	        		}else if(key == "error"){
	        			var errorValue = returnValue[key];
						var htmlValue = "";
						var i = 0;
						for(var error in errorValue){
							if(error != ""){	
								i++;
								htmlValue += "&nbsp;&nbsp;"+i+"、"+errorValue[error]+"<br>";
							}
						}
						
						layer.open({
						  type: 1,
						  title: '错误', 
						  skin: 'layui-layer-rim', //加上边框
						  area: ['300px', '150px'], //宽高
						  content: htmlValue
						});
	        		}
	        		
	        	}
				//按钮设置 disabled="disabled"
				document.getElementById("uploadSubmit").disabled=false;
	        },
			error: function(XMLHttpRequest, textStatus, errorThrown) {
				//jquery请求session过期跳转
				timeoutJump(XMLHttpRequest);
			}
	    });
	    
	}
	//侦查当前文件上传情况
	function onprogress(evt){
       //侦查附件上传情况
       //通过事件对象侦查
       //该匿名函数表达式大概0.05-0.1秒执行一次
      // console.log(evt.loaded);  //已经上传大小情况
       //evt.total; 附件总大小
       var loaded = evt.loaded;
       var tot = evt.total;
       var per = Math.floor(100*loaded/tot);  //已经上传的百分比
       var son =  document.getElementById('progressBar');
       son.innerHTML = per+"%";
       son.style.width=per+"%";
   }
</script>




<BODY>
<#-- 引入页头 -->
<@include action="${newPublic_2}"/>
<div class="skeleton">
	<div class="main wrap backgroundModule" >
		<#-- 引入服务导航 -->
		<@include action="${newPublic_4}"/>
		
		<form id="editUserForm" method="post" autocomplete="off" action="user/control/editUser">
		<!-- 令牌标记 -->
		<input type="hidden" id="token" name="token" value="${token}">
		<div class="editUserModule wrap">
			
			<div class="blankTableModule">
				<div class="updateAvatar" >
		             <a href="javascript:void(0);" onclick="javascript: avatarLayer(); return false;">
		             	<div id="updateAvatarLink" class="change" style="display: none;"><span>更换头像</span></div>
		             </a>
		             
		             <#if user.avatarName != null>
						<img src="${user.avatarPath}${user.avatarName}">
					<#else>
						<!--[if (IE)]><img src="${commonPath}images/min_avata.png"><![endif]-->
						<!--[if !(IE)]><!--><img avatar="${(user.nickname != null && user.nickname??) ?string(user.nickname , user.account)}" ><!--<![endif]-->
					</#if> 
		        </div>
				
				<div class="box">
        			<div class="form">
						<div class="form-field" >
			        		<div id="account_field_error" class="form-field-container">
				        		<div class="form-field-radio">
				        			<div class="form-field-radio-container">
					        			<div class="form-field-radio-input">
					        				<div>${user.account}</div>
					        				<label class="form-field-label form-field-active">账号</label>
					        			</div>
				        			</div>
				        		</div>
			        		</div>
			        	</div>
			        	<div class="form-field" >
			        		<div id="nickname_field_error" class="form-field-container">
				        		<#if user.nickname != null && user.nickname??>
									<div class="form-field-radio">
					        			<div class="form-field-radio-container">
											<div class="form-field-radio-input">
						        				<div>${user.nickname}</div>
						        				<label class="form-field-label form-field-active">呢称</label>
						        			</div>
						        		</div>
				        			</div>	
								<#else>
									<div class="form-field-text">
										<div class="form-field-input-container">
						        			<input id="nickname" maxLength="20" class="form-field-text-input" type="text" value="" onfocus="inputBoxClickTip(this);" onblur="inputBoxOutTip(this);">
						        			<label class="form-field-label">呢称</label>
					        			</div>
				        			</div>
								</#if>
				        		<div id="nickname_prompt_error" class="form-field-prompt-error"></div>
				        		<div class="form-field-help">不设置请留空</div>
			        		</div>
			        	</div>
			        	<#if userRoleList?? && userRoleList?size gt 0>
			        	<div class="form-field" >
			        		<div id="role_field_error" class="form-field-container">
				        		<div class="form-field-radio">
				        			<div class="form-field-radio-container">
					        			<div class="form-field-radio-input">
					        				<div>
					        					<table cellSpacing="0" cellPadding="0" width="100%" border="0">
												    <#list userRoleList as userRole>
													    <tr>
													  		<td style="text-align:left;width: 200px;line-height: 28px;">
													  			${userRole.name}
													    	</td>
													    	<td style="text-align:left;">
													    		${userRole.validPeriodEnd} 到期
													    	</td>
													    </tr>
													</#list>
											    </table>
					        				</div>
					        				<label class="form-field-label form-field-active">角色</label>
					        			</div>
				        			</div>
				        		</div>
			        		</div>
			        	</div>
			        	</#if>
			        	<div class="form-field" >
			        		<div id="allowUserDynamic_field_error" class="form-field-container">
				        		<div class="form-field-radio">
				        			<div class="form-field-radio-container">
				        				<div class="form-field-radio-input">
					        				<label>
												<input type="radio" class="formRadio" name="allowUserDynamic" value="true" <#if user.allowUserDynamic ==true> checked='checked'</#if>>
								                <span class="formRadio-core"></span>
												<span class="formRadio-text">显示</span> 
											</label>
											<label>
												<input type="radio" class="formRadio" name="allowUserDynamic" value="false" <#if user.allowUserDynamic ==false> checked='checked'</#if>>
								                <span class="formRadio-core"></span>
												<span class="formRadio-text">关闭</span> 
											</label>
					        			</div>
					        			<label class="form-field-label form-field-active">允许显示用户动态</label>
				        			</div>
				        		</div>
			        			<div id="allowUserDynamic_prompt_error" class="form-field-prompt-error"></div>
			        		</div>
			        	</div>
			        	
			        	<div class="form-field" >
			        		<div id="oldPassword_field_error" class="form-field-container">
				        		<div class="form-field-text">
				        			<div class="form-field-input-container">
					        			<input id="oldPassword" maxLength="20" class="form-field-text-input" type="password" value="" onfocus="inputBoxClickTip(this);" onblur="inputBoxOutTip(this);">
					        			<label class="form-field-label">旧密码</label>
				        			</div>
				        		</div>
			        			<div id="oldPassword_prompt_error" class="form-field-prompt-error"></div>
			        		</div>
			        	</div>
			        	<div class="form-field" >
			        		<div id="password_field_error" class="form-field-container">
				        		<div class="form-field-text">
				        			<div class="form-field-input-container">
					        			<input id="password" maxLength="20" class="form-field-text-input" type="password" value="" onfocus="inputBoxClickTip(this);" onblur="inputBoxOutTip(this);">
					        			<label class="form-field-label">密码</label>
				        			</div>
				        		</div>
			        			<div id="password_prompt_error" class="form-field-prompt-error"></div>
			        		</div>
			        	</div>
			        	<div class="form-field" >
			        		<div id="confirmPassword_field_error" class="form-field-container">
				        		<div class="form-field-text">
				        			<div class="form-field-input-container">
					        			<input id="confirmPassword" maxLength="20" class="form-field-text-input" type="password" value="" onfocus="inputBoxClickTip(this);" onblur="inputBoxOutTip(this);">
					        			<label class="form-field-label">确认密码</label>
				        			</div>
				        		</div>
			        			<div id="confirmPassword_prompt_error" class="form-field-prompt-error"></div>
			        		</div>
			        	</div>
			        	<!-- 用户自定义注册功能项 -->
						<#list userCustomList as userCustom>
			        		<#if userCustom.chooseType ==1>
								<div class="form-field" >
					        		<div id="userCustom_${userCustom.id}_field_error" class="form-field-container">
						        		<div class="form-field-text">
						        			<div class="form-field-input-container">
							        			<input name="userCustom_${userCustom.id}" size="${userCustom.size}" maxlength="${userCustom.maxlength}" class="form-field-text-input" type="text" value="<#list userCustom.userInputValueList as userInputValue>${userInputValue.content}</#list>" onfocus="inputBoxClickTip(this);" onblur="inputBoxOutTip(this);">
							        			<label class="form-field-label"><#if userCustom.required == true><span class="required">*</span></#if>${userCustom.name}</label>
						        			</div>
						        		</div>
					        			<div id="userCustom_${userCustom.id}_prompt_error" class="form-field-prompt-error"></div>
					        			<div class="form-field-help">${userCustom.tip}</div>
					        		</div>
					        	</div>
							</#if>
			        		<#if userCustom.chooseType ==2>
			        			<#if userCustom.itemValue?has_content>
								<div class="form-field" >
					        		<div id="userCustom_${userCustom.id}_field_error" class="form-field-container">
						        		<div class="form-field-radio">
						        			<div class="form-field-radio-container">
						        				<div class="form-field-radio-input">
							        			<#list userCustom.itemValue?keys as itemValue>
													<#-- 选中项 -->
													<#assign _checked = "">
													<#list userCustom.userInputValueList as userInputValue>
														<#if userInputValue.options == itemValue>
															<#assign _checked=" checked='checked'">
														</#if>
													</#list>
													
													<#-- 默认选第一项 -->
													<#if itemValue_index == 0  && userCustom.userInputValueList?exists && userCustom.userInputValueList?size == 0> 
													<#assign _checked = " checked='checked'">
													</#if>
		
													<label>
														<input type="radio" class="formRadio" name="userCustom_${userCustom.id}" value="${itemValue}" ${_checked}>
										                <span class="formRadio-core"></span>
														<span class="formRadio-text">${userCustom.itemValue[itemValue]}</span> 
													</label>
												
												</#list>
							        			</div>
							        			<label class="form-field-label form-field-active"><#if userCustom.required == true><span class="required">*</span></#if>${userCustom.name}</label>
						        			</div>
						        		</div>
					        			<div id="userCustom_${userCustom.id}_prompt_error" class="form-field-prompt-error"></div>
					        			<div class="form-field-help">${userCustom.tip}</div>
					        		</div>
					        	</div>
					        	</#if>
					        	
							</#if>
							<#if userCustom.chooseType ==3>
								<#if userCustom.itemValue?has_content>
									<div class="form-field" >
						        		<div id="userCustom_${userCustom.id}_field_error" class="form-field-container">
							        		<div class="form-field-radio">
							        			<div class="form-field-radio-container">
							        				<div class="form-field-radio-input">
								        			<#list userCustom.itemValue?keys as itemValue>
														<#-- 选中项 -->
														<#assign _checked = "">
														<#list userCustom.userInputValueList as userInputValue>
															<#if userInputValue.options == itemValue>
																<#assign _checked=" checked='checked'">
															</#if>
														</#list>
														<label>
															<input type="checkbox" class="formCheckbox" name="userCustom_${userCustom.id}" value="${itemValue}" ${_checked}>
															<span class="formCheckbox-core"></span>
															<span class="formCheckbox-text">${userCustom.itemValue[itemValue]}</span>
														</label>
													</#list>
								        			</div>
								        			<label class="form-field-label form-field-active"><#if userCustom.required == true><span class="required">*</span></#if>${userCustom.name}</label>
							        			</div>
							        		</div>
						        			<div id="userCustom_${userCustom.id}_prompt_error" class="form-field-prompt-error"></div>
						        			<div class="form-field-help">${userCustom.tip}</div>
						        		</div>
						        	</div>
								</#if>
							</#if>
							<#if userCustom.chooseType ==4>
								<div class="form-field" >
					        		<div id="userCustom_${userCustom.id}_field_error" class="form-field-container">
						        		<div class="form-field-radio">
						        			<div class="form-field-radio-container">
						        				<div class="form-field-radio-input">
							        			<select class="formSelect" name="userCustom_${userCustom.id}" <#if userCustom.multiple == true> multiple='multiple'</#if> <#if userCustom.selete_size != null> size='${userCustom.selete_size}'</#if>>
													<#if userCustom.itemValue?has_content>
													<#list userCustom.itemValue?keys as itemValue>
														<#assign _selected = "">
														<#list userCustom.userInputValueList as userInputValue>
															<#if userInputValue.options == itemValue>
																<#assign _selected=" selected='selected'">
															</#if>
														</#list>			
														<option value="${itemValue}" ${_selected}>${userCustom.itemValue[itemValue]}</option>		
													</#list>
													</#if>	
												</select>
							        			</div>
							        			<label class="form-field-label form-field-active"><#if userCustom.required == true><span class="required">*</span></#if>${userCustom.name}</label>
						        			</div>
						        		</div>
					        			<div id="userCustom_${userCustom.id}_prompt_error" class="form-field-prompt-error"></div>
					        			<div class="form-field-help">${userCustom.tip}</div>
					        		</div>
					        	</div>
							</#if>
							<#if userCustom.chooseType ==5>
								<div class="form-field" >
					        		<div id="userCustom_${userCustom.id}_field_error" class="form-field-container">
						        		<div class="form-field-radio">
						        			<div class="form-field-radio-container">
						        				<div class="form-field-radio-input">
							        				<textarea class="formTextarea" name="userCustom_${userCustom.id}" rows="${userCustom.rows}" cols="${userCustom.cols}"><#list userCustom.userInputValueList as userInputValue>${userInputValue.content}</#list></textarea>
							        			</div>
							        			<label class="form-field-label form-field-active"><#if userCustom.required == true><span class="required">*</span></#if>${userCustom.name}</label>
						        			</div>
						        		</div>
					        			<div id="userCustom_${userCustom.id}_prompt_error" class="form-field-prompt-error"></div>
					        			<div class="form-field-help">${userCustom.tip}</div>
					        		</div>
					        	</div>
							</#if>
			        	</#list>
			        	
					</div>
				</div>
				<div id="token_prompt_error" style="color: red;">${(error['token'])!}</div>
        		<div id="user_prompt_error" style="color: red;">${(error['user'])!}</div>
				<div class="submitButton-box">
					<a href="javascript:void(0);" onClick="javascript:ajaxSubmit()" tabindex="6">提&nbsp;交</a>
				</div>
			</div>
		</div>
		</form>
	
	</div>
</div>
<#--引入页脚-->
<@include action="${newPublic_3}"/>


<script language="javascript" type="text/javascript">
	$(".form-field").find(".form-field-input-container").bind("mousedown",function(e) {
		$(this).find(".form-field-text-input").focus();
		
		if($(this).find(".form-field-label").hasClass("form-field-active")){
			return;
		
		}
		$(this).find(".form-field-label").addClass("form-field-active");
	});
	
	$(document).mousedown(function (e) {
        var target = $(e.target);
        if (target.closest(".form-field-input-container").length == 0) {
            $(".form-field-input-container").each(function(){
			    if($(this).find(".form-field-label").hasClass("form-field-active")){
					if($(this).find('input[type="text"]').val() == "" || $(this).find('input[type="password"]').val() == ""){
						$(this).find(".form-field-label").removeClass("form-field-active");
					}
					
				}
			});
        }
    });
    //文本框含有默认值时字段名称缩小
	$(document).ready(function(){
		$(".form-field-input-container").each(function(){
		    if(!$(this).find(".form-field-label").hasClass("form-field-active")){
				if(($(this).find('input[type="text"]').val() != undefined && $(this).find('input[type="text"]').val() != '') 
					|| $(this).find('input[type="password"]').val() != undefined && $(this).find('input[type="password"]').val() != ''){
					$(this).find(".form-field-label").addClass("form-field-active");
				}
				
			}
		});
	});
	
	
	//监听Tab键
    $(document).on('keyup',function (e) {
	    if(e.keyCode == 9){
	    	var input = $(this).find('input:focus');
	    	if (input.length) {
		    	if(!input.parent().parent().find(".form-field-label").hasClass("form-field-active")){
					input.parent().parent().find(".form-field-label").addClass("form-field-active");
				}
		    }
		}
	});
    //解决提交按钮的click和blur事件冲突
	$(document).ready(function(){
		$("input[type='button']").mousedown(function(e){
	    	e.preventDefault();
		});
		$("a[href='javascript:void(0);']").mousedown(function(e){
	    	e.preventDefault();
		});
		
	});
</script>
<script language="javascript" type="text/javascript">	
	//点击输入框提示
	function inputBoxClickTip(obj){
	
	
	}
	//离开输入框提示
	function inputBoxOutTip(obj){
		verification(obj.id);
	}
	//验证参数
	function verification(field){
		$("#"+field+"_prompt_error").hide();
		$("#"+field+"_field_error").removeClass("form-field-error");
		
		if(field == "password"){//密码
			var password = $("#"+field).val().trim();
				if(password != ""){
					if(getStringLeng(password) < 7){
					$("#"+field+"_prompt_error").html("密码长度不能小于7位");
					$("#"+field+"_prompt_error").show();
					$("#"+field+"_field_error").addClass("form-field-error");
					return false;
				}
				if(getStringLeng(password) > 20){
					$("#"+field+"_prompt_error").html("密码长度不能大于20位");
					$("#"+field+"_prompt_error").show();
					$("#"+field+"_field_error").addClass("form-field-error");
					return false;
				}
			}
			
		}
		if(field == "confirmPassword"){//确认密码
			var confirmPassword = $("#"+field).val().trim();
			var password = $("#password").val().trim();
			if(confirmPassword != password){
				$("#"+field+"_prompt_error").html("两次密码不相等");
				$("#"+field+"_prompt_error").show();
				$("#"+field+"_field_error").addClass("form-field-error");
				return false;
			}
		}
		return true;
	}
	
	
	//组装参数
	function getParameter(){
		var parameter = "";

		//令牌标记
		var token = $("#token").val();
		parameter += "&token="+token;
		
		
		//呢称
		var nickname = $("#nickname").val();
		if(nickname != null){
			parameter += "&nickname="+encodeURIComponent(nickname.trim());
		}
		
		var allowUserDynamic_radio = document.getElementsByName("allowUserDynamic");
		for(var i=0; i<allowUserDynamic_radio.length; i++) {
			if (allowUserDynamic_radio[i].checked) {
				parameter += "&allowUserDynamic="+allowUserDynamic_radio[i].value;
			}
		}
	
		//密码需SHA256加密
		var password = $("#password").val().trim();
		if(password != ""){
			parameter += "&password="+ CryptoJS.SHA256(password);
			
			var oldPassword = $("#oldPassword").val().trim();
			if(oldPassword != ""){
				parameter += "&oldPassword="+ CryptoJS.SHA256(oldPassword);
			}
		}
		
		//自定义表单name集合
		var array = new Array();
		
		//读取表单所有的input标签
		var all_input = document.getElementsByTagName("input");
		for(var i=0;i<all_input.length; i++){
			var obj = all_input[i];
			if(obj.name.substring(0,11) =="userCustom_"){
				var isExist = false;//是否已存在数组中
				//如果存在，则不添加
				for(var j=0;j<array.length; j++){
					if(array[j] == all_input[i].name){
						isExist = true;
						break;
					}
				}
				if(isExist == false){
					array.push (all_input[i].name); 
				}		
			}
		}
		//读取表单所有的select标签
		var all_select = document.getElementsByTagName("select");
		for(var i=0;i<all_select.length; i++){
			var obj = all_select[i];
			if(obj.name.substring(0,11) =="userCustom_"){
				var isExist = false;//是否已存在数组中
				//如果存在，则不添加
				for(var j=0;j<array.length; j++){
					if(array[j] == all_select[i].name){
						isExist = true;
						break;
					}
				}
				if(isExist == false){
					array.push (all_select[i].name); 
				}		
			}
		}
		//读取表单所有的textarea标签
		var all_textarea = document.getElementsByTagName("textarea");
		for(var i=0;i<all_textarea.length; i++){
			var obj = all_textarea[i];
			if(obj.name.substring(0,11) =="userCustom_"){
				var isExist = false;//是否已存在数组中
				//如果存在，则不添加
				for(var j=0;j<array.length; j++){
					if(array[j] == all_textarea[i].name){
						isExist = true;
						break;
					}
				}
				if(isExist == false){
					array.push (all_textarea[i].name); 
				}		
			}
		}

		for(var i=0;i<array.length; i++){
			//读取表单参数
			var obj = document.getElementsByName(array[i]);
			if(obj[0].type == "text"){//输入框
			
				parameter += "&"+obj[0].name+"="+encodeURIComponent(obj[0].value);
			}
			if(obj[0].type == "radio"){//单选
				for(var j=0;j<obj.length;j++){ 
					if(obj[j].checked){
						parameter += "&"+obj[0].name+"="+obj[j].value;
						break; 
					}
				}
			}
			if(obj[0].type == "checkbox"){//多选
				for(var j=0;j<obj.length;j++){ 
					if(obj[j].checked){
						parameter += "&"+obj[0].name+"="+obj[j].value;
					}
				}
			}
			if(obj[0].type.substring(0,6) == "select"){//下拉列表
				for(var j=0;j<obj[0].length;j++){ 
					if(obj[0][j].selected){
						parameter += "&"+obj[0].name+"="+obj[0][j].value;
					}
				}
			}
			if(obj[0].type == "textarea"){//表单域
				parameter += "&"+obj[0].name+"="+encodeURIComponent(obj[0].value);
			
			}
		}
		

	
		//删除第一个&号,防止因为多了&号而出现警告: Parameters: Invalid chunk ignored.信息
		if(parameter.indexOf("&") == 0){
			parameter = parameter.substring(1,parameter.length);
		}
		return parameter;
	}
	
	//验证全部参数
	function allVerification(){
		var isVerification = true;
		if(verification("password") == false){
			isVerification = false;
		}
		if(verification("confirmPassword") == false){
			isVerification = false;
		}
		return isVerification;
	}
	
	//ajax提交
	function ajaxSubmit(){
	
		if(allVerification() == false){
			//需引入layer
     		layer.msg('请填好资料再提交', {
				time: 3000 //3秒关闭（如果不配置，默认是3秒）
				},function(){//关闭后的操作
						
				}
			);
			return;
		}
	
		var parameter = getParameter();
		if(parameter.indexOf("&") == 0){
			parameter = parameter.substring(1,parameter.length);
		}
		post_request(function(value){
			if(value != ""){
				var returnValue = JSON.parse(value);//JSON转为对象
				for(var key in returnValue){
					if(key == "success"){	
						var success = returnValue[key];	
						if(success == "true"){
							//需引入layer
				     		layer.msg('修改成功，3秒后自动刷新当前页面', {
								time: 3000 //3秒关闭（如果不配置，默认是3秒）
								},function(){//关闭后的操作
									//刷新当前在页面
									window.location.reload();	
								}
							);
						}
					}else if(key == "error"){
						var errorValue = returnValue[key];
						for(var error in errorValue){
							if(error != ""){
								$("#"+error+"_prompt_error").html(errorValue[error]);
								$("#"+error+"_prompt_error").show();
								$("#"+error+"_field_error").addClass("form-field-error");
							}
						}
					}
				}
			}	
		},
			"user/control/editUser?&timestamp=" + new Date().getTime(), true,parameter);

	}
</script>
</BODY>

</HTML>
