zhangkun
/
zzdyrmyyUI


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405
							<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<link href="../../css/plugins/cropper/cropper.min.css" rel="stylesheet">
		<script src="../../Script/Common/huayi.load.js"></script>
		<script src="../../Script/Common/huayi.config.js"></script>
		<script src="../../js/laydate/laydate.js"></script>
		<link href="../../css/init.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="../../css/Table/table1.css" />
		<link rel="stylesheet" href="../../css/webuploader.css" />
		<title>设备维修评价</title>
		<style>
			.btnn {
				background: #2f4050;
				color: #fff;
				padding: 3px 10px;
				border: 0;
				border-radius: 3px;
				cursor: pointer;
			}
			
			.crop_left {
				width: 40%;
				float: left;
			}
			
			.crop_right {
				width: 30%;
				float: right;
				margin-right: 25px;
			}
			
			.time-box .dates {
				width: 100%!important;
			}
			
			i.tub {
				right: 25px!important;
			}
			
			b.text_require {
				color: red;
			}
			
			.loader_icon {
				display: block;
				height: 36px;
				width: 36px;
				background: url(../../img/upLod.png) no-repeat;
			}
			
			.table_extension tr td:last-child {
				text-align: right !important;
			}
			
			.btn-label {
				display: inline-block;
				border: 1px solid #ccc;
				text-align: center!important;
				padding: 7px 14px;
				border-radius: 2px;
				text-indent: initial;
				margin: 5px 2px;
				cursor: pointer;
			}
			
			.btn-label.active {
				border: 1px solid #249fea;
			}
		</style>
	</head>

	<body class="">
		<div class="container wrapper-content">
			<div class="form-horizontal">
				<div class="form-group clearfix">
					<label for="woCode" class="col-sm-3 control-label text-right"><b class="text_require">*</b>工单编号</label>
					<div class="col-sm-9">
						<input id="woCode" class="form-control" type="text" autocomplete="off" readonly="readonly" />
					</div>
				</div>
				<div class="form-group clearfix">
					<label for="score" class="col-sm-3 control-label text-right"><b class="text_require">*</b>得分</label>
					<div class="col-sm-9 clearfix">
						<ul id="ratingScores" class="rating clearfix">
							<li class="rating-item" title="差"></li>
							<li class="rating-item" title="不满意"></li>
							<li class="rating-item" title="一般"></li>
							<li class="rating-item" title="满意"></li>
							<li class="rating-item" title="很满意 "></li>
						</ul>
						<span id="ratingTips" class="ratingTips"></span>
					</div>
				</div>
				<div class="form-group clearfix">
					<label for="arrivetime" class="col-sm-3 control-label text-right"><b class="text_require">*</b>维修工到场时间</label>
					<div class="col-sm-9">
						<input type="text" class="form-control" id="arrivetime" />
					</div>
				</div>

				<div class="form-group clearfix">
					<label for="evaluate" class="col-sm-3 control-label text-right">评价内容</label>
					<div class="col-sm-9">
						<textarea id="evaluate" class="form-control" name="" rows="" autocomplete="off" cols="" style="resize: none;"></textarea>
					</div>
				</div>

				<div class="form-group clearfix">
					<label for="" class="col-sm-3 control-label text-right">附件</label>
					<div class="col-sm-9 uploadTP">
						<div id="filePicker1" class="imgUpload" data-index="1">
							<i class="loader_icon"></i>
						</div>

						<div id='image_list1' class="row image-list"></div>

					</div>
				</div>

				<div class="form-group clearfix">
					<label for="" class="col-sm-3 control-label text-right">评价标签</label>
					<div class="col-sm-9 uploadTP">
						<div class="greetings_remarks">

							<span class="btn-label">维修及时</span>
							<span class="btn-label">态度特别棒</span>
							<span class="btn-label">服务专业</span>
							<span class="btn-label">服务态度差</span>
							<span class="btn-label">到场不及时</span>
						</div>

					</div>
				</div>

				<div class="form-group clearfix">
					<div class="col-sm-12" style="text-align: center;">
						<input type="button" id="HY_save" class="btn_gray btn" onclick="btn_save()" value="评价" />
					</div>
				</div>
			</div>
		</div>
		<script src="../js/equipmentCommon.js"></script>
		<script src="../../js/ratingStars/ratingStars.js"></script>
		<script src="../../js/webuploader.min.js"></script>
		<script>
			var starNum = 0; //星星个数，默认是0 
			var code = helper.request.queryString("code");
			var ids = helper.request.queryString("id");
			$(document).ready(function() {
				$('#woCode').val(code);
				//1 差、2 不满意、3 一般、4 满意、5 很满意
				rating.init('#ratingScores', {
					mode: 'LightEntire',
					num: 0,
					readOnly: false,
					select:function(num,total){
						var self = this;
						layer.tips($(self).attr('title'), '#ratingTips');
//						console.log(this);
//						$('#ratingTips').text($(this).attr('title'));
//						console.log('当前第' + num + '颗，一共' + total + '颗。');
					},
					chosen: function(num, total) {
						//console.log('当前点击的是第' + num + '颗，一共' + total + '颗。');
						//rating.init('#rating1','unbindEvent');//只能选择一次
						starNum = num;
						layer.closeAll();
						$('#ratingTips').text($(this).attr('title'));
					},
				});

				//日期
				laydate.render({
					elem: '#arrivetime',
					theme: '#249fea',
					type: 'datetime'
				});
				$('.greetings_remarks span').click(function() {
					$(this).toggleClass('active');
				})
				
				gettime()
			})
// 获取完成时间
function gettime(){
	$.ajax({
		type: "get",
		url: huayi.config.callcenter_url + "equipmentapi/api/worepairbase/getsingle",
		async: true,
		dataType: 'json',
		data: {
			id: ids,
		},
		success: function(data) {
			if(data.state.toLowerCase() == 'success') {
				console.log(data)
				$('#arrivetime').val(data.data.deals[0].createtime)
			}
		}
	});
}
			uploaderImg(1)
			var imageArr1 = '';

			//添加图片
			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/*'
					},
					fileSizeLimit: 30 * 1024 * 1024, // 30 M
					fileSingleSizeLimit: 5 * 1024 * 1024, // 5 M
					resize: false
				});
				//上传图片提示
				uploader.on('error', function(handler) {
					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();
						uploader.removeFile(file);
						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;
				//			console.log(imageArr0)
			}

			//自定义字段 数组
			function getExtenArr() {
				var extenArr = [];
				$('.greetings_remarks span').each(function(g, h) {
					if($(h).hasClass('active')) {
						extenArr.push($(h).text());
					}

				})
				//				console.log(extenArr)
				return extenArr;
			}
			//保存	
			function btn_save() {
				addValue();
			}
			//处理
			function addValue() {
				if(starNum === 0) {
					layer.confirm('请选择得分！', {
						icon: 2,
						btn: ['确定'] //按钮
					});
					return;
				}
				if($("#arrivetime").val() == '') {
					layer.confirm('请选择维修工到场时间！', {
						icon: 2,
						btn: ['确定'] //按钮
					});
					return;
				}

				$.ajax({
					type: "post",
					url: huayi.config.callcenter_url + "equipmentapi/api/worepairbase/evaluate",
					async: true,
					dataType: 'json',
					data: {
						wocode: code, //工单编号
						channel: 1, //渠道
						score: starNum, //得分
						arrivetime: $('#arrivetime').val(), //时间
						label: getExtenArr(), //标签
						files: imageArr1, //	处理完成照片
						evaluate: $('#evaluate').val() //评价内容
					},
					success: function(data) {
						if(data.state.toLowerCase() == 'success') {
							var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
							parent.layer.close(index); //再执行关闭  
							layer.msg(data.message);
							parent.$('#table1').bootstrapTable('refresh');
						}
					}
				});
			}
		</script>
	</body>

</html>