YH_Web_UI/WebUI/CallCenterWe.../equipmentMai.../js/addOrEditPro...

/**
 * 增加或编辑 项目通讯录
 * */

var imglist = []; //保存头像的数组（大图，小图）

$(function() {
	autosize($('textarea'));
	var user_id = helper.request.queryString("edit_id");
	if(user_id) { //修改
		helper.getDropList.getProlistDrop($('#pro_title')).then(function() {
			getProject(user_id);
		});
	} else {
		helper.getDropList.getProlistDrop($('#pro_title')); //项目
		$(".image-crop > img").attr('src', '');
		imgEditor(); //头像图片裁剪
	}
	//添加编辑保存按钮点击
	$('#pro_save').on('click', saveProject);
});
//获取单个信息
function getProject(ids) {
	$.getJSON(huayi.config.callcenter_url + "equipmentapi/api/ProjectUser/getdetails", {
		id: ids,
	}, function(data) {
		if(data.state == "success") {
			var res = data.data;
			if(res) {
				$('#pro_title').selectpicker('val', res.projectid).trigger('change'); //项目名称
				$('#pro_property').find('input[type=radio][value="' + res.type + '"]').prop('checked', true); //是 int 类型（ 1 甲方2诺达）
				$('#pro_personname').val(res.name); //是 string 姓名
				$('#pro_sex').find('input[type=radio][value="' + res.sex + '"]').prop('checked', true); //否 string 性别
				$('#pro_tel').val(res.mobilephone); //否 string 手机
				$('#pro_mobile').val(res.telephone); // 否 string 固话
				$('#pro_dept').val(res.department); //否 string 科室
				$('#pro_post').val(res.position); //否 string 岗位
				$('#pro_remark').val(res.remark); //否 string 备注
				//项目头像
				var ipUrl = res.imgurl;
				if(ipUrl) {
					imglist = []; //保存头像的数组（大图，小图）
					imglist.push(ipUrl); //头像 大图
					imglist.push(res.imgsmallurl); //头像 小图
					$(".image-crop > img").attr('src', ipUrl);
				} else {
					$('.crop_left img').attr('src', '');
				}
				imgEditor();
			}
		}
	});
}
//保存项目
function saveProject() {
	var user_id = helper.request.queryString("edit_id");
	var wUrl;
	if(!$.trim($('#pro_title').val())) {
		layer.confirm('你还没有选择项目', {
			icon: 2,
			btn: ['确定'] //按钮
		});
		return;
	}

	if(!$.trim($('#pro_personname').val())) {
		layer.confirm('姓名不能为空！', {
			icon: 2,
			btn: ['确定'] //按钮
		});
		return;
	}

	if($.trim($('#pro_tel').val())) {
		if(!regexs.phone.test($.trim($('#pro_tel').val()))) {
			layer.confirm('手机号码格式不正确，请重新输入！', {
				icon: 2,
				btn: ['确定'] //按钮
			});
			return;
		}
	}
	if($.trim($('#pro_mobile').val())) {
		if(!regexs.phone.test($.trim($('#pro_mobile').val()))) {
			layer.confirm('固定电话格式不正确，请重新输入！', {
				icon: 2,
				btn: ['确定'] //按钮
			});
			return;
		}
	}

	if(user_id) {
		wURL = "equipmentapi/api/ProjectUser/update";
	} else {
		wURL = "equipmentapi/api/ProjectUser/add";
	}

	$.post(huayi.config.callcenter_url + wURL, {
		id: user_id, //是 string id
		projectid: $('#pro_title').val(), // 是 string 项目id
		type: $('#pro_property').find('input[type=radio]:checked').val(), // 是 int 类型（ 1 甲方2诺达）
		name: $('#pro_personname').val(), //是 string 姓名
		sex: $('#pro_sex').find('input[type=radio]:checked').val(), //否 string 性别
		mobilephone: $('#pro_tel').val(), //否 string 手机
		telephone: $('#pro_mobile').val(), // 否 string 固话
		imgurl: imglist[0], //否 string 头像
		imgsmallurl: imglist[1], //否	string	头像缩略图
		department: $('#pro_dept').val(), //否 string 科室
		position: $('#pro_post').val(), //否 string 岗位
		remark: $('#pro_remark').val(), //否 string 备注
	}, function(data) {
		data = JSON.parse(data);
		if(data.state == "success") {
			var index = parent.layer.getFrameIndex(window.name);
			parent.layer.close(index);
			parent.$('#table_all').bootstrapTable('refresh');
			parent.layer.msg("保存成功");
		}
	});
}

//图片剪切
function imgEditor() {
	var o = $(".image-crop > img");
	o.cropper("destroy");
	o.cropper({
		aspectRatio: 200 / 200,
		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", 'proMailList');
	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") {
				if(result.data && result.data.length > 0) {
					imglist = []; //保存头像的数组（大图，小图）
					imglist.push(result.data[0].fileurl);
					imglist.push(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) {
			//$('.progress-bar').css('width', '0%');
			//$('.progress-bar').text('0%');
			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');
		},

	});

}