4 changed files with 582 additions and 146 deletions
-
182src/assets/js/LodopFuncs.js
-
146src/assets/js/LodopFuncs_old.js
-
260src/utils/LodopFuncs.js
-
84src/utils/LodopFuncs_old.js
@ -0,0 +1,146 @@ |
|||
//==本JS是加载Lodop插件及CLodop服务的综合示例,可直接使用,建议看懂后融进自己页面程序==
|
|||
|
|||
var CreatedOKLodopObject, CLodopIsLocal, CLodopJsState; |
|||
|
|||
//==判断是否需要CLodop(那些不支持插件的浏览器):==
|
|||
function needCLodop() { |
|||
try { |
|||
var ua = navigator.userAgent; |
|||
if (ua.match(/Windows\sPhone/i)) |
|||
return true; |
|||
if (ua.match(/iPhone|iPod|iPad/i)) |
|||
return true; |
|||
if (ua.match(/Android/i)) |
|||
return true; |
|||
if (ua.match(/Edge\D?\d+/i)) |
|||
return true; |
|||
|
|||
var verTrident = ua.match(/Trident\D?\d+/i); |
|||
var verIE = ua.match(/MSIE\D?\d+/i); |
|||
var verOPR = ua.match(/OPR\D?\d+/i); |
|||
var verFF = ua.match(/Firefox\D?\d+/i); |
|||
var x64 = ua.match(/x64/i); |
|||
if ((!verTrident) && (!verIE) && (x64)) |
|||
return true; |
|||
else if (verFF) { |
|||
verFF = verFF[0].match(/\d+/); |
|||
if ((verFF[0] >= 41) || (x64)) |
|||
return true; |
|||
} else if (verOPR) { |
|||
verOPR = verOPR[0].match(/\d+/); |
|||
if (verOPR[0] >= 32) |
|||
return true; |
|||
} else if ((!verTrident) && (!verIE)) { |
|||
var verChrome = ua.match(/Chrome\D?\d+/i); |
|||
if (verChrome) { |
|||
verChrome = verChrome[0].match(/\d+/); |
|||
if (verChrome[0] >= 41) |
|||
return true; |
|||
} |
|||
} |
|||
return false; |
|||
} catch (err) { |
|||
return true; |
|||
} |
|||
} |
|||
|
|||
//==加载引用CLodop的主JS,用双端口8000和18000(以防其中一个被占):==
|
|||
function loadCLodop() { |
|||
if (CLodopJsState == "loading" || CLodopJsState == "complete") return; |
|||
CLodopJsState = "loading"; |
|||
var head = document.head || document.getElementsByTagName("head")[0] || document.documentElement; |
|||
var JS1 = document.createElement("script"); |
|||
var JS2 = document.createElement("script"); |
|||
JS1.src = "http://localhost:8000/CLodopfuncs.js?priority=1"; |
|||
JS2.src = "http://localhost:18000/CLodopfuncs.js"; |
|||
JS1.onload = JS2.onload = function() {CLodopJsState = "complete";} |
|||
JS1.onerror = JS2.onerror = function(evt) {CLodopJsState = "complete";} |
|||
head.insertBefore(JS1, head.firstChild); |
|||
head.insertBefore(JS2, head.firstChild); |
|||
CLodopIsLocal = !!((JS1.src + JS2.src).match(/\/\/localho|\/\/127.0.0./i)); |
|||
} |
|||
|
|||
if (needCLodop()){loadCLodop();}//加载
|
|||
|
|||
//==获取LODOP对象主过程,判断是否安装、需否升级:==
|
|||
function getLodop(oOBJECT, oEMBED) { |
|||
var strHtmInstall = "<br><font color='#FF00FF'>打印控件未安装!点击这里<a href='install_lodop32.exe' target='_self'>执行安装</a>,安装后请刷新页面或重新进入。</font>"; |
|||
var strHtmUpdate = "<br><font color='#FF00FF'>打印控件需要升级!点击这里<a href='install_lodop32.exe' target='_self'>执行升级</a>,升级后请重新进入。</font>"; |
|||
var strHtm64_Install = "<br><font color='#FF00FF'>打印控件未安装!点击这里<a href='install_lodop64.exe' target='_self'>执行安装</a>,安装后请刷新页面或重新进入。</font>"; |
|||
var strHtm64_Update = "<br><font color='#FF00FF'>打印控件需要升级!点击这里<a href='install_lodop64.exe' target='_self'>执行升级</a>,升级后请重新进入。</font>"; |
|||
var strHtmFireFox = "<br><br><font color='#FF00FF'>(注意:如曾安装过Lodop旧版附件npActiveXPLugin,请在【工具】->【附加组件】->【扩展】中先卸它)</font>"; |
|||
var strHtmChrome = "<br><br><font color='#FF00FF'>(如果此前正常,仅因浏览器升级或重安装而出问题,需重新执行以上安装)</font>"; |
|||
var strCLodopInstall_1 = "<br><font color='#FF00FF'>Web打印服务CLodop未安装启动,点击这里<a href='CLodop_Setup_for_Win32NT.exe' target='_self'>下载执行安装</a>"; |
|||
var strCLodopInstall_2 = "<br>(若此前已安装过,可<a href='CLodop.protocol:setup' target='_self'>点这里直接再次启动</a>)"; |
|||
var strCLodopInstall_3 = ",成功后请刷新本页面。</font>"; |
|||
var strCLodopUpdate = "<br><font color='#FF00FF'>Web打印服务CLodop需升级!点击这里<a href='CLodop_Setup_for_Win32NT.exe' target='_self'>执行升级</a>,升级后请刷新页面。</font>"; |
|||
var LODOP; |
|||
try { |
|||
var ua = navigator.userAgent; |
|||
var isIE = !!(ua.match(/MSIE/i)) || !!(ua.match(/Trident/i)); |
|||
if (needCLodop()) { |
|||
try { |
|||
LODOP = getCLodop(); |
|||
} catch (err) {} |
|||
if (!LODOP && CLodopJsState !== "complete") { |
|||
if (CLodopJsState == "loading") alert("网页还没下载完毕,请稍等一下再操作."); else alert("没有加载CLodop的主js,请先调用loadCLodop过程."); |
|||
return; |
|||
} |
|||
if (!LODOP) { |
|||
document.body.innerHTML = strCLodopInstall_1 + (CLodopIsLocal ? strCLodopInstall_2 : "") + strCLodopInstall_3 + document.body.innerHTML; |
|||
return; |
|||
} else { |
|||
if (CLODOP.CVERSION < "4.1.2.7") { |
|||
document.body.innerHTML = strCLodopUpdate + document.body.innerHTML; |
|||
} |
|||
if (oEMBED && oEMBED.parentNode) |
|||
oEMBED.parentNode.removeChild(oEMBED); //清理旧版无效元素
|
|||
if (oOBJECT && oOBJECT.parentNode) |
|||
oOBJECT.parentNode.removeChild(oOBJECT); |
|||
} |
|||
} else { |
|||
var is64IE = isIE && !!(ua.match(/x64/i)); |
|||
//==如果页面有Lodop就直接使用,否则新建:==
|
|||
if (oOBJECT || oEMBED) { |
|||
if (isIE) |
|||
LODOP = oOBJECT; |
|||
else |
|||
LODOP = oEMBED; |
|||
} else if (!CreatedOKLodopObject) { |
|||
LODOP = document.createElement("object"); |
|||
LODOP.setAttribute("width", 0); |
|||
LODOP.setAttribute("height", 0); |
|||
LODOP.setAttribute("style", "position:absolute;left:0px;top:-100px;width:0px;height:0px;"); |
|||
if (isIE) |
|||
LODOP.setAttribute("classid", "clsid:2105C259-1E0C-4534-8141-A753534CB4CA"); |
|||
else |
|||
LODOP.setAttribute("type", "application/x-print-lodop"); |
|||
document.documentElement.appendChild(LODOP); |
|||
CreatedOKLodopObject = LODOP; |
|||
} else |
|||
LODOP = CreatedOKLodopObject; |
|||
//==Lodop插件未安装时提示下载地址:==
|
|||
if ((!LODOP) || (!LODOP.VERSION)) { |
|||
if (ua.indexOf('Chrome') >= 0) |
|||
document.body.innerHTML = strHtmChrome + document.body.innerHTML; |
|||
if (ua.indexOf('Firefox') >= 0) |
|||
document.body.innerHTML = strHtmFireFox + document.body.innerHTML; |
|||
document.body.innerHTML = (is64IE ? strHtm64_Install : strHtmInstall) + document.body.innerHTML; |
|||
return LODOP; |
|||
} |
|||
} |
|||
if (LODOP.VERSION < "6.2.2.6") { |
|||
if (!needCLodop()) |
|||
document.body.innerHTML = (is64IE ? strHtm64_Update : strHtmUpdate) + document.body.innerHTML; |
|||
} |
|||
//===如下空白位置适合调用统一功能(如注册语句、语言选择等):==
|
|||
|
|||
|
|||
//=======================================================
|
|||
return LODOP; |
|||
} catch (err) { |
|||
alert("getLodop出错:" + err); |
|||
} |
|||
} |
|||
|
|||
export default getLodop |
|||
@ -1,84 +1,248 @@ |
|||
import { MessageBox } from 'element-ui' |
|||
import {getPrinterUrl} from '../api/label/printer' |
|||
//==本JS是加载Lodop插件或Web打印服务CLodop/Lodop7的综合示例==
|
|||
import { MessageBox } from 'element-ui' |
|||
|
|||
// ====页面动态加载C-Lodop云打印必须的文件CLodopfuncs.js====
|
|||
//用双端口加载主JS文件Lodop.js(或CLodopfuncs.js兼容老版本)以防其中某端口被占:
|
|||
var MainJS = "CLodopfuncs.js", |
|||
URL_WS1 = "ws://localhost:8000/" + MainJS, //ws用8000/18000
|
|||
URL_WS2 = "ws://localhost:18000/" + MainJS, |
|||
URL_HTTP1 = "http://localhost:8000/" + MainJS, //http用8000/18000
|
|||
URL_HTTP2 = "http://localhost:18000/" + MainJS, |
|||
URL_HTTP3 = "https://localhost.lodop.net:8443/" + MainJS; //https用8000/8443
|
|||
|
|||
var head = document.head || document.getElementsByTagName('head')[0] || document.documentElement |
|||
var CreatedOKLodopObject, CLodopIsLocal, LoadJsState; |
|||
|
|||
var oscript = document.createElement('script') |
|||
|
|||
// 让本机的浏览器打印(更优先一点):
|
|||
|
|||
oscript = document.createElement('script') |
|||
|
|||
oscript.src = 'http://localhost:8000/CLodopfuncs.js?priority=2' |
|||
|
|||
head.insertBefore(oscript, head.firstChild) |
|||
|
|||
// 加载双端口(8000和18000)避免其中某个端口被占用:
|
|||
|
|||
oscript = document.createElement('script') |
|||
|
|||
oscript.src = 'http://localhost:18000/CLodopfuncs.js?priority=1' |
|||
//==判断是否需要CLodop(那些不支持插件的浏览器):==
|
|||
function needCLodop() { |
|||
try { |
|||
var ua = navigator.userAgent; |
|||
if (ua.match(/Windows\sPhone/i) || |
|||
ua.match(/iPhone|iPod|iPad/i) || |
|||
ua.match(/Android/i) || |
|||
ua.match(/Edge\D?\d+/i)) |
|||
return true; |
|||
var verTrident = ua.match(/Trident\D?\d+/i); |
|||
var verIE = ua.match(/MSIE\D?\d+/i); |
|||
var verOPR = ua.match(/OPR\D?\d+/i); |
|||
var verFF = ua.match(/Firefox\D?\d+/i); |
|||
var x64 = ua.match(/x64/i); |
|||
if ((!verTrident) && (!verIE) && (x64)) return true; |
|||
else if (verFF) { |
|||
verFF = verFF[0].match(/\d+/); |
|||
if ((verFF[0] >= 41) || (x64)) return true; |
|||
} else if (verOPR) { |
|||
verOPR = verOPR[0].match(/\d+/); |
|||
if (verOPR[0] >= 32) return true; |
|||
} else if ((!verTrident) && (!verIE)) { |
|||
var verChrome = ua.match(/Chrome\D?\d+/i); |
|||
if (verChrome) { |
|||
verChrome = verChrome[0].match(/\d+/); |
|||
if (verChrome[0] >= 41) return true; |
|||
} |
|||
} |
|||
return false; |
|||
} catch (err) { |
|||
return true; |
|||
} |
|||
} |
|||
|
|||
head.insertBefore(oscript, head.firstChild) |
|||
//==检查加载成功与否,如没成功则用http(s)再试==
|
|||
function checkOrTryHttp() { |
|||
if (window.getCLodop) { |
|||
LoadJsState = "complete"; |
|||
return true; |
|||
} |
|||
if (LoadJsState == "loadingB" || LoadJsState == "complete") return; |
|||
LoadJsState = "loadingB"; |
|||
var head = document.head || document.getElementsByTagName("head")[0] || document.documentElement; |
|||
var JS1 = document.createElement("script"), |
|||
JS2 = document.createElement("script"), |
|||
JS3 = document.createElement("script"); |
|||
JS1.src = URL_HTTP1; |
|||
JS2.src = URL_HTTP2; |
|||
JS3.src = URL_HTTP3; |
|||
JS1.onload = JS2.onload = JS3.onload = JS2.onerror = JS3.onerror = function() { |
|||
LoadJsState = "complete"; |
|||
} |
|||
JS1.onerror = function(e) { |
|||
if (window.location.protocol !== 'https:') |
|||
head.insertBefore(JS2, head.firstChild); |
|||
else |
|||
head.insertBefore(JS3, head.firstChild); |
|||
} |
|||
head.insertBefore(JS1, head.firstChild); |
|||
} |
|||
|
|||
// 下载loadLodop
|
|||
//==加载Lodop对象的主过程:==
|
|||
(function loadCLodop() { |
|||
if (!needCLodop()) return; |
|||
CLodopIsLocal = !!((URL_WS1 + URL_WS2).match(/\/\/localho|\/\/127.0.0./i)); |
|||
LoadJsState = "loadingA"; |
|||
if (!window.WebSocket && window.MozWebSocket) window.WebSocket = window.MozWebSocket; |
|||
//ws方式速度快(小于200ms)且可避免CORS错误,但要求Lodop版本足够新:
|
|||
try { |
|||
var WSK1 = new WebSocket(URL_WS1); |
|||
WSK1.onopen = function(e) { setTimeout(checkOrTryHttp, 200); } |
|||
WSK1.onmessage = function(e) { if (!window.getCLodop) eval(e.data); } |
|||
WSK1.onerror = function(e) { |
|||
var WSK2 = new WebSocket(URL_WS2); |
|||
WSK2.onopen = function(e) { setTimeout(checkOrTryHttp, 200); } |
|||
WSK2.onmessage = function(e) { if (!window.getCLodop) eval(e.data); } |
|||
WSK2.onerror = function(e) { checkOrTryHttp(); } |
|||
} |
|||
} catch (e) { |
|||
checkOrTryHttp(); |
|||
} |
|||
})(); |
|||
|
|||
// 下载CLodop安装程序
|
|||
function loadLodop() { |
|||
|
|||
window.open(window.SITE_CONFIG['baseUrl'] + '/printer/download') |
|||
|
|||
} |
|||
|
|||
// ====获取LODOP对象的主过程:====
|
|||
|
|||
function getLodop() { |
|||
|
|||
var LODOP |
|||
|
|||
//==获取LODOP对象主过程==
|
|||
function getLodop(oOBJECT, oEMBED) { |
|||
var LODOP; |
|||
try { |
|||
var isWinIE = (/MSIE/i.test(navigator.userAgent)) || (/Trident/i.test(navigator.userAgent)); |
|||
var isWinIE64 = isWinIE && (/x64/i.test(navigator.userAgent)); |
|||
var isLinuxX86 = (/Linux/i.test(navigator.platform)) && (/x86/i.test(navigator.platform)); |
|||
var isLinuxARM = (/Linux/i.test(navigator.platform)) && (/aarch/i.test(navigator.platform)); |
|||
|
|||
LODOP = getCLodop() |
|||
|
|||
if (!LODOP && document.readyState !== 'complete') { |
|||
|
|||
MessageBox.alert('C-Lodop print control is not ready, please try again later!') |
|||
if (needCLodop() || isLinuxX86 || isLinuxARM) { |
|||
try { |
|||
LODOP = window.getCLodop(); |
|||
} catch (err) {} |
|||
|
|||
if (!LODOP) { |
|||
debugger; |
|||
logger.info("LodopFuncs.js getLodop no CLodop"); |
|||
MessageBox({ |
|||
title: 'Information', |
|||
type: 'warning', |
|||
showCancelButton: true, |
|||
confirmButtonText: 'Download', |
|||
cancelButtonText: 'Cancel', |
|||
zIndex: 3000, |
|||
message: "You haven't installed the printing component Or the version you installed is not the latest version, please download and install or upgrade, also please check the related service is started, finally please close and reopen the browser.", |
|||
callback: res => { |
|||
if (res === 'confirm') { |
|||
loadLodop(); |
|||
} |
|||
} |
|||
}); |
|||
return |
|||
|
|||
} |
|||
|
|||
return LODOP |
|||
|
|||
} catch (err) { |
|||
// 检查版本是否需要升级
|
|||
var needUpgrade = false; |
|||
if (isLinuxX86 && LODOP.CVERSION < "7.1.0.5") needUpgrade = true; |
|||
else if (isLinuxARM && LODOP.CVERSION < "7.1.0.5") needUpgrade = true; |
|||
else if (typeof CLODOP !== 'undefined' && CLODOP.CVERSION < "6.6.2.8") needUpgrade = true; |
|||
|
|||
if (needUpgrade) { |
|||
MessageBox({ |
|||
|
|||
title: 'Information', |
|||
|
|||
type: 'warning', |
|||
|
|||
confirmButtonText: 'Confirm', |
|||
showCancelButton: true, |
|||
confirmButtonText: 'Download', |
|||
cancelButtonText: 'Cancel', |
|||
zIndex: 3000, |
|||
|
|||
message: 'You haven’t install the printing component, you can follow the steps in Manual to complete the installation, then close and reopen the window again, it should be fixed', |
|||
|
|||
message: "You haven't installed the printing component Or the version you installed is not the latest version, please download and install or upgrade, also please check the related service is started, finally please close and reopen the browser.", |
|||
callback: res => { |
|||
|
|||
if (res === 'confirm') { |
|||
loadLodop(); |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
|
|||
loadLodop() |
|||
|
|||
if (LoadJsState !== "complete") { |
|||
if (!LoadJsState) { |
|||
MessageBox.alert('Lodop main JS file is not loaded, please call loadCLodop first.', 'Information', { type: 'warning' }); |
|||
} |
|||
return; |
|||
} |
|||
|
|||
} else { |
|||
//==如果页面有Lodop插件就直接使用,否则新建:==
|
|||
if (oOBJECT || oEMBED) { |
|||
if (isWinIE) |
|||
LODOP = oOBJECT; |
|||
else |
|||
LODOP = oEMBED; |
|||
} else if (!CreatedOKLodopObject) { |
|||
LODOP = document.createElement("object"); |
|||
LODOP.setAttribute("width", 0); |
|||
LODOP.setAttribute("height", 0); |
|||
LODOP.setAttribute("style", "position:absolute;left:0px;top:-100px;width:0px;height:0px;"); |
|||
if (isWinIE) |
|||
LODOP.setAttribute("classid", "clsid:2105C259-1E0C-4534-8141-A753534CB4CA"); |
|||
else |
|||
LODOP.setAttribute("type", "application/x-print-lodop"); |
|||
document.documentElement.appendChild(LODOP); |
|||
CreatedOKLodopObject = LODOP; |
|||
} else { |
|||
LODOP = CreatedOKLodopObject; |
|||
} |
|||
|
|||
}) |
|||
//==Lodop插件未安装时提示下载:==
|
|||
if ((!LODOP) || (!LODOP.VERSION)) { |
|||
MessageBox({ |
|||
title: 'Information', |
|||
type: 'warning', |
|||
showCancelButton: true, |
|||
confirmButtonText: 'Download', |
|||
cancelButtonText: 'Cancel', |
|||
zIndex: 3000, |
|||
message: "You haven't installed the printing component Or the version you installed is not the latest version, please download and install or upgrade, also please check the related service is started, finally please close and reopen the browser.", |
|||
callback: res => { |
|||
if (res === 'confirm') { |
|||
loadLodop(); |
|||
} |
|||
} |
|||
}); |
|||
return LODOP; |
|||
} |
|||
|
|||
if (LODOP.VERSION < "6.2.2.6") { |
|||
MessageBox({ |
|||
title: 'Information', |
|||
type: 'warning', |
|||
showCancelButton: true, |
|||
confirmButtonText: 'Download', |
|||
cancelButtonText: 'Cancel', |
|||
zIndex: 3000, |
|||
message: "You haven't installed the printing component Or the version you installed is not the latest version, please download and install or upgrade, also please check the related service is started, finally please close and reopen the browser.", |
|||
callback: res => { |
|||
if (res === 'confirm') { |
|||
loadLodop(); |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
|
|||
//===如下空白位置适合调用统一功能(如注册语句、语言选择等):=======================
|
|||
|
|||
//===============================================================================
|
|||
return LODOP; |
|||
} catch (err) { |
|||
MessageBox({ |
|||
title: 'Information', |
|||
type: 'warning', |
|||
showCancelButton: true, |
|||
confirmButtonText: 'Download', |
|||
cancelButtonText: 'Cancel', |
|||
zIndex: 3000, |
|||
message: "You haven't installed the printing component Or the version you installed is not the latest version, please download and install or upgrade, also please check the related service is started, finally please close and reopen the browser.", |
|||
callback: res => { |
|||
if (res === 'confirm') { |
|||
loadLodop(); |
|||
} |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
|
|||
export default getLodop |
|||
@ -0,0 +1,84 @@ |
|||
import { MessageBox } from 'element-ui' |
|||
import {getPrinterUrl} from '../api/label/printer' |
|||
|
|||
// ====页面动态加载C-Lodop云打印必须的文件CLodopfuncs.js====
|
|||
|
|||
var head = document.head || document.getElementsByTagName('head')[0] || document.documentElement |
|||
|
|||
var oscript = document.createElement('script') |
|||
|
|||
// 让本机的浏览器打印(更优先一点):
|
|||
|
|||
oscript = document.createElement('script') |
|||
|
|||
oscript.src = 'http://localhost:8000/CLodopfuncs.js?priority=2' |
|||
|
|||
head.insertBefore(oscript, head.firstChild) |
|||
|
|||
// 加载双端口(8000和18000)避免其中某个端口被占用:
|
|||
|
|||
oscript = document.createElement('script') |
|||
|
|||
oscript.src = 'http://localhost:18000/CLodopfuncs.js?priority=1' |
|||
|
|||
head.insertBefore(oscript, head.firstChild) |
|||
|
|||
// 下载loadLodop
|
|||
|
|||
function loadLodop() { |
|||
|
|||
window.open( window.SITE_CONFIG['baseUrl']+'/printer/download') |
|||
|
|||
} |
|||
|
|||
// ====获取LODOP对象的主过程:====
|
|||
|
|||
function getLodop() { |
|||
|
|||
var LODOP |
|||
|
|||
try { |
|||
|
|||
LODOP = getCLodop() |
|||
|
|||
if (!LODOP && document.readyState !== 'complete') { |
|||
|
|||
MessageBox.alert('C-Lodop print control is not ready, please try again later!') |
|||
|
|||
return |
|||
|
|||
} |
|||
|
|||
return LODOP |
|||
|
|||
} catch (err) { |
|||
|
|||
MessageBox({ |
|||
|
|||
title: 'Information', |
|||
|
|||
type: 'warning', |
|||
|
|||
confirmButtonText: 'Confirm', |
|||
cancelButtonText: 'Cancel', |
|||
zIndex: 3000, |
|||
|
|||
message: 'You haven’t install the printing component, you can follow the steps in Manual to complete the installation, then close and reopen the window again, it should be fixed', |
|||
|
|||
callback: res => { |
|||
|
|||
if (res === 'confirm') { |
|||
|
|||
loadLodop() |
|||
|
|||
} |
|||
|
|||
} |
|||
|
|||
}) |
|||
|
|||
} |
|||
|
|||
} |
|||
|
|||
export default getLodop |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue