/**
|
* Created by weidy on 2019/1/21. 文件预览
|
*/
|
layui.define(['layer','table','element'],function(exports){
|
var Home = function(){
|
this.id = "vciFilePreview";
|
this.previewFileKey = "";
|
this.extraParams = {};
|
this.viewtype = "pdf";
|
this.viewtypeConstant = {
|
/**
|
* 与后台的VciFileViewTypeConstant对应
|
*/
|
PDF:'pdf',
|
XPS:'xps',
|
COMMON:'common',
|
IMAGES:'images',
|
AUDIO:'audio',
|
VIDEO:'video',
|
FLASH:'flash',
|
TEXT:'text',
|
HTML:'html',
|
ACTIVE:'active'
|
};
|
this.backPath = configData.compatibility?path:configData.filePreviewPath;
|
this.url={
|
controller:'vciFilePreviewController/',
|
ajaxPreview:'ajaxPreview',
|
showXps:'showXps',
|
showPdf:'showPdf',
|
showCommon:'showCommonFile',
|
getPdfUrlForIE:'getPdfUrlForIE',
|
listLinkeFile:'vciFileQueryController/gridFiles'
|
};
|
this.config = {};
|
};
|
Home.prototype.getContent = function(id){
|
var that = this;
|
return '<div class="layui-index-home layui-fluid" style="overflow:auto;position:absolute;left:5px;top:5px;background-color: #999999;z-index:auto;" id="vciFilePreview_' + id + '"></div>' +
|
'<div id="previewinfo_' + id + '" class="layui-layout-east" style="display:block;position:absolute;right:0;margin-top:5px;margin-right:5px;width:340px;height:98%;max-width:340px;min-width:150px;border:1px solid #e1e1e1">' +
|
'<div lay-filter="panelFileInfo_' + id + '" class="layui-tab layui-tab-card" lay-allowClose="false" style="margin-top:0px;">'+
|
'<ul class="layui-tab-title" lay-allowClose="false">' +
|
'</ul>' +
|
'<div class="layui-tab-content"></div>' +
|
'</div> '+
|
'</div> '+
|
'</div>';
|
};
|
Home.prototype.init = function(id,options){
|
var that = this;
|
var parent ;
|
var isInner = false;
|
if(options.showType && options.showType == "inner"){
|
parent = $("#vciFilePreview_" + id).parent();
|
isInner =true;
|
}else{
|
parent = $(document);
|
}
|
var width = (options.width?options.width:(isInner?(parent.width()-380):(parent.width()-430)));
|
var height =options.height?options.height: (parent.height()-120);
|
if(options.hideRightPanel){
|
width = $(document).width()-85;
|
$("#previewinfo_" + id).hide();
|
}
|
options.contentStyle = 'max-width: ' + width + 'px;max-height:' + height +'px;width:' + width + "px;height:" + height + "px;";
|
window.print = function(){
|
return false;
|
};
|
that.config[id] = options;
|
//需要先到后台生成文件
|
$webUtil.get(that.url.controller + that.url.ajaxPreview,options,function(result){
|
if(result.success){
|
that.doShow(id,result.obj,true);
|
}else{
|
$webUtil.showErrorMsg(result.msg);
|
}
|
},function(xhr,err){
|
$webUtil.showErrorMsg("下载预览相关的许可出错,可能是文件预览服务没有启动");
|
},that.backPath);
|
};
|
Home.prototype.doShow = function(id,previewVO,first){
|
var that = this;
|
//不同的类型的显示方式
|
var viewtype = previewVO.viewType;
|
var previewFileKey = previewVO.previewKey;
|
if(that.viewtypeConstant.XPS == viewtype){
|
that.showXps(id,previewFileKey,first);
|
}else if(that.viewtypeConstant.PDF == viewtype || that.viewtypeConstant.ACTIVE == viewtype){
|
//pdf的预览,对于IE8,IE9需要adobe的控件,如果是其他浏览器,则直接显示
|
that.showPdf(id,previewFileKey,first,viewtype);
|
}else if(that.viewtypeConstant.IMAGES == viewtype){
|
that.showImages(id,previewFileKey,first);
|
}else if(that.viewtypeConstant.AUDIO == viewtype || that.viewtypeConstant.VIDEO == viewtype){
|
that.showVedioAndAudio(id,previewFileKey,first);
|
}else if(that.viewtypeConstant.TEXT == viewtype){
|
that.showText(id,previewFileKey,first);
|
}else if(that.viewtypeConstant.HTML == viewtype){
|
that.showHtml(id,previewFileKey,first);
|
}else{
|
that.downloadFile(id,previewFileKey,first);
|
}
|
};
|
Home.prototype.downloadFile = function(id,previewFileKey,first){
|
//下载文件
|
var that = this;
|
$webUtil.get(that.url.controller + that.url.showCommon,{filePreviewKey:previewFileKey,viewType:that.viewtypeConstant.COMMON},function(result){
|
if(result.success){
|
that.replaceIframe(id, '<div style="text-align: center;font-size:20px;height:100px;">这个文件不支持预览,将自动为您下载</div>');
|
$webUtil.fileDownload(that.backPath + result.obj);
|
if(first){
|
that.initRightPanle(id);
|
}
|
}else{
|
$webUtil.showErrorMsg(result.msg);
|
}
|
},function(xhr,error){
|
$webUtil.showErrorMsg("下载预览相关的许可出错,可能是文件预览服务没有启动");
|
},that.backPath);
|
|
};
|
Home.prototype.replaceIframe = function(id,html){
|
//替换iframe部分的内容
|
$("#vciFilePreview_" + id).find("[name='vciFilePreviewContent']").remove();
|
$("#vciFilePreview_" + id).prepend(html);
|
};
|
Home.prototype.showHtml = function(id,previewFileKey,first){
|
//显示html
|
var that = this;
|
$webUtil.get(that.url.controller + that.url.showCommon,{filePreviewKey:previewFileKey,viewType:that.viewtypeConstant.HTML},function(result){
|
if(result.success){
|
var iframeUrl = that.backPath+ result.obj ;
|
that.replaceIframe(id, '<iframe src="' + iframeUrl + '" style="' + that.config[id].contentStyle + '" name="vciFilePreviewContent" frameborder="false" scrolling="none" ></iframe>');
|
if(first){
|
that.initRightPanle(id);
|
}
|
}else{
|
$webUtil.showErrorMsg(result.msg);
|
}
|
},function(xhr,error){
|
$webUtil.showErrorMsg("获取文件的路径出错,可能是文件预览服务没有启动");
|
},that.backPath);
|
};
|
Home.prototype.showText = function(id,previewFileKey,first){
|
//显示普通的文本
|
var that = this;
|
$webUtil.get(that.url.controller + that.url.showCommon,{filePreviewKey:previewFileKey,viewType:that.viewtypeConstant.TEXT},function(result){
|
if(result.success){
|
var width = ($(document).width()-400);
|
var height = ($(document).height()-80);
|
var contentStyle = 'max-width: ' + width + 'px;max-height:' + height +'px;width:' + width + "px;height:" + height + "px;";
|
that.replaceIframe(id,'<pre class="layui-code" lay-skin="notepad" lay-encode="false" style="' + contentStyle + ';overflow: auto" name="vciFilePreviewContent">' + result.obj +'</pre>');
|
if(first){
|
that.initRightPanle(id);
|
}
|
}else{
|
$webUtil.showErrorMsg(result.msg);
|
}
|
},function(xhr,error){
|
$webUtil.showErrorMsg("获取文件的内容出错,可能是文件预览服务没有启动");
|
},that.backPath);
|
};
|
Home.prototype.showVedioAndAudio =function(id,previewFileKey,first){
|
var that = this;
|
//视频
|
$webUtil.get(that.url.controller + that.url.showCommon,{filePreviewKey:previewFileKey,viewType:that.viewtypeConstant.AUDIO},function(result){
|
if(result.success){
|
var html = '<object id="player" classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6" name="vciFilePreviewContent" style="' + that.config[id].contentStyle + ';">'+
|
'<param name="AutoStart" VALUE="-1">'+
|
'<param name="enabled" value="1">'+
|
'<param name="EnableContextMenu" VALUE="-1">'+
|
'<param name="url" VALUE="' + that.backPath + result.obj + '">'+
|
'<param name="volume" value="50">'+
|
'</object>';
|
that.replaceIframe(id,html);
|
if(first){
|
that.initRightPanle(id);
|
}
|
}else{
|
$webUtil.showErrorMsg(result.msg);
|
}
|
},function(xhr,error){
|
$webUtil.showErrorMsg("获取文件的路径出错,可能是文件预览服务没有启动");
|
},that.backPath);
|
};
|
Home.prototype.showImages = function (id,previewFileKey,first) {
|
var that = this;
|
//图片
|
$webUtil.get(that.url.controller +that.url.showCommon,{filePreviewKey:previewFileKey,viewType:that.viewtypeConstant.IMAGES},function(result){
|
if(result.success){
|
that.replaceIframe(id,'<img src="' + that.backPath + result.obj + '" style="max-width:' + ($(document).width()-360) + 'px;height:auto;" name="vciFilePreviewContent" />');
|
if(first){
|
that.initRightPanle(id);
|
}
|
}else{
|
$webUtil.showErrorMsg(result.msg);
|
}
|
},function(xhr,error){
|
$webUtil.showErrorMsg("获取文件的路径出错,可能是文件预览服务没有启动");
|
},that.backPath);
|
};
|
Home.prototype.showXps = function(id,previewFileKey,first){
|
var that = this;
|
$webUtil.get(that.url.controller +that.url.showXps,{xpsPreviewKey:previewFileKey},function(result){
|
if(result.success){
|
var iframeUrl = that.backPath + result.obj ;
|
that.replaceIframe(id, '<iframe src="' + iframeUrl + '" style="' + that.config[id].contentStyle + '" name="vciFilePreviewContent" frameborder="false" scrolling="auto" ></iframe>');
|
if(first){
|
that.initRightPanle(id);
|
}
|
}else{
|
$webUtil.showErrorMsg(result.msg);
|
}
|
},function(xhr,error){
|
$webUtil.showErrorMsg("获取文件的路径出错,可能是文件预览服务没有启动");
|
},that.backPath);
|
};
|
Home.prototype.showPdf = function(id,previewFileKey,first,viewtype){
|
var that = this;
|
$webUtil.get(that.url.controller +that.url.showPdf,{pdfPreviewKey:previewFileKey},function(result){
|
if(result.success){
|
//有adobe 和active的方式
|
var iframeUrl = that.backPath + result.obj + "?AuthorizationToken=" + $webUtil.getToken() ;
|
if(that.isIE()) {
|
if (that.viewtypeConstant.ACTIVE == viewtype) {
|
//要控制下载的时候,使用这个
|
that.replaceIframe(id, '<object id="csocx' + id + '" name="vciFilePreviewContent" style="' + that.config[id].contentStyle + '" classid="clsid:195CA93F-2C9A-4E46-A8B3-D28E8C790954">' +
|
'<param name="Url" value="' + iframeUrl + '"></param></object>');
|
document.getElementById("csocx" + id).Url = iframeUrl;
|
} else {
|
if (!that.checkAdobeReaderInstall()) {
|
that.replaceIframe(id, projectName + "jslib/layui-2.2.5-debug/lay/filepreview/help.html?viewtype=" + that.viewtype);
|
} else {
|
that.replaceIframe(id, '<div style="' + that.config[id].contentStyle + '" id="vciFilePreviewContent' + id + '" name="vciFilePreviewContent" ></div>');
|
var pdfObject = new PDFObject({
|
id: 'vciFilePreviewContent' + id,
|
url: iframeUrl,
|
pdfOpenParams: {
|
scrollbars: '0',
|
toolbar: '0',
|
statusbar: '0'
|
}
|
}).embed('vciFilePreviewContent' + id);
|
}
|
}
|
}else{
|
//可能是支持HTML5的浏览器,因此使用pdf.js进行展示
|
var url = projectName + 'jslib/layui-2.2.5-debug/lay/filepreview/web/viewer.html?file=' +iframeUrl ;
|
that.replaceIframe(id,'<iframe src="' + url + '" style="' + that.config[id].contentStyle + '" name="vciFilePreviewContent" frameborder="false" scrolling="auto" ></iframe>');
|
}
|
if (first) {
|
that.initRightPanle(id);
|
}
|
}else{
|
$webUtil.showErrorMsg(result.msg);
|
}
|
},function(xhr,error){
|
$webUtil.showErrorMsg("获取文件的路径出错,可能是文件预览服务没有启动");
|
},that.backPath);
|
};
|
Home.prototype.checkAdobeReaderInstall =function(){
|
var activeRender = false;
|
//检查pdf是否安装
|
for (var i = 2; i < 12; i++) {
|
try {
|
var activeAdobe = eval("new ActiveXObject('PDF.pdfCtrl." + x + "');");
|
if (activeAdobe) {
|
activeRender = true;
|
break;
|
}
|
} catch (e) {
|
|
}
|
}
|
if (!activeRender) {
|
//看看acro4
|
try {
|
var activeAdobe4 = new ActiveXObject("PDF.PdfCtrl.1");
|
activeRender = true;
|
} catch (e) {
|
|
}
|
}
|
if (!activeRender) {
|
try {
|
var activeAdobe7 = new ActiveXObject("AcroPDF.PDF.1");
|
activeRender = true;
|
} catch (e) {
|
|
}
|
}
|
return activeRender;
|
};
|
Home.prototype.initRightPanle = function (id) {
|
//初始化右侧的列表和帮助信息
|
var that = this;
|
var options = that.config[id];
|
if(!options.hideRightPanel) {
|
layui.element.tabAdd('panelFileInfo_' + id, {
|
title: '本业务数据的所有附件',
|
id: "tab_allFile_" + id,
|
content: '<div id="allfile_' + id + '">' +
|
'<div layui-filter="toolbar_' + id + '" class="layui-btn-container"></div>' +
|
'<table id="allfile_table_' + id + '" lay-filter="allfile_table_' + id + '" style="overflow-y:auto;"></table>' +
|
'</div>'
|
});
|
that.initFileTable(id);
|
layui.element.tabAdd('panelFileInfo_' + id, {
|
title: '使用帮助信息',
|
id: "tab_preViewHelp_" + id,
|
content:that.getHelpContent(options.viewtype)
|
});
|
layui.element.tabChange('panelFileInfo_' + id, "tab_allFile_" + id);
|
$('a[name="vcifilepreviewforlinkfile"]').die().live('click', function () {
|
var thisFileNameCell = $(this);
|
var linkFileOid = thisFileNameCell.attr("fileoid");
|
that.clickNamePREVIEW(id, linkFileOid);
|
});
|
}
|
};
|
Home.prototype.getHelpContent = function (viewtype){
|
var sUserAgent = navigator.userAgent;
|
var that = this;
|
var isActive = false;
|
if("active" == viewtype){
|
isActive = true;
|
}
|
var downloadUrl = isActive?"/download/VCIPdfViewer.exe":"/download/AdbeRdr920_zh_CN.exe";
|
var installHelp = "/download/安装说明.doc";
|
var systemInfo = "您的系统是windows:";
|
if((navigator.platform == "Win32") || (navigator.platform == "Windows")){
|
if(sUserAgent.indexOf("Windows NT 5.1") > -1 ||
|
sUserAgent.indexOf("Windows XP") > -1){
|
if(isActive) {
|
downloadUrl = "/download/vciFilePreview.zip";
|
installHelp = "/download/安装说明xp.doc";
|
}
|
systemInfo = "您的操作系统是windows xp:";
|
}
|
var html = systemInfo + "</br>";
|
if(isActive){
|
html += "<a href='javascript:void(0);' docurl='" + projectName + installHelp + "' id='downloadDoc'>点击这里下载【安装说明】</a></br>";
|
}else{
|
html += "默认提供9.2版本的Adobe Reader,可以自行安装其他版本的Adobe的pdf软件</br>";
|
}
|
html += "<a href='javascript:void(0);' docurl='" + projectName + downloadUrl + "' id='downloadInstall'>点击这里下载安装文件</a>";
|
}else{
|
html = ("<br/>您的操作系统不是windows,不需要安装,请使用谷歌浏览器、火狐浏览器或者safari浏览器");
|
}
|
$("#downloadDoc").unbind("click").click(function(){
|
that.doDownload($(this).attr("docurl"));
|
});
|
$("#downloadInstall").unbind("click").click(function(){
|
that.doDownload($(this).attr("docurl"));
|
});
|
return ['<div style="display:block;text-align: left;padding:20px;">',
|
'<p style="color:blue;">1. 建议您使用谷歌浏览器,或者火狐等浏览器查看体验更佳</p>',
|
'<hr className="layui-bg-red">',
|
'<p style="color:blue;">2. 显示的内容中某些表格等可能会出现显示的格式错误的情况,但是不影响阅读。这种情况下的原文格式是正常的,建议此时直接下载文件</p>',
|
'<hr className="layui-bg-red">',
|
'<p style="color:blue;">3. 右侧列表中是当前预览文件所属的业务类型下的所有附件,可以直接单击名称就可以查看</p>',
|
'<hr className="layui-bg-red">',
|
'<p style="color:blue;">4. 需要安装文件预览的程序后才能查看内容,请在下方下载安装程序根据要求安装</p>',
|
'<hr className="layui-bg-red">',
|
'<p id="downloadP" style="color:red">' ,html ,'</p>',
|
'<hr className="layui-bg-red">',
|
'</div>'].join('');
|
};
|
Home.prototype.doDownload = function (url){
|
var downIframe = $("<iframe>");
|
downIframe.attr("style","display:none;");
|
$("body").append(downIframe);
|
downIframe.attr("src",url);
|
if (downIframe.attachEvent) {
|
downIframe.attachEvent("onload",
|
function() {
|
downIframe.remove();
|
});
|
} else {
|
downIframe.onload = function() {
|
downIframe.remove();
|
};
|
}
|
};
|
Home.prototype.isIE = function () {
|
var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
|
//IE11不就算在里面,因为它本身支持H5的方式了
|
return /msie/g.test(userAgent.toLowerCase());
|
};
|
Home.prototype.initFileTable = function(id) {
|
var that = this;
|
var table = layui.table;
|
var columns = [{
|
field:'name',
|
title:'文件名称',
|
width:300,
|
templet:function (d) {
|
var showName = $webUtil.isNull(d.id)?d.name:d.id;
|
return '<a href="javascript:;" name="vcifilepreviewforlinkfile" style="color:#2080da;text-decoration:underline;" compId="' + id +'" fileoid="'
|
+ d.oid + '" >'
|
+ showName + ($webUtil.isNull(d.fileExtension)?"":("." + d.fileExtension)) + '</a>';
|
}
|
}];
|
var options = that.config[id];
|
layui.table.render({
|
elem:"#allfile_table_"+id,
|
url:that.url.listLinkeFile,
|
id:"allfile_table_"+id,
|
backPath:configData.fileServicePath,
|
where:{
|
ownbizOid:options.ownbizOid,
|
ownbizBtm:options.ownbizBtm
|
},
|
cols:[columns],
|
height:450
|
});
|
};
|
Home.prototype.clickNamePREVIEW = function(id,linkFileOid){
|
var that = this;
|
var extraParams={};
|
extraParams['linkFileOid'] = linkFileOid;
|
extraParams['viewType'] = that.config[id].viewType;
|
$webUtil.showProgress("即将开始预览,请等待....");
|
$webUtil.post(that.url.controller + that.url.ajaxPreview, extraParams, function (result) {
|
$webUtil.closeProgress();
|
if (result.success && result.obj) {
|
that.doShow(id,result.obj,false);
|
} else {
|
$webUtil.showErrorMsg(result.msg);
|
}
|
},function(xhr,error){
|
$webUtil.showErrorMsg("获取文件的许可出错,可能是文件预览服务未启动")
|
});
|
};
|
var home = new Home();
|
exports('FilePreviewBase',home);
|
});
|