duhongyu
/
ShuangHui_UI


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259
							<!doctype html>
<html lang="en" class="feedback">

	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>问题反馈</title>
		<link rel="stylesheet" type="text/css" href="../css/mui.min.css" />
		<link href="../css/feedback-page.css" rel="stylesheet" />
		
		<style>
			p {
				font-size: 16px;
				color: #fe6604;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav" style="">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left" style="color: #fff;"></a>

			<h1 class="mui-title" style="color: #fff;">办理工单</h1>
		</header>
		<div class="mui-content">
			<p>办理人（必填）</p>
			<div class="mui-input-row">
				<input id='contact' type="text" class="mui-input-clear contact" />
			</div>
			<p>办理内容（必填）</p>
			<div class="row mui-input-row">
				<textarea id='question' class="mui-input-clear question" placeholder="请详细描述你的问题和意见..."></textarea>
			</div>
			<br />
			<div class="mui-input-row" style="background: #FFFFFF;">
				<div class="feedback">
					<p>添加图片(选填,提供问题截图,单张10M以下)</p>
					<div id='image-list' class="row image-list"></div>
				</div>
			</div>
			<div class="" style="padding: 10px;">
				<br />
				<button id="submit" type="button" class="mui-btn mui-btn-block mui-btn-primary submit">办理</button>
			</div>
			
		</div>
		<script src="../js/jquery.min.js"></script>
		<script src="../js/huayi.config.js"></script>
		<script src="../js/zepto.js"></script>
		<script src="../js/mui.min.js"></script>
		<script src="../js/webuploader.min.js"></script>
		<script src="../js/mui.zoom.js"></script>
		<script src="../js/mui.previewimage.js"></script>
		<script src="../js/feedback-page.js"></script>
		<script type="text/javascript">
			mui.init();
			mui.plusReady(function() {
				var wv = plus.webview.currentWebview();
				var vText = wv.name;
				var token = wv.token;
				var Str = '';
				var str_ary;
				document.getElementById("submit").addEventListener('tap', function() {
					var username = $("#contact").val();
					var question = $("#question").val();
					$(".image-box").each(function(i, n) {
						var a = $(n).attr("indexs");
						if(a) {
							Str += a + ',';

						}
					})
					str_ary = Str.substring(0, Str.length - 1);
//					alert(str_ary);
					if(!username) {
						plus.nativeUI.toast('输入办理人');
					} else if(!question) {
						plus.nativeUI.toast('输入内容');
					} else {
						mui.ajax(huayi.config.callcenter_url + 'WorkOrder/FeedBackWorkOrder', {
							data: {
								workorderid: vText,
								dealman: username, //办理人
								result: question, //办理内容
								state: 1,
								token: token,
								files: str_ary,
							},
							dataType: 'json', //服务器返回json格式数据
							type: 'post', //HTTP请求类型
							timeout: 10000, //超时时间设置为10秒；
							success: function(data) {
								var btnArray = ['否', '是'];
								mui.confirm('是否办理工单', '提示', btnArray, function(e) {
									if(e.index == 1) {
										plus.nativeUI.toast('办理成功');
										var wobj = plus.webview.getWebviewById("WorkDetails");
										wobj.reload(true);
									} else {
										plus.nativeUI.toast('取消办理');
									}
								})

							},
							error: function(xhr, type, errorThrown) {

							}
						});
					}
				})
			})
			var applicationPath = window.applicationPath === "" ? "" : window.applicationPath || "../../";
			var $ = jQuery;
			$list = $('#image-list'),
				// 优化retina, 在retina下这个值是2
				ratio = window.devicePixelRatio || 1,
				// 缩略图大小
				thumbnailWidth = 50 * ratio,
				thumbnailHeight = 50 * ratio,
				// Web Uploader实例
				//添加图片
				$(function() {
					//imgNum = 2;
					var usercode = localStorage.getItem("user"); //获取本地存储
//					var base64 = reader.result.split(',')[1];
//					var dataUrl = 'data:image/png;base64,' + base64;
					uploader = WebUploader.create({
						
						// 自动上传。
						auto: true,
						// swf文件路径
						swf: 'js/Uploader.swf',

						// 文件接收服务端。
						server: 'http://117.158.196.116:4010/Web/Upload64',
						// 选择文件的按钮。可选。
						// 内部根据当前运行是创建，可能是input元素，也可能是flash.
						pick: '#filePicker',
						// 图片数量限制
						threads: 5, //上传并发数。允许同时最大上传进程数,为了保证文件上传顺序  
						fileNumLimit: 5,
//						fileSizeLimit: 30 * 1024 * 1024, // 20 M
						fileSingleSizeLimit: 5 * 1024 * 1024,// 20 M
//						alert(usercode);
						formData: {
							uploadtype: "Works",
//							dataurl: dataUrl,
							usercode:1234
						},
						//可以重复上传
						//duplicate: false,
						// 只允许选择文件，可选。
						accept: {
							title: 'Images',
							extensions: 'gif,jpg,jpeg,bmp,png',
							mimeTypes: 'image/*'
						},
//						resize: false
					});
					uploader.on('beforeFileQueued', function(file) {
						console.log(file)
					});
					//上传图片提示
					uploader.on('error', function(handler) {
						console.log(handler)

						if(handler == "Q_EXCEED_NUM_LIMIT") {
							mui.toast("超出最大文件数");
						}
					});
					// 当有文件添加进来的时候
					uploader.on('fileQueued', function(file) {
						$('#image-list').addClass('SHOW');
						console.log(file);

						var $li = $(
								'<div id="' + file.id + '" class="file-item thumbnail">' +
								'<div class="image-close">X</div>' +
								'<img>' +
								'<div class="info">' + file.name + '</div>' +
								'</div>'
							),
						$img = $li.find('img');
						uploader.makeThumb(file, function(error, src) {
								if(error) {
									$img.replaceWith('<span>不能预览</span>');
									return;
								}
								$img.attr('src', src);
							}, thumbnailWidth, thumbnailHeight);
						$list.prepend($li);
						var IMGLIST = $(".thumbnail");
						//绑定删除
						$('#' + file.id).on('tap', '.image-close', function() {
							uploader.removeFile(file);
							var $fileLi = $('#' + file.id);
							$fileLi.off().find('.image-close').off().end().remove();
							file_num();
						});
					});
					// 文件上传成功，给item添加成功class, 用样式标记上传成功。
					uploader.on('uploadSuccess', function(file, response){
						
//						$.each(response.data, function(i, j) {
//							var $img = $('#' + file.id).find('img');
//							var img = j.fileurl;
//							//console.log(img);
//							$('#' + file.id).attr({
//								'data-filename': j.filename,
//								'data-fileext': j.fileext,
//								'data-filemd5': j.filemd5,
//								'data-filesize': j.filesize,
//								'data-fileurl': j.fileurl
//							});
//							
//						});
//						$('#' + file.id).addClass('upload-state-done');
//						file_num();
					});
					// 文件上传失败，现实上传出错。
					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();
					});
				});

			function file_num() {
//				var base64 = reader.result.split(',')[1];
//				var dataUrl = 'data:image/png;base64,' + base64;
//				var usercode = localStorage.getItem("user"); //获取本地存储
				var arr = [];
				$('#image-list').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")
					}
					arr.push(obj)
				})
				window['Faultpic'] = arr;

				console.log(Faultpic);
			}
		</script>
	</body>

</html>