refactor(ui): unify mapping form into single shared component

Extract the SKU mapping modal (HTML + JS) from dashboard, logs, and
missing_skus into a shared component in base.html + shared.js. All pages
now use the same compact layout with CODMAT/Cant. column headers.

- Fix missing_skus backdrop bug: event.stopPropagation() on icon click
  prevents double modal open from <a> + <tr> event bubbling
- Shrink mappings addModal from modal-lg to regular size with compact layout
- Remove ~500 lines of duplicated modal HTML and JS across 4 pages
- Each page keeps a thin wrapper (openDashQuickMap, openLogsQuickMap,
  openMapModal) that calls shared openQuickMap() with an onSave callback

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Claude Agent
2026-03-19 23:21:43 +00:00
parent c806ca2d81
commit 327f0e6ea2
10 changed files with 247 additions and 501 deletions

View File

@@ -356,11 +356,16 @@ body {
.qm-row { display: flex; gap: 6px; align-items: center; }
.qm-codmat-wrap { flex: 1; min-width: 0; }
.qm-rm-btn { padding: 2px 6px; line-height: 1; }
#qmCodmatLines .qm-selected:empty { display: none; }
#quickMapModal .modal-body { padding-top: 12px; padding-bottom: 8px; }
#quickMapModal .modal-header { padding: 10px 16px; }
#quickMapModal .modal-header h5 { font-size: 0.95rem; margin: 0; }
#quickMapModal .modal-footer { padding: 8px 16px; }
#qmCodmatLines .qm-selected:empty,
#codmatLines .qm-selected:empty { display: none; }
#quickMapModal .modal-body,
#addModal .modal-body { padding-top: 12px; padding-bottom: 8px; }
#quickMapModal .modal-header,
#addModal .modal-header { padding: 10px 16px; }
#quickMapModal .modal-header h5,
#addModal .modal-header h5 { font-size: 0.95rem; margin: 0; }
#quickMapModal .modal-footer,
#addModal .modal-footer { padding: 8px 16px; }
/* ── Deleted mapping rows ────────────────────────── */
tr.mapping-deleted td {