115 lines
4.3 KiB
HTML
115 lines
4.3 KiB
HTML
{% extends "base.html" %}
|
|
{% block title %}{{ title }}{% endblock %}
|
|
{% block content %}
|
|
<div class="row justify-content-center">
|
|
<div class="col-lg-6">
|
|
<div class="card shadow-sm">
|
|
<div class="card-header bg-danger text-white">
|
|
<h5 class="mb-0"><i class="bi bi-exclamation-triangle"></i> {{ title }}</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<form method="post" enctype="multipart/form-data">
|
|
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
|
|
|
|
{# Contract selector — UI only; narrows the facility list via AJAX #}
|
|
<div class="mb-3">
|
|
<label class="form-label fw-semibold" for="contract_select">Contract</label>
|
|
<select id="contract_select" class="form-select">
|
|
<option value="">— Select Contract —</option>
|
|
{% for p in projects %}
|
|
<option value="{{ p.id }}">{{ p.name }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
|
|
{# Facility — populated by JS once a contract is chosen #}
|
|
<div class="mb-3">
|
|
{{ form.facility_id.label(class="form-label fw-semibold") }}
|
|
{{ form.facility_id(class="form-select", id="facility_id") }}
|
|
{% for e in form.facility_id.errors %}<div class="text-danger small">{{ e }}</div>{% endfor %}
|
|
</div>
|
|
|
|
{# Remaining fields — assigned_to hidden from customer role #}
|
|
{% for field in [form.severity, form.description, form.photo] %}
|
|
<div class="mb-3">
|
|
{{ field.label(class="form-label fw-semibold") }}
|
|
{{ field(class="form-select" if field.type == 'SelectField' else "form-control", rows=4 if field.type == 'TextAreaField' else none) }}
|
|
{% for e in field.errors %}<div class="text-danger small">{{ e }}</div>{% endfor %}
|
|
</div>
|
|
{% endfor %}
|
|
{% if current_user.role != 'customer' %}
|
|
<div class="mb-3">
|
|
{{ form.assigned_to.label(class="form-label fw-semibold") }}
|
|
{{ form.assigned_to(class="form-select") }}
|
|
{% for e in form.assigned_to.errors %}<div class="text-danger small">{{ e }}</div>{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
|
|
<div class="d-flex gap-2">
|
|
<button type="submit" class="btn btn-danger">Log Issue</button>
|
|
<a href="{{ url_for('issues.index') }}" class="btn btn-outline-secondary">Cancel</a>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block extra_js %}
|
|
<script>
|
|
(function () {
|
|
'use strict';
|
|
var contractSel = document.getElementById('contract_select');
|
|
var facilitySel = document.getElementById('facility_id');
|
|
var FACILITIES_URL = '{{ url_for("inspections.facilities_for_project", project_id=0) }}'.replace('/0', '/');
|
|
|
|
// Values injected from the route (non-null only after a POST validation error)
|
|
var preProjectId = {{ selected_project_id | tojson }};
|
|
var preFacilityId = {{ form.facility_id.data | tojson }};
|
|
|
|
function setPlaceholder() {
|
|
facilitySel.innerHTML = '<option value="">— Select a Contract first —</option>';
|
|
facilitySel.disabled = true;
|
|
}
|
|
|
|
function loadFacilities(projectId, restoreFacilityId) {
|
|
facilitySel.disabled = true;
|
|
facilitySel.innerHTML = '<option value="">Loading…</option>';
|
|
fetch(FACILITIES_URL + projectId)
|
|
.then(function (r) { return r.json(); })
|
|
.then(function (data) {
|
|
facilitySel.innerHTML = '<option value="">— Select Facility —</option>';
|
|
data.forEach(function (f) {
|
|
var opt = document.createElement('option');
|
|
opt.value = f.id;
|
|
opt.textContent = f.name;
|
|
if (restoreFacilityId && f.id === restoreFacilityId) { opt.selected = true; }
|
|
facilitySel.appendChild(opt);
|
|
});
|
|
facilitySel.disabled = false;
|
|
})
|
|
.catch(function () {
|
|
facilitySel.innerHTML = '<option value="">Could not load facilities</option>';
|
|
});
|
|
}
|
|
|
|
contractSel.addEventListener('change', function () {
|
|
if (this.value) {
|
|
loadFacilities(this.value, null);
|
|
} else {
|
|
setPlaceholder();
|
|
}
|
|
});
|
|
|
|
// Restore state after a POST validation error
|
|
if (preProjectId) {
|
|
contractSel.value = String(preProjectId);
|
|
loadFacilities(preProjectId, preFacilityId);
|
|
} else {
|
|
setPlaceholder();
|
|
}
|
|
}());
|
|
</script>
|
|
{% endblock %}
|