diff --git a/app/modules/malaysia/templates/malaysia/rack_view.html b/app/modules/malaysia/templates/malaysia/rack_view.html index 0c513f8..e03d921 100644 --- a/app/modules/malaysia/templates/malaysia/rack_view.html +++ b/app/modules/malaysia/templates/malaysia/rack_view.html @@ -42,26 +42,23 @@ } .rvp-toolbar .rvp-title { margin-right:auto; color:#fff; font-weight:700; font-size:16px; } .rvp-pages { display:flex; flex-direction:column; gap:18px; align-items:center; } - /* 화면 미리보기: A4 가로 비율(297:210) 시트 */ + /* 화면 미리보기: A4 가로 비율(297:210) 시트 — 여백 최소, 글자 최대 */ .rvp-sheet { background:#fff; width:min(100%, 1000px); aspect-ratio:297/210; box-shadow:0 8px 24px rgba(0,0,0,.3); border-radius:4px; - display:flex; flex-direction:column; padding:4% 5%; box-sizing:border-box; + display:flex; flex-direction:column; padding:1.5%; box-sizing:border-box; } - .rvp-cell-code { - font-weight:900; line-height:1; letter-spacing:.5px; - font-size:9vmin; color:#0f172a; border-bottom:4px solid #0f172a; - padding-bottom:2%; margin-bottom:3%; text-align:center; - } - .rvp-list { flex:1 1 auto; display:flex; flex-direction:column; justify-content:center; gap:3%; } - .rvp-line { text-align:center; } - .rvp-line .rvp-name { display:block; font-weight:900; font-size:6.5vmin; color:#0f172a; line-height:1.1; } - .rvp-line .rvp-calc { display:block; font-weight:800; font-size:5vmin; color:#1e293b; margin-top:1%; } - .rvp-empty { text-align:center; font-weight:900; font-size:7vmin; color:#94a3b8; margin:auto 0; } + .rvp-list { flex:1 1 auto; display:flex; flex-direction:column; justify-content:center; gap:4%; } + .rvp-line { display:flex; flex-direction:column; align-items:center; text-align:center; gap:0.5%; } + .rvp-line .rvp-name { font-weight:900; font-size:7vmin; color:#0f172a; line-height:1.05; } + .rvp-line .rvp-size { font-weight:900; font-size:14vmin; color:#0f172a; line-height:1; } + .rvp-line .rvp-calc { font-weight:800; font-size:6vmin; color:#1e293b; margin-top:1.5%; } + .rvp-line .rvp-calc .rvp-box { font-size:9.5vmin; font-weight:900; } + .rvp-empty { text-align:center; font-weight:900; font-size:9vmin; color:#94a3b8; margin:auto 0; } /* ── 실제 인쇄 ── */ @media print { - @page { size: A4 landscape; margin: 8mm; } + @page { size: A4 landscape; margin: 4mm; } body * { visibility: hidden !important; } .rvp-overlay, .rvp-overlay * { visibility: visible !important; } .rvp-overlay { @@ -73,14 +70,15 @@ .rvp-sheet { width:100% !important; height:100vh !important; aspect-ratio:auto !important; box-shadow:none !important; border-radius:0 !important; page-break-after:always; - padding:0 !important; + padding:2mm !important; } .rvp-sheet:last-child { page-break-after:auto; } - /* 인쇄 시 글씨 더 크게(멀리서도 보이게) — cm/vh 기준 */ - .rvp-cell-code { font-size:3cm; border-bottom-width:6px; } - .rvp-line .rvp-name { font-size:2.4cm; } - .rvp-line .rvp-calc { font-size:1.6cm; } - .rvp-empty { font-size:2.5cm; } + /* 인쇄 시 글씨 더 크게(멀리서도 보이게) — cm 기준 */ + .rvp-line .rvp-name { font-size:2.6cm; } + .rvp-line .rvp-size { font-size:5.5cm; } + .rvp-line .rvp-calc { font-size:1.8cm; } + .rvp-line .rvp-calc .rvp-box { font-size:3cm; } + .rvp-empty { font-size:3cm; } } {% endblock %} @@ -156,5 +154,5 @@
- + {% endblock %} diff --git a/app/static/malaysia_rack_view.js b/app/static/malaysia_rack_view.js index 7f513b8..d9d3236 100644 --- a/app/static/malaysia_rack_view.js +++ b/app/static/malaysia_rack_view.js @@ -14,6 +14,12 @@ function t(ko, en) { return lang() === "en" ? en : ko; } function fmt(n) { return Number(n || 0).toLocaleString(); } function nameOf(e) { return (lang() === "en" ? e.en : e.ko) || e.sku; } + // 상품명 끝의 용량 토큰(숫자 포함, 예 750ml)을 분리 → {main, size} + function splitName(full) { + var m = String(full || "").match(/^(.*\S)\s+(\S*\d\S*)$/); + if (m) return { main: m[1], size: m[2] }; + return { main: full || "", size: "" }; + } function getEntries(cell) { try { return JSON.parse(cell.getAttribute("data-entries") || "[]"); } @@ -155,10 +161,6 @@ var arr = getEntries(cell); var sheet = document.createElement("div"); sheet.className = "rvp-sheet"; - var code = document.createElement("div"); - code.className = "rvp-cell-code"; - code.textContent = cell.getAttribute("data-cell"); - sheet.appendChild(code); var list = document.createElement("div"); list.className = "rvp-list"; if (!arr.length) { @@ -169,16 +171,24 @@ } else { arr.forEach(function (e) { var total = (Number(e.upb) || 0) * (Number(e.box) || 0); + var nm = splitName(nameOf(e)); var line = document.createElement("div"); line.className = "rvp-line"; - var nm = document.createElement("span"); - nm.className = "rvp-name"; - nm.textContent = nameOf(e); + var main = document.createElement("span"); + main.className = "rvp-name"; + main.textContent = nm.main; + line.appendChild(main); + if (nm.size) { + var size = document.createElement("span"); + size.className = "rvp-size"; + size.textContent = nm.size; + line.appendChild(size); + } var calc = document.createElement("span"); calc.className = "rvp-calc"; - calc.textContent = fmt(e.upb) + t("개", "ea") + " × " + fmt(e.box) - + t("박스", "box") + " = " + fmt(total); - line.appendChild(nm); + calc.innerHTML = fmt(e.upb) + t("개", "ea") + " × " + + "" + fmt(e.box) + t("박스", "box") + "" + + " = " + fmt(total); line.appendChild(calc); list.appendChild(line); });