YH_Web_UI/WebUI/CallCenterWe.../StudyMaterial/js/StudyMateria...

/**
 * 文件资料详情
 * */
$(function() {
	//	var fid = helper.request.queryString("edit_id");
	var fid = getQueryString("edit_id");
	if(fid) {
		getBtnsInfo(fid);
	}
});

//获取详情
function getBtnsInfo(fid) {
	$.ajax({
		type: "get",
		url: huayi.config.callcenter_url + "equipmentapi/api/StudyMaterialsInfo/getdetails",
		dataType: 'json',
		async: true,
		data: {
			id: fid
		},
		success: function(data) {
			/*验证请求*/
			if(data.state == "success") {
				var res = data.data;
				if(res) {
					$("#columsTitle").text(res.title);
					$("#decription").html(decodeURIComponent((res.content)));

					//附件
					var EnclosureList = res.studymaterfile;
					if(EnclosureList && EnclosureList.length > 0) {
						var $list = $("#fileList");
						$.each(EnclosureList, function(i, v) {
							if(v.filesmallurl) {
								//原来的图片
								var $li = $(
									'<li><span class="img_mask"><a href="' + v.fileurl + '" download="filename" title="点击下载"><i class="glyphicon glyphicon-download-alt" aria-hidden="true"></i></a></span>' +
									'<img layer-src="' + v.fileurl + '"  src="' + v.filesmallurl + '" title="图片" alt="' + v.filename + '"/>' +
									'<span class="file_name">' + v.filename + '</span>' +
									'</li>'
								);
								$list.append($li);
							} else {

								if(v.fileext === '.pdf') {
									var $liFile = $(
										'<li><span class="img_mask"><a href="' + v.fileurl + '" download="filename" title="点击下载"><i class="glyphicon glyphicon-download-alt" aria-hidden="true"></i></a></span>' +
										'<div onclick="btn_views(\'' + v.fileurl + '\')" class="noThumb thumb" title="文件"><i class="glyphicon glyphicon-paperclip"></i><p>点击预览</p></div>' +
										'<span class="file_name">' + v.filename + '</span>' +
										'</li>'
									);
								} else {
									var $liFile = $(
										'<li><span class="img_mask"><a href="' + v.fileurl + '" download="filename" title="点击下载"><i class="glyphicon glyphicon-download-alt" aria-hidden="true"></i></a></span>' +
										'<div class="noThumb" title="文件"><i class="glyphicon glyphicon-paperclip"></i><p>无法预览</p></div>' +
										'<span class="file_name">' + v.filename + '</span>' +
										'</li>'
									);
								}
								$list.append($liFile);
							}
						});

						layer.photos({
							photos: '#fileList',
							anim: 5, //0-6的选择，指定弹出图片动画类型，默认随机（请注意，3.0之前的版本用shift参数）
							title: '查看图片',
							move: '.layui-layer-title',
							shadeClose: false,
							closeBtn: 1,
							area: ['80%', '90%'],
							tab: function(pic, layero) {
								$('.layui-layer-content').on("mousewheel", function(e, d) {
//									helper.methods.zoomImg($('#layui-layer-photos').find('img[alt="' + pic.alt + '"]'), d);
									zoomImg($('#layui-layer-photos').find('img[alt="' + pic.alt + '"]'), d);
									$('#layui-layer-photos').find('img[alt="' + pic.alt + '"]').dragging({
										move: "both", //拖动方向，x y both
										randomPosition: false //初始位置是否随机
									});
									return false;
								});
								helper.methods.initLayerPhotos('#layui-layer-photos', pic, layero);
							},
						});

					} else {
						$("#fileList").html('<p class="abnormal">暂无内容。。。</p>');
					}
				}
			}
		}

	});
}

//生成pdf预览文件
function btn_views(sfiles) {
	$('#the-canvas').empty();
	$('.preview_area').show();
	var url = sfiles;
	pdfjsLib.GlobalWorkerOptions.workerSrc =
		//		'/js/pdfjs/pdf.worker.js';
		'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.0.943/pdf.worker.min.js';

	var pdfDoc = null,
		pageNum = 1,
		pageRendering = false,
		pageNumPending = null,
		scale = 1.5,
		canvas = document.getElementById('the-canvas'),
		ctx = canvas.getContext('2d');

	/**
	 * Get page info from document, resize canvas accordingly, and render page.
	 * @param num Page number.
	 */
	function renderPage(num) {
		pageRendering = true;
		// Using promise to fetch the page
		pdfDoc.getPage(num).then(function(page) {
			var viewport = page.getViewport(scale);
			canvas.height = viewport.height;
			canvas.width = viewport.width;

			// Render PDF page into canvas context
			var renderContext = {
				canvasContext: ctx,
				viewport: viewport
			};
			var renderTask = page.render(renderContext);

			// Wait for rendering to finish
			renderTask.promise.then(function() {
				pageRendering = false;
				if(pageNumPending !== null) {
					// New page rendering is pending
					renderPage(pageNumPending);
					pageNumPending = null;
				}
			});
		});

		// Update page counters
		document.getElementById('page_num').textContent = num;
	}

	/**
	 * If another page rendering in progress, waits until the rendering is
	 * finised. Otherwise, executes rendering immediately.
	 */
	function queueRenderPage(num) {
		if(pageRendering) {
			pageNumPending = num;
		} else {
			renderPage(num);
		}
	}

	/**
	 * Displays previous page.
	 */
	function onPrevPage() {
		if(pageNum <= 1) {
			return;
		}
		pageNum--;
		queueRenderPage(pageNum);
	}
	document.getElementById('prev').addEventListener('click', onPrevPage);

	/**
	 * Displays next page.
	 */
	function onNextPage() {
		if(pageNum >= pdfDoc.numPages) {
			return;
		}
		pageNum++;
		queueRenderPage(pageNum);
	}
	document.getElementById('next').addEventListener('click', onNextPage);

	/**
	 * Asynchronously downloads PDF.
	 */
	pdfjsLib.getDocument(url).then(function(pdfDoc_) {
		pdfDoc = pdfDoc_;
		document.getElementById('page_count').textContent = pdfDoc.numPages;

		// Initial/first page rendering
		renderPage(pageNum);
	});

}

function getQueryString(item) {
	var locationSearch = "";
	var tmpLocationArr = location.href.split("?");
	if(tmpLocationArr.length > 1) locationSearch = "?" + tmpLocationArr[1];
	var svalue = locationSearch.match(new RegExp("[\?\&]" + item + "=([^\&]*)(\&?)", "i"));
	var Qvalue = svalue ? svalue[1] : svalue;
	if(Qvalue == null) {
		return "";
	} else {
		return Qvalue.trim();
	}
}

/**
 * 鼠标滚轮放大缩小
 * o img元素
 * d 滚轮的方向
 * */
function zoomImg(o, d) {
	//d 1 上 -1 下
	var width = $(o).width();
	var height = $(o).height();
	if(d === 1) {
		$(o).css({
			"left": "50%",
			"marginLeft": -(width * 1.2) / 2,
			"top": "50%",
			"marginTop": -(height * 1.2) / 2,
			"width": width * 1.2,
			"height": height * 1.2
		});
	}
	if(d === -1) {
		$(o).css({
			"left": "50%",
			"marginLeft": -(width * 1.2) / 2,
			"top": "50%",
			"marginTop": -(height * 1.2) / 2,
			"width": width / 1.2,
			"height": height / 1.2
		});
	}
}