add bubble chart, fix dashboard perf

This commit is contained in:
Tykayn 2025-06-21 10:26:55 +02:00 committed by tykayn
parent ca00f8c0be
commit ad4170db14
8 changed files with 335 additions and 248 deletions

View file

@ -7,11 +7,17 @@
// any CSS you import will output into a single css file (app.css in this case) // any CSS you import will output into a single css file (app.css in this case)
import './styles/app.css'; import './styles/app.css';
// start the Stimulus application
// import './bootstrap';
import './utils.js'; import './utils.js';
import './opening_hours.js'; import './opening_hours.js';
import './josm.js'; import './josm.js';
import './edit.js'; import './edit.js';
import Chart from 'chart.js/auto';
window.Chart = Chart;
// Attendre le chargement du DOM // Attendre le chargement du DOM
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', () => {

View file

@ -1,5 +1,4 @@
function colorHeadingTable() { function colorHeadingTable() {
const headers = document.querySelectorAll('th'); const headers = document.querySelectorAll('th');
headers.forEach(header => { headers.forEach(header => {
const text = header.textContent; const text = header.textContent;
@ -13,9 +12,7 @@ function colorHeadingTable() {
}); });
} }
function check_validity(e) { function check_validity(e) {
list_inputs_good_to_fill = [ list_inputs_good_to_fill = [
'input[name="commerce_tag_value__contact:email"]', 'input[name="commerce_tag_value__contact:email"]',
'input[name="commerce_tag_value__contact:phone"]', 'input[name="commerce_tag_value__contact:phone"]',
@ -73,20 +70,16 @@ function check_validity(e) {
document.querySelector('#validation_messages').classList.add('is-invalid'); document.querySelector('#validation_messages').classList.add('is-invalid');
} }
} }
// Générer une couleur pastel aléatoire
const genererCouleurPastel = () => { const genererCouleurPastel = () => {
// Utiliser des valeurs plus claires (180-255) pour obtenir des tons pastel
const r = Math.floor(Math.random() * 75 + 180); const r = Math.floor(Math.random() * 75 + 180);
const g = Math.floor(Math.random() * 75 + 180); const g = Math.floor(Math.random() * 75 + 180);
const b = Math.floor(Math.random() * 75 + 180); const b = Math.floor(Math.random() * 75 + 180);
return `rgb(${r}, ${g}, ${b})`; return `rgb(${r}, ${g}, ${b})`;
}; };
async function searchInseeCode(query) { async function searchInseeCode(query) {
try { try {
// Afficher l'indicateur de chargement
document.querySelector('#loading_search_insee').classList.remove('d-none'); document.querySelector('#loading_search_insee').classList.remove('d-none');
const response = await fetch(`https://geo.api.gouv.fr/communes?nom=${query}&fields=nom,code,codesPostaux&limit=10`); const response = await fetch(`https://geo.api.gouv.fr/communes?nom=${query}&fields=nom,code,codesPostaux&limit=10`);
@ -104,21 +97,16 @@ async function searchInseeCode(query) {
} }
} }
function updateMapHeightForLargeScreens() { function updateMapHeightForLargeScreens() {
const mapFound = document.querySelector('#map'); const mapFound = document.querySelector('#map');
if (mapFound && window.innerHeight > 800 && window.innerWidth > 800) { if (mapFound && window.innerHeight > 800 && window.innerWidth > 800) {
mapFound.style.height = window.innerWidth * 0.8 + 'px'; mapFound.style.height = window.innerWidth * 0.8 + 'px';
} else { } else {
console.log('window.innerHeight', window.innerHeight); console.log('window.innerHeight', window.innerHeight);
} }
} }
// lister les changesets de l'utilisateur osm-commerces
async function listChangesets() { async function listChangesets() {
// Ajouter le header Accept pour demander du JSON
const options = { const options = {
headers: { headers: {
'Accept': 'application/json' 'Accept': 'application/json'
@ -128,7 +116,6 @@ async function listChangesets() {
const data = await changesets.json(); const data = await changesets.json();
console.log(data.changesets.length); console.log(data.changesets.length);
// Grouper les changesets par période
const now = new Date(); const now = new Date();
const last24h = new Date(now - 24 * 60 * 60 * 1000); const last24h = new Date(now - 24 * 60 * 60 * 1000);
const last7days = new Date(now - 7 * 24 * 60 * 60 * 1000); const last7days = new Date(now - 7 * 24 * 60 * 60 * 1000);
@ -154,7 +141,6 @@ async function listChangesets() {
} }
}); });
// Afficher les statistiques
const historyDiv = document.getElementById('userChangesHistory'); const historyDiv = document.getElementById('userChangesHistory');
if (historyDiv) { if (historyDiv) {
historyDiv.innerHTML = ` historyDiv.innerHTML = `
@ -170,8 +156,6 @@ async function listChangesets() {
} }
} }
function openInPanoramax() { function openInPanoramax() {
const center = map.getCenter(); const center = map.getCenter();
const zoom = map.getZoom(); const zoom = map.getZoom();
@ -179,147 +163,111 @@ function openInPanoramax() {
window.open(panoramaxUrl); window.open(panoramaxUrl);
} }
function enableLabourageForm() { function enableLabourageForm() {
// Récupérer les éléments du formulaire
const citySearchInput = document.getElementById('citySearch'); const citySearchInput = document.getElementById('citySearch');
const citySuggestionsList = document.getElementById('citySuggestions'); const citySuggestionsList = document.getElementById('citySuggestions');
if (citySearchInput && citySuggestionsList) { if (citySearchInput && citySuggestionsList) {
// Configurer la recherche de ville avec la fonction existante
setupCitySearch('citySearch', 'citySuggestions', function (result_search) { setupCitySearch('citySearch', 'citySuggestions', function (result_search) {
console.log('code_insee', result_search.insee);
// Activer le spinner dans le bouton de labourage
const labourageBtn = document.querySelector('.btn-labourer'); const labourageBtn = document.querySelector('.btn-labourer');
if (labourageBtn) { if (labourageBtn) {
labourageBtn.innerHTML = '<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> Chargement...'; labourageBtn.innerHTML = '<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> Chargement...';
labourageBtn.disabled = true; labourageBtn.disabled = true;
} }
console.log('result_search', result_search, getLabourerUrl(result_search));
window.location.href = getLabourerUrl(result_search); window.location.href = getLabourerUrl(result_search);
}); });
} }
} }
// Fonction pour gérer la recherche de villes
/**
* Configure la recherche de ville avec autocomplétion
* @param {string} inputId - ID de l'input de recherche
* @param {string} suggestionListId - ID de la liste des suggestions
* @param {Function} onSelect - Callback appelé lors de la sélection d'une ville
*/
function setupCitySearch(inputId, suggestionListId, onSelect) { function setupCitySearch(inputId, suggestionListId, onSelect) {
const searchInput = document.getElementById(inputId); const searchInput = document.getElementById(inputId);
const suggestionList = document.getElementById(suggestionListId); const suggestionList = document.getElementById(suggestionListId);
window.searchInput = searchInput;
window.suggestionList = suggestionList;
window.onSelect = onSelect;
if (!searchInput || !suggestionList) return; if (!searchInput || !suggestionList) return;
let timeoutId = null; let timeoutId = null;
let searchOngoing = false; let searchOngoing = false;
searchInput.addEventListener('input', function () { searchInput.addEventListener('input', function () {
console.log('input', this.value);
clearTimeout(timeoutId); clearTimeout(timeoutId);
const query = this.value.trim(); const query = this.value.trim();
if (query.length < 3) {
clearSuggestions();
return;
}
timeoutId = setTimeout(() => { timeoutId = setTimeout(() => {
if (!searchOngoing) { if (!searchOngoing) {
searchOngoing = true; searchOngoing = true;
performSearch(query); performSearch(query).then(() => {
searchOngoing = false; searchOngoing = false;
});
} }
}, 300); }, 300);
}); });
} async function performSearch(query) {
try {
const response = await fetch(`https://geo.api.gouv.fr/communes?nom=${encodeURIComponent(query)}&fields=nom,code,codesPostaux&limit=5`);
function performSearch(query) { const data = await response.json();
console.log('performSearch', query);
fetch(`https://geo.api.gouv.fr/communes?nom=${encodeURIComponent(query)}&fields=nom,code,codesPostaux&limit=5`)
.then(response => response.json())
.then(data => {
const citySuggestions = data.map(city => ({ const citySuggestions = data.map(city => ({
name: city.nom, name: city.nom,
postcode: city.codesPostaux[0], postcode: city.codesPostaux[0],
insee: city.code insee: city.code,
display_name: `${city.nom} (${city.codesPostaux[0]})`
})); }));
displaySuggestions(citySuggestions); displaySuggestions(citySuggestions);
}) } catch (error) {
.catch(error => { console.error("Erreur de recherche:", error);
console.error('Erreur lors de la recherche:', error); }
clearSuggestions(); }
});
}
function displaySuggestions(suggestions) { function displaySuggestions(suggestions) {
console.log('displaySuggestions', suggestions);
clearSuggestions();
suggestions.forEach(suggestion => {
const li = document.createElement('li');
li.className = 'list-group-item p-2';
li.textContent = `${suggestion.name} (${suggestion.postcode})`;
li.addEventListener('click', () => {
searchInput.value = suggestion.name;
clearSuggestions();
if (onSelect) onSelect(suggestion);
});
window.suggestionList.appendChild(li);
});
window.suggestionList.classList.remove('d-none');
console.log('window.suggestionList', window.suggestionList);
}
function clearSuggestions() {
window.suggestionList.innerHTML = '';
}
// Fermer les suggestions en cliquant en dehors
document.addEventListener('click', function (e) {
if (window.searchInput && !window.searchInput?.contains(e.target) && !window.suggestionList?.contains(e.target)) {
clearSuggestions(); clearSuggestions();
suggestions.forEach(suggestion => {
const item = document.createElement('div');
item.classList.add('suggestion-item');
item.textContent = suggestion.display_name;
item.addEventListener('click', () => {
searchInput.value = suggestion.display_name;
clearSuggestions();
if (onSelect) {
onSelect(suggestion);
}
});
suggestionList.appendChild(item);
});
suggestionList.style.display = 'block';
} }
});
// Fonction pour formater l'URL de labourage function clearSuggestions() {
/** suggestionList.innerHTML = '';
* Génère l'URL de labourage pour un code postal donné suggestionList.style.display = 'none';
* @param {string} zipCode - Le code postal }
* @returns {string} L'URL de labourage
*/ document.addEventListener('click', (e) => {
if (!searchInput.contains(e.target) && !suggestionList.contains(e.target)) {
clearSuggestions();
}
});
}
function getLabourerUrl(obj) { function getLabourerUrl(obj) {
if (obj && obj.insee) {
return `/admin/labourer/${obj.insee}`; return `/admin/labourer_insee/${obj.insee}`;
}
// Fonction pour gérer la soumission du formulaire d'ajout de ville
function handleAddCityFormSubmit(event) {
event.preventDefault();
const form = event.target;
const submitButton = form.querySelector('button[type="submit"]');
const zipCodeInput = form.querySelector('input[name="zip_code"]');
if (!zipCodeInput.value) {
return;
} }
// Afficher le spinner return '#';
submitButton.disabled = true; }
const originalContent = submitButton.innerHTML;
submitButton.innerHTML = '<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> Labourer...'; function handleAddCityFormSubmit(event) {
// Rediriger event.preventDefault();
window.location.href = getLabourerUrl(zipCodeInput.value); const zipCode = document.getElementById('selectedZipCode').value;
if (zipCode && zipCode.match(/^\d{5}$/)) {
window.location.href = `/admin/labourer/${zipCode}`;
} else {
alert('Veuillez sélectionner une ville valide avec un code postal.');
}
} }
/**
* Colore les cellules d'un tableau en fonction des pourcentages
* @param {string} selector - Le sélecteur CSS pour cibler les cellules à colorer
* @param {string} color - La couleur de base en format RGB (ex: '154, 205, 50')
*/
function colorizePercentageCells(selector, color = '154, 205, 50') { function colorizePercentageCells(selector, color = '154, 205, 50') {
document.querySelectorAll(selector).forEach(cell => { document.querySelectorAll(selector).forEach(cell => {
const percentage = parseInt(cell.textContent); const percentage = parseInt(cell.textContent);
@ -330,16 +278,9 @@ function colorizePercentageCells(selector, color = '154, 205, 50') {
}); });
} }
/**
* Colore les cellules d'un tableau avec un gradient relatif à la valeur maximale
* @param {string} selector - Le sélecteur CSS pour cibler les cellules à colorer
* @param {string} color - La couleur de base en format RGB (ex: '154, 205, 50')
*/
function colorizePercentageCellsRelative(selector, color = '154, 205, 50') { function colorizePercentageCellsRelative(selector, color = '154, 205, 50') {
// Récupérer toutes les cellules
const cells = document.querySelectorAll(selector); const cells = document.querySelectorAll(selector);
// Trouver la valeur maximale
let maxValue = 0; let maxValue = 0;
cells.forEach(cell => { cells.forEach(cell => {
const value = parseInt(cell.textContent); const value = parseInt(cell.textContent);
@ -348,28 +289,20 @@ function colorizePercentageCellsRelative(selector, color = '154, 205, 50') {
} }
}); });
// Appliquer le gradient relatif à la valeur max
cells.forEach(cell => { cells.forEach(cell => {
const value = parseInt(cell.textContent); const value = parseInt(cell.textContent);
if (!isNaN(value)) { if (!isNaN(value)) {
const alpha = value / maxValue; // Ratio relatif au maximum const alpha = value / maxValue;
cell.style.backgroundColor = `rgba(${color}, ${alpha})`; cell.style.backgroundColor = `rgba(${color}, ${alpha})`;
} }
}); });
} }
/**
* Ajuste dynamiquement la taille du texte des éléments list-group-item selon leur nombre
* @param {string} selector - Le sélecteur CSS des éléments à ajuster
* @param {number} [minFont=0.8] - Taille de police minimale en rem
* @param {number} [maxFont=1.2] - Taille de police maximale en rem
*/
function adjustListGroupFontSize(selector, minFont = 0.8, maxFont = 1.2) { function adjustListGroupFontSize(selector, minFont = 0.8, maxFont = 1.2) {
const items = document.querySelectorAll(selector); const items = document.querySelectorAll(selector);
const count = items.length; const count = items.length;
let fontSize = maxFont; let fontSize = maxFont;
if (count > 0) { if (count > 0) {
// Plus il y a d'items, plus la taille diminue, mais jamais en dessous de minFont
fontSize = Math.max(minFont, maxFont - (count - 5) * 0.05); fontSize = Math.max(minFont, maxFont - (count - 5) * 0.05);
} }
items.forEach(item => { items.forEach(item => {
@ -377,97 +310,13 @@ function adjustListGroupFontSize(selector, minFont = 0.8, maxFont = 1.2) {
}); });
} }
function check_validity() {
if (!document.getElementById('editLand')) {
return;
}
const form = document.getElementById('editLand');
const fields = {
'name': {
required: true,
message: 'Le nom est requis'
},
'contact:street': {
required: true,
message: 'La rue est requise'
},
'contact:housenumber': {
required: true,
message: 'Le numéro est requis'
},
'contact:phone': {
pattern: /^(?:(?:\+|00)33|0)\s*[1-9](?:[\s.-]*\d{2}){4}$/,
message: 'Le numéro de téléphone n\'est pas valide'
},
'contact:email': {
pattern: /^[^\s@]+@[^\s@]+\.[^\s@]+$/,
message: 'L\'adresse email n\'est pas valide'
},
'contact:website': {
pattern: /^(https?:\/\/)?([\da-z.-]+)\.([a-z.]{2,6})([/\w .-]*)*\/?$/,
message: 'L\'URL du site web n\'est pas valide'
}
};
let isValid = true;
const errorMessages = {};
// Supprimer les messages d'erreur précédents
document.querySelectorAll('.error-message').forEach(el => el.remove());
// Vérifier chaque champ
for (const [fieldName, rules] of Object.entries(fields)) {
const input = form.querySelector(`[name="${fieldName}"]`);
if (!input) continue;
const value = input.value.trim();
let fieldError = null;
// Ne valider que si le champ n'est pas vide
if (value) {
if (rules.pattern && !rules.pattern.test(value)) {
fieldError = rules.message;
}
} else if (rules.required) {
// Si le champ est vide et requis
fieldError = rules.message;
}
if (fieldError) {
isValid = false;
errorMessages[fieldName] = fieldError;
// Créer et afficher le message d'erreur
const errorDiv = document.createElement('div');
errorDiv.className = 'error-message text-danger small mt-1';
errorDiv.textContent = fieldError;
input.parentNode.appendChild(errorDiv);
// Ajouter une classe d'erreur au champ
input.classList.add('is-invalid');
} else {
input.classList.remove('is-invalid');
}
}
return isValid;
}
// Exporter les fonctions dans window
window.setupCitySearch = setupCitySearch; window.setupCitySearch = setupCitySearch;
window.getLabourerUrl = getLabourerUrl;
window.handleAddCityFormSubmit = handleAddCityFormSubmit; window.handleAddCityFormSubmit = handleAddCityFormSubmit;
window.colorizePercentageCells = colorizePercentageCells; window.colorizePercentageCells = colorizePercentageCells;
window.colorizePercentageCellsRelative = colorizePercentageCellsRelative; window.colorizePercentageCellsRelative = colorizePercentageCellsRelative;
window.adjustListGroupFontSize = adjustListGroupFontSize;
window.check_validity = check_validity; window.check_validity = check_validity;
window.enableLabourageForm = enableLabourageForm;
window.performSearch = performSearch;
window.openInPanoramax = openInPanoramax; window.openInPanoramax = openInPanoramax;
window.listChangesets = listChangesets; window.listChangesets = listChangesets;
window.updateMapHeightForLargeScreens = updateMapHeightForLargeScreens; window.colorHeadingTable = colorHeadingTable;
window.searchInseeCode = searchInseeCode; window.adjustListGroupFontSize = adjustListGroupFontSize;
window.genererCouleurPastel = genererCouleurPastel; window.genererCouleurPastel = genererCouleurPastel;
window.check_validity = check_validity;

21
package-lock.json generated
View file

@ -9,6 +9,7 @@
"@babel/core": "^7.17.0", "@babel/core": "^7.17.0",
"@babel/preset-env": "^7.16.0", "@babel/preset-env": "^7.16.0",
"@symfony/webpack-encore": "^5.0.0", "@symfony/webpack-encore": "^5.0.0",
"chart.js": "^4.5.0",
"core-js": "^3.38.0", "core-js": "^3.38.0",
"regenerator-runtime": "^0.13.9", "regenerator-runtime": "^0.13.9",
"webpack": "^5.74.0", "webpack": "^5.74.0",
@ -1694,6 +1695,13 @@
"@jridgewell/sourcemap-codec": "^1.4.14" "@jridgewell/sourcemap-codec": "^1.4.14"
} }
}, },
"node_modules/@kurkle/color": {
"version": "0.3.4",
"resolved": "https://registry.npmjs.org/@kurkle/color/-/color-0.3.4.tgz",
"integrity": "sha512-M5UknZPHRu3DEDWoipU6sE8PdkZ6Z/S+v4dD+Ke8IaNlpdSQah50lz1KtcFBa2vsdOnwbbnxJwVM4wty6udA5w==",
"dev": true,
"license": "MIT"
},
"node_modules/@nuxt/friendly-errors-webpack-plugin": { "node_modules/@nuxt/friendly-errors-webpack-plugin": {
"version": "2.6.0", "version": "2.6.0",
"resolved": "https://registry.npmjs.org/@nuxt/friendly-errors-webpack-plugin/-/friendly-errors-webpack-plugin-2.6.0.tgz", "resolved": "https://registry.npmjs.org/@nuxt/friendly-errors-webpack-plugin/-/friendly-errors-webpack-plugin-2.6.0.tgz",
@ -2469,6 +2477,19 @@
"node": ">=4" "node": ">=4"
} }
}, },
"node_modules/chart.js": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.5.0.tgz",
"integrity": "sha512-aYeC/jDgSEx8SHWZvANYMioYMZ2KX02W6f6uVfyteuCGcadDLcYVHdfdygsTQkQ4TKn5lghoojAsPj5pu0SnvQ==",
"dev": true,
"license": "MIT",
"dependencies": {
"@kurkle/color": "^0.3.0"
},
"engines": {
"pnpm": ">=8"
}
},
"node_modules/chrome-trace-event": { "node_modules/chrome-trace-event": {
"version": "1.0.4", "version": "1.0.4",
"resolved": "https://registry.npmjs.org/chrome-trace-event/-/chrome-trace-event-1.0.4.tgz", "resolved": "https://registry.npmjs.org/chrome-trace-event/-/chrome-trace-event-1.0.4.tgz",

View file

@ -3,6 +3,7 @@
"@babel/core": "^7.17.0", "@babel/core": "^7.17.0",
"@babel/preset-env": "^7.16.0", "@babel/preset-env": "^7.16.0",
"@symfony/webpack-encore": "^5.0.0", "@symfony/webpack-encore": "^5.0.0",
"chart.js": "^4.5.0",
"core-js": "^3.38.0", "core-js": "^3.38.0",
"regenerator-runtime": "^0.13.9", "regenerator-runtime": "^0.13.9",
"webpack": "^5.74.0", "webpack": "^5.74.0",

View file

@ -97,6 +97,7 @@ final class AdminController extends AbstractController
} elseif ($updateExisting) { } elseif ($updateExisting) {
// Mettre à jour les données depuis Overpass uniquement si updateExisting est true // Mettre à jour les données depuis Overpass uniquement si updateExisting est true
$existingPlace->update_place_from_overpass_data($placeData); $existingPlace->update_place_from_overpass_data($placeData);
$stats->addPlace($existingPlace);
$this->entityManager->persist($existingPlace); $this->entityManager->persist($existingPlace);
$updatedCount++; $updatedCount++;
} }
@ -452,11 +453,14 @@ final class AdminController extends AbstractController
} }
// Récupérer toutes les données // Récupérer toutes les données
$places = $this->motocultrice->labourer($insee_code); $places_overpass = $this->motocultrice->labourer($insee_code);
$processedCount = 0; $processedCount = 0;
$updatedCount = 0; $updatedCount = 0;
$deletedCount = 0;
foreach ($places as $placeData) { $overpass_osm_ids = array_map(fn($place) => $place['id'], $places_overpass);
foreach ($places_overpass as $placeData) {
// Vérifier si le lieu existe déjà // Vérifier si le lieu existe déjà
$existingPlace = $this->entityManager->getRepository(Place::class) $existingPlace = $this->entityManager->getRepository(Place::class)
->findOneBy(['osmId' => $placeData['id']]); ->findOneBy(['osmId' => $placeData['id']]);
@ -477,8 +481,11 @@ final class AdminController extends AbstractController
->setSiret($this->motocultrice->find_siret($placeData['tags']) ?? '') ->setSiret($this->motocultrice->find_siret($placeData['tags']) ?? '')
->setAskedHumainsSupport(false) ->setAskedHumainsSupport(false)
->setLastContactAttemptDate(null) ->setLastContactAttemptDate(null)
->setNote('') ->setNote($this->motocultrice->find_tag($placeData['tags'], 'note') ? true : false)
->setPlaceCount(0); ->setNoteContent($this->motocultrice->find_tag($placeData['tags'], 'note') ?? '')
->setPlaceCount(0)
// ->setOsmData($placeData['modified'] ?? null)
;
// Mettre à jour les données depuis Overpass // Mettre à jour les données depuis Overpass
$place->update_place_from_overpass_data($placeData); $place->update_place_from_overpass_data($placeData);
@ -487,17 +494,63 @@ final class AdminController extends AbstractController
$stats->addPlace($place); $stats->addPlace($place);
$processedCount++; $processedCount++;
} elseif ($updateExisting) { } elseif ($updateExisting) {
// Mettre à jour les données depuis Overpass uniquement si updateExisting est true // Mettre à jour les données depuis Overpass et s'assurer qu'il est marqué comme "vivant"
$existingPlace->setDead(false);
$existingPlace->update_place_from_overpass_data($placeData); $existingPlace->update_place_from_overpass_data($placeData);
$stats->addPlace($existingPlace);
$this->entityManager->persist($existingPlace); $this->entityManager->persist($existingPlace);
$updatedCount++; $updatedCount++;
} }
} }
// Flush final // Supprimer les lieux qui ne sont plus dans la réponse Overpass
$this->entityManager->flush(); $db_places = $this->entityManager->getRepository(Place::class)->findBy(['zip_code' => $insee_code]);
foreach ($db_places as $db_place) {
if (!in_array($db_place->getOsmId(), $overpass_osm_ids)) {
$this->entityManager->remove($db_place);
$deletedCount++;
}
}
// Récupérer tous les commerces de la zone qui n'ont pas été supprimés
$commerces = $this->entityManager->getRepository(Place::class)->findBy(['zip_code' => $insee_code]);
// Récupérer les stats existantes pour la zone
$stats = $this->entityManager->getRepository(Stats::class)->findOneBy(['zone' => $insee_code]);
if(!$stats) {
$stats = new Stats();
$stats->setZone($insee_code);
}
$urls = $stats->getAllCTCUrlsMap();
$statsHistory = $this->entityManager->getRepository(StatsHistory::class)
->createQueryBuilder('sh')
->where('sh.stats = :stats')
->setParameter('stats', $stats)
->orderBy('sh.id', 'DESC')
->setMaxResults(365)
->getQuery()
->getResult();
// Calculer les statistiques
$calculatedStats = $this->motocultrice->calculateStats($commerces);
// Mettre à jour les stats pour la zone donnée
$stats->setPlacesCount($calculatedStats['places_count']);
$stats->setAvecHoraires($calculatedStats['counters']['avec_horaires']);
$stats->setAvecAdresse($calculatedStats['counters']['avec_adresse']);
$stats->setAvecSite($calculatedStats['counters']['avec_site']);
$stats->setAvecAccessibilite($calculatedStats['counters']['avec_accessibilite']);
$stats->setAvecNote($calculatedStats['counters']['avec_note']);
$stats->setCompletionPercent($calculatedStats['completion_percent']);
// Associer les stats à chaque commerce
foreach ($commerces as $commerce) {
$commerce->setStats($stats);
$this->entityManager->persist($commerce);
}
// Mettre à jour les statistiques finales
$stats->computeCompletionPercent(); $stats->computeCompletionPercent();
// Calculer les statistiques de fraîcheur des données OSM // Calculer les statistiques de fraîcheur des données OSM
@ -564,8 +617,12 @@ final class AdminController extends AbstractController
$message = 'Labourage terminé avec succès. ' . $processedCount . ' nouveaux lieux traités.'; $message = 'Labourage terminé avec succès. ' . $processedCount . ' nouveaux lieux traités.';
if ($updateExisting) { if ($updateExisting) {
$message .= ' ' . $updatedCount . ' lieux existants mis à jour pour la zone '.$stats->getName().' ('.$stats->getZone().').'; $message .= ' ' . $updatedCount . ' lieux existants mis à jour.';
} }
if ($deletedCount > 0) {
$message .= ' ' . $deletedCount . ' lieux ont été supprimés.';
}
$message .= ' Zone : '.$stats->getName().' ('.$stats->getZone().').';
$this->addFlash('success', $message); $this->addFlash('success', $message);
} catch (\Exception $e) { } catch (\Exception $e) {
$this->addFlash('error', 'Erreur lors du labourage : ' . $e->getMessage()); $this->addFlash('error', 'Erreur lors du labourage : ' . $e->getMessage());

View file

@ -162,16 +162,33 @@ out meta;';
public function labourer(string $zone): array public function labourer(string $zone): array
{ {
$query = $this->get_query_places($zone);
$url = 'https://overpass-api.de/api/interpreter?data=' . urlencode($query);
try { try {
$query = $this->get_query_places($zone); $response = $this->client->request('GET', $url, [
$response = $this->client->request('POST', $this->overpassApiUrl, [ 'timeout' => 90, // Augmenter le timeout pour les zones très denses
'body' => ['data' => $query]
]); ]);
if ($response->getStatusCode() !== 200) {
throw new \Exception('L\'API Overpass a retourné un code de statut non-200 : ' . $response->getStatusCode());
}
$data = json_decode($response->getContent(), true); $data = json_decode($response->getContent(), true);
if (json_last_error() !== JSON_ERROR_NONE) {
// Tenter de récupérer le corps de la réponse brute en cas d'erreur JSON pour le débogage
$rawResponse = $response->getContent(false); // ne pas lancer d'exception si la réponse n'est pas décodable
throw new \Exception('Réponse JSON invalide depuis l\'API Overpass. Erreur: ' . json_last_error_msg() . '. Réponse brute : ' . substr($rawResponse, 0, 500));
}
$places = []; $places = [];
if (isset($data['elements'])) { if (isset($data['elements'])) {
if (count($data['elements']) === 0) {
// Ce n'est pas une erreur, juste aucun lieu trouvé. On retourne un tableau vide.
return [];
}
foreach ($data['elements'] as $element) { foreach ($data['elements'] as $element) {
if (isset($element['tags'])) { if (isset($element['tags'])) {
$places[] = [ $places[] = [
@ -198,8 +215,13 @@ out meta;';
gc_collect_cycles(); gc_collect_cycles();
return $places; return $places;
} catch (\Symfony\Contracts\HttpClient\Exception\TransportExceptionInterface $e) {
// Gérer spécifiquement les erreurs de transport (timeout, problème de connexion)
throw new \Exception('Erreur de communication avec l\'API Overpass (le service est peut-être indisponible ou la requête a expiré) : ' . $e->getMessage(), 0, $e);
} catch (\Exception $e) { } catch (\Exception $e) {
throw new \Exception("Erreur lors de la requête Overpass : " . $e->getMessage()); // Rattraper et relancer les autres exceptions (y compris celles que nous avons définies)
throw $e;
} }
} }

View file

@ -23,6 +23,7 @@
overflow-y: auto; overflow-y: auto;
width: 100%; width: 100%;
z-index: 1000; z-index: 1000;
display: none;
} }
.suggestion-item { .suggestion-item {
padding: 8px 12px; padding: 8px 12px;
@ -58,7 +59,42 @@
</div> </div>
</div> </div>
<div class="row mb-4">
<div class="col-12">
<div class="card">
<div class="card-header">
Statistiques des villes (nombre de commerces)
</div>
<div class="card-body">
<canvas id="statsBubbleChart" style="min-height: 400px; width: 100%;"></canvas>
</div>
</div>
</div>
</div>
<div class="row"> <div class="row">
<div class="col-12">
<div class="card">
<div class="card-body">
<h3 class="card-title">Labourer une ville</h3>
<form id="labourerForm">
<div class="search-container">
<input type="text"
id="citySearch"
class="form-control"
placeholder="Rechercher une ville..."
autocomplete="off">
<div id="citySuggestions" class="suggestion-list"></div>
</div>
<input type="hidden" name="zip_code" id="selectedZipCode">
<button type="submit" class="btn btn-primary mt-3">Labourer cette ville</button>
</form>
</div>
</div>
</div>
</div>
<div class="row mt-4">
<div class="col-12"> <div class="col-12">
<h2>Statistiques par ville</h2> <h2>Statistiques par ville</h2>
<div class="table-responsive"> <div class="table-responsive">
@ -69,6 +105,7 @@
<th>Code postal</th> <th>Code postal</th>
<th>Complétion</th> <th>Complétion</th>
<th>Nombre de commerces</th> <th>Nombre de commerces</th>
<th>Lieux par habitants</th>
<th>Actions</th> <th>Actions</th>
</tr> </tr>
</thead> </thead>
@ -84,7 +121,8 @@
</a></td> </a></td>
<td>{{ stat.zone }}</td> <td>{{ stat.zone }}</td>
<td>{{ stat.completionPercent }}%</td> <td>{{ stat.completionPercent }}%</td>
<td>{{ stat.places|length }}</td> <td>{{ stat.placesCount }}</td>
<td>{{ (stat.placesCount / (stat.population or 1 ))|round(2) }}</td>
<td> <td>
<div class="btn-group" role="group"> <div class="btn-group" role="group">
<a href="{{ path('app_admin_stats', {'insee_code': stat.zone}) }}" class="btn btn-sm btn-primary" title="Voir les statistiques de cette ville"> <a href="{{ path('app_admin_stats', {'insee_code': stat.zone}) }}" class="btn btn-sm btn-primary" title="Voir les statistiques de cette ville">
@ -114,31 +152,119 @@
</div> </div>
</div> </div>
</div> </div>
{% include 'public/labourage-form.html.twig' %}
</div> </div>
{% endblock %} {% endblock %}
{% block javascripts %} {% block javascripts %}
{{ parent() }} {{ parent() }}
<script src='{{ asset('js/maplibre/maplibre-gl.js') }}'></script> {# Les scripts sont maintenant gérés par Webpack Encore via app.js #}
<script src='{{ asset('js/utils.js') }}'></script>
<script> <script>
document.addEventListener('DOMContentLoaded', function() { document.addEventListener('DOMContentLoaded', function() {
// Initialiser les tooltips Bootstrap const statsDataRaw = [
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]')) {% for stat in stats %}
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) { {% if stat.placesCount > 0 and stat.name is not null and stat.population > 0 %}
return new bootstrap.Tooltip(tooltipTriggerEl) {
}); label: '{{ (stat.name ~ " (" ~ stat.zone ~ ")")|e('js') }}',
placesCount: {{ stat.placesCount }},
completion: {{ stat.completionPercent|default(0) }},
x: {{ stat.population }},
y: {{ (stat.placesCount / stat.population * 1000)|round(2) }}
},
{% endif %}
{% endfor %}
];
// Colorer les cellules de pourcentage const ctx = document.getElementById('statsBubbleChart');
colorizePercentageCells('td:nth-child(3)'); if (ctx && statsDataRaw.length > 0) {
// colorier selon le nombre de lieux const statsData = statsDataRaw.map(d => ({
colorizePercentageCellsRelative('td:nth-child(4)', '154, 205, 50'); ...d,
r: Math.sqrt(d.placesCount) * 2.5 // Utilise la racine carrée pour la taille, avec un facteur d'échelle
}));
enableLabourageForm(); new Chart(ctx.getContext('2d'), {
performSearch('dieppe'); type: 'bubble',
data: {
datasets: [{
label: 'Commerces par ville',
data: statsData,
backgroundColor: statsData.map(d => `hsla(120, 60%, 70%, ${d.completion / 120 + 0.2})`),
borderColor: 'hsl(120, 60%, 40%)',
borderWidth: 1,
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
plugins: {
legend: {
display: false
},
tooltip: {
callbacks: {
label: function(context) {
const data = context.dataset.data[context.dataIndex];
let label = data.label || '';
if (label) {
label += ': ';
}
label += `${data.placesCount} commerces, ${data.y} pour 1000 hab., ${data.completion}% complétion`;
return label;
}
}
}
},
scales: {
x: {
type: 'logarithmic',
title: {
display: true,
text: 'Population (échelle log)'
}
},
y: {
title: {
display: true,
text: 'Commerces pour 1000 habitants'
}
}
}
}
});
}
// La fonction est maintenant globale grâce à l'import dans app.js
if (typeof colorizePercentageCells === 'function') {
colorizePercentageCells('td:nth-child(3)');
}
// Gérer le formulaire de labourage
const labourageForm = document.getElementById('labourerForm');
const citySearchInput = document.getElementById('citySearch');
const selectedZipCodeInput = document.getElementById('selectedZipCode');
const labourageBtn = labourageForm.querySelector('button[type="submit"]');
const originalBtnHtml = labourageBtn.innerHTML;
if (labourageForm && citySearchInput && typeof setupCitySearch === 'function') {
setupCitySearch('citySearch', 'citySuggestions', function (suggestion) {
// Afficher le spinner et désactiver le bouton
labourageBtn.innerHTML = '<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> Chargement...';
labourageBtn.disabled = true;
citySearchInput.disabled = true;
if (suggestion.insee) {
window.location.href = `/admin/labourer/${suggestion.insee}`;
} else if (suggestion.postcode) {
// Moins probable, mais en solution de repli
window.location.href = `/admin/labourer/${suggestion.postcode}`;
}
});
labourageForm.addEventListener('submit', function(e) {
e.preventDefault();
alert("Veuillez rechercher et sélectionner une ville directement dans la liste de suggestions.");
});
}
}); });
</script> </script>
{% endblock %} {% endblock %}

View file

@ -100,7 +100,7 @@
</div> </div>
</div> </div>
<div class="row city-list "> <div class="row city-list ">
<div id="stats_bubble"></div>
<div class="mt-5"> <div class="mt-5">
<h2><i class="bi bi-geo-alt"></i> Villes disponibles</h2> <h2><i class="bi bi-geo-alt"></i> Villes disponibles</h2>
<p>Visualisez un tableau de bord de la complétion des commerces et autres lieux d'intérêt pour votre ville grâce à OpenStreetMap</p> <p>Visualisez un tableau de bord de la complétion des commerces et autres lieux d'intérêt pour votre ville grâce à OpenStreetMap</p>
@ -239,6 +239,11 @@
}); });
enableLabourageForm(); enableLabourageForm();
function displayStatsBubble(){
const statsBubble = document.querySelector('#stats_bubble');
}
}); });
</script> </script>
{% endblock %} {% endblock %}