dbx-main/app/static/malaysia_rack.js

/* 말레이시아 재고조사 — 랙(rack) 입력 보조 스크립트.
 *
 * - 칸(.rack-cell) 헤더의 + 버튼: 빈 입력행을 칸에 추가(템플릿 #rk-row-tpl 클론).
 *   클론 시 숨김필드 rk_cell 에 해당 칸 코드를 채워 서버 병렬배열과 정렬.
 * - 행의 × 버튼: 그 행 제거(칸에 행이 0개여도 무방 — 서버가 빈 칸 스킵).
 * - 입수량/박스수 입력 시 행 소계(rk-sub)만 실시간 갱신.
 *   (칸 합계는 서로 다른 상품을 더하게 되어 의미 없으므로 표시하지 않음.)
 * 저장은 폼 제출(서버에서 SKU별 집계 → 재고조사 라인 재생성).
 */
(function () {
  "use strict";

  function num(el) {
    var v = parseInt((el && el.value) || "0", 10);
    return isNaN(v) || v < 0 ? 0 : v;
  }

  function comma(n) {
    return n.toLocaleString("en-US");
  }

  function recalcRow(row) {
    var upb = num(row.querySelector(".rk-upb"));
    var box = num(row.querySelector(".rk-box"));
    var sub = row.querySelector(".rk-sub");
    if (sub) sub.textContent = comma(upb * box);
  }

  function wireRow(row) {
    row.querySelectorAll(".rk-upb, .rk-box").forEach(function (inp) {
      inp.addEventListener("input", function () {
        recalcRow(row);
      });
    });
    var del = row.querySelector(".rk-del");
    if (del) {
      del.addEventListener("click", function () {
        row.remove();
      });
    }
  }

  function addRow(cell) {
    var tpl = document.getElementById("rk-row-tpl");
    if (!tpl) return;
    var frag = tpl.content.cloneNode(true);
    var row = frag.querySelector(".rk-row");
    if (!row) return;
    var hidden = row.querySelector('input[name="rk_cell"]');
    if (hidden) hidden.value = cell.getAttribute("data-cell") || "";
    cell.querySelector(".rk-rows").appendChild(row);
    wireRow(row);
    var sku = row.querySelector(".rk-sku");
    if (sku) sku.focus();
  }

  document.addEventListener("DOMContentLoaded", function () {
    document.querySelectorAll(".rack-cell .rk-row").forEach(function (row) {
      wireRow(row);
      recalcRow(row);
    });
    document.querySelectorAll(".rack-cell .rk-add").forEach(function (btn) {
      btn.addEventListener("click", function () {
        var cell = btn.closest(".rack-cell");
        if (cell) addRow(cell);
      });
    });
  });
})();