419 lines
46 KiB
HTML
419 lines
46 KiB
HTML
{% extends "assets/detail_generic.html" %}
|
||
{% load i18n %}
|
||
{% load static %}
|
||
|
||
{% block script %}
|
||
{{ block.super }}
|
||
<script src="{% static 'assets/clean_litterbin_observations.js' %}"></script>
|
||
{% endblock script %}
|
||
|
||
{% block extra_blocks %}
|
||
{% with observations=asset.observations.all %}
|
||
<div class="card mb-3" id="observations-card"
|
||
data-update-url="{% url 'assets:clean_update_litter_bin_observations' asset.id %}">
|
||
|
||
{# ── Header ── #}
|
||
<div class="card-header bg-light d-flex align-items-center justify-content-between">
|
||
<h5 class="mb-0">
|
||
<i class="bi bi-clipboard2-check me-2"></i>{% translate "Observations" %}
|
||
<span class="badge bg-secondary ms-2" id="obs-count">{{ observations|length }}</span>
|
||
</h5>
|
||
{% if allowed_update_fields %}
|
||
<button id="obs-add-btn" type="button" class="btn btn-outline-primary btn-sm d-none">
|
||
<i class="bi bi-plus-lg me-1"></i>{% translate "Ajouter" %}
|
||
</button>
|
||
{% endif %}
|
||
</div>
|
||
|
||
{# ── Body ── #}
|
||
<div class="card-body p-0">
|
||
{% if not observations %}
|
||
<p class="text-muted small px-3 py-2 mb-0" id="obs-empty-msg">{% translate "Aucune observation enregistrée." %}</p>
|
||
{% endif %}
|
||
|
||
<div class="accordion accordion-flush" id="observationsAccordion">
|
||
|
||
{% for obs in observations %}
|
||
<div class="accordion-item obs-item" data-obs-id="{{ obs.id }}">
|
||
<h2 class="accordion-header">
|
||
<button class="accordion-button collapsed py-2 px-3 d-flex align-items-center gap-2"
|
||
type="button" data-bs-toggle="collapse" data-bs-target="#obs-c-{{ obs.id }}">
|
||
<span class="obs-header-date text-muted small fw-normal flex-shrink-0">
|
||
{% if obs.observation_datetime %}{{ obs.observation_datetime|date:"d/m/Y H:i" }}{% else %}<em>{% translate "Date inconnue" %}</em>{% endif %}
|
||
</span>
|
||
<span class="obs-header-note text-truncate flex-grow-1 small" style="max-width:400px;">
|
||
{{ obs.observer_note|default:""|truncatechars:80 }}
|
||
</span>
|
||
<span class="obs-delete-badge badge text-bg-danger d-none ms-auto flex-shrink-0">{% translate "Suppression" %}</span>
|
||
</button>
|
||
</h2>
|
||
<div id="obs-c-{{ obs.id }}" class="accordion-collapse collapse">
|
||
<div class="accordion-body px-3 pt-2 pb-3">
|
||
|
||
{# ════ VIEW PANEL ════ #}
|
||
<div class="obs-view-panel">
|
||
|
||
{# Note générale #}
|
||
{% if obs.observer_note %}
|
||
<p class="text-muted fst-italic small mb-3 border-start border-3 border-secondary ps-2">{{ obs.observer_note }}</p>
|
||
{% endif %}
|
||
|
||
<div class="d-flex flex-column flex-md-row gap-3">
|
||
|
||
{# ── Colonne Sol ── #}
|
||
<div style="flex:1;min-width:0">
|
||
<p class="text-uppercase text-secondary fw-semibold mb-2" style="font-size:.68rem;letter-spacing:.07em">{% translate "Sol" %}</p>
|
||
<table class="table table-sm table-borderless mb-0" style="font-size:.82rem">
|
||
<tbody>
|
||
{% with yes='<i class="bi bi-check-circle-fill text-success"></i>' no='<i class="bi bi-x-circle text-muted opacity-50"></i>' %}
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1" style="width:60%">{% translate "Pente trop forte" %}</td>
|
||
<td class="py-1">{% if obs.sol_pente_trop_forte %}<i class="bi bi-check-circle-fill text-warning"></i>{% else %}<i class="bi bi-x-circle text-muted opacity-50"></i>{% endif %}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Sol instable" %}</td>
|
||
<td class="py-1">{% if obs.sol_instable %}<i class="bi bi-check-circle-fill text-warning"></i>{% else %}<i class="bi bi-x-circle text-muted opacity-50"></i>{% endif %}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Surface réfléchissante" %}</td>
|
||
<td class="py-1">{% if obs.sol_reflechissant %}<i class="bi bi-check-circle-fill text-secondary"></i>{% else %}<i class="bi bi-x-circle text-muted opacity-50"></i>{% endif %}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Surface glissante" %}</td>
|
||
<td class="py-1">{% if obs.sol_glissant %}<i class="bi bi-check-circle-fill text-warning"></i>{% else %}<i class="bi bi-x-circle text-muted opacity-50"></i>{% endif %}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Fissures" %}</td>
|
||
<td class="py-1">{% if obs.sol_fentes %}<i class="bi bi-check-circle-fill text-warning"></i>{% else %}<i class="bi bi-x-circle text-muted opacity-50"></i>{% endif %}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Entrave" %}</td>
|
||
<td class="py-1">{% if obs.sol_entrave %}<i class="bi bi-check-circle-fill text-danger"></i>{% else %}<i class="bi bi-x-circle text-muted opacity-50"></i>{% endif %}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Dalles podotactiles" %}</td>
|
||
<td class="py-1">{% if obs.sol_dalles_podo %}<i class="bi bi-check-circle-fill text-info"></i>{% else %}<i class="bi bi-x-circle text-muted opacity-50"></i>{% endif %}</td>
|
||
</tr>
|
||
{% endwith %}
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Pente transversale" %}</td>
|
||
<td class="py-1">{% if obs.sol_pente_transversale is not None %}<span class="fw-medium">{{ obs.sol_pente_transversale|stringformat:"g" }} %</span>{% else %}<span class="text-muted">—</span>{% endif %}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Pente longitudinale" %}</td>
|
||
<td class="py-1">{% if obs.sol_pente_longitudinale is not None %}<span class="fw-medium">{{ obs.sol_pente_longitudinale|stringformat:"g" }} %</span>{% else %}<span class="text-muted">—</span>{% endif %}</td>
|
||
</tr>
|
||
{% if obs.sol_remarque %}
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Remarque" %}</td>
|
||
<td class="py-1 fst-italic">{{ obs.sol_remarque }}</td>
|
||
</tr>
|
||
{% endif %}
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
{# ── Colonne Accessibilité ── #}
|
||
<div style="flex:1;min-width:0;border-left:1px solid var(--bs-border-color);padding-left:1rem">
|
||
<p class="text-uppercase text-secondary fw-semibold mb-2" style="font-size:.68rem;letter-spacing:.07em">{% translate "Accessibilité" %}</p>
|
||
<table class="table table-sm table-borderless mb-0" style="font-size:.82rem">
|
||
<tbody>
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1" style="width:60%">{% translate "Type de quartier" %}</td>
|
||
<td class="py-1">{% if obs.acc_type_quartier %}<span class="fw-medium">{{ obs.get_acc_type_quartier_display }}</span>{% else %}<span class="text-muted">—</span>{% endif %}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Densité flux piéton" %}</td>
|
||
<td class="py-1">{% if obs.acc_densite_flux_pieton %}<span class="fw-medium">{{ obs.get_acc_densite_flux_pieton_display }}</span>{% else %}<span class="text-muted">—</span>{% endif %}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Approche 2 m dégagée" %}</td>
|
||
<td class="py-1">{% if obs.acc_approche_2m %}<i class="bi bi-check-circle-fill text-success"></i>{% else %}<i class="bi bi-x-circle text-muted opacity-50"></i>{% endif %}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Voirie à traverser" %}</td>
|
||
<td class="py-1">{% if obs.acc_voirie_a_traverser %}<i class="bi bi-check-circle-fill text-warning"></i>{% else %}<i class="bi bi-x-circle text-muted opacity-50"></i>{% endif %}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Poubelle isolée" %}</td>
|
||
<td class="py-1">{% if obs.acc_poubelle_isolee %}<i class="bi bi-check-circle-fill text-secondary"></i>{% else %}<i class="bi bi-x-circle text-muted opacity-50"></i>{% endif %}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Gêne flux routier" %}</td>
|
||
<td class="py-1">{% if obs.acc_gene_flux_routier %}<i class="bi bi-check-circle-fill text-danger"></i>{% else %}<i class="bi bi-x-circle text-muted opacity-50"></i>{% endif %}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Gêne flux piéton" %}</td>
|
||
<td class="py-1">{% if obs.acc_gene_flux_pieton %}<i class="bi bi-check-circle-fill text-danger"></i>{% else %}<i class="bi bi-x-circle text-muted opacity-50"></i>{% endif %}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Itinéraire logique" %}</td>
|
||
<td class="py-1">{% if obs.acc_chemin_logique %}<i class="bi bi-check-circle-fill text-success"></i>{% else %}<i class="bi bi-x-circle text-muted opacity-50"></i>{% endif %}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Contraste visuel" %}</td>
|
||
<td class="py-1">{% if obs.acc_contraste %}<i class="bi bi-check-circle-fill text-info"></i>{% else %}<i class="bi bi-x-circle text-muted opacity-50"></i>{% endif %}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Indicateurs de tri" %}</td>
|
||
<td class="py-1">{% if obs.acc_indications_tri %}<i class="bi bi-check-circle-fill text-info"></i>{% else %}<i class="bi bi-x-circle text-muted opacity-50"></i>{% endif %}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Accès agent (véhicule)" %}</td>
|
||
<td class="py-1">
|
||
{% if obs.acc_agent_vehicule %}
|
||
{% if obs.acc_agent_vehicule == "normal" %}<span class="text-success fw-medium">{% translate "Normal" %}</span>
|
||
{% elif obs.acc_agent_vehicule == "difficult" %}<span class="text-warning fw-medium">{% translate "Difficile" %}</span>
|
||
{% else %}<span class="text-danger fw-medium">{% translate "Impossible" %}</span>{% endif %}
|
||
{% else %}<span class="text-muted">—</span>{% endif %}
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Accès agent (pied)" %}</td>
|
||
<td class="py-1">
|
||
{% if obs.acc_agent_pied %}
|
||
{% if obs.acc_agent_pied == "normal" %}<span class="text-success fw-medium">{% translate "Normal" %}</span>
|
||
{% elif obs.acc_agent_pied == "difficult" %}<span class="text-warning fw-medium">{% translate "Difficile" %}</span>
|
||
{% else %}<span class="text-danger fw-medium">{% translate "Impossible" %}</span>{% endif %}
|
||
{% else %}<span class="text-muted">—</span>{% endif %}
|
||
</td>
|
||
</tr>
|
||
{% if obs.acc_point_interet %}
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Points d'intérêt" %}</td>
|
||
<td class="py-1">
|
||
<div class="d-flex flex-wrap gap-1">
|
||
{% for poi in obs.acc_point_interet %}<span class="badge rounded-pill border border-secondary-subtle text-secondary-emphasis small">{{ poi }}</span>{% endfor %}
|
||
{% if obs.acc_point_interet_autre %}<span class="badge rounded-pill border border-secondary-subtle text-secondary-emphasis small">{{ obs.acc_point_interet_autre }}</span>{% endif %}
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
{% endif %}
|
||
{% if obs.acc_remarque %}
|
||
<tr>
|
||
<td class="text-muted ps-0 py-1">{% translate "Remarque" %}</td>
|
||
<td class="py-1 fst-italic">{{ obs.acc_remarque }}</td>
|
||
</tr>
|
||
{% endif %}
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
</div>{# /flex #}
|
||
</div>{# /obs-view-panel #}
|
||
|
||
{# ════ EDIT PANEL ════ #}
|
||
<div class="obs-edit-panel d-none">
|
||
|
||
<p class="text-uppercase text-secondary mb-1 mt-1" style="font-size:.72rem;letter-spacing:.05em">{% translate "Général" %}</p>
|
||
<div class="row g-2 mb-3">
|
||
<div class="col-md-4">
|
||
<label class="form-label small mb-1" for="obs-{{ obs.id }}-dt">{% translate "Date / heure" %}</label>
|
||
<input type="datetime-local" id="obs-{{ obs.id }}-dt" class="form-control form-control-sm"
|
||
name="observation_datetime" value="{{ obs.observation_datetime|date:'Y-m-d\TH:i'|default:'' }}">
|
||
</div>
|
||
<div class="col-12">
|
||
<label class="form-label small mb-1" for="obs-{{ obs.id }}-note">{% translate "Note" %}</label>
|
||
<textarea id="obs-{{ obs.id }}-note" class="form-control form-control-sm" name="observer_note" rows="2">{{ obs.observer_note|default:"" }}</textarea>
|
||
</div>
|
||
</div>
|
||
|
||
<p class="text-uppercase text-secondary mb-1" style="font-size:.72rem;letter-spacing:.05em">{% translate "Sol" %}</p>
|
||
<div class="row g-2 mb-3">
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-{{ obs.id }}-sol1" name="sol_pente_trop_forte" {% if obs.sol_pente_trop_forte %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-sol1">{% translate "Pente trop forte" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-{{ obs.id }}-sol2" name="sol_instable" {% if obs.sol_instable %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-sol2">{% translate "Sol instable" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-{{ obs.id }}-sol3" name="sol_reflechissant" {% if obs.sol_reflechissant %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-sol3">{% translate "Surface réfléchissante" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-{{ obs.id }}-sol4" name="sol_glissant" {% if obs.sol_glissant %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-sol4">{% translate "Surface glissante" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-{{ obs.id }}-sol5" name="sol_fentes" {% if obs.sol_fentes %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-sol5">{% translate "Fissures" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-{{ obs.id }}-sol6" name="sol_entrave" {% if obs.sol_entrave %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-sol6">{% translate "Entrave" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-{{ obs.id }}-sol7" name="sol_dalles_podo" {% if obs.sol_dalles_podo %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-sol7">{% translate "Dalles podotactiles" %}</label></div></div>
|
||
<div class="col-6 col-md-3">
|
||
<label class="form-label small mb-1" for="obs-{{ obs.id }}-pt">{% translate "Pente transversale (%)" %}</label>
|
||
<input type="number" step="0.1" id="obs-{{ obs.id }}-pt" class="form-control form-control-sm" name="sol_pente_transversale" value="{% if obs.sol_pente_transversale is not None %}{{ obs.sol_pente_transversale|stringformat:"g" }}{% endif %}">
|
||
</div>
|
||
<div class="col-6 col-md-3">
|
||
<label class="form-label small mb-1" for="obs-{{ obs.id }}-pl">{% translate "Pente longitudinale (%)" %}</label>
|
||
<input type="number" step="0.1" id="obs-{{ obs.id }}-pl" class="form-control form-control-sm" name="sol_pente_longitudinale" value="{% if obs.sol_pente_longitudinale is not None %}{{ obs.sol_pente_longitudinale|stringformat:"g" }}{% endif %}">
|
||
</div>
|
||
<div class="col-12">
|
||
<label class="form-label small mb-1" for="obs-{{ obs.id }}-sr">{% translate "Remarque sol" %}</label>
|
||
<textarea id="obs-{{ obs.id }}-sr" class="form-control form-control-sm" name="sol_remarque" rows="2">{{ obs.sol_remarque|default:"" }}</textarea>
|
||
</div>
|
||
</div>
|
||
|
||
<p class="text-uppercase text-secondary mb-1" style="font-size:.72rem;letter-spacing:.05em">{% translate "Accessibilité" %}</p>
|
||
<div class="row g-2 mb-3">
|
||
<div class="col-md-4">
|
||
<label class="form-label small mb-1">{% translate "Type de quartier" %}</label>
|
||
<select name="acc_type_quartier" class="form-select form-select-sm">
|
||
<option value="">—</option>
|
||
<option value="importante_ponctuelle" {% if obs.acc_type_quartier == "importante_ponctuelle" %}selected{% endif %}>{% translate "Important – ponctuel" %}</option>
|
||
<option value="importante_continue" {% if obs.acc_type_quartier == "importante_continue" %}selected{% endif %}>{% translate "Important – continu" %}</option>
|
||
<option value="faible" {% if obs.acc_type_quartier == "faible" %}selected{% endif %}>{% translate "Faible" %}</option>
|
||
<option value="autre" {% if obs.acc_type_quartier == "autre" %}selected{% endif %}>{% translate "Autre" %}</option>
|
||
</select>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<label class="form-label small mb-1">{% translate "Densité flux piéton" %}</label>
|
||
<select name="acc_densite_flux_pieton" class="form-select form-select-sm">
|
||
<option value="">—</option>
|
||
<option value="high" {% if obs.acc_densite_flux_pieton == "high" %}selected{% endif %}>{% translate "Élevée" %}</option>
|
||
<option value="medium" {% if obs.acc_densite_flux_pieton == "medium" %}selected{% endif %}>{% translate "Moyenne" %}</option>
|
||
<option value="low" {% if obs.acc_densite_flux_pieton == "low" %}selected{% endif %}>{% translate "Faible" %}</option>
|
||
</select>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<label class="form-label small mb-1">{% translate "Accès agent (véhicule)" %}</label>
|
||
<select name="acc_agent_vehicule" class="form-select form-select-sm">
|
||
<option value="">—</option>
|
||
<option value="normal" {% if obs.acc_agent_vehicule == "normal" %}selected{% endif %}>{% translate "Normal" %}</option>
|
||
<option value="difficult" {% if obs.acc_agent_vehicule == "difficult" %}selected{% endif %}>{% translate "Difficile" %}</option>
|
||
<option value="impossible" {% if obs.acc_agent_vehicule == "impossible" %}selected{% endif %}>{% translate "Impossible" %}</option>
|
||
</select>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<label class="form-label small mb-1">{% translate "Accès agent (pied)" %}</label>
|
||
<select name="acc_agent_pied" class="form-select form-select-sm">
|
||
<option value="">—</option>
|
||
<option value="normal" {% if obs.acc_agent_pied == "normal" %}selected{% endif %}>{% translate "Normal" %}</option>
|
||
<option value="difficult" {% if obs.acc_agent_pied == "difficult" %}selected{% endif %}>{% translate "Difficile" %}</option>
|
||
<option value="impossible" {% if obs.acc_agent_pied == "impossible" %}selected{% endif %}>{% translate "Impossible" %}</option>
|
||
</select>
|
||
</div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-{{ obs.id }}-a1" name="acc_approche_2m" {% if obs.acc_approche_2m %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-a1">{% translate "Approche 2 m dégagée" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-{{ obs.id }}-a2" name="acc_voirie_a_traverser" {% if obs.acc_voirie_a_traverser %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-a2">{% translate "Voirie à traverser" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-{{ obs.id }}-a3" name="acc_poubelle_isolee" {% if obs.acc_poubelle_isolee %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-a3">{% translate "Poubelle isolée" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-{{ obs.id }}-a4" name="acc_gene_flux_routier" {% if obs.acc_gene_flux_routier %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-a4">{% translate "Gêne flux routier" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-{{ obs.id }}-a5" name="acc_gene_flux_pieton" {% if obs.acc_gene_flux_pieton %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-a5">{% translate "Gêne flux piéton" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-{{ obs.id }}-a6" name="acc_chemin_logique" {% if obs.acc_chemin_logique %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-a6">{% translate "Itinéraire logique" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-{{ obs.id }}-a7" name="acc_contraste" {% if obs.acc_contraste %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-a7">{% translate "Contraste visuel" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-{{ obs.id }}-a8" name="acc_indications_tri" {% if obs.acc_indications_tri %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-a8">{% translate "Indicateurs de tri" %}</label></div></div>
|
||
<div class="col-12">
|
||
<label class="form-label small mb-1">{% translate "Points d'intérêt" %}</label>
|
||
<div class="d-flex flex-wrap gap-3">
|
||
{% with poi=obs.acc_point_interet %}
|
||
<div class="form-check"><input class="form-check-input" type="checkbox" name="acc_point_interet" value="bus_stop" id="obs-{{ obs.id }}-p1" {% if "bus_stop" in poi %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-p1">{% translate "Arrêt Bus/Tram" %}</label></div>
|
||
<div class="form-check"><input class="form-check-input" type="checkbox" name="acc_point_interet" value="park" id="obs-{{ obs.id }}-p2" {% if "park" in poi %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-p2">{% translate "Parc" %}</label></div>
|
||
<div class="form-check"><input class="form-check-input" type="checkbox" name="acc_point_interet" value="school" id="obs-{{ obs.id }}-p3" {% if "school" in poi %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-p3">{% translate "École" %}</label></div>
|
||
<div class="form-check"><input class="form-check-input" type="checkbox" name="acc_point_interet" value="commerce" id="obs-{{ obs.id }}-p4" {% if "commerce" in poi %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-p4">{% translate "Commerce" %}</label></div>
|
||
<div class="form-check"><input class="form-check-input" type="checkbox" name="acc_point_interet" value="monument" id="obs-{{ obs.id }}-p5" {% if "monument" in poi %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-p5">{% translate "Monument" %}</label></div>
|
||
<div class="form-check"><input class="form-check-input" type="checkbox" name="acc_point_interet" value="pedestrian_crossing" id="obs-{{ obs.id }}-p6" {% if "pedestrian_crossing" in poi %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-p6">{% translate "Passage piéton" %}</label></div>
|
||
<div class="form-check"><input class="form-check-input" type="checkbox" name="acc_point_interet" value="place" id="obs-{{ obs.id }}-p7" {% if "place" in poi %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-p7">{% translate "Place" %}</label></div>
|
||
<div class="form-check"><input class="form-check-input" type="checkbox" name="acc_point_interet" value="none" id="obs-{{ obs.id }}-p8" {% if "none" in poi %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-p8">{% translate "Aucun" %}</label></div>
|
||
<div class="form-check"><input class="form-check-input" type="checkbox" name="acc_point_interet" value="other" id="obs-{{ obs.id }}-p9" {% if "other" in poi %}checked{% endif %}><label class="form-check-label small" for="obs-{{ obs.id }}-p9">{% translate "Autre" %}</label></div>
|
||
{% endwith %}
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<label class="form-label small mb-1" for="obs-{{ obs.id }}-pia">{% translate "Autre point d'intérêt" %}</label>
|
||
<input type="text" id="obs-{{ obs.id }}-pia" class="form-control form-control-sm" name="acc_point_interet_autre" value="{{ obs.acc_point_interet_autre|default:'' }}">
|
||
</div>
|
||
<div class="col-12">
|
||
<label class="form-label small mb-1" for="obs-{{ obs.id }}-ar">{% translate "Remarque accessibilité" %}</label>
|
||
<textarea id="obs-{{ obs.id }}-ar" class="form-control form-control-sm" name="acc_remarque" rows="2">{{ obs.acc_remarque|default:"" }}</textarea>
|
||
</div>
|
||
</div>
|
||
|
||
{% if allowed_update_fields %}
|
||
<button type="button" class="btn btn-outline-danger btn-sm obs-mark-delete-btn">
|
||
<i class="bi bi-trash me-1"></i>{% translate "Supprimer cette observation" %}
|
||
</button>
|
||
{% endif %}
|
||
|
||
</div>{# /obs-edit-panel #}
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
{% endfor %}
|
||
|
||
</div>{# /accordion #}
|
||
</div>{# /card-body #}
|
||
</div>{# /card #}
|
||
|
||
{# ── Template for NEW observations ── #}
|
||
{% if allowed_update_fields %}
|
||
<template id="obs-new-item-template">
|
||
<div class="accordion-item obs-item obs-new-item" data-obs-id="">
|
||
<h2 class="accordion-header">
|
||
<button class="accordion-button py-2 px-3 d-flex align-items-center gap-2"
|
||
type="button" data-bs-toggle="collapse" data-bs-target="#obs-c-_NEWID_">
|
||
<span class="obs-header-date text-muted small fw-normal flex-shrink-0">—</span>
|
||
<span class="obs-header-note text-truncate flex-grow-1 small" style="max-width:400px;"></span>
|
||
<span class="obs-delete-badge badge text-bg-danger d-none ms-auto flex-shrink-0">{% translate "Suppression" %}</span>
|
||
</button>
|
||
</h2>
|
||
<div id="obs-c-_NEWID_" class="accordion-collapse show">
|
||
<div class="accordion-body px-3 pt-2 pb-3">
|
||
<div class="obs-edit-panel">
|
||
|
||
<p class="text-uppercase text-secondary mb-1 mt-1" style="font-size:.72rem;letter-spacing:.05em">{% translate "Général" %}</p>
|
||
<div class="row g-2 mb-3">
|
||
<div class="col-md-4">
|
||
<label class="form-label small mb-1" for="obs-_NEWID_-dt">{% translate "Date / heure" %}</label>
|
||
<input type="datetime-local" id="obs-_NEWID_-dt" class="form-control form-control-sm" name="observation_datetime" value="">
|
||
</div>
|
||
<div class="col-12">
|
||
<label class="form-label small mb-1" for="obs-_NEWID_-note">{% translate "Note" %}</label>
|
||
<textarea id="obs-_NEWID_-note" class="form-control form-control-sm" name="observer_note" rows="2"></textarea>
|
||
</div>
|
||
</div>
|
||
|
||
<p class="text-uppercase text-secondary mb-1" style="font-size:.72rem;letter-spacing:.05em">{% translate "Sol" %}</p>
|
||
<div class="row g-2 mb-3">
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-_NEWID_-sol1" name="sol_pente_trop_forte"><label class="form-check-label small" for="obs-_NEWID_-sol1">{% translate "Pente trop forte" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-_NEWID_-sol2" name="sol_instable"><label class="form-check-label small" for="obs-_NEWID_-sol2">{% translate "Sol instable" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-_NEWID_-sol3" name="sol_reflechissant"><label class="form-check-label small" for="obs-_NEWID_-sol3">{% translate "Surface réfléchissante" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-_NEWID_-sol4" name="sol_glissant"><label class="form-check-label small" for="obs-_NEWID_-sol4">{% translate "Surface glissante" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-_NEWID_-sol5" name="sol_fentes"><label class="form-check-label small" for="obs-_NEWID_-sol5">{% translate "Fissures" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-_NEWID_-sol6" name="sol_entrave"><label class="form-check-label small" for="obs-_NEWID_-sol6">{% translate "Entrave" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-_NEWID_-sol7" name="sol_dalles_podo"><label class="form-check-label small" for="obs-_NEWID_-sol7">{% translate "Dalles podotactiles" %}</label></div></div>
|
||
<div class="col-6 col-md-3"><label class="form-label small mb-1" for="obs-_NEWID_-pt">{% translate "Pente transversale (%)" %}</label><input type="number" step="0.1" id="obs-_NEWID_-pt" class="form-control form-control-sm" name="sol_pente_transversale" value=""></div>
|
||
<div class="col-6 col-md-3"><label class="form-label small mb-1" for="obs-_NEWID_-pl">{% translate "Pente longitudinale (%)" %}</label><input type="number" step="0.1" id="obs-_NEWID_-pl" class="form-control form-control-sm" name="sol_pente_longitudinale" value=""></div>
|
||
<div class="col-12"><label class="form-label small mb-1" for="obs-_NEWID_-sr">{% translate "Remarque sol" %}</label><textarea id="obs-_NEWID_-sr" class="form-control form-control-sm" name="sol_remarque" rows="2"></textarea></div>
|
||
</div>
|
||
|
||
<p class="text-uppercase text-secondary mb-1" style="font-size:.72rem;letter-spacing:.05em">{% translate "Accessibilité" %}</p>
|
||
<div class="row g-2 mb-3">
|
||
<div class="col-md-4"><label class="form-label small mb-1">{% translate "Type de quartier" %}</label><select name="acc_type_quartier" class="form-select form-select-sm"><option value="">—</option><option value="importante_ponctuelle">{% translate "Important – ponctuel" %}</option><option value="importante_continue">{% translate "Important – continu" %}</option><option value="faible">{% translate "Faible" %}</option><option value="autre">{% translate "Autre" %}</option></select></div>
|
||
<div class="col-md-4"><label class="form-label small mb-1">{% translate "Densité flux piéton" %}</label><select name="acc_densite_flux_pieton" class="form-select form-select-sm"><option value="">—</option><option value="high">{% translate "Élevée" %}</option><option value="medium">{% translate "Moyenne" %}</option><option value="low">{% translate "Faible" %}</option></select></div>
|
||
<div class="col-md-4"><label class="form-label small mb-1">{% translate "Accès agent (véhicule)" %}</label><select name="acc_agent_vehicule" class="form-select form-select-sm"><option value="">—</option><option value="normal">{% translate "Normal" %}</option><option value="difficult">{% translate "Difficile" %}</option><option value="impossible">{% translate "Impossible" %}</option></select></div>
|
||
<div class="col-md-4"><label class="form-label small mb-1">{% translate "Accès agent (pied)" %}</label><select name="acc_agent_pied" class="form-select form-select-sm"><option value="">—</option><option value="normal">{% translate "Normal" %}</option><option value="difficult">{% translate "Difficile" %}</option><option value="impossible">{% translate "Impossible" %}</option></select></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-_NEWID_-a1" name="acc_approche_2m"><label class="form-check-label small" for="obs-_NEWID_-a1">{% translate "Approche 2 m dégagée" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-_NEWID_-a2" name="acc_voirie_a_traverser"><label class="form-check-label small" for="obs-_NEWID_-a2">{% translate "Voirie à traverser" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-_NEWID_-a3" name="acc_poubelle_isolee"><label class="form-check-label small" for="obs-_NEWID_-a3">{% translate "Poubelle isolée" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-_NEWID_-a4" name="acc_gene_flux_routier"><label class="form-check-label small" for="obs-_NEWID_-a4">{% translate "Gêne flux routier" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-_NEWID_-a5" name="acc_gene_flux_pieton"><label class="form-check-label small" for="obs-_NEWID_-a5">{% translate "Gêne flux piéton" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-_NEWID_-a6" name="acc_chemin_logique"><label class="form-check-label small" for="obs-_NEWID_-a6">{% translate "Itinéraire logique" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-_NEWID_-a7" name="acc_contraste"><label class="form-check-label small" for="obs-_NEWID_-a7">{% translate "Contraste visuel" %}</label></div></div>
|
||
<div class="col-6 col-md-4"><div class="form-check form-switch"><input class="form-check-input" type="checkbox" role="switch" id="obs-_NEWID_-a8" name="acc_indications_tri"><label class="form-check-label small" for="obs-_NEWID_-a8">{% translate "Indicateurs de tri" %}</label></div></div>
|
||
<div class="col-12">
|
||
<label class="form-label small mb-1">{% translate "Points d'intérêt" %}</label>
|
||
<div class="d-flex flex-wrap gap-3">
|
||
<div class="form-check"><input class="form-check-input" type="checkbox" name="acc_point_interet" value="bus_stop" id="obs-_NEWID_-p1"><label class="form-check-label small" for="obs-_NEWID_-p1">{% translate "Arrêt Bus/Tram" %}</label></div>
|
||
<div class="form-check"><input class="form-check-input" type="checkbox" name="acc_point_interet" value="park" id="obs-_NEWID_-p2"><label class="form-check-label small" for="obs-_NEWID_-p2">{% translate "Parc" %}</label></div>
|
||
<div class="form-check"><input class="form-check-input" type="checkbox" name="acc_point_interet" value="school" id="obs-_NEWID_-p3"><label class="form-check-label small" for="obs-_NEWID_-p3">{% translate "École" %}</label></div>
|
||
<div class="form-check"><input class="form-check-input" type="checkbox" name="acc_point_interet" value="commerce" id="obs-_NEWID_-p4"><label class="form-check-label small" for="obs-_NEWID_-p4">{% translate "Commerce" %}</label></div>
|
||
<div class="form-check"><input class="form-check-input" type="checkbox" name="acc_point_interet" value="monument" id="obs-_NEWID_-p5"><label class="form-check-label small" for="obs-_NEWID_-p5">{% translate "Monument" %}</label></div>
|
||
<div class="form-check"><input class="form-check-input" type="checkbox" name="acc_point_interet" value="pedestrian_crossing" id="obs-_NEWID_-p6"><label class="form-check-label small" for="obs-_NEWID_-p6">{% translate "Passage piéton" %}</label></div>
|
||
<div class="form-check"><input class="form-check-input" type="checkbox" name="acc_point_interet" value="place" id="obs-_NEWID_-p7"><label class="form-check-label small" for="obs-_NEWID_-p7">{% translate "Place" %}</label></div>
|
||
<div class="form-check"><input class="form-check-input" type="checkbox" name="acc_point_interet" value="none" id="obs-_NEWID_-p8"><label class="form-check-label small" for="obs-_NEWID_-p8">{% translate "Aucun" %}</label></div>
|
||
<div class="form-check"><input class="form-check-input" type="checkbox" name="acc_point_interet" value="other" id="obs-_NEWID_-p9"><label class="form-check-label small" for="obs-_NEWID_-p9">{% translate "Autre" %}</label></div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6"><label class="form-label small mb-1" for="obs-_NEWID_-pia">{% translate "Autre point d'intérêt" %}</label><input type="text" id="obs-_NEWID_-pia" class="form-control form-control-sm" name="acc_point_interet_autre" value=""></div>
|
||
<div class="col-12"><label class="form-label small mb-1" for="obs-_NEWID_-ar">{% translate "Remarque accessibilité" %}</label><textarea id="obs-_NEWID_-ar" class="form-control form-control-sm" name="acc_remarque" rows="2"></textarea></div>
|
||
</div>
|
||
|
||
<button type="button" class="btn btn-outline-danger btn-sm obs-mark-delete-btn">
|
||
<i class="bi bi-trash me-1"></i>{% translate "Supprimer cette observation" %}
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
{% endif %}
|
||
|
||
{% endwith %}
|
||
{% endblock extra_blocks %}
|