yiheRepair/SystemManager/js/addUserManag...

/**
 * 用户增加或编辑
 * */
var head_img_data; //保存头像的大图
var small_img_data; //保存头像的小图
var Ids = helper.request.queryString("ids");
var imageArr0 = '',
	imageArr1 = '';
uploaderImg(0); //技能证书
uploaderImg(1); //身份证
$(function() {
	autosize($('textarea'));

	//获取项目
	helper.getDropList.getProlistDrop($('#projectid'));

	//获取角色
	GetRoleName($('#role_id'));

	imgEditor(); //头像裁剪

	if(Ids) {
		$('.editPwd').show();
		$('.addPwd').hide();
		$.when(helper.getDropList.getProlistDrop($('#projectid')), GetRoleName($('#role_id'))).then(function() {
			//			$('#projectid').find('option[value=""]').attr('disabled', true);
			getUserDetails(Ids); //详情
		});
	}

	//添加编辑保存按钮点击
	$('#pro_save').on('click', saveUsers);

	//日期
	lay('.layer_times').each(function() {
		laydate.render({
			elem: this,
			trigger: 'click',
		});
	});

	//密码对比
	$('#password2').blur(function() {
		if($(this).val()) {
			if($(this).val() !== $('#password').val()) {
				layer.confirm('密码输入不一致，请重新输入！', {
					icon: 2,
					btn: ['确定']
				}, function(index) {
					layer.close(index);
					$('#password2').val('');
					$('#password2').trigger('focus');
				});
				return;
			}
		} else {
			layer.confirm('请确认密码！', {
				icon: 2,
				btn: ['确定']
			});
			return;
		}
	})

});
var pwdHtml = '<ul class="project_items form-horizontal" style="width: 95%">' +
	'<li class="form-group addPwd">' +
	'<label for="password" class="col-md-2 text-right"><b class="text_require">*</b>密码</label>' +
	'<div class="col-md-10">' +
	'<input id="password_cz" class="form-control" type="password" autocomplete="off" placeholder="请输入密码" />' +
	'</div>' +
	'</li>' +
	'<li class="form-group addPwd">' +
	'<label for="password2" class="col-md-2 text-right"><b class="text_require">*</b>确认密码</label>' +
	'<div class="col-md-10">' +
	'<input id="password2_cz" class="form-control" type="password" autocomplete="off" placeholder="请再次输入密码" />' +
	'</div>' +
	'</li>' +
	'<li class="form-group addPwd">' +
	'<div class="col-md-12" style="text-align: center;">' +
	'<button id="submitPwd" class="btn btn-info" onclick="editPwd()">提交</button>' +
	'</div>' +
	'</li>' +
	'</ul>'
var pwdTC, userCodes;
$('#editPwd').click(function() {
	pwdTC = layer.open({
		type: 1,
		title: '密码重置',
		area: ['50%', '50%'], //宽高
		content: pwdHtml
	});
});

//密码重置
function editPwd() {
	if(!regexs.passwordReg.test($.trim($('#password_cz').val()))) {
		layer.confirm('请输入有效的密码（6-32个字符只能是字母、下划线、数字）', {
			icon: 2,
			btn: ['确定']
		});
		return;
	}

	if(!regexs.passwordReg.test($.trim($('#password2_cz').val()))) {
		layer.confirm('请输入有效的确认密码（6-32个字符只能是字母、下划线、数字）', {
			icon: 2,
			btn: ['确定']
		});
		return;
	}
	$('#password2_cz').blur(function() {
		if($(this).val()) {
			if($(this).val() !== $('#password_cz').val()) {
				layer.confirm('密码输入不一致，请重新输入！', {
					icon: 2,
					btn: ['确定']
				}, function(index) {
					layer.close(index);
					$('#password2_cz').val('');
					$('#password2_cz').trigger('focus');
				});
				return;
			}
		} else {
			layer.confirm('请确认密码！', {
				icon: 2,
				btn: ['确定']
			});
			return;
		}
	})
	$.post(huayi.config.callcenter_url + "signtokenapi/api/UserAccount/updatepassword", {
		usercode: userCodes,
		password: $.md5($('#password_cz').val()),
		surepassword: $.md5($('#password2_cz').val()),
	}, function(data) {
		data = JSON.parse(data);
		if(data.state == "success") {
			layer.msg("密码修改成功！");
			layer.close(pwdTC); //关闭弹层
		}
	});
}

//获取详情
function getUserDetails(ids) {
	$.getJSON(huayi.config.callcenter_url + "signtokenapi/api/UserAccount/getdetails", {
		id: ids,
	}, function(data) {
		if(data.state == "success") {
			var res = data.data;
			$('#usercode').val(res.usercode);
			userCodes = res.usercode;
			$('#user_name').val(res.username);
			$('#type').find('input[name="userType_flag"][value="' + res.type + '"]').prop("checked", "checked"), //用户类型
			$('#role_id').selectpicker('val', res.role_id).trigger('change'); //角色id
			$('input[name="sex"][value="' + res.sex + '"]').prop("checked", "checked"); //性别
			$('#mail').val(res.mail); //邮箱
			$('#mobile').val(res.mobile); //手机号
			$('#remark').val(res.remark); //备注

			$('#entrytime').val(res.entrytime); //	string	入职时间
			$('#transfertime').val(res.transfertime); //	string	转岗时间
			$('#idcardno').val(res.idcardno), //string	身份证号码（新）
			getImgVal(res.certificate, 0); //	list	技能证书
			getImgVal(res.idcard, 1); //list	身份证照片（新）
			
			$('#image_list0').find('.thumbnail').on('click', '.image-close', function() {
				$(this).parent().remove();
				file_num(0);
			});
			$('#image_list1').find('.thumbnail').on('click', '.image-close', function() {
				$(this).parent().remove();
				file_num(1);
			});
			
			$('#projectid').selectpicker('val', res.projectlist).trigger("change"); //项目信息

			//头像
			var ipUrl = data.data.head_img;
			if(ipUrl && ipUrl.length > 0) {
				head_img_data = ipUrl;
				small_img_data = data.data.head_small_img;
				$('.crop_left img').attr('src', ipUrl);
				//				$.each(ipUrl, function(i, v) {
				//					$('.crop_left img').attr('src', v.head_img);
				//					$("#file_name").val(v.filename);
				//				});
			} else {
				//				$('.crop_left img').attr('src', '../img/p3.jpg');
				$('.crop_left img').attr('src', '');
			}
			
			imgEditor();
			//话务相关
			//			$('input[name="seat_flag"][value="' + res.seat_flag + '"]').prop("checked", "checked"); //话务标志
			//			$('#extensionnumber').val(res.extensionnumber); //分机号
			//			$('#group').val(res.group); //坐席组
			//			$('input[name="seat_right"][value="' + res.seat_right + '"]').prop("checked", "checked"); //坐席权限
			//			$('#seat_level').val(res.seat_level); //坐席等级
			//			$('input[name="see_flag"][value="' + res.see_flag + '"]').prop("checked", "checked"); //查看权限
			//			$('input[name="call_type"][value="' + res.call_type + '"]').prop("checked", "checked"); //呼叫类型
			//			$('#team_id').val(res.team_id); //团队

		}
	});
}

//保存
function saveUsers() {
	if(!regexs.userReg.test($.trim($('#usercode').val()))) {
		layer.confirm('请输入有效的用户工号（只能是字母、下划线、数字）', {
			icon: 2,
			btn: ['确定']
		});
		return;
	}

	if(!$.trim($('#user_name').val())) {
		layer.confirm('请输入姓名！', {
			icon: 2,
			btn: ['确定']
		});
		return;
	}

	if(!$.trim($('#role_id').val())) {
		layer.confirm('请选择角色！', {
			icon: 2,
			btn: ['确定']
		});
		return;
	}

	if(!regexs.phone.test($.trim($('#mobile').val()))) {
		layer.confirm('请输入有效的手机号码！', {
			icon: 2,
			btn: ['确定']
		});
		return;
	}

	if($.trim($('#idcardno').val())) {
		if(!regexs.identityCard.test($.trim($('#idcardno').val()))) {
			layer.confirm('请输入有效的身份证号码！', {
				icon: 2,
				btn: ['确定']
			});
			return;
		}
	}

	if(!$.trim($('#projectid').val())) {
		layer.confirm('请选择项目信息', {
			icon: 2,
			btn: ['确定']
		});
		return;
	}

	if(Ids) {
		editUsers(Ids);
	} else {
		if(!regexs.passwordReg.test($.trim($('#password').val()))) {
			layer.confirm('请输入有效的密码（6-32个字符只能是字母、下划线、数字）', {
				icon: 2,
				btn: ['确定']
			});
			return;
		}

		if(!regexs.passwordReg.test($.trim($('#password2').val()))) {
			layer.confirm('请输入有效的确认密码（6-32个字符只能是字母、下划线、数字）', {
				icon: 2,
				btn: ['确定']
			});
			return;
		}
		addUsers();
	}
}

//添加用户
function addUsers() {
	$.post(huayi.config.callcenter_url + "signtokenapi/api/UserAccount/add", {
		usercode: $('#usercode').val(),
		username: $('#user_name').val(),
		password: $.md5($('#password').val()),
		type: $('#type').find('input[name="userType_flag"]:checked').val(), //用户类型
		role_id: $('#role_id').val(),
		sex: $('input[name="sex"]:checked').val(),
		mail: $('#mail').val(),
		head_img: head_img_data, //头像大图
		head_small_img: small_img_data, //头像缩略图
		mobile: $('#mobile').val(), //手机号码
		remark: $('#remark').val(),
		idcardno: $('#idcardno').val(), //string	身份证号码（新）
		idcard: imageArr1, //	list	身份证照片（新）
		certificate: imageArr0, //	list	技能证书
		entrytime: $('#entrytime').val(), //	string	入职时间
		transfertime: $('#transfertime').val(), //	string	转岗时间
        projectlist: $('#projectid').val() ? $('#projectid').val():[] //	list	项目id 如：[“项目id”,”项目id”,”项目id”]

		//话务相关
		//			seat_flag: $('input[name="seat_flag"]:checked').val(), //话务标志
		//			extensionnumber: $('#extensionnumber').val(), //分机号
		//			seat_right: $('input[name="seat_right"]:checked').val(), //坐席类别
		//			seat_level: $('#seat_level').val(), //坐席等级
		//			group: $('#group').val(), //坐席组id
		//			see_flag: $('input[name="see_flag"]:checked').val(),//string	察看权限（1:个人;2:班组;3:所有）
		//			call_type: $('input[name="call_type"]:checked').val(),//int	0：呼入；1：呼出
		//			team_id: $('#team_id').val(),//团队id

	}, function(data) {
		data = JSON.parse(data);
		if(data.state == "success") {
			var index = parent.layer.getFrameIndex(window.name);
			parent.layer.close(index);
			parent.$('#user_table').bootstrapTable('refresh');
			parent.layer.msg("保存成功");
		}
	});
}

//编辑用户
function editUsers(Ids) {
    $.post(huayi.config.callcenter_url + "signtokenapi/api/UserAccount/update", {
		id: Ids,
		usercode: $('#usercode').val(),
		username: $('#user_name').val(),
		type: $('#type').find('input[name="userType_flag"]:checked').val(), //用户类型
		role_id: $('#role_id').val(),
		sex: $('input[name="sex"]:checked').val(),
		mail: $('#mail').val(),
		head_img: head_img_data, //头像大图
		head_small_img: small_img_data, //头像缩略图
		mobile: $('#mobile').val(),
		remark: $('#remark').val(),

		idcardno: $('#idcardno').val(), //string	身份证号码（新）
		idcard: imageArr1, //	list	身份证照片（新）
		certificate: imageArr0, //	list	技能证书
		entrytime: $('#entrytime').val(), //	string	入职时间
		transfertime: $('#transfertime').val(), //	string	转岗时间
		projectlist: $('#projectid').val() ? $('#projectid').val():[]  //	list	项目id 如：[“项目id”,”项目id”,”项目id”]

		//话务相关
		//			seat_flag: $('input[name="seat_flag"]:checked').val(), //话务标志
		//			extensionnumber: $('#extensionnumber').val(), //分机号
		//			seat_right: $('input[name="seat_right"]:checked').val(), //坐席类别
		//			seat_level: $('#seat_level').val(), //坐席等级
		//			group: $('#group').val(), //坐席组id
		//			see_flag: $('input[name="see_flag"]:checked').val(),//string	察看权限（1:个人;2:班组;3:所有）
		//			call_type: $('input[name="call_type"]:checked').val(),//int	0：呼入；1：呼出
		//			team_id: $('#team_id').val(),//团队id

	}, function(data) {
		data = JSON.parse(data);
		if(data.state == "success") {
			//更新头像
			if($('#usercode').val() === window.localStorage.getItem('userCode')){
				if(head_img_data != window.localStorage.getItem('headImg')){
					window.localStorage.setItem('headImg', head_img_data);
					top.$('#head_img').attr('src', head_img_data);
				}
			}
			var index = parent.layer.getFrameIndex(window.name);
			parent.layer.close(index);
			parent.$('#user_table').bootstrapTable('refresh');
			parent.layer.msg("保存成功");
		}
	});
}

//图片剪切
function imgEditor() {
	var o = $(".image-crop > img");
	o.cropper("destroy");
	o.cropper({
		//		aspectRatio: 750 / 1334,
		aspectRatio: 1 / 1,
		resizable: true,
		dragCrop: true,
		preview: ".img-preview",
		done: function() {

		}
	});
	var r = $("#inputImage");
	var fileName = $("#file_name").val();
	if(window.FileReader) {
		r.change(function() {
			$('.progress-bar').css('width', '0%');
			$('.progress-bar').text('0%');
			var e, i = new FileReader,
				t = this.files;
			if(t.length && (e = t[0], /^image\/\w+$/.test(e.type))) {
				i.readAsDataURL(e);
				fileName = e.name;
				i.onload = function() {
					r.val("");
					o.cropper("reset", !0).cropper("replace", this.result);
				}
			} else {
				layer.msg("请选择本地图片文件");
			}
		});

		$("#setDrag").click(function() {
			var self = $(this);
			o.cropper("setDragMode", "crop");
			var imgUrl = o.cropper("getCroppedCanvas").toDataURL('image/png');
			//var dataurl = encodeURIComponent(imgUrl);
			var filesjson;
			var list = [],
				listItem = {};
			listItem.filename = fileName;
			listItem.fileurl = imgUrl;
			list.push(listItem);
			filesjson = JSON.stringify(list);
			upLoadFile(filesjson, self);
		});
		$("#zoomIn").click(function() {
			$('.progress-bar').css('width', '0%');
			$('.progress-bar').text('0%');
			o.cropper("zoom", .1)
		});
		$("#zoomOut").click(function() {
			$('.progress-bar').css('width', '0%');
			$('.progress-bar').text('0%');
			o.cropper("zoom", -.1)
		});
		$("#rotateLeft").click(function() {
			$('.progress-bar').css('width', '0%');
			$('.progress-bar').text('0%');
			o.cropper("rotate", 45)
		});
		$("#rotateRight").click(function() {
			$('.progress-bar').css('width', '0%');
			$('.progress-bar').text('0%');
			o.cropper("rotate", -45)
		});
	} else {
		r.addClass("hide");
	}
}

/**
 * 图片的上传 
 * fjson 上传图片 的数据
 * self 调用者的this
 */

function upLoadFile(fjson, self) {
	var formData = new FormData();
	formData.append("uploadtype", 'proManagement');
	formData.append("filesjson", fjson);
	$.ajax({
		type: "post",
		url: huayi.config.callcenter_url + "fileserverapi/Api/Upload",
		data: formData, //这里上传的数据使用了formData 对象
		　　processData: false,
		　　contentType: false, //必须false才会自动加上正确的Content-Type 
		xhr: function() { //这是关键  获取原生的xhr对象  做以前做的所有事情  
			var xhr = jQuery.ajaxSettings.xhr();
			xhr.upload.onload = function() {
				//alert('finish downloading')
			}
			xhr.upload.onprogress = function(ev) {
				console.log(ev);
				//if(ev.lengthComputable) {
				var percent = 100 * ev.loaded / ev.total;
				console.log(percent, ev);
				$('.progress-bar').css('width', percent + '%');
				$('.progress-bar').text(percent + '%');
				//}
			}
			return xhr;
		},

		async: true,
		beforeSend: function() { //触发ajax请求开始时执行
			self.attr("disabled", true);
			self.text('图片上传中...');
			$('.anniu').find('.btnn').css('backgroundColor', '#778592');
		},
		//		data: {
		//			uploadtype: 'proManagement',
		//			filesjson: fjson,
		//		},
		success: function(result) {
			result = $.parseJSON(result);
			self.attr("disabled", false);
			self.text('上传图片');
			$('.anniu').find('.btnn').css('backgroundColor', '#2f4050');
			/*验证请求*/
			if(result.state.toLowerCase() == "success") {
				head_img_data = result.data[0].fileurl;
				small_img_data = result.data[0].filesmallurl;//头像缩略图
				layer.msg("图片上传成功");
			} else {
				layer.msg(result.message);
			}
		},
		error: function(textStatus) {
			$('.progress-bar').css('width', '0%');
			$('.progress-bar').text('0%');
			layer.confirm('网络繁忙，请稍后再试...', {
				btn: ['确定'] //按钮
			});
			self.text('上传图片');
			self.attr("disabled", false);
			$('.anniu').find('.btnn').css('backgroundColor', '#2f4050');
		},
		complete: function(XMLHttpRequest, textStatus) {
			if(textStatus == 'timeout') {
				var xmlhttp = window.XMLHttpRequest ? new window.XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHttp");
				xmlhttp.abort();
				layer.confirm('网络超时，请稍后再试...', {
					btn: ['确定'] //按钮
				});　　　　
			}
			self.text('上传图片');
			self.attr("disabled", false);
			$('.anniu').find('.btnn').css('backgroundColor', '#2f4050');
		},

	});

}

//角色下拉
function GetRoleName(obj) {
	var dtd = $.Deferred(); //在函数内部，新建一个Deferred对象
	$.getJSON(huayi.config.callcenter_url + "configurationapi/api/RoleInfo/getlistdrop", function(data) {
		if(data.state.toLowerCase() == "success") {
			obj.empty();
			obj.append("<option value=''>请选择角色</option>");
			var content = data.data;
			$(content).each(function(i, n) {
				$("<option value='" + n.id + "'>" + n.role_name + "</option>").appendTo(obj);
			});
			obj.selectpicker('refresh');
			dtd.resolve(); // 改变Deferred对象的执行状态
		}
	})
	return dtd.promise(); // 返回promise对象
}

//添加技能证书和身份证照片
function uploaderImg(cindex) {
	var imgList = $('#image_list' + cindex),
		eleId = $('#filePicker' + cindex),
		uploader;
	uploader = WebUploader.create({
		// 自动上传。
		auto: true,
		// swf文件路径
		swf: '../js/Uploader.swf',
		// 文件接收服务端。
		server: huayi.config.callcenter_url + 'fileserverapi/Api/Upload',
		// 选择文件的按钮。可选。
		// 内部根据当前运行是创建，可能是input元素，也可能是flash.
		pick: eleId,
		// 图片数量限制
		//					fileNumLimit: 4,
		//可以重复上传
		duplicate: true,
		formData: {
			uploadtype: 'equipment' //自定义文件夹用于存放图片 
		},
		// 只允许选择文件，可选。
		accept: {
			title: 'Images',
			extensions: 'gif,jpg,jpeg,bmp,png',
			mimeTypes: 'image/*'
		},
		resize: false,
		fileSizeLimit: 30 * 1024 * 1024, // 30 M
		fileSingleSizeLimit: 5 * 1024 * 1024 // 5 M
	});
	//上传图片提示
	uploader.on('error', function(code) {
		switch(code) {
			case "Q_EXCEED_NUM_LIMIT":
				layer.msg('只能上传六个文件。');
				break;
			case "Q_TYPE_DENIED":
				layer.msg('图片类型不正确。');
				break;
			case "F_DUPLICATE":
				layer.msg('该文件已上传，请选择其它文件。');
				break;
			case "F_EXCEED_SIZE":
				layer.msg('单文件大小不能超过5M。');
				break;
			case "Q_EXCEED_SIZE_LIMIT":
				layer.msg('总文件大小不能超过30M。');
				break;
			default:
				break;
		}
	});
	// 当有文件添加进来的时候
	uploader.on('fileQueued', function(file) {
		console.log(file);
		var $li = $(
				'<div id="' + cindex + '' + file.id + '" class="file-item thumbnail">' +
				'<div class="image-close">X</div>' +
				'<img>' +
				'<div class="info">' + file.name + '</div>' +
				'</div>'
			),
			$img = $li.find('img');
		imgList.prepend($li);
		$(".image-close").on('click', function() {
			event.stopPropagation();
			$(this).parent().remove();
			helper.methods.delImgs($(this).parent().attr("data-filesmallurl"), $(this).parent().attr("data-fileurl"));
			file_num(cindex)
		});
	});
	// 文件上传成功，给item添加成功class, 用样式标记上传成功。
	uploader.on('uploadSuccess', function(file, response) {
		console.log(file)
		$.each(response.data, function(i, j) {
			//						obj=
			var $img = $('#' + cindex + file.id).find('img');
			$('#' + cindex + file.id).attr({
				'data-filename': j.filename,
				'data-fileext': j.fileext,
				'data-filemd5': j.filemd5,
				'data-filesize': j.filesize,
				'data-fileurl': j.fileurl,
				'data-filesmallurl': j.filesmallurl
			});
			uploader.makeThumb(file, function(error, src) {
				$img.attr('src', j.filesmallurl);
				$img.addClass('image-item');
				//						$img.attr('data-preview-group', "1");

			}, 50, 50);

		});
		$('#' + cindex + file.id).addClass('upload-state-done');
		file_num(cindex)
	});

	// 文件上传失败，现实上传出错。
	uploader.on('uploadError', function(file) {
		var $li = $('#' + cindex + file.id),
			$error = $li.find('div.error');
		// 避免重复创建
		if(!$error.length) {
			$error = $('<div class="error"></div>').appendTo($li);
		}
		$error.text('上传失败');
	});

	// 完成上传完了，成功或者失败，先删除进度条。
	//				uploader.on('uploadComplete', function(file) {

	//				});

}
//隐藏域值
function file_num(num) {
	var arr = [];
	$('#image_list' + num).find('.thumbnail').each(function(j, m) {
		var obj = {
			'filename': $(m).attr("data-filename"),
			'fileext': $(m).attr("data-fileext"),
			'filemd5': $(m).attr("data-filemd5"),
			'filesize': $(m).attr("data-filesize"),
			'fileurl': $(m).attr("data-fileurl"),
			'filesmallurl': $(m).attr("data-filesmallurl")
		}
		arr.push(obj)
	})
	window['imageArr' + num] = arr;
}
//获取详情时 图片展示
function getImgVal(data, num) {
	$(data).each(function(i, n) {
		var $li = $(
				'<div class="file-item thumbnail" data-filename="' + n.filename + '" data-fileext="' + n.fileext + '" data-filemd5="' + n.filemd5 + '" data-filesize="' + n.filesize + '" data-fileurl="' + n.fileurl + '" data-filesmallurl="' + n.filesmallurl + '" >' +
				'<div class="image-close">X</div>' +
				'<img src="' + n.filesmallurl + '">' +
				'<div class="info">' + n.filename + '</div>' +
				'</div>'
			),
			$img = $li.find('img');
		$('#image_list' + num).prepend($li);
	})
	file_num(num)
}