From a761caf5db9674edd58862978bde08b3eb1c24ee Mon Sep 17 00:00:00 2001 From: Paul LOPEZ Date: Wed, 6 Nov 2024 23:20:33 +0100 Subject: [PATCH] =?UTF-8?q?Nouvelle=20fonctionnalit=C3=A9=20:=20qualit?= =?UTF-8?q?=C3=A9=20des=20am=C3=A9nagements?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit QualityText component possibilité de déclarer la qualité de l'aménagement et affichage sur tooltip LineTooltip : si la donnée qualité n'est pas définie, le LineTooltip n'affiche pas de ligne supplémentaire qualityText : notion de Inconnue manquante fix factorisation des label de qualityNames qualité : réduction du nombre d'état (satisfaisant et non satisfaisant) + adapatation du LineTooltip composant StatsQuality créé et ajouté dans le bloc aperçu de la page des lignes ajout du composant qualité sur la page d'accueil --- assets/icons/satisfactory.svg | 3 +++ assets/icons/unsatisfactory.svg | 3 +++ components/StatsQuality.vue | 28 +++++++++++++++++++++ components/content/Overview.vue | 2 ++ components/content/QualityText.vue | 38 +++++++++++++++++++++++++++++ components/tooltips/LineTooltip.vue | 34 +++++++++++++++++++++++--- composables/useConfig.ts | 10 +++++++- composables/useStats.ts | 25 +++++++++++++++++-- config.json | 4 ++- pages/index.vue | 3 ++- types/index.ts | 3 +++ 11 files changed, 145 insertions(+), 8 deletions(-) create mode 100644 assets/icons/satisfactory.svg create mode 100644 assets/icons/unsatisfactory.svg create mode 100644 components/StatsQuality.vue create mode 100644 components/content/QualityText.vue diff --git a/assets/icons/satisfactory.svg b/assets/icons/satisfactory.svg new file mode 100644 index 00000000..7e6e2954 --- /dev/null +++ b/assets/icons/satisfactory.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/assets/icons/unsatisfactory.svg b/assets/icons/unsatisfactory.svg new file mode 100644 index 00000000..2eae78cd --- /dev/null +++ b/assets/icons/unsatisfactory.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/components/StatsQuality.vue b/components/StatsQuality.vue new file mode 100644 index 00000000..3971a276 --- /dev/null +++ b/components/StatsQuality.vue @@ -0,0 +1,28 @@ + + + diff --git a/components/content/Overview.vue b/components/content/Overview.vue index 4415c58a..7ce830ae 100644 --- a/components/content/Overview.vue +++ b/components/content/Overview.vue @@ -9,6 +9,7 @@ +
@@ -23,6 +24,7 @@ const { path } = useRoute(); const { getLineColor } = useColors(); const { getTotalDistance, displayDistanceInKm } = useStats(); +const { displayQuality } = useConfig(); const { voie } = defineProps({ voie: Object }); diff --git a/components/content/QualityText.vue b/components/content/QualityText.vue new file mode 100644 index 00000000..259edd7a --- /dev/null +++ b/components/content/QualityText.vue @@ -0,0 +1,38 @@ + + + diff --git a/components/tooltips/LineTooltip.vue b/components/tooltips/LineTooltip.vue index cac8ccc8..7641a03b 100644 --- a/components/tooltips/LineTooltip.vue +++ b/components/tooltips/LineTooltip.vue @@ -53,6 +53,15 @@ {{ typologyNames[feature.properties.type] ?? 'Inconnu' }} +
+
+ Qualité +
+
+ + {{ getQuality(feature.properties.quality).label }} +
+
@@ -63,11 +72,11 @@ diff --git a/composables/useConfig.ts b/composables/useConfig.ts index 85cae780..53d7ecce 100644 --- a/composables/useConfig.ts +++ b/composables/useConfig.ts @@ -17,5 +17,13 @@ export const useConfig = () => { return config.nbVoiesCyclables; } - return { getRevName, getAssoName, getAssoLink, getNbVoiesCyclables }; + function displayQuality(): boolean { + return config.qualityDisplay; + } + + function displayQualityOnHomePage(): boolean { + return config.qualityDisplayOnHomePage; + } + + return { getRevName, getAssoName, getAssoLink, getNbVoiesCyclables, displayQuality, displayQualityOnHomePage }; }; diff --git a/composables/useStats.ts b/composables/useStats.ts index c11d1859..575da115 100644 --- a/composables/useStats.ts +++ b/composables/useStats.ts @@ -1,5 +1,5 @@ import { groupBy } from '../helpers/helpers'; -import { isLineStringFeature, type Feature, type Geojson, type LaneType, type LineStringFeature } from '../types'; +import { isLineStringFeature, type Feature, type Geojson, type LaneType, type LineStringFeature, type LaneQuality } from '../types'; export const useStats = () => { function getAllUniqLineStrings(voies: Geojson[]) { @@ -137,6 +137,20 @@ export const useStats = () => { }; } + function getStatsQuality(voies: Geojson[]): { distance: number, percent: number, nbZone: number } { + const features = getAllUniqLineStrings(voies); + const totalDistance = getDistance({ features }); + const unsatisfactoryFeatures = features.filter(feature => feature.properties.quality === 'unsatisfactory'); + + const unsatisfactoryDistance = getDistance({ features: unsatisfactoryFeatures }); + + return { + distance: unsatisfactoryDistance, + percent: Math.round(unsatisfactoryDistance / totalDistance * 100), + nbZone: unsatisfactoryFeatures.length + }; + } + const typologyNames: Record = { bidirectionnelle: 'Piste bidirectionnelle', bilaterale: 'Piste bilatérale', @@ -150,6 +164,11 @@ export const useStats = () => { inconnu: 'Inconnu' }; + const qualityNames: Record = { + unsatisfactory: 'Non satisfaisant', + satisfactory: 'Satisfaisant' + }; + function getStatsByTypology(voies: Geojson[]) { const lineStringFeatures = getAllUniqLineStrings(voies); const totalDistance = getDistance({ features: lineStringFeatures }); @@ -180,6 +199,8 @@ export const useStats = () => { getStatsByTypology, displayDistanceInKm, displayPercent, - typologyNames + typologyNames, + qualityNames, + getStatsQuality }; }; diff --git a/config.json b/config.json index 53d9546a..9117f28b 100644 --- a/config.json +++ b/config.json @@ -141,5 +141,7 @@ "color": "#873E99", "link": "https://destinations2026-sytral.fr/processes/t10" } - ] + ], + "qualityDisplay": false, + "qualityDisplayOnHomePage": false } diff --git a/pages/index.vue b/pages/index.vue index bff2b263..28a0bc11 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -15,6 +15,7 @@
+
@@ -37,7 +38,7 @@