style(malaysia): 랙 입력 UI — 정보 상단 이동·풀폭·코드 숨김
- 날짜/창고/상태/안내를 상단 가로 스트립으로 이동(좌측 280px 칸 제거) - 랙 보드 풀폭 → A/B 두 면 한 화면에 나란히 - 드롭다운에 상품코드 숨기고 이름만 표시(value 는 코드 유지) - 입력란 폭 축소·min-width:0 으로 칸 넘침 방지 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -6,7 +6,7 @@
|
||||
<select name="rk_sku" class="erp-input rk-sku" {% if disabled %}disabled{% endif %}>
|
||||
<option value="">— 선택 —</option>
|
||||
{% for it in items %}
|
||||
<option value="{{ it.item_code }}" {% if entry and entry.sku_code == it.item_code %}selected{% endif %}>{{ it.item_code }} · {{ it.item_name }}</option>
|
||||
<option value="{{ it.item_code }}" {% if entry and entry.sku_code == it.item_code %}selected{% endif %}>{{ it.item_name }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<input class="erp-input rk-upb" type="number" min="1" name="rk_upb" placeholder="입수량"
|
||||
@@ -23,28 +23,28 @@
|
||||
<style>
|
||||
.mys-compact .erp-table th,
|
||||
.mys-compact .erp-table td { padding-top:4px; padding-bottom:4px; }
|
||||
/* 랙 보드 */
|
||||
.rack-board { display:flex; gap:24px; flex-wrap:wrap; }
|
||||
.rack-side { flex:1 1 480px; }
|
||||
/* 랙 보드 — 두 면을 한 화면에 나란히 */
|
||||
.rack-board { display:flex; gap:16px; flex-wrap:wrap; }
|
||||
.rack-side { flex:1 1 460px; min-width:0; }
|
||||
.rack-side h3 { text-align:center; margin:0 0 8px; }
|
||||
.rack-row { display:grid; grid-template-columns:repeat(6, 1fr); gap:6px; margin-bottom:6px; }
|
||||
.rack-row { display:grid; grid-template-columns:repeat(6, 1fr); gap:5px; margin-bottom:5px; }
|
||||
.rack-cell {
|
||||
border:1px solid #cbd5e1; border-radius:6px; padding:4px;
|
||||
background:#f8fafc; min-height:84px; display:flex; flex-direction:column;
|
||||
border:1px solid #cbd5e1; border-radius:6px; padding:3px;
|
||||
background:#f8fafc; min-height:78px; display:flex; flex-direction:column; min-width:0;
|
||||
}
|
||||
.rack-cell-head {
|
||||
display:flex; align-items:center; justify-content:space-between;
|
||||
font-size:11px; font-weight:600; color:#475569; margin-bottom:3px;
|
||||
display:flex; align-items:center; gap:3px; justify-content:space-between;
|
||||
font-size:10px; font-weight:600; color:#475569; margin-bottom:3px;
|
||||
}
|
||||
.rack-cell-head .rk-cell-total { color:#0f172a; }
|
||||
.rack-cell-head .rk-cell-total { color:#0f172a; white-space:nowrap; }
|
||||
.rack-cell-head .rk-add {
|
||||
border:1px solid #94a3b8; background:#fff; border-radius:4px;
|
||||
width:18px; height:18px; line-height:1; padding:0; cursor:pointer; font-weight:700;
|
||||
width:18px; height:18px; line-height:1; padding:0; cursor:pointer; font-weight:700; flex:0 0 auto;
|
||||
}
|
||||
.rk-rows { display:flex; flex-direction:column; gap:3px; }
|
||||
.rk-row { display:grid; grid-template-columns: 1fr 38px 8px 32px 30px 16px; gap:2px; align-items:center; }
|
||||
.rk-row .rk-sku { font-size:10px; padding:1px 2px; }
|
||||
.rk-row .rk-upb, .rk-row .rk-box { font-size:10px; padding:1px 2px; text-align:right; }
|
||||
.rk-row { display:grid; grid-template-columns: minmax(0,1fr) 34px 7px 30px 26px 14px; gap:2px; align-items:center; }
|
||||
.rk-row .rk-sku { font-size:10px; padding:1px 2px; min-width:0; }
|
||||
.rk-row .rk-upb, .rk-row .rk-box { font-size:10px; padding:1px 2px; text-align:right; min-width:0; }
|
||||
.rk-row .rk-x { font-size:10px; color:#94a3b8; text-align:center; }
|
||||
.rk-row .rk-sub { font-size:10px; text-align:right; color:#2563eb; font-weight:600; }
|
||||
.rk-row .rk-del {
|
||||
@@ -62,41 +62,26 @@
|
||||
</div>
|
||||
|
||||
<form method="post" action="/malaysia/stocktakes/{{ stocktake.id }}/rack/bulk">
|
||||
<div style="display:grid;grid-template-columns:280px 1fr;gap:16px;align-items:start;">
|
||||
|
||||
<!-- 좌: 정보 + 동작 -->
|
||||
<div class="erp-card">
|
||||
<div class="cpg-card-head"><h2><span class="i18n">재고조사</span> #{{ stocktake.id }}</h2></div>
|
||||
<div style="margin-top:8px;display:flex;flex-direction:column;gap:6px;">
|
||||
<div><span class="erp-muted">날짜</span><br>{{ stocktake.stocktake_date }}</div>
|
||||
<div><span class="erp-muted">창고</span><br>{{ stocktake.warehouse_code }}</div>
|
||||
<div><span class="erp-muted">상태</span><br>
|
||||
{% if stocktake.status=='finalized' %}<span class="erp-badge erp-badge-success">확정</span>
|
||||
{% elif stocktake.status=='cancelled' %}<span class="erp-badge erp-badge-neutral">취소</span>
|
||||
{% else %}<span class="erp-badge erp-badge-inverse">작성중</span>{% endif %}
|
||||
</div>
|
||||
{% if stocktake.finalized_at %}<div><span class="erp-muted">확정시각</span><br>{{ stocktake.finalized_at }}</div>{% endif %}
|
||||
</div>
|
||||
|
||||
{% if missing_bom %}
|
||||
<p style="color:#b91c1c;font-weight:600;margin-top:10px;">⚠ BOM 없는 콤보: {{ missing_bom|join(', ') }}</p>
|
||||
{% endif %}
|
||||
|
||||
<p class="erp-muted" style="margin-top:10px;font-size:12px;">
|
||||
<span class="i18n">랙 칸에 아이템·입수량(박스당 개수)·박스 수를 입력하면 낱개/콤보 수량이 자동 집계됩니다. 한 칸에 여러 아이템은 + 로 추가하세요.</span>
|
||||
</p>
|
||||
|
||||
{% if is_draft %}
|
||||
<div class="erp-page-actions" style="margin-top:12px;">
|
||||
<button type="submit" class="erp-btn erp-btn-primary">입력 저장</button>
|
||||
</div>
|
||||
{% endif %}
|
||||
<!-- 상단 정보 스트립 -->
|
||||
<div class="erp-card" style="display:flex;align-items:center;gap:18px;flex-wrap:wrap;">
|
||||
<h2 style="margin:0;"><span class="i18n">재고조사</span> #{{ stocktake.id }}</h2>
|
||||
<div><span class="erp-muted">날짜</span> {{ stocktake.stocktake_date }}</div>
|
||||
<div><span class="erp-muted">창고</span> {{ stocktake.warehouse_code }}</div>
|
||||
<div><span class="erp-muted">상태</span>
|
||||
{% if stocktake.status=='finalized' %}<span class="erp-badge erp-badge-success">확정</span>
|
||||
{% elif stocktake.status=='cancelled' %}<span class="erp-badge erp-badge-neutral">취소</span>
|
||||
{% else %}<span class="erp-badge erp-badge-inverse">작성중</span>{% endif %}
|
||||
</div>
|
||||
{% if stocktake.finalized_at %}<div><span class="erp-muted">확정시각</span> {{ stocktake.finalized_at }}</div>{% endif %}
|
||||
{% if missing_bom %}<span style="color:#b91c1c;font-weight:600;">⚠ BOM 없는 콤보: {{ missing_bom|join(', ') }}</span>{% endif %}
|
||||
<span class="erp-muted i18n" style="flex:1 1 220px;font-size:12px;">랙 칸에 아이템·입수량(박스당 개수)·박스 수를 입력하면 낱개/콤보 수량이 자동 집계됩니다. 한 칸에 여러 아이템은 + 로 추가하세요.</span>
|
||||
{% if is_draft %}<button type="submit" class="erp-btn erp-btn-primary">입력 저장</button>{% endif %}
|
||||
</div>
|
||||
|
||||
<!-- 우: 랙 보드 -->
|
||||
<div class="erp-card">
|
||||
<div class="cpg-card-head"><h2>랙 입력 (박스 단위)</h2></div>
|
||||
<div class="rack-board" style="margin-top:10px;">
|
||||
<!-- 랙 보드 -->
|
||||
<div class="erp-card" style="margin-top:12px;">
|
||||
<div class="cpg-card-head"><h2>랙 입력 (박스 단위)</h2></div>
|
||||
<div class="rack-board" style="margin-top:10px;">
|
||||
{% for side in rack_layout %}
|
||||
<div class="rack-side">
|
||||
<h3>Side {{ side.side }}</h3>
|
||||
@@ -128,7 +113,6 @@
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<!-- JS 클론용 빈 행 템플릿(옵션 1벌만 보유) -->
|
||||
|
||||
Reference in New Issue
Block a user