Tr_Code/templates/partials/sb_mmi_list.html

76 lines
3.4 KiB
HTML

<section>
<div class="filter-row" style="display: flex; flex-wrap: wrap; gap: 0.7rem; align-items: end; margin-bottom: 1rem;">
<div style="flex: 1; min-width:160px;">
<label for="mmiManufacturer">제작사</label>
<select id="mmiManufacturer" name="manufacturer"
hx-get="/sb?section=mmicode"
hx-include="#mmiManufacturer,#mmiAliasName,#mmiSearch,#mmiGroupCode"
hx-target="#tabPanel" hx-params="*" hx-trigger="change">
<option value="" {% if selected_manufacturer=='' %}selected{% endif %}>전체</option>
{% for m in manufacturers %}
<option value="{{ m }}" {% if m==selected_manufacturer %}selected{% endif %}>{{ m }}</option>
{% endfor %}
</select>
</div>
<div style="flex:1; min-width:130px;">
<label for="mmiAliasName">차량분류</label>
<select id="mmiAliasName" name="alias_name"
hx-get="/sb?section=mmicode"
hx-include="#mmiManufacturer,#mmiAliasName,#mmiSearch,#mmiGroupCode"
hx-target="#tabPanel" hx-params="*" hx-trigger="change">
<option value="" {% if selected_alias_name=='' %}selected{% endif %}>전체</option>
{% for an in alias_names %}
<option value="{{ an }}" {% if an==selected_alias_name %}selected{% endif %}>{{ an }}</option>
{% endfor %}
</select>
</div>
</div>
<div class="search-row" style="display:flex; align-items:center; gap:1rem; margin-bottom:1.2rem;">
<div style="flex:4;">
<label for="mmiSearch">검색어</label>
<input id="mmiSearch" name="q" value="{{ q }}" placeholder="코드/설명/차량 검색"
hx-get="/sb?section=mmicode"
hx-trigger="keyup changed delay:200ms, search"
hx-target="#tabPanel"
hx-include="#mmiManufacturer,#mmiAliasName,#mmiSearch,#mmiGroupCode">
</div>
<div style="flex:1; min-width:110px; text-align:right; align-self:end;">
<label for="mmiGroupCode" style="margin-bottom:.45em;display:flex;align-items:center;gap:.4em;justify-content:flex-end;">
<input type="checkbox" id="mmiGroupCode" name="group_code" value="on"
hx-get="/sb?section=mmicode"
hx-target="#tabPanel"
hx-include="#mmiManufacturer,#mmiAliasName,#mmiSearch,#mmiGroupCode"
hx-trigger="change" {% if group_code=='on' %}checked{% endif %}>
코드 묶기
</label>
</div>
</div>
<div class="list" {% if page > 0 %} style="display:contents;" {% endif %}>
{% if rows %}
{% for r in rows %}
<article class="item">
<header>
<div class="code">{{ r.code_name }}</div>
<div class="title">{{ r.code_description or '' }}</div>
</header>
<footer>
<small>{{ r.manufacturer or '—' }}{% if r.alias_name %} · {{ r.alias_name }}{% endif %}{% if r.data_type %} · {{ r.data_type }}{% endif %}{% if r.car_id %} · {{ r.car_id }}{% endif %}</small>
</footer>
</article>
{% endfor %}
{% else %}
<p>검색 결과가 없습니다.</p>
{% endif %}
</div>
</section>
{% if rows|length >= page_size %}
<div class="load-more-trigger"
hx-get="/sb?section=mmicode&page={{ page + 1 }}&{{ query_params_string }}"
hx-swap="outerHTML"
hx-trigger="revealed">
<article class="item placeholder">Loading...</article>
</div>
{% endif %}