style(cupang): 상자 목록 엑셀 버튼 초록, 머리글 안 줄임, 행 클릭 체크 토글
- 엑셀 다운로드 버튼 배경 #217346 - 표 머리글은 말줄임 없이 전체 표시(상자번호 열 74px) - 행 클릭 시 상자 단위로 체크 색 토글 + 체크 개수 표시(세는 용도) Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
{% extends "erp_base.html" %}
|
||||
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260903b" />{% endblock %}
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260903c" />{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<section class="cpg">
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{% extends "erp_base.html" %}
|
||||
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260903b" />{% endblock %}
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260903c" />{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<section class="cpg">
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{% extends "erp_base.html" %}
|
||||
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260903b" />{% endblock %}
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260903c" />{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<section class="cpg">
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{% extends "erp_base.html" %}
|
||||
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260903b" />{% endblock %}
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260903c" />{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<section class="cpg">
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{% extends "erp_base.html" %}
|
||||
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260903b" />{% endblock %}
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260903c" />{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<section class="cpg">
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{% extends "erp_base.html" %}
|
||||
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260903b" />{% endblock %}
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260903c" />{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
{# 출고 묶음 보기 — 상자 계산 화면과 같은 3열 구성. 읽기 전용(수정 없음). #}
|
||||
@@ -49,7 +49,8 @@
|
||||
<div class="cpg-card-head">
|
||||
<h2>② 상자 목록</h2>
|
||||
<span class="erp-muted">상자마다 담긴 제품과 수량</span>
|
||||
<a class="erp-btn erp-btn-ghost cpg-boxno-dl"
|
||||
<span class="cpg-boxno-count" id="cpg-boxno-count">체크 0/{{ box_list|length }}</span>
|
||||
<a class="erp-btn cpg-boxno-dl"
|
||||
href="/cupang/{{ shipment.id }}/boxes.xlsx">엑셀 다운로드</a>
|
||||
</div>
|
||||
|
||||
@@ -86,7 +87,7 @@
|
||||
<tbody>
|
||||
{% for b in box_list %}
|
||||
{% for it in b['items'] %}
|
||||
<tr class="{% if loop.first %}is-boxtop{% endif %}">
|
||||
<tr data-box="{{ b.no }}" class="{% if loop.first %}is-boxtop{% endif %}">
|
||||
{% if loop.first %}
|
||||
<td class="cpg-boxno-cell" rowspan="{{ b['items']|length }}">{{ b.no }}</td>
|
||||
{% endif %}
|
||||
@@ -165,4 +166,41 @@
|
||||
|
||||
</div><!-- /cpg-calc3 -->
|
||||
</section>
|
||||
|
||||
<script>
|
||||
// 상자 목록 행 클릭 → 체크 표시 토글(상자 단위). 세는 동안 눈으로 확인하려는 용도.
|
||||
(function () {
|
||||
var table = document.querySelector(".cpg-boxno-table");
|
||||
var counter = document.getElementById("cpg-boxno-count");
|
||||
if (!table) return;
|
||||
var total = table.querySelectorAll("tbody tr[data-box]").length
|
||||
? new Set(Array.prototype.map.call(
|
||||
table.querySelectorAll("tbody tr[data-box]"),
|
||||
function (tr) { return tr.getAttribute("data-box"); }
|
||||
)).size
|
||||
: 0;
|
||||
|
||||
function refresh() {
|
||||
if (!counter) return;
|
||||
var done = new Set();
|
||||
table.querySelectorAll("tbody tr.is-checked[data-box]").forEach(function (tr) {
|
||||
done.add(tr.getAttribute("data-box"));
|
||||
});
|
||||
counter.textContent = "체크 " + done.size + "/" + total;
|
||||
counter.classList.toggle("is-on", done.size > 0);
|
||||
}
|
||||
|
||||
table.addEventListener("click", function (e) {
|
||||
var tr = e.target.closest("tbody tr[data-box]");
|
||||
if (!tr) return;
|
||||
var no = tr.getAttribute("data-box");
|
||||
var rows = table.querySelectorAll('tbody tr[data-box="' + no + '"]');
|
||||
var on = !tr.classList.contains("is-checked");
|
||||
rows.forEach(function (r) { r.classList.toggle("is-checked", on); });
|
||||
refresh();
|
||||
});
|
||||
|
||||
refresh();
|
||||
})();
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
||||
Reference in New Issue
Block a user