YH_Web_UI/WebUI/CallCenterWe.../orderManagem.../js/manualProduc...

/**
 * 手工制单
 * */
var proimglist = []; //附件的数组
var uploader; //上传实例
var limitNum = 6; //限制数量
var isCleanOrderForm = false;//是否是清空表单
$(function() {
	autosize($('textarea'));

	//获取工单来源
	helper.getDropList.getlistDropByDic($('#order_source'), 'GDLY').then(function() {
		$('#order_source').selectpicker('val', '5b9f254a94eefd1bcb989b41').trigger('change');
	});

	//获取工单类型
	//helper.getDropList.getlistDropRadioByDic($('#order_type'), 'GDLX', 'inlineRadioOptions');

	//省市二级联动
	helper.getDropList.getProLocation($('#order_province'), $('#order_city'));

	//附件
	uploaderImages();

	//新增工单创建
	$('#save_order').on('click', saveOrder);

});

//创建
function saveOrder() {
	var loadIndex;
	if(!regexs.userNameReg.test($.trim($('#order_name').val()))) {
		layer.confirm('请输入有效的客户姓名（2-20位汉字可以包含·•）！', {
			icon: 2,
			btn: ['确定']
		});
		return;
	}

	if(!regexs.phone.test($.trim($('#order_tel').val()))) {
		layer.confirm('请输入正确的电话！', {
			icon: 2,
			btn: ['确定']
		});
		return;
	}

	$.ajax({
		type: "post",
		url: huayi.config.callcenter_url + "callcenterapi/api/BusOrder/add",
		dataType: 'json',
		async: true,
		beforeSend: function() { //触发ajax请求开始时执行
			$('#save_order').attr("disabled", true);
			$('#save_order').text('创建中...');
			$(document).off('click', '#save_order', saveOrder);
			loadIndex = layer.load();
		},
		data: {
			//unique_id: CallID, //		否	string	callid
			//leaverecordid	否	string	语音留言id
			//callrecordid否	string	通话记录id
			sourceid: $('#order_source').val(), //	否	string	来源id
			typeid: $('#order_type').find('input[type="radio"]:checked').val(), //	否	string	类型id
			name: $('#order_name').val(), //	否	string	姓名
			phone: $('#order_tel').val(), //	是	string	号码
			sex: $('#order_sex').find('input[type="radio"]:checked').val(), //	否	string	性别
			province: $('#order_province').val(), //	否	string	省code
			city: $('#order_city').val(), //	否	string	市code
			address: $('#order_address').val(), //	否	string	地址
			deptid: $('#order_dept').attr('data-id'), //	否	string	部门id
			content: helper.filter.delHtmlTag($('#order_reception').val()), //	是	string	工单内容
			files: proimglist, //否	list	附件json
			//title	是	string	标题
		},
		success: function(result) {
			if(result.state.toLowerCase() === "success") {
				cleanOrderForm(); //清空新增工单的数据
				layer.msg("创建成功");
			}
		},
		error: function(textStatus) {
			layer.close(loadIndex);
			layer.confirm('网络繁忙，请稍后再试...', {
				icon: 7,
				closeBtn: 0,
				btn: ['确定'] //按钮
			});
			$('#save_order').text('创建');
			$('#save_order').attr("disabled", false);
			$(document).off('click', '#save_order', saveOrder);
			$(document).on('click', '#save_order', saveOrder);
		},
		complete: function(XMLHttpRequest, textStatus) {
			layer.close(loadIndex);
			if(textStatus == 'timeout') {
				var xmlhttp = window.XMLHttpRequest ? new window.XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHttp");
				xmlhttp.abort();
				layer.confirm('网络超时，请稍后再试...', {
					icon: 7,
					closeBtn: 0,
					btn: ['确定'] //按钮
				});　　　　
			}
			$('#save_order').text('创建');
			$('#save_order').attr("disabled", false);
			$(document).off('click', '#save_order', saveOrder);
			$(document).on('click', '#save_order', saveOrder);
		},
	});
}


//清空新增工单的数据
function cleanOrderForm() {
	$('#order_form').find('input.form-control').val('');
	$('#order_form').find('textarea.form-control').val('');
	$('#order_form').find('select.form-control').val('');

	//$('#order_type').find("input[type='radio'][value='5b9f24e494eefd1bcb989b3e']").prop("checked", true);
	$('#order_sex').find("input[type='radio'][value='男']").prop("checked", true);
	
	$('#order_province').selectpicker('val', '').trigger('change');

//	$('#order_transfer_dept').val('').trigger('keyup');
//	$('#order_transfer_dept').attr('placeholder', '请选择部门');
//	$('#order_transfer_dept').attr('data-id', '');

	$('#order_form').find('.selectpicker.form-control').selectpicker('val', '').trigger('change');
	$('#order_source').selectpicker('val', '5b9f254a94eefd1bcb989b41').trigger('change');
	
	isCleanOrderForm = true;
	$('#fileList').find('.img_del').trigger('click')
	
}

//上传项目图纸
function uploaderImages() {
	if(uploader) {
		uploader.destroy();
	}
	uploader = WebUploader.create({
		auto: true, // 选完文件后，是否自动上传 
		swf: '../plugins/webuploader/Uploader.swf', // swf文件路径 
		server: huayi.config.callcenter_url + "fileserverapi/Api/Upload", // 文件接收服务端 
		pick: '#imgPicker', // 选择文件的按钮。可选 
		formData: {
			uploadtype: 'orderFiles'
		},
		// 只允许选择图片文件。 
		accept: {
			//			title: 'Images',
			//			extensions: 'gif,jpg,jpeg,bmp,png',
			//			mimeTypes: 'image/*'
		},
		compress: false, //webuploader默认压缩图片,设置compress:false，可以按照原始比例上传图片  
		//fileVal: "upFile",//设置文件上传域的name。  
		threads: limitNum, //上传并发数。允许同时最大上传进程数,为了保证文件上传顺序  
		fileNumLimit: limitNum,
		fileSizeLimit: 30 * 1024 * 1024, // 30 M
		fileSingleSizeLimit: 5 * 1024 * 1024 // 5 M
	});

	uploader.on('fileQueued', function(file) {
		var $list = $("#fileList"),
			$li = $(
				'<li id="' + file.id + '"><span class="img_mask"><i class="img_del"></i></span>' +
				'<img/>' +
				'<span class="img_state"><i></i></span>' +
				'<span class="file_name">' + file.name + '</span>' +
				'</li>'
			),
			$img = $li.find('img');

		// $list为容器jQuery实例 
		$list.append($li);

		// 创建缩略图 
		uploader.makeThumb(file, function(error, src) {
			if(error) {
				$img.replaceWith('<div class="noThumb"><i class="glyphicon glyphicon-paperclip"></i><p>无法预览</p></div>');
				return;
			}
			$img.attr('src', src);
		}, 109, 109); //109*109为缩略图尺寸 

		//绑定删除
		$('#' + file.id).on('click', '.img_del', function() {
			uploader.removeFile(file);
			var $fileLi = $('#' + file.id);
			$fileLi.off().find('.img_del').off().end().remove();
			var itemFileName = $(this).parent().parent().find('.file_name').text();
			$.each(proimglist, function(i, v) {
				if(v && v.filename == itemFileName) {
					proimglist.splice(i, 1);
					if(!isCleanOrderForm){
						helper.methods.delImgs(v.filesmallurl, v.fileurl);
					}
				}
			});
			$('#fileNum').text(proimglist.length);
		});

	});

	// 文件上传过程中创建进度条实时显示。 
	uploader.on('uploadProgress', function(file, percentage) {
		var $li = $('#' + file.id),
			$percent = $li.find('.progress span');

		// 避免重复创建 
		if(!$percent.length) {
			$percent = $('<div class="progress" style="">' +
					'<span class="text">0%</span>' +
					'<span class="percentage"></span>' +
					'</div>')
				.appendTo($li)
				.find('span');
		}

		$percent.eq(0).text(Math.round(percentage * 100) + '%');
		$percent.eq(1).css('width', Math.round(percentage * 100) + '%');
	});

	// 文件上传成功，给item添加成功class, 用样式标记上传成功。 
	uploader.on('uploadSuccess', function(file, res) {
		proimglist.push(res.data[0]);
		$('#fileNum').text(proimglist.length);
		$('#' + file.id).addClass('upload-state-done');
	});

	// 文件上传失败，显示上传出错。 
	uploader.on('uploadError', function(file) {
		var $li = $('#' + file.id),
			$error = $li.find('div.error');

		// 避免重复创建 
		if(!$error.length) {
			$error = $('<div class="error"></div>').appendTo($li);
		}

		$error.text('上传失败');
	});

	// 完成上传完了，成功或者失败，先删除进度条。 
	uploader.on('uploadComplete', function(file) {
		$('#' + file.id).find('.progress').remove();
	});

	uploader.onError = function(code) {
		//console.log('Error：' + 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;
		}

	};
}