diff --git a/other-module/canteen-device/clean-veg-packaging-labeler/label-preview.html b/other-module/canteen-device/clean-veg-packaging-labeler/label-preview.html
index cf2d383..1cabfa1 100644
--- a/other-module/canteen-device/clean-veg-packaging-labeler/label-preview.html
+++ b/other-module/canteen-device/clean-veg-packaging-labeler/label-preview.html
@@ -35,7 +35,7 @@
/* Tab 切换栏 */
.tab-bar { display: flex; gap: 0; padding: 12px 20px 0; flex-shrink: 0; }
- .tab-btn { padding: 8px 20px; border: 1px solid rgba(255,255,255,0.08); background: transparent; color: rgba(255,255,255,0.5); font-size: 13px; font-weight: 500; cursor: pointer; transition: all 0.2s; font-family: inherit; border-radius: 8px 8px 0 0; border-bottom: none; }
+ .tab-btn { padding: 8px 12px; border: 1px solid rgba(255,255,255,0.08); background: transparent; color: rgba(255,255,255,0.5); font-size: 13px; font-weight: 500; cursor: pointer; transition: all 0.2s; font-family: inherit; border-radius: 8px 8px 0 0; border-bottom: none; }
.tab-btn:hover { color: rgba(255,255,255,0.8); background: rgba(255,255,255,0.03); }
.tab-btn.active { color: #fff; border-color: rgba(255,255,255,0.12); }
.tab-btn--blue.active { background: #1a2b4a; }
@@ -107,6 +107,14 @@
}
.label-sticker__qrcode svg { display: block; width: 100%; height: 100%; }
+ /* ====== 小标签 — 半长热敏纸(宽度为大标签一半,字段精简逐行排布) ====== */
+ .label-sticker--small { width: 200px; min-height: 0; }
+ .label-sticker--small .label-sticker__body { padding: 5px 8px; gap: 1px; }
+ .label-sticker--small .label-info { font-size: 9px; }
+ .label-sticker--small .label-sticker__qrcode { width: 48px; height: 48px; }
+ /* 小标签字段单列堆叠 */
+ .label-info--col { flex-direction: column; gap: 1px; }
+
/* 打印按钮 */
.action-bar { display: flex; gap: 10px; justify-content: center; flex-shrink: 0; padding: 0 20px 16px; }
.print-btn {
@@ -150,10 +158,16 @@
订单标签
+
+
@@ -161,10 +175,14 @@
@@ -336,9 +354,9 @@
panel.innerHTML = html;
}
- /* 生成二维码占位 SVG(9×9 网格 + 三角落定位图案) */
- function qrSvg(code) {
- var size = 56, cells = 9, cw = size / cells;
+ /* 生成二维码占位 SVG(9×9 网格 + 三角落定位图案),px 指定边长,默认 56 */
+ function qrSvg(code, px) {
+ var size = px || 56, cells = 9, cw = size / cells;
var hash = 0, i;
for (i = 0; i < code.length; i++) { hash = ((hash << 5) - hash) + code.charCodeAt(i); hash |= 0; }
var rects = '';
@@ -357,10 +375,10 @@
}
}
}
- return '';
+ return '';
}
- /* ---- 渲染净菜包标签 ---- */
+ /* ---- 渲染净菜包标签-大 ---- */
function renderVegLabels() {
var panel = document.getElementById('panelVeg');
var html = '';
@@ -398,7 +416,7 @@
panel.innerHTML = html;
}
- /* ---- 渲染餐品净菜包标签 ---- */
+ /* ---- 渲染餐品净菜包标签-大 ---- */
function renderMealLabels() {
var panel = document.getElementById('panelMeal');
var html = '';
@@ -434,39 +452,81 @@
panel.innerHTML = html;
}
+ /* ---- 小标签共用模板:半长热敏纸,字段为 订单号/名称/包装规格/包装日期/保质期,二维码居右 ---- */
+ function smallLabelHtml(nameLabel, name, specObj, shelfLife, code) {
+ return ''
+ + ''
+ + '
'
+ + '
'
+ + '
订单号:' + mockData.orderNo + '
'
+ + '
' + nameLabel + ':' + name + '
'
+ + '
包装规格:' + formatSpec(specObj) + '
'
+ + '
包装日期:' + mockData.packDate + '
'
+ + '
保质期:' + shelfLife + '
'
+ + '
'
+ + '
'
+ + qrSvg(code, 48)
+ + '
';
+ }
+
+ /* ---- 渲染净菜包标签-小 ---- */
+ function renderVegSmallLabels() {
+ var panel = document.getElementById('panelVegSmall');
+ var html = '';
+ mockData.vegPacks.forEach(function(v) {
+ var specObj = typeof v.packSpec === 'object' ? v.packSpec : parseLegacyPackSpec(v.packSpec);
+ for (var p = 0; p < v.packSize; p++) {
+ var code = mockData.orderNo + '-V' + v.name.charAt(0) + (p + 1);
+ html += smallLabelHtml('净菜名称', v.name, specObj, v.shelfLife, code);
+ }
+ });
+ panel.innerHTML = html;
+ }
+
+ /* ---- 渲染餐品净菜包标签-小 ---- */
+ function renderMealSmallLabels() {
+ var panel = document.getElementById('panelMealSmall');
+ var html = '';
+ mockData.mealPacks.forEach(function(m) {
+ var specObj = typeof m.packSpec === 'object' ? m.packSpec : parseLegacyPackSpec(m.packSpec);
+ for (var p = 0; p < m.packSize; p++) {
+ var code = mockData.orderNo + '-M' + (p + 1);
+ html += smallLabelHtml('餐品名称', m.name, specObj, m.shelfLife, code);
+ }
+ });
+ panel.innerHTML = html;
+ }
+
/* ---- Tab 切换 ---- */
var currentTab = 'order';
+ var TAB_PANELS = { 'order': 'panelOrder', 'veg': 'panelVeg', 'veg-s': 'panelVegSmall', 'meal': 'panelMeal', 'meal-s': 'panelMealSmall' };
function switchTab(tab) {
currentTab = tab;
document.querySelectorAll('.tab-btn').forEach(function(b) { b.classList.remove('active'); });
document.querySelector('.tab-btn[data-tab="' + tab + '"]').classList.add('active');
document.querySelectorAll('.label-panel').forEach(function(p) { p.classList.remove('active'); });
- if (tab === 'order') {
- document.getElementById('panelOrder').classList.add('active');
- } else if (tab === 'veg') {
- document.getElementById('panelVeg').classList.add('active');
- } else if (tab === 'meal') {
- document.getElementById('panelMeal').classList.add('active');
- }
- /* 更新打印按钮颜色 */
+ document.getElementById(TAB_PANELS[tab]).classList.add('active');
+ /* 更新打印按钮颜色:订单蓝 / 净菜绿 / 餐品橙 */
var btn = document.getElementById('printBtn');
btn.className = 'print-btn';
if (tab === 'order') btn.classList.add('print-btn--blue');
- else if (tab === 'veg') btn.classList.add('print-btn--green');
- else if (tab === 'meal') btn.classList.add('print-btn--orange');
+ else if (tab === 'veg' || tab === 'veg-s') btn.classList.add('print-btn--green');
+ else btn.classList.add('print-btn--orange');
}
/* ---- 打印当前标签:按 packSize 计数 ---- */
function handlePrintCurrent() {
var labels = [];
if (currentTab === 'order') labels.push('订单标签');
- else if (currentTab === 'veg') {
+ else if (currentTab === 'veg' || currentTab === 'veg-s') {
+ var vegTag = currentTab === 'veg' ? '净菜包标签-大' : '净菜包标签-小';
mockData.vegPacks.forEach(function(v) {
- for (var p = 0; p < v.packSize; p++) { labels.push('净菜包标签 — ' + v.name); }
+ for (var p = 0; p < v.packSize; p++) { labels.push(vegTag + ' — ' + v.name); }
});
- } else if (currentTab === 'meal') {
+ } else {
+ var mealTag = currentTab === 'meal' ? '餐品净菜包标签-大' : '餐品净菜包标签-小';
mockData.mealPacks.forEach(function(m) {
- for (var p = 0; p < m.packSize; p++) { labels.push('餐品净菜包标签 — ' + m.name); }
+ for (var p = 0; p < m.packSize; p++) { labels.push(mealTag + ' — ' + m.name); }
});
}
showToast('已发送打印指令:' + labels.length + ' 张标签', 2000, 'success');
@@ -513,7 +573,9 @@
/* ---- 初始化 ---- */
renderOrderLabels();
renderVegLabels();
+ renderVegSmallLabels();
renderMealLabels();
+ renderMealSmallLabels();