loko/streetup/assets/templates/assets/naturegreensurface_detail.html
2026-07-22 14:48:40 +02:00

122 lines
No EOL
5.5 KiB
HTML

{% extends "base.html" %}
{% load static %}
{% block content %}
<div class="row mt-2" style="height: calc(100vh - 200px);">
<div class="col-md-8" style="max-height: calc(100vh - 200px); overflow: auto;">
<h3 class="h3">
<i class="bi bi-suit-club"></i><span class="mx-2">{{ asset.code}}</span>
</h3>
<hr>
<div class="row mb-4">
<div class="col-md-6">
<label class="mx-2">Statut:</label><i class="bi bi-circle-fill status_{{ asset.status }}"></i> {{ asset.get_status_display }}<br>
<label class="mx-2">Type:</label>{{ asset.model.name_fr|default:"" }}<br>
</div>
<div class="col-md-6">
{% if asset.lon %}
<a href="https://www.google.com/maps?cbll={{ asset.lat|floatformat:'6u'}},{{ asset.lon|floatformat:'6u'}}&cbp=12,0,0,0,5&layer=c&panoid=" target="_blank" style="text-decoration: none; font-size: 16px; display: flex; align-items: center;">
<img src="{% static 'common/google-street-view-logo.png' %}" alt="Street View" height="20" style="margin-right: 8px;">
View in Google Street View
</a>
{% endif %}
</div>
</div>
<div class="row mb-4">
<div class="col-md-12">
<label class="mx-2">Densité:</label>{{ asset.density }}<br>
<label class="mx-2">Pondération:</label>{{ asset.weighting }}<br>
<label class="mx-2">Fréquence de tonte:</label>{{ asset.weighting }}<br>
</div>
</div>
<div class="row mb-4">
<div class="col-md-6">
<label class="mx-2">Dernier entretien:</label>{{ asset.last_preventive_date|default:"" }}<br>
</div>
</div>
<!-- Documents -->
<div class="card mb-4">
<div class="card-header">
<h4>Documents</h4>
</div>
<div class="card-body">
<div class="row">
{% for document in asset.documents.all %}
<div class="col-md-2 mb-3">
<a href="{{ document.file.url }}" target="_blank">
<div class="img-thumbnail" style="width: 100%; height: 100px; overflow: hidden;">
{% if document.thumbnail %}
<img src="{{ document.thumbnail.url }}" alt="{{ document.file.name }}" style="width: 100%; height: 100%; object-fit: cover; object-position: center;">
{% else %}
<img src="{{ document.file.url }}" alt="{{ document.file.name }}" style="width: 100%; height: 100%; object-fit: cover; object-position: center;">
{% endif %}
</div>
</a>
</div>
{% endfor %}
</div>
</div>
</div>
<!-- Interventions -->
<div class="card mb-4">
<div class="card-header">
<h4>Interventions</h4>
</div>
<div class="card-body">
<table id="interventions-table" class="table"
data-height="550"
data-pagination="true"
data-page-size="25"
data-click-to-select="true" >
<thead>
<tr>
<th data-field="actions" data-width="100"></th>
<th data-field="code">Code</th>
<th data-field="title">Titre</th>
<th data-field="begin_date">Début</th>
<th data-field="statut">Statut</th>
</tr>
<tbody>
{% for interv in interventions %}
<tr>
<td>
<a href="{% url 'interventions:interventions_index' %}{{ interv.id }}" type="button" class="btn btn-sm btn-light detail-btn" data-id="${row.id}" data-bs-toggle="tooltip" title="Detail">
<i class="bi bi-info-circle"></i>
</a>
</td>
<td>{{ interv.code }}</td>
<td>{{ interv.title }}</td>
<td>{{ interv.begin_time|date:"d-m-Y H:i" }}</td>
<td>{{ interv.get_status_display }}</td>
</tr>
{% endfor %}
</tbody>
</thead>
</table>
</div>
</div>
</div>
<div class="col-md-4">
<div id="map">
</div>
</div>
</div>
{% endblock content%}
{% block script %}
{{ asset.lon|json_script:"lon_value" }}
{{ asset.lat|json_script:"lat_value" }}
{{ asset.geojson|json_script:"geojson_value" }}
<script>
const feature_geojson = JSON.parse(document.getElementById("geojson_value").textContent);
const feature_lon = JSON.parse(document.getElementById("lon_value").textContent);
const feature_lat = JSON.parse(document.getElementById("lat_value").textContent);
</script>
<script src="{% static 'assets/green_detail.js' %}"></script>
{% endblock script %}