// ==UserScript==
// @name MEST QRCode
// @namespace joyings.com.cn
// @version 0.2.5
// @description 美尔斯通二维码
// @author zmz125000
// @match http://*/mest/*
// @icon http://www.google.com/s2/favicons?domain=openwrt.org
// @grant none
// @require https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js
// @require https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.js
// @license MIT
// ==/UserScript==
(function () {
'use strict';
// Your code here...
addPrintButtons();
function sleep(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
}
// 添加按钮
async function addPrintButtons() {
if (!$('input[placeholder="输入关键字进行过滤"]')[0]) {
await sleep(500);
addPrintButtons();
return;
} else if (!$('button:contains("打印")')[0]) {
let btnRow = $('button:contains("导出")')[0].parentElement;
var btn = document.createElement('button');
btn.setAttribute('id', 'printTableBtn');
btn.setAttribute('type', 'button');
btn.onclick = makeQRCode;
btn.appendChild(document.createTextNode('生成二维码并打印'));
var btn2 = document.createElement('button');
btn2.setAttribute('id', 'printTableBtn');
btn2.setAttribute('type', 'button');
btn2.onclick = formatAndPrint;
btn2.appendChild(document.createTextNode('直接打印'));
var btn3 = document.createElement('button');
btn3.setAttribute('type', 'button');
btn3.onclick = generateAndPrint;
btn3.appendChild(document.createTextNode('打印生产单'));
btnRow.appendChild(btn);
btnRow.appendChild(btn2);
btnRow.appendChild(btn3);
}
await sleep(500);
addPrintButtons();
}
async function makeQRCode() {
let bodyRows = document.querySelectorAll('[class="cell el-tooltip"]')[0].closest('table').lastChild.rows;
const qrIndex = $('th:contains("二维码")')[0].cellIndex;
if (!qrIndex) {
return;
}
let qrCell = null;
for (let row of bodyRows) {
qrCell = row.cells.item(qrIndex);
let qrDiv = $('#qrBoxDiv', qrCell)[0];
if (qrDiv) {
qrCell.removeChild(qrDiv);
}
qrDiv = document.createElement('div');
qrDiv.setAttribute('id', 'qrBoxDiv');
qrCell.appendChild(qrDiv);
let str = $('div', row.cells.item(qrIndex))[0].textContent;
new QRCode(qrDiv, {
text: str,
width: 96,
height: 96
});
}
while ($('img', qrCell)[0].getAttribute('style') == "display: none;") {
await sleep(100);
}
formatAndPrint();
}
async function formatAndPrint() {
var header = $('thead')[0].firstChild;
var body = document.querySelectorAll('[class="cell el-tooltip"]')[0].closest('tbody').cloneNode(true);
var bodyRows = body.rows;
// cleanup table elements
var tbl = document.createElement('table');
for (let row of bodyRows) {
// tr
row.removeAttribute('class');
for (let cell of row.cells) {
// td
cell.removeAttribute('class');
cell.removeAttribute('rowspan');
cell.removeAttribute('colspan');
// td-div
cell.firstChild.removeAttribute('class');
cell.firstChild.removeAttribute('style');
}
}
var printContents = body.innerHTML;
var pageTemplate = '<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/paper-css/0.3.0/paper.css">\n<style>@page { size: A4 }</style>\n<body class="A5">\n<section class="sheet padding-10mm">\n';
// add contents here
pageTemplate += "<table>" + printContents + "</table>";
pageTemplate += '\n</section>\n</body>';
var w = window.open();
w.document.write(pageTemplate);
await sleep(500);
w.print();
// w.close();
}
async function generateAndPrint() {
const orderNoIndex = $('th:contains("订单号")')[0].cellIndex;
const customerIndex = $('th:contains("客户名")')[0].cellIndex;
const billDateIndex = $('th:contains("单据日期")')[0].cellIndex;
const billDeliveryIndex = $('th:contains("发货日期")')[0].cellIndex;
const productCodeIndex = $('th:contains("产品编码")')[0].cellIndex;
const productNameIndex = $('th:contains("产品名")')[0].cellIndex;
const productAliasIndex = $('th:contains("产品别名")')[0].cellIndex;
const productSpecsIndex = $('th:contains("产品规格")')[0].cellIndex;
const scdIndex = $('th:contains("生产单号")')[0].cellIndex;
const orderQuantityIndex = $('th:contains("下单数")')[0].cellIndex;
const processIndex = $('th:contains("工序名")')[0].cellIndex;
const semiIndex = $('th:contains("工件名")')[0].cellIndex;
const plannedQuantityIndex = $('th:contains("加工数")')[0].cellIndex;
var htmlContent = `${htmlTemplate}`;
var map = new Map();
var trCells = $('tr')[1].cells;
map.set('customerName', trCells.item(customerIndex));
map.set('orderNo', trCells.item(orderNoIndex));
map.set('productCode', trCells.item(productCodeIndex));
map.set('productName', trCells.item(productNameIndex));
map.set('productAlias', trCells.item(productAliasIndex));
map.set('productSpecs', trCells.item(productSpecsIndex));
map.set('SCD', trCells.item(scdIndex));
map.set('orderQuantity', trCells.item(orderQuantityIndex));
map.set('plannedQuantity', trCells.item(plannedQuantityIndex));
map.set('orderDate', trCells.item(billDateIndex));
map.set('deliveryDate', trCells.item(billDeliveryIndex));
for (let item of map) {
$('#' + item[0], htmlContent)[0].textContent = $('div', item[1])[0].textContent;
}
new QRCode($('#SCDQR', htmlContent)[0], {
text: map.get('SCD'),
width: 96,
height: 96
});
var w = window.open();
w.document.write(htmlTemplate);
// 填信息
for (let item of map) {
$('#' + item[0], w.document)[0].textContent = $('div', item[1])[0].textContent;
}
new QRCode($('#SCDQR', w.document)[0], {
text: map.get('SCD'),
width: 128,
height: 128
});
// 填工序卡表体
var bodyRows = $('tbody')[0].rows;
var processTable = $('#procedureTable', w.document)[0]
var wIndex = 2;
for (let row of bodyRows) {
let process = $('div', row.cells.item(processIndex))[0].textContent;
let semi = $('div', row.cells.item(semiIndex))[0].textContent;
let plannedQuantity = $('div', row.cells.item(plannedQuantityIndex))[0].textContent;
let tr = processTable.insertRow(wIndex++);
tr.insertCell(0).innerHTML = row.rowIndex + 1;
tr.insertCell(1).innerHTML = process;
tr.insertCell(2).innerHTML = semi;
tr.insertCell(3).innerHTML = plannedQuantity;
tr.insertCell(4).innerHTML = '';
tr.insertCell(5).innerHTML = '';
let qrCell = tr.insertCell(6);
var qrDiv = document.createElement('div');
new QRCode(qrDiv, {
text: process,
width: 64,
height: 64
});
qrCell.appendChild(qrDiv);
}
await sleep(500);
w.print();
return htmlContent;
}
var htmlTemplate = '<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/paper-css/0.3.0/paper.css">' +
'' +
'<body class="A4" style="height: auto;">' +
' <section class="sheet padding-10mm" style="height: auto;">' +
' <p align=center style="margin-top: -5px;"><span class=title lang=ZH-CN>车间生产任务单</span></p>' +
' <div align=center>' +
' <div id="leftbox">' +
' <p align=left><span>客户名: </span><span id="customerName"></span></p>' +
' <p align=left><span>订单号: </span><span id="orderNo"></span></p>' +
' <p align=left><span>产品编码: </span><span id="productCode"></span></p>' +
' <p align=left><span>产品名: </span><span id="productName"></span></p>' +
' <p align=left><span>产品别名: </span><span id="productAlias"></span></p>' +
' <p align=left><span>产品规格: </span><span id="productSpecs"></span></p>' +
' <p align=left><span>生产单号: </span><span id="SCD"></span></p>' +
' <p align=left><span>客户下单数: </span><span id="orderQuantity"></span></p>' +
' <p align=left><span>计划生产数: </span><span id="plannedQuantity"></span></p>' +
' <p align=left><span>订单日期: </span><span id="orderDate"></span></p>' +
' <p align=left><span>交货日期: </span><span id="deliveryDate"></span></p>' +
' </div>' +
'' +
' <div id="rightbox">' +
' <table id="materialTable">' +
' <tr>' +
' <th>工序</th>' +
' <th>物料编号</th>' +
' <th>物料名称</th>' +
' <th>物料规格</th>' +
' <th>用量</th>' +
' <th>单位</th>' +
' </tr>' +
' </table>' +
' <div style="margin-top: 10px;" id="SCDQR"></div>' +
' </div>' +
' </div>' +
' <div style="clear: both;"></div>' +
' <div align=center>' +
' <table id="procedureTable">' +
' <thead>' +
' <tr>' +
' <th colspan="7"><span style="font-size: medium;">产品名: </span> <span' +
' id="ProductNameCell"></span> ' +
' </th>' +
' </thead>' +
' <tfoot>' +
' <tr>' +
' <th colspan="7"><span style="font-size: medium;">车间生产单号: </span><span id="SCDCell"></span> ' +
' </th>' +
' </tr>' +
' </tfoot>' +
' </tr>' +
' <tr>' +
' <th>#</th>' +
' <th>工序</th>' +
' <th style="max-width: 100mm;">工序内容</th>' +
' <th>加工数</th>' +
' <th style="min-width: 15mm;">开工</th>' +
' <th style="min-width: 15mm;">完工</th>' +
' <th>二维码</th>' +
' </tr>' +
' </table>' +
' </div>' +
' </section>' +
'</body>' +
'<style>' +
' @page {' +
' size: A4' +
' }' +
'' +
' #leftbox {' +
' float: left;' +
' margin-top: 20px;' +
' margin-bottom: 40px;' +
' width: 50%;' +
' }' +
'' +
' #rightbox {' +
' float: right;' +
' margin-top: 30px;' +
' width: 50%;' +
' }' +
'' +
' .title {' +
' text-align: center;' +
' font-size: large;' +
' }' +
'' +
' p {' +
' margin-bottom: -10px;' +
' font-size: 90%;' +
' }' +
'' +
' table,' +
' th,' +
' td {' +
' border: 1px solid black;' +
' word-wrap: break-word;' +
' }' +
'' +
' table {' +
' page-break-inside: auto' +
' }' +
'' +
' thead {' +
' display: table-header-group' +
' }' +
'' +
' tfoot {' +
' display: table-footer-group' +
' }' +
'' +
' tr,' +
' td,' +
' th {' +
' page-break-inside: avoid;' +
' page-break-after: auto' +
' }' +
'' +
' td {' +
' font-size: smaller;' +
' }' +
'</style>';
})();