king/dbx-main
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(cupang): 배분 완료 도장·완료 카드 흐리게, 박스명 배지 제거

Browse Source 
- ② 제품별 카드에서 "쿠팡박스" 배지 제거(모든 규칙이 같은 박스명이라 무의미)
- 배분이 끝난 제품 카드·혼합 박스에 파란 "배분 완료" 도장(살짝 기울어진
  테두리, 찍히는 애니메이션)
- 완료된 카드는 글자를 회색으로 낮추고, 혼합 박스는 상자 아이콘까지
  흑백 처리해 남은 카드와 한눈에 구분되게 함

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
king
2026-08-29 03:50:46 +09:00
parent c9a16d8cc4
commit 2779a6285d
9 changed files with 54 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/modules/cupang/templates/cupang/box_calc.html
+8 -3
View File
@@ -1,6 +1,6 @@
{% extends "erp_base.html" %}
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260829i" />{% endblock %}
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260829j" />{% endblock %}
{% block content %}
<section class="cpg">
@@ -303,6 +303,11 @@
"</svg>";
}
// 배분이 끝난 카드에 찍는 도장.
function stampHtml() {
return '<span class="cpg-stamp" aria-label="배분 완료">배분 완료</span>';
}
function kpi(label, value, hint) {
return '<div class="cpg-kpi"><span class="cpg-kpi-label">' + esc(label) + "</span>" +
'<strong class="cpg-kpi-value">' + esc(value) + "</strong>" +
@@ -347,7 +352,7 @@
' data-key="' + esc(key) + '">' +
'<div class="cpg-sum-prod-head">' +
'<span class="cpg-sum-prod-name">' + esc(r.product_name) + "</span>" +
'<span class="erp-badge erp-badge-neutral">' + esc(r.box_name) + "</span>" +
(remain ? "" : stampHtml()) +
"</div>" +
'<div class="cpg-sum-prod-nums">' +
"<strong>" + remain + "박스</strong>" +
@@ -380,7 +385,7 @@
'<div class="cpg-box-art">' + boxSvg(b.fill_percent, m.box_name) + "</div>" +
'<div class="cpg-box-info">' +
'<div class="cpg-box-title">' + esc(m.box_name) + " 혼합 #" + (i + 1) +
(remain ? "" : ' <span class="erp-badge erp-badge-success">배분됨</span>') + "</div>" +
(remain ? "" : stampHtml()) + "</div>" +
'<ul class="cpg-box-items">' + items + "</ul>" +
'<div class="cpg-box-bar"><span style="width:' + b.fill_percent + '%"></span></div>' +
'<div class="cpg-box-fillnum">' + b.fill_percent + "% 채움 · " + units[key] + "개</div>" +
app/modules/cupang/templates/cupang/box_rules.html
+1 -1
View File
@@ -1,6 +1,6 @@
{% extends "erp_base.html" %}
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260829i" />{% endblock %}
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260829j" />{% endblock %}
{% block content %}
<section class="cpg">
app/modules/cupang/templates/cupang/centers.html
+1 -1
View File
@@ -1,6 +1,6 @@
{% extends "erp_base.html" %}
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260829i" />{% endblock %}
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260829j" />{% endblock %}
{% block content %}
<section class="cpg">
app/modules/cupang/templates/cupang/detail.html
+1 -1
View File
@@ -1,6 +1,6 @@
{% extends "erp_base.html" %}
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260829i" />{% endblock %}
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260829j" />{% endblock %}
{% block content %}
<section class="cpg">
app/modules/cupang/templates/cupang/form.html
+1 -1
View File
@@ -1,6 +1,6 @@
{% extends "erp_base.html" %}
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260829i" />{% endblock %}
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260829j" />{% endblock %}
{% block content %}
<section class="cpg">
app/modules/cupang/templates/cupang/index.html
+1 -1
View File
@@ -1,6 +1,6 @@
{% extends "erp_base.html" %}
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260829i" />{% endblock %}
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260829j" />{% endblock %}
{% block content %}
<section class="cpg">
app/modules/cupang/templates/cupang/products.html
+1 -1
View File
@@ -1,6 +1,6 @@
{% extends "erp_base.html" %}
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260829i" />{% endblock %}
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260829j" />{% endblock %}
{% block content %}
<section class="cpg">
app/static/cupang.css
+37
View File
@@ -730,3 +730,40 @@ body.cpg-dragging { cursor: grabbing; user-select: none; }
.cpg-tree-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cpg-tree-qty { font-weight: 600; color: var(--color-rich-black); }
.cpg-tree-per { font-size: 11px; }
/* 배분 완료 도장 */
.cpg-stamp {
--stamp: #1d5fd0;
flex: 0 0 auto;
display: inline-block;
padding: 2px 8px;
border: 2px solid var(--stamp);
border-radius: 6px;
color: var(--stamp);
font-size: 11px;
font-weight: 800;
letter-spacing: 1px;
line-height: 1.4;
white-space: nowrap;
opacity: .85;
transform: rotate(-7deg);
box-shadow: inset 0 0 0 1px rgba(29, 95, 208, .25);
animation: cpg-stamp-in .22s ease-out;
}
@keyframes cpg-stamp-in {
from { opacity: 0; transform: rotate(-7deg) scale(1.6); }
to { opacity: .85; transform: rotate(-7deg) scale(1); }
}
/* 배분이 끝난 카드는 흐리게 — 글자·상자 아이콘 모두 */
.cpg-sum-prod.is-done, .cpg-box-card.is-done { opacity: 1; }
.cpg-sum-prod.is-done .cpg-sum-prod-name,
.cpg-sum-prod.is-done .cpg-sum-prod-nums,
.cpg-box-card.is-done .cpg-box-title,
.cpg-box-card.is-done .cpg-box-items,
.cpg-box-card.is-done .cpg-box-fillnum { color: var(--color-midtone-gray); opacity: .6; }
.cpg-sum-prod.is-done .cpg-sum-prod-nums strong,
.cpg-box-card.is-done .cpg-box-items b { color: var(--color-midtone-gray); }
.cpg-box-card.is-done .cpg-box-svg { filter: grayscale(1); opacity: .45; }
.cpg-box-card.is-done .cpg-box-bar { opacity: .4; }
.cpg-sum-prod.is-done .cpg-stamp, .cpg-box-card.is-done .cpg-stamp { opacity: .85; }
tests/js/box_calc_ui.test.js
+3
View File
@@ -122,6 +122,8 @@ function dragCardTo(card, target) {
check("전량 담기 후 잔여 0", text(".cpg-sum-prod .cpg-sum-prod-nums").startsWith("0박스0개"),
text(".cpg-sum-prod .cpg-sum-prod-nums"));
check("잔여 0 카드는 드래그 불가", $$(".cpg-sum-prod")[0].classList.contains("is-done"));
check("배분 완료 도장 표시", !!$$(".cpg-sum-prod")[0].querySelector(".cpg-stamp"));
check("제품 카드에 박스명 배지 없음", !$$(".cpg-sum-prod")[0].querySelector(".erp-badge"));
check("센터 합계 2박스/16개", text(".cpg-dist-sum").replace(/\s/g, "").startsWith("2박스16개"),
text(".cpg-dist-sum"));
@@ -143,6 +145,7 @@ function dragCardTo(card, target) {
$("#cpg-dlg-ok").click();
check("혼합 박스가 센터에 담긴다", $$(".cpg-dist-item").length === 2);
check("혼합 담은 뒤 배분됨 표시", $(".cpg-box-card").className.includes("is-done"));
check("혼합 박스에도 도장", !!$(".cpg-box-card .cpg-stamp"));
check("혼합 박스 아래 내용물 트리", $$(".cpg-dist-tree li").length === 2,
String($$(".cpg-dist-tree li").length));
check("트리에 제품명·개수", text(".cpg-dist-tree li").includes("미라네 4호 세트") &&