226 lines
8.7 KiB
HTML
226 lines
8.7 KiB
HTML
{% extends "assets/base_assets_index.html" %}
|
|
{% load static i18n %}
|
|
|
|
{% block locations_filter_form %}
|
|
<form method="get" id="filter-form" class="row g-3 mb-4" style="width: 30vw;">
|
|
<div class="col-12">
|
|
<label class="form-label">{% translate "Type de localisation" %}</label>
|
|
<div class="d-flex gap-3">
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="radio" name="location_type" id="location_type_all" value=""
|
|
{% if not selected_location_type %}checked{% endif %}>
|
|
<label class="form-check-label" for="location_type_all">{% translate "Tous" %}</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input" type="radio" name="location_type" id="location_type_naturerwiz" value="naturerwiz"
|
|
{% if selected_location_type == 'naturerwiz' %}checked{% endif %}>
|
|
<label class="form-check-label" for="location_type_naturerwiz">{% translate "GIEP" %}</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-12">
|
|
<button type="button" id="apply-filters" class="btn btn-primary">{% translate "Filtrer" %}</button>
|
|
<button type="button" id="reset-filters" class="btn btn-secondary">{% translate "Réinitialiser" %}</button>
|
|
</div>
|
|
</form>
|
|
{% endblock locations_filter_form %}
|
|
|
|
{% block location_row_actions %}
|
|
{% if can_create_location %}
|
|
<button type="button" class="btn btn-sm btn-outline-primary" data-location-create
|
|
title="{% translate 'Créer une nouvelle localisation GIEP' %}">
|
|
<i class="bi bi-plus-circle"></i>
|
|
</button>
|
|
{% endif %}
|
|
{% endblock location_row_actions %}
|
|
|
|
{% block assets_filter_form %}
|
|
<form method="get" id="assets-filter-form" class="row g-3 mb-3 me-3" style="width: 600px;">
|
|
<div class="col-6">
|
|
<label for="category" class="form-label">{% translate "Catégorie" %}</label>
|
|
<select name="category" id="category" class="form-select" multiple>
|
|
{% for key, value in category_choices %}
|
|
<option value="{{ key }}" {% if key in selected_categories %}selected{% endif %}>
|
|
{{ value }}
|
|
</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
<div class="col-12 d-flex justify-content-between mt-4" style="width: 200px;">
|
|
<button type="button" id="apply-assets-filters" class="btn btn-sm btn-primary">{% translate "Filtrer" %}</button>
|
|
<button type="button" id="reset-assets-filters" class="btn btn-sm btn-secondary">{% translate "Réinitialiser" %}</button>
|
|
</div>
|
|
</form>
|
|
{% endblock assets_filter_form %}
|
|
|
|
{% block asset_row_actions %}
|
|
{% if can_create_asset and not preventive_draft_id %}
|
|
<button type="button" class="btn btn-sm btn-outline-primary" data-bs-toggle="modal" data-bs-target="#addWaterAssetModal"
|
|
title="{% translate 'Créer un nouvel ouvrage GIEP' %}">
|
|
<i class="bi bi-plus-circle"></i>
|
|
</button>
|
|
{% endif %}
|
|
{% endblock asset_row_actions %}
|
|
|
|
{% block const_script %}
|
|
<script>
|
|
const locationsgeojsonUrl = "{% url 'assets:water_locations_geojson' %}";
|
|
const assetsgeojsonUrl = "{% url 'assets:water_assets_geojson' %}";
|
|
|
|
const locationsurl = "";
|
|
const assetsurl = "{% url 'assets:water_index' %}";
|
|
|
|
var locations_property_fields = ['name'];
|
|
var locations_columns = [
|
|
{ field: 'name', title: '{% translate "Nom" %}' }
|
|
];
|
|
|
|
var assets_property_fields = ['category', 'area'];
|
|
var assets_columns = [
|
|
{ field: 'category', title: '{% translate "Catégorie" %}' },
|
|
{ field: 'area', title: '{% translate "Superficie" %}' }
|
|
];
|
|
|
|
const locations_layer_def = {
|
|
id: 'locations',
|
|
type: 'fill',
|
|
source: 'locations',
|
|
paint: {
|
|
'fill-color': '#0094ff',
|
|
'fill-opacity': 0
|
|
}
|
|
};
|
|
var locations_outline_layer = {
|
|
id: 'locations-outline',
|
|
type: 'line',
|
|
source: 'locations',
|
|
paint: {
|
|
'line-color': [
|
|
'case',
|
|
['boolean', ['feature-state', 'highlighted'], false], '#ff0000',
|
|
'#0094ff'
|
|
],
|
|
'line-width': 1,
|
|
'line-opacity': 0.7
|
|
}
|
|
};
|
|
|
|
const assets_hollow_surfaces_layer_def = {
|
|
id: 'assets-hollow',
|
|
type: 'fill',
|
|
source: 'assets',
|
|
filter: [
|
|
'all',
|
|
['==', ['get', 'asset_type'], 'naturerwiasset'],
|
|
['any',
|
|
['==', ['geometry-type'], 'Polygon'],
|
|
['==', ['geometry-type'], 'MultiPolygon']
|
|
]
|
|
],
|
|
paint: {
|
|
'fill-color': [
|
|
'match', ['get', 'structure_type'],
|
|
['massif drainant', 'tranchee drainante', 'collecteur en beton poreux', 'empierrement sedimentation'], '#8d6e63',
|
|
['jardin de pluie', 'noue', 'toiture verte', 'bande filtrante', 'espace vert sur dalle'], '#009688',
|
|
['bassin sec/infiltration', 'bassin en eau', 'bassin orage', 'citerne', 'toiture stockante', 'SAUL-vide', 'SAUL-terre'], '#0277bd',
|
|
'#0288d1'
|
|
],
|
|
'fill-opacity': [
|
|
'case',
|
|
['boolean', ['feature-state', 'highlighted'], false], 0.8,
|
|
0.6
|
|
],
|
|
'fill-outline-color': [
|
|
'case',
|
|
['boolean', ['feature-state', 'highlighted'], false], '#ff0000',
|
|
'#01579B'
|
|
],
|
|
},
|
|
minzoom: 8
|
|
};
|
|
|
|
const assets_lines_layer_def = {
|
|
id: 'assets-lines',
|
|
type: 'line',
|
|
source: 'assets',
|
|
filter: [
|
|
'all',
|
|
['==', ['get', 'asset_type'], 'naturerwiasset'],
|
|
['any',
|
|
['==', ['geometry-type'], 'LineString'],
|
|
['==', ['geometry-type'], 'MultiLineString']
|
|
]
|
|
],
|
|
paint: {
|
|
'line-color': [
|
|
'match', ['get', 'structure_type'],
|
|
['massif drainant', 'tranchee drainante', 'drain', 'collecteur en beton poreux', 'reseau egout separatif'], '#8d6e63',
|
|
['noue', 'jardin de pluie', 'bande filtrante'], '#009688',
|
|
['filet eau', 'caniveau infiltrant', 'gargouille de trottoir', 'avaloir de rail', 'trop plein'], '#0277bd',
|
|
'#0288d1'
|
|
],
|
|
'line-width': [
|
|
'case',
|
|
['boolean', ['feature-state', 'highlighted'], false], 5,
|
|
3
|
|
],
|
|
'line-opacity': 0.8
|
|
},
|
|
minzoom: 8
|
|
};
|
|
|
|
const assets_points_layer_def = {
|
|
id: 'assets-points',
|
|
type: 'circle',
|
|
source: 'assets',
|
|
filter: [
|
|
'all',
|
|
['==', ['get', 'asset_type'], 'naturerwiasset'],
|
|
['any',
|
|
['==', ['geometry-type'], 'Point'],
|
|
['==', ['geometry-type'], 'MultiPoint']
|
|
]
|
|
],
|
|
paint: {
|
|
'circle-radius': [
|
|
'interpolate', ['linear'], ['zoom'],
|
|
8, 1,
|
|
12, 1.5,
|
|
16, 2.5,
|
|
20, 5
|
|
],
|
|
'circle-color': [
|
|
'match', ['get', 'structure_type'],
|
|
['massif drainant', 'tranchee drainante', 'drain', 'collecteur en beton poreux', 'reseau egout separatif'], '#8d6e63',
|
|
['noue', 'jardin de pluie', 'bande filtrante'], '#009688',
|
|
['bassin sec/infiltration', 'bassin en eau', 'bassin orage', 'citerne', 'toiture stockante'], '#0277bd',
|
|
'#0288d1'
|
|
],
|
|
'circle-stroke-width': [
|
|
'case',
|
|
['boolean', ['feature-state', 'highlighted'], false], 2,
|
|
1
|
|
],
|
|
'circle-stroke-color': [
|
|
'case',
|
|
['boolean', ['feature-state', 'highlighted'], false], '#ff0000',
|
|
'#000000'
|
|
],
|
|
'circle-opacity': 0.8
|
|
},
|
|
minzoom: 8
|
|
};
|
|
|
|
const assets_layers_defs = [assets_hollow_surfaces_layer_def, assets_lines_layer_def, assets_points_layer_def];
|
|
</script>
|
|
{% endblock const_script %}
|
|
|
|
{% block extra_script %}
|
|
{% if can_create_location %}
|
|
{% include "assets/components/location_edit_modals.html" with thematic_code=thematic_code location_type=location_type entry_label="Zone GIEP" %}
|
|
{% endif %}
|
|
{% if can_create_asset %}
|
|
{% include "assets/components/add_asset_modal.html" with modal_id="addWaterAssetModal" thematic_code="water" categories=water_categories %}
|
|
<script src="{% static 'assets/asset_add_modal.js' %}"></script>
|
|
{% endif %}
|
|
{% endblock extra_script %}
|