131 lines
6.1 KiB
HTML
131 lines
6.1 KiB
HTML
{% extends "base.html" %}
|
|
{% set editing = item is not none %}
|
|
{% block title %}{{ _('Edit') if editing else _('Add equipment') }} — The Shooter's Network{% endblock %}
|
|
{% block content %}
|
|
<h1>{{ _('Edit') if editing else _('Add equipment') }}</h1>
|
|
|
|
{% set f = prefill or item %}
|
|
|
|
<form method="post"
|
|
action="{{ url_for('equipment.edit', item_id=item.id) if editing else url_for('equipment.new') }}"
|
|
enctype="multipart/form-data"
|
|
style="max-width:520px;">
|
|
|
|
<div style="margin-bottom:1rem;">
|
|
<label class="field-label">{{ _('Category *') }}</label>
|
|
<select name="category" required style="width:100%;padding:0.55rem 0.75rem;border:1px solid #ccc;border-radius:4px;font-size:0.95rem;background:#fff;">
|
|
{% for key, label in categories %}
|
|
<option value="{{ key }}" {% if (f and f.category == key) or (not f and key == 'rifle') %}selected{% endif %}>{{ label }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
|
|
<div style="margin-bottom:1rem;">
|
|
<label class="field-label">{{ _('Name *') }}</label>
|
|
<input type="text" name="name" value="{{ f.name if f else '' }}" required
|
|
placeholder="e.g. Tikka T3x, Glock 17"
|
|
style="width:100%;padding:0.55rem 0.75rem;border:1px solid #ccc;border-radius:4px;font-size:0.95rem;">
|
|
</div>
|
|
|
|
<div style="display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem;">
|
|
<div>
|
|
<label class="field-label">{{ _('Brand') }}</label>
|
|
<input type="text" name="brand" value="{{ f.brand if f else '' }}"
|
|
placeholder="e.g. Tikka, Leupold"
|
|
style="width:100%;padding:0.55rem 0.75rem;border:1px solid #ccc;border-radius:4px;font-size:0.95rem;">
|
|
</div>
|
|
<div>
|
|
<label class="field-label">{{ _('Model') }}</label>
|
|
<input type="text" name="model" value="{{ f.model if f else '' }}"
|
|
placeholder="e.g. T3x, VX-3HD"
|
|
style="width:100%;padding:0.55rem 0.75rem;border:1px solid #ccc;border-radius:4px;font-size:0.95rem;">
|
|
</div>
|
|
</div>
|
|
|
|
<div id="rifle-fields" style="margin-bottom:1rem;">
|
|
<div style="display:grid;grid-template-columns:1fr 1fr;gap:1rem;">
|
|
<div>
|
|
<label class="field-label">{{ _('Caliber') }}</label>
|
|
<input type="text" name="caliber" value="{{ f.caliber if f else '' }}"
|
|
placeholder="e.g. .308 Win, 6.5 CM"
|
|
style="width:100%;padding:0.55rem 0.75rem;border:1px solid #ccc;border-radius:4px;font-size:0.95rem;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="scope-fields" style="display:none;margin-bottom:1rem;">
|
|
<div style="display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;">
|
|
<div>
|
|
<label class="field-label">{{ _('Magnification') }}</label>
|
|
<input type="text" name="magnification" value="{{ f.magnification if f else '' }}"
|
|
placeholder="e.g. 3-15x50"
|
|
style="width:100%;padding:0.55rem 0.75rem;border:1px solid #ccc;border-radius:4px;font-size:0.95rem;">
|
|
</div>
|
|
<div>
|
|
<label class="field-label">{{ _('Reticle') }}</label>
|
|
<select name="reticle" style="width:100%;padding:0.55rem 0.75rem;border:1px solid #ccc;border-radius:4px;font-size:0.95rem;background:#fff;">
|
|
<option value="">—</option>
|
|
<option value="FFP" {% if f and f.reticle == 'FFP' %}selected{% endif %}>FFP (First Focal Plane)</option>
|
|
<option value="SFP" {% if f and f.reticle == 'SFP' %}selected{% endif %}>SFP (Second Focal Plane)</option>
|
|
</select>
|
|
</div>
|
|
<div>
|
|
<label class="field-label">{{ _('Unit') }}</label>
|
|
<select name="unit" style="width:100%;padding:0.55rem 0.75rem;border:1px solid #ccc;border-radius:4px;font-size:0.95rem;background:#fff;">
|
|
<option value="">—</option>
|
|
<option value="MOA" {% if f and f.unit == 'MOA' %}selected{% endif %}>MOA</option>
|
|
<option value="MRAD" {% if f and f.unit == 'MRAD' %}selected{% endif %}>MRAD</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div style="margin-bottom:1rem;">
|
|
<label class="field-label">{{ _('Serial number') }}</label>
|
|
<input type="text" name="serial_number" value="{{ f.serial_number if f else '' }}"
|
|
style="width:100%;padding:0.55rem 0.75rem;border:1px solid #ccc;border-radius:4px;font-size:0.95rem;">
|
|
</div>
|
|
|
|
<div style="margin-bottom:1rem;">
|
|
<label class="field-label">{{ _('Notes') }}</label>
|
|
<textarea name="notes" rows="3"
|
|
style="width:100%;padding:0.55rem 0.75rem;border:1px solid #ccc;border-radius:4px;font-size:0.95rem;resize:vertical;">{{ f.notes if f else '' }}</textarea>
|
|
</div>
|
|
|
|
<div style="margin-bottom:1.5rem;">
|
|
<label class="field-label">{{ _('Photo') }}</label>
|
|
{% if editing and item.photo_url %}
|
|
<div style="margin-bottom:0.5rem;">
|
|
<img src="{{ item.photo_url }}" alt="Current photo"
|
|
style="height:80px;border-radius:4px;object-fit:cover;">
|
|
<span style="font-size:0.82rem;color:#888;margin-left:0.5rem;">{{ _('Upload a new one to replace it.') }}</span>
|
|
</div>
|
|
{% endif %}
|
|
<input type="file" name="photo" accept="image/*"
|
|
style="font-size:0.92rem;">
|
|
</div>
|
|
|
|
<div style="display:flex;gap:1rem;align-items:center;">
|
|
<button type="submit"
|
|
style="background:#1a1a2e;color:#fff;border:none;border-radius:4px;padding:0.6rem 1.5rem;font-size:0.95rem;cursor:pointer;">
|
|
{{ _('Save changes') if editing else _('Add equipment') }}
|
|
</button>
|
|
<a href="{{ url_for('equipment.detail', item_id=item.id) if editing else url_for('equipment.index') }}"
|
|
style="font-size:0.9rem;color:#666;">{{ _('Cancel') }}</a>
|
|
</div>
|
|
</form>
|
|
|
|
<style>.field-label { display:block; font-size:.88rem; font-weight:600; color:#444; margin-bottom:.3rem; }</style>
|
|
|
|
<script>
|
|
function toggleCategoryFields() {
|
|
var cat = document.querySelector('[name="category"]').value;
|
|
var isScope = cat === 'scope';
|
|
document.getElementById('scope-fields').style.display = isScope ? '' : 'none';
|
|
document.getElementById('rifle-fields').style.display = isScope ? 'none' : '';
|
|
}
|
|
document.querySelector('[name="category"]').addEventListener('change', toggleCategoryFields);
|
|
toggleCategoryFields(); // run on load
|
|
</script>
|
|
{% endblock %}
|