diff --git a/app/modules/cupang/router.py b/app/modules/cupang/router.py index 38cf4da..58d52b1 100644 --- a/app/modules/cupang/router.py +++ b/app/modules/cupang/router.py @@ -592,6 +592,7 @@ async def box_calc_page(request: Request) -> HTMLResponse: "page_title": "쿠팡 밀크런 — 박스 계산", "page_subtitle": "제품명과 수량을 넣으면 박스 수와 남은 낱개를 계산합니다.", "box_rules": store.list_box_rules(), + "centers": store.list_centers(), }, ) diff --git a/app/modules/cupang/templates/cupang/box_calc.html b/app/modules/cupang/templates/cupang/box_calc.html index ab83b4c..32e2075 100644 --- a/app/modules/cupang/templates/cupang/box_calc.html +++ b/app/modules/cupang/templates/cupang/box_calc.html @@ -1,6 +1,6 @@ {% extends "erp_base.html" %} -{% block head_extra %}{% endblock %} +{% block head_extra %}{% endblock %} {% block content %}
@@ -8,6 +8,7 @@
◀◀ 달력 박스 입수량 설정 + 입고센터 관리
{% if not box_rules %} @@ -19,69 +20,99 @@ {% else %} -
+
-
-
-

박스 계산

- 수량을 고치고 다시 계산하면 결과가 갱신됩니다. + +
+
+

① 박스 계산

+ 수량 칸에서 Tab = 다음 상품 수량, Enter = 계산 +
+ +
+ + + + + + + + + + + + + + +
제품명수량
+
+ +
+ + + + +
-
- - - - - - - - - - - - - - - - - - - - - - -
제품명수량박스 / 입수량박스낱개필요
+ +
+
+

② 박스 요약

+ 카드를 ③ 센터로 끌어다 놓으면 잔여가 줄어듭니다. +
+ +
왼쪽에서 제품과 수량을 넣고 계산하세요.
+ +
-
- - - - -
-
+ +
+
+

③ 센터 분배

+ 입고센터 관리에 등록한 센터만 표시됩니다. +
- - -
+
{% endif %} diff --git a/app/modules/cupang/templates/cupang/box_rules.html b/app/modules/cupang/templates/cupang/box_rules.html index daac23e..0c64627 100644 --- a/app/modules/cupang/templates/cupang/box_rules.html +++ b/app/modules/cupang/templates/cupang/box_rules.html @@ -1,6 +1,6 @@ {% extends "erp_base.html" %} -{% block head_extra %}{% endblock %} +{% block head_extra %}{% endblock %} {% block content %}
diff --git a/app/modules/cupang/templates/cupang/centers.html b/app/modules/cupang/templates/cupang/centers.html index 37f7ea2..dd59d6b 100644 --- a/app/modules/cupang/templates/cupang/centers.html +++ b/app/modules/cupang/templates/cupang/centers.html @@ -1,6 +1,6 @@ {% extends "erp_base.html" %} -{% block head_extra %}{% endblock %} +{% block head_extra %}{% endblock %} {% block content %}
diff --git a/app/modules/cupang/templates/cupang/detail.html b/app/modules/cupang/templates/cupang/detail.html index 7e61157..59b5803 100644 --- a/app/modules/cupang/templates/cupang/detail.html +++ b/app/modules/cupang/templates/cupang/detail.html @@ -1,6 +1,6 @@ {% extends "erp_base.html" %} -{% block head_extra %}{% endblock %} +{% block head_extra %}{% endblock %} {% block content %}
diff --git a/app/modules/cupang/templates/cupang/form.html b/app/modules/cupang/templates/cupang/form.html index 58f1adb..7eac1c4 100644 --- a/app/modules/cupang/templates/cupang/form.html +++ b/app/modules/cupang/templates/cupang/form.html @@ -1,6 +1,6 @@ {% extends "erp_base.html" %} -{% block head_extra %}{% endblock %} +{% block head_extra %}{% endblock %} {% block content %}
diff --git a/app/modules/cupang/templates/cupang/index.html b/app/modules/cupang/templates/cupang/index.html index 8aa8ca7..762ba43 100644 --- a/app/modules/cupang/templates/cupang/index.html +++ b/app/modules/cupang/templates/cupang/index.html @@ -1,6 +1,6 @@ {% extends "erp_base.html" %} -{% block head_extra %}{% endblock %} +{% block head_extra %}{% endblock %} {% block content %}
diff --git a/app/modules/cupang/templates/cupang/products.html b/app/modules/cupang/templates/cupang/products.html index 95d5154..9361385 100644 --- a/app/modules/cupang/templates/cupang/products.html +++ b/app/modules/cupang/templates/cupang/products.html @@ -1,6 +1,6 @@ {% extends "erp_base.html" %} -{% block head_extra %}{% endblock %} +{% block head_extra %}{% endblock %} {% block content %}
diff --git a/app/static/cupang.css b/app/static/cupang.css index 8061b27..7810942 100644 --- a/app/static/cupang.css +++ b/app/static/cupang.css @@ -577,3 +577,75 @@ stroke-width: 3px; stroke-linejoin: round; } + +/* ── 박스 계산 3열 작업 영역 (① 계산 / ② 요약 / ③ 센터 분배) ── */ +.cpg-calc3 { + display: grid; + grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.25fr) minmax(0, 0.9fr); + gap: 16px; + align-items: stretch; +} +.cpg-calc3 > .erp-card { margin-bottom: 0; display: flex; flex-direction: column; } +@media (max-width: 1500px) { + .cpg-calc3 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } + .cpg-calc3 > .cpg-dist-card { grid-column: 1 / -1; } +} +@media (max-width: 1000px) { + .cpg-calc3 { grid-template-columns: minmax(0, 1fr); } + .cpg-calc3 > .cpg-dist-card { grid-column: auto; } +} + +/* ② 요약: 카드가 드래그 가능함을 알린다 */ +.cpg-sum-prod[draggable="true"], .cpg-box-card[draggable="true"] { cursor: grab; } +.cpg-sum-prod[draggable="true"]:hover, .cpg-box-card[draggable="true"]:hover { + border-color: var(--color-rich-black); +} +.cpg-sum-prod.is-dragging, .cpg-box-card.is-dragging { opacity: .45; } +.cpg-sum-prod.is-done, .cpg-box-card.is-done { opacity: .5; } + +/* ③ 센터 분배 */ +.cpg-dist-list { + display: flex; + flex-direction: column; + gap: 10px; + overflow-y: auto; + max-height: min(72vh, 820px); +} +.cpg-dist-center { + border: 1px solid var(--color-subtle-ash); + border-radius: 10px; + padding: 10px 12px; +} +.cpg-dist-center.has-items { border-color: var(--color-rich-black); } +.cpg-dist-head { + display: flex; + align-items: center; + justify-content: space-between; + gap: 8px; + margin-bottom: 8px; + font-size: 14px; +} +.cpg-dist-drop { + border: 1.5px dashed var(--color-subtle-ash); + border-radius: 8px; + padding: 8px; + min-height: 52px; + transition: background .15s ease, border-color .15s ease; +} +.cpg-dist-drop.is-over { + border-color: var(--color-rich-black); + background: var(--color-ghost-gray); +} +.cpg-dist-hint { font-size: 12px; color: var(--color-midtone-gray); } +.cpg-dist-center.has-items .cpg-dist-hint { display: none; } +.cpg-dist-items { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; } +.cpg-dist-item { + display: flex; + align-items: center; + gap: 6px; + font-size: 13px; +} +.cpg-dist-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.cpg-dist-qty { width: 62px; min-width: 0; text-align: right; padding: 2px 6px; } +.cpg-dist-unit { font-size: 12px; color: var(--color-midtone-gray); } +.cpg-dist-del { padding: 2px 8px; line-height: 1.4; }