zhoufan
/
NYDX_CallCenter_UI


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210
							<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>报表预览</title>
		<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1">
		<script src="../Script/Common/huayi.load.js"></script>
		<script src="../Script/Common/huayi.config.js"></script>
		<link rel="stylesheet" href="css/printPreview_n.css" />
		<!--<link rel="stylesheet" href="css/printPreview_p.css" media="print" />-->
	</head>

	<body>
		<!--startprint1-->
		<div id="printPreview">
			<div class="alignC headerAlign">
				<h2>南阳电信<br>反映问题登记表</h2>
				<h3>
            		<div>工单编号: <span class="t_workOrders"></span></div>
            	</h3>
			</div>
			<table class="alignC tableLists" border="1">
				<tbody>
					<tr height="43px">
						<td>姓 名</td>
						<td class="t_name"></td>
						<td>电 话</td>
						<td class="t_tel"></td>
					</tr>
					<tr height="43px">
						<td>调查时间</td>
						<td class="t_time"></td>
						<td>调查员</td>
						<td class="t_investigator"></td>
					</tr>
					<tr height="43px">
						<td>问题分类</td>
						<td class="t_infoCls"></td>
						<td>热点分类</td>
						<td class="t_rdfl"></td>
					</tr>
					<tr height="43px">
						<td>处理部门</td>
						<td class="t_dept" colspan="3"></td>
					</tr>
					<tr height="184px">
						<td>反映问题</td>
						<td class="t_reactionPro" colspan="3"></td>
					</tr>
					<tr height="156px">
						<td>问题处理<br>情况</td>
						<td class="t_proHandling" colspan="3"></td>
					</tr>
					<tr height="118px">
						<td>回访反馈<br>情况</td>
						<td class="t_feedback" colspan="3"></td>
					</tr>
					<tr height="64px">
						<td>备 注</td>
						<td class="t_remarks" colspan="3"></td>
					</tr>
					<tr height="43px">
						<td>调查对象签名</td>
						<td class="t_investigationSign"></td>
						<!--<td>调查人签字</td>-->
						<td>问题办理人<br>签名</td>
						<td class="t_InvestigatorSign"></td>
					</tr>
					<tr height="43px">
						<td>回访人签名</td>
						<td class="t_revisit"></td>
						<td class=""></td>
						<td class=""></td>
					</tr>
				</tbody>
			</table>
		</div>
		<!--endprint1-->
		<div class="alignC exportBtn">
			<input type="button" value="导出word" class="btn" id="btn_html2pdf" />
			<input type="button" value="打印" class="btn hidden" onclick="preview(1)" />
		</div>

		<script src="../js/html2pdf/jspdf.debug.js"></script>
		<script src="../js/html2pdf/html2canvas.js"></script>
		<script src="../js/html2pdf/canvas2image.js"></script>
		<script src="../js/html2pdf/FileSaver.js"></script>
		<script src="../js/jquery.wordexport.js"></script>
		<script type="text/javascript">
			$(document).ready(function() {
				var wid = helper.request.queryString("wid");
				if(wid) {
					$('.t_workOrders').text(wid);//编号
					workOrderInfo(wid);
				}
				//导出pdf点击事件
//				$('#btn_html2pdf').on('click',convert2pdf);
				//导出word
				$("#btn_html2pdf").click(function(event) {
				$("#printPreview").wordExport('南阳电信反映问题登记表');
				});
				//document.getElementById("btn_html2pdf").onclick = convert2pdf;
			});
			//获取信息
			function workOrderInfo(oid){
				$.getJSON(huayi.config.callcenter_url + 'WorkOrder/GetWorkOrder', {
						orderid: oid,
						token: $.cookie("token")
					}, function(result) {
						if(result.state.toLowerCase() == "success") {
							var res = result.data.data;
							if(res.length > 0){
								var content = result.data.data[0];
								$('.t_name').text(content.Customer);//姓名
								$('.t_tel').text(content.CustomerTel);//电话
								$('.t_time').text(content.Inqtime && content.Inqtime.split(' ')[0]);//调查时间
								$('.t_investigator').text(content.Inquser);//调查员
								$('.t_infoCls').text(content.InfoType);//问题分类
								$('.t_dept').text(content.Unit);//交办单位
								$('.t_rdfl').text(content.InfoTypeDetail);//热点分类
								
								var reactionPro = content.Detail;
								if(reactionPro){
									reactionPro = reactionPro.replace(/[ ]/g, "&nbsp;").replace(/\ +/g, "&nbsp;").replace(/\r\n/g, "<br />").replace(/\n/g, "<br />");
									$('.t_reactionPro').html(reactionPro);//反映问题
								}else{
									$('.t_reactionPro').html("");//反映问题
								}
								
								
								$('.t_proHandling').text(content.clcontent);//问题处理情况
								$('.t_feedback').text(content.Answer);//回访反馈情况
								$('.t_remarks').text(content.Remark);//备注
							}
						}
					})
			}
			//导出pdf处理过清晰度
			function convert2pdf() {
				var indexLoad = layer.load();
				var cntElem = $('#printPreview')[0];
				var shareContent = cntElem; //需要截图的包裹的（原生的）DOM 对象
				var width = shareContent.offsetWidth; //获取dom 宽度
				var height = shareContent.offsetHeight; //获取dom 高度
				var canvas = document.createElement("canvas"); //创建一个canvas节点
				var scale = 2; //定义任意放大倍数 支持小数
				canvas.width = width * scale; //定义canvas 宽度 * 缩放
				canvas.height = height * scale; //定义canvas高度 *缩放
				canvas.getContext("2d").scale(scale, scale); //获取context,设置scale 
				var opts = {
					scale: scale, // 添加的scale 参数
					canvas: canvas, //自定义 canvas
					// logging: true, //日志开关，便于查看html2canvas的内部执行流程
					width: width, //dom 原始宽度
					height: height,
					useCORS: true // 【重要】开启跨域配置
				};

				html2canvas(shareContent, opts).then(function(canvas) {
					var context = canvas.getContext('2d');
					// 【重要】关闭抗锯齿
					context.mozImageSmoothingEnabled = false;
					context.webkitImageSmoothingEnabled = false;
					context.msImageSmoothingEnabled = false;
					context.imageSmoothingEnabled = false;
					var w = canvas.width;
					var h = canvas.height;
					// 【重要】默认转化的格式为png,也可设置为其他格式
					var img = Canvas2Image.convertToJPEG(canvas, w, h, 'jpeg');
					var imgData = $(img).attr('src');
					var doc = new jsPDF("p", "mm", "a4");
					/* A0 841×1189                           
					 A1 594×841                            
					 A2 420×594                            
					 A3 297×420                            
					 A4 210×297                            
					 A5 148×210                            
					 A6 105×148                            
					 A7 74×105                             
					 A8 52×74                              
					 A9 37×52                              
					 A10 26×37*/

					doc.addImage(imgData, 'JPEG', 0, 0, 210, 297);
					doc.save('南阳电信反映问题登记表.pdf');
					layer.close(indexLoad);
					//layer.msg('导出成功！');
				});
			}
			//打印
			function preview(oper) {
				if(oper < 5) {
					bdhtml = window.document.body.innerHTML; //获取当前页的html代码
					sprnstr = "<!--startprint" + oper + "-->"; //设置打印开始区域
					eprnstr = "<!--endprint" + oper + "-->"; //设置打印结束区域
					prnhtml = bdhtml.substring(bdhtml.indexOf(sprnstr) + 18); //从开始代码向后取html
					print.portrait = true; //纵向打印
					prnhtml = prnhtml.substring(0, prnhtml.indexOf(eprnstr)); //从结束代码向前取html
					window.document.body.innerHTML = prnhtml;
					window.print();
					window.document.body.innerHTML = bdhtml;
				} else {
					window.print();
				}
			}
		</script>
	</body>

</html>