Fala pessoal, seguinte, tenho uma aplicação WEB rodando em rede local utilizando Node.JS, JavaScript e Bootstrap, preciso criar uma página simples na qual o usuário irá acessar esta página por um dispositivo móvel, esta página será composta por:
- Um campo do tipo lista onde deverá aparecer todas as impressoras disponíveis na rede
- Um imput Text para que o usuário digite um texto qualquer
- Um botão “imprimir”
Operação:
O usuário irá selecionar a impressora desejada e digitar o texto no campo, ao clicar em imprimir, a página deverá enviar esta impressão para a impressora selecionada.
Notas:
A impressora é do tipo portátil ligada na mesma rede wifi do dispositivo móvel.
A impressora é da Zebra (etiqueta contínua), desta forma o código deve ser em ZPL
Fiz algumas pesquisas e até consegui realizar a impressão, mas gostaria de conhecer outros códigos mais completos com seleção de impressora na rede, mensagens de retorno, tamanho de impressão dinâmica.
Por favor, podem compartilhar códigos ou projetos que posam me ajudar.
Código ZPL:
^XA^
LL1000
^FS^CF0,90
^FS^FO210,100^FDAQUI VEM O TEXTO
^FS^FO90,250^GB1000,3,3
^FS^BY5,2,150^FO120,300^BC^FDAQUI VEM TEXTO
^XZ
Abaixo o que fiz até o momento:
Neste primeiro código utilizei o:
browser-print: Browser Print Request Form
No arquivo Header da página onde contem as importações faço a importação deste plugin browser-print
<!-- browser-print: https://www.zebra.com/us/en/forms/browser-print-request-pc.html -->
<script src="plugins/zebra-browser-print-js-v30216/BrowserPrint-3.0.216.min.js"></script>
<script src="plugins/zebra-browser-print-js-v30216/BrowserPrint-Zebra-1.0.216.min.js"></script>
<script src="plugins/zebra-browser-print-js-v30216/DevDemo.js"></script>
E na minha página front-end tenho o seguinte trecho
<!-- Impressão ZPL -->
<script>
$(document).ready(setup_web_print);
</script>
<div class="container" style="width:500px">
<div id="main">
<div id="printer_select">
Zebra Printer Options<br />
Printer: <select id="printers"></select>
</div> <!-- /printer_select -->
<div id="print_form">
Enter Name: <input type="text" id="entered_name" />
<br /><br />
<button type="button" class="btn btn-lg btn-primary" onclick="sendData();" value="Print">Print Label</button>
</div> <!-- /print_form -->
</div> <!-- /main -->
</div><!-- /container -->
E este é o arquivo js que possui todas as funções chamada pelo botão imprimir:
var available_printers = null;
var selected_category = null;
var default_printer = null;
var selected_printer = null;
var format_start = "^XA^LL1000^FS^CF0,90^FS^FO210,100^FD";
var format_middle ="^FS^FO50,250^GB700,3,3^FS^BY5,2,150^FO120,300^BC^FD";
var format_end = "^XZ";
var default_mode = true;
function setup_web_print() {
$('#printer_select').on('change', onPrinterSelected);
showLoading("Loading Printer Information...");
default_mode = true;
selected_printer = null;
available_printers = null;
selected_category = null;
default_printer = null;
BrowserPrint.getDefaultDevice('printer', function(printer) {
default_printer = printer
if ((printer != null) && (printer.connection != undefined)) {
selected_printer = printer;
var printer_details = $('#printer_details');
var selected_printer_div = $('#selected_printer');
selected_printer_div.text("Using Default Printer: " + printer.name);
hideLoading();
printer_details.show();
$('#print_form').show();
}
BrowserPrint.getLocalDevices(function(printers) {
available_printers = printers;
var sel = document.getElementById("printers");
var printers_available = false;
sel.innerHTML = "";
if (printers != undefined) {
for (var i = 0; i < printers.length; i++) {
if (printers[i].connection == 'usb') {
var opt = document.createElement("option");
opt.innerHTML = printers[i].connection + ": " + printers[i].uid;
opt.value = printers[i].uid;
sel.appendChild(opt);
printers_available = true;
}
}
}
if (!printers_available) {
showErrorMessage("No Zebra Printers could be found!");
hideLoading();
$('#print_form').hide();
return;
} else if (selected_printer == null) {
default_mode = false;
changePrinter();
$('#print_form').show();
hideLoading();
}
}, undefined, 'printer');
},
function(error_response) {
showBrowserPrintNotFound();
});
};
function showBrowserPrintNotFound() {
showErrorMessage("An error occured while attempting to connect to your Zebra Printer. You may not have Zebra Browser Print installed, or it may not be running. Install Zebra Browser Print, or start the Zebra Browser Print Service, and try again.");
};
function sendData() {
showLoading("Printing...");
checkPrinterStatus(function(text) {
if (text == "Ready to Print") {
//selected_printer.send(format_start + $('#entered_name').val() + format_end, printComplete, printerError);
selected_printer.send(format_start + $('#entered_name').val() + format_middle + $('#entered_name').val() + format_end, printComplete, printerError);
} else {
printerError(text);
}
});
};
function checkPrinterStatus(finishedFunction) {
selected_printer.sendThenRead("~HQES",
function(text) {
var that = this;
var statuses = new Array();
var ok = false;
var is_error = text.charAt(70);
var media = text.charAt(88);
var head = text.charAt(87);
var pause = text.charAt(84);
// check each flag that prevents printing
if (is_error == '0') {
ok = true;
statuses.push("Ready to Print");
}
if (media == '1')
statuses.push("Paper out");
if (media == '2')
statuses.push("Ribbon Out");
if (media == '4')
statuses.push("Media Door Open");
if (media == '8')
statuses.push("Cutter Fault");
if (head == '1')
statuses.push("Printhead Overheating");
if (head == '2')
statuses.push("Motor Overheating");
if (head == '4')
statuses.push("Printhead Fault");
if (head == '8')
statuses.push("Incorrect Printhead");
if (pause == '1')
statuses.push("Printer Paused");
if ((!ok) && (statuses.Count == 0))
statuses.push("Error: Unknown Error");
finishedFunction(statuses.join());
}, printerError);
};
function hidePrintForm() {
$('#print_form').hide();
};
function showPrintForm() {
$('#print_form').show();
};
function showLoading(text) {
$('#loading_message').text(text);
$('#printer_data_loading').show();
hidePrintForm();
$('#printer_details').hide();
$('#printer_select').hide();
};
function printComplete() {
hideLoading();
}
function hideLoading() {
$('#printer_data_loading').hide();
if (default_mode == true) {
showPrintForm();
$('#printer_details').show();
} else {
$('#printer_select').show();
showPrintForm();
}
};
function changePrinter() {
default_mode = false;
selected_printer = null;
$('#printer_details').hide();
if (available_printers == null) {
showLoading("Finding Printers...");
$('#print_form').hide();
setTimeout(changePrinter, 200);
return;
}
$('#printer_select').show();
onPrinterSelected();
}
function onPrinterSelected() {
selected_printer = available_printers[$('#printers')[0].selectedIndex];
}
function showErrorMessage(text) {
$('#main').hide();
$('#error_div').show();
$('#error_message').html(text);
}
function printerError(text) {
showErrorMessage("An error occurred while printing. Please try again." + text);
}
function trySetupAgain() {
$('#main').show();
$('#error_div').hide();
setup_web_print();
//hideLoading();
}