77 lines
3.5 KiB
JavaScript
77 lines
3.5 KiB
JavaScript
class PrintJobForRawCommands extends React.Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = {
|
|
printerCommands: ""
|
|
};
|
|
}
|
|
|
|
|
|
|
|
setPrinterCommands(cmds) {
|
|
//console.log(cmds);
|
|
//no need to re-render
|
|
this.state.printerCommands = cmds;
|
|
this.props.onPrinterCommandsChange(this.state.printerCommands);
|
|
}
|
|
|
|
setPredefinedCommands(cmdId){
|
|
let cmds = '';
|
|
if(cmdId == 'zpl')
|
|
cmds = '^XA^FO30,40^ADN,36,20^FDZPL Printed from JSPrintManager^FS^FO30,60^BY4^B3N,,200^FD12345678^FS^XZ';
|
|
else if(cmdId == 'epl')
|
|
cmds = '\x0AN\x0AQ609,24\x0Aq784\x0AA170,5,0,1,5,5,N,"EPL Printed from JSPrintManager"\x0AB170,50,0,3C,2,6,120,B,"BCP-1234"\x0AP1\x0A';
|
|
else if(cmdId == 'escpos')
|
|
cmds = '\x1b@\x1bE\x01ESC POS Printed from JSPrintManager\x1bd\x01\x1dk\x04987654321\x00\x1bd\x01987654321\x1dV\x41\x03';
|
|
else if(cmdId == 'ipl')
|
|
cmds = '<STX><ESC>C<ETX><STX><ESC>P<ETX><STX>E4;F4<ETX><STX>H0;o200,100;f0;c25;h20;w20;d0,30<ETX><STX>L1;o200,150;f0;l575;w5<ETX><STX>B2;o200,200;c0,0;h100;w2;i1;d0,10<ETX><STX>I2;h1;w1;c20<ETX><STX>R<ETX><STX><ESC>E4<ETX><STX><CAN><ETX><STX>IPL Printed from JSPrintManager<CR><ETX><STX>SAMPLE<ETX><STX><ETB><ETX>';
|
|
else if(cmdId == 'dpl')
|
|
cmds = '\x02L\x0dH07\x0dD11\x0d191100801000025DPL Printed from JSPrintManager\x0d1a6210000000050590PCS\x0dE\x0d';
|
|
|
|
|
|
|
|
|
|
document.getElementById("cmds-" + this.props.jobIndex).value = cmds;
|
|
this.setPrinterCommands(cmds);
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<div className="col-md-12">
|
|
<hr />
|
|
<strong>Enter the raw printer commands</strong>
|
|
<div className="alert alert-warning">
|
|
<small>
|
|
Enter the printer's commands you want to send and is supported
|
|
by the specified printer (e.g. ESC/POS, ZPL, EPL, etc).
|
|
<br />
|
|
For non-printable characters, use the JS hex notation (e.g.
|
|
\x0D for carriage return, \x1B for ESC)
|
|
<br />
|
|
<strong>Refer to your target printer programming manual to know how to write the raw commands!</strong>
|
|
</small>
|
|
</div>
|
|
<div>
|
|
<small>Predefined Samples for most known RAW Printer Commands</small>
|
|
<br />
|
|
<button type="button" className="btn btn-light btn-sm" onClick={e => this.setPredefinedCommands('zpl')}><i className="fa fa-arrow-circle-down"></i> Zebra ZPL</button>
|
|
|
|
<button type="button" className="btn btn-light btn-sm" onClick={e => this.setPredefinedCommands('epl')}><i className="fa fa-arrow-circle-down"></i> Zebra EPL</button>
|
|
|
|
<button type="button" className="btn btn-light btn-sm" onClick={e => this.setPredefinedCommands('escpos')}><i className="fa fa-arrow-circle-down"></i> EPSON ESC/POS</button>
|
|
|
|
<button type="button" className="btn btn-light btn-sm" onClick={e => this.setPredefinedCommands('ipl')}><i className="fa fa-arrow-circle-down"></i> Intermec IPL</button>
|
|
|
|
<button type="button" className="btn btn-light btn-sm" onClick={e => this.setPredefinedCommands('dpl')}><i className="fa fa-arrow-circle-down"></i> Datamax DPL</button>
|
|
</div>
|
|
<textarea
|
|
id={"cmds-" + this.props.jobIndex}
|
|
className="form-control form-control-sm"
|
|
onChange={e => this.setPrinterCommands(e.target.value)}
|
|
/>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
window.PrintJobForRawCommands = PrintJobForRawCommands; |