mirror of
https://github.com/devcode-it/openstamanager.git
synced 2025-02-16 11:30:55 +01:00
Migliore mappa interventi
This commit is contained in:
Beppe
parent
8fa4d9a562
commit
c9559f651a
185
modules/interventi/plugins/mappa.php
Normal file
185
modules/interventi/plugins/mappa.php
Normal file
@ -0,0 +1,185 @@
|
||||
<?php
|
||||
/*
|
||||
* OpenSTAManager: il software gestionale open source per l'assistenza tecnica e la fatturazione
|
||||
* Copyright (C) DevCode s.r.l.
|
||||
*
|
||||
* This program is free software: you can redistribute it and/or modify
|
||||
* it under the terms of the GNU General Public License as published by
|
||||
* the Free Software Foundation, either version 3 of the License, or
|
||||
* (at your option) any later version.
|
||||
*
|
||||
* This program is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU General Public License
|
||||
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
include_once __DIR__.'/../../core.php';
|
||||
|
||||
if(get('op')=='getmappa'){
|
||||
$nome = 'Ricarica mappa';
|
||||
}
|
||||
else{
|
||||
$nome = 'Visualizza mappa';
|
||||
}
|
||||
|
||||
echo "<center><a onclick=\"location.href='".$rootdir."/controller.php?id_module=".$id_module."&op=getmappa&r='+Math.random()+'#tab_".Plugins::get('Mostra su mappa')['id']."';\" id='button' class='btn btn-primary btn-lg btn-large'>".$nome."</a></center>";
|
||||
echo "<br>";
|
||||
|
||||
|
||||
if(get('op')=='getmappa'){
|
||||
$current_module = Modules::get($id_module);
|
||||
$total = Util\Query::readQuery($current_module);
|
||||
$module_query = Modules::replaceAdditionals($id_module, $total['query']);
|
||||
|
||||
$search_filters = array();
|
||||
|
||||
if( is_array( $_SESSION['module_'.$id_module] ) ){
|
||||
foreach( $_SESSION['module_'.$id_module] as $field_name => $field_value ){
|
||||
if( $field_value != '' && $field_name != 'selected' && $field_name != 'id_segment'){
|
||||
$field_name = str_replace( "search_", "", $field_name );
|
||||
$field_name = str_replace( "__", " ", $field_name );
|
||||
$field_name = str_replace( "-", " ", $field_name );
|
||||
array_push( $search_filters, "`".$field_name."` LIKE \"%".$field_value."%\"" );
|
||||
}
|
||||
}
|
||||
}
|
||||
if( sizeof($search_filters) > 0 ){
|
||||
$module_query = str_replace( "2=2", "2=2 AND (".implode( " AND ", $search_filters ).") ", $module_query);
|
||||
}
|
||||
|
||||
$rs1 = $dbo->fetchArray( $module_query );
|
||||
|
||||
//marker svg
|
||||
if (!file_exists($docroot.'/assets/dist/img/leaflet/place-marker.svg')) {
|
||||
throw new Exception("File not found: " . $docroot.'/assets/dist/img/leaflet/place-marker.svg');
|
||||
}
|
||||
|
||||
$svgContent = file_get_contents($docroot.'/assets/dist/img/leaflet/place-marker.svg');
|
||||
if ($svgContent === false) {
|
||||
throw new Exception("Error reading file: " . $docroot.'/assets/dist/img/leaflet/place-marker.svg');
|
||||
}
|
||||
$stringa_descrizioni = "";
|
||||
$stringa_content = "";
|
||||
$color = "";
|
||||
$lat = "";
|
||||
$lng = "";
|
||||
for( $i=0; $i<sizeof($rs1); $i++ ){//elenco delle righe
|
||||
$val = html_entity_decode( $rs1[$i]['idanagrafica'] );
|
||||
$id_sede = $dbo->selectOne('in_interventi', '*', ['id' => $rs1[$i]['id']])['idsede_destinazione'];
|
||||
if($id_sede){
|
||||
$query = "SELECT *, nomesede AS ragione_sociale FROM an_sedi WHERE id='".$id_sede."'";
|
||||
$rs=$dbo->fetchArray($query);
|
||||
}else{
|
||||
$query="SELECT *, ragione_sociale FROM an_anagrafiche WHERE idanagrafica='".$val."'";
|
||||
$rs=$dbo->fetchArray($query);
|
||||
}
|
||||
|
||||
if($rs[0]['lat'] && $rs[0]['lng']){
|
||||
$color .= "'".$rs1[$i]['_bg_']."',";
|
||||
$lat .= "'".$rs[0]['lat']."',";
|
||||
$lng .= "'".$rs[0]['lng']."',";
|
||||
$stringa_descrizioni .= "'".str_replace("'", " ", $rs[0]['ragione_sociale'])."',";
|
||||
|
||||
$stringa_content .= "'";
|
||||
|
||||
$stringa_content .= str_replace("'", "", "<big><b>".$rs[0]['ragione_sociale']."</b></big><br>".$rs[0]['indirizzo'].", ".$rs[0]['cap'].", ".$rs[0]['citta']." (".$rs[0]['provincia'].")".($rs[0]['telefono']!=''? "<br><i class=\"fa fa-phone\"></i> ".$rs[0]['telefono'] : "").($rs[0]['email']!=''? "<br><i class=\"fa fa-envelope\"></i> ".$rs[0]['email'] : "")."<br>");
|
||||
|
||||
|
||||
$altri_interventi = $dbo->fetchArray('SELECT * FROM in_interventi WHERE idsede_destinazione='.prepare($id_sede).' AND idanagrafica='.prepare($val).' AND id IN ('.implode(',', array_column($rs1, 'id')).')');
|
||||
for($j=0;$j<sizeof($altri_interventi);$j++){
|
||||
$stringa_content .= str_replace("'", "", "<br> <a href=\"".$rootdir."/editor.php?id_module=".$id_module."&id_record=".$altri_interventi[$j]['id']."\">Intervento numero: ".$altri_interventi[$j]['codice']." del ".date('d/m/Y', strtotime($altri_interventi[$j]['data_richiesta']))."</a>");
|
||||
}
|
||||
|
||||
$stringa_content .= "',";
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
echo "<div id='mappa'></div>";
|
||||
$stringa_descrizioni = substr($stringa_descrizioni,0,-1);
|
||||
$stringa_content = substr($stringa_content,0,-1);
|
||||
$lat = substr($lat,0,-1);
|
||||
$lng = substr($lng,0,-1);
|
||||
?>
|
||||
|
||||
<link rel="stylesheet" href="<?php echo $rootdir; ?>/modules/mappa/css/app.css">
|
||||
|
||||
<!-- Mappa -->
|
||||
<script>
|
||||
var ROOTDIR = '<?php echo $rootdir; ?>';
|
||||
|
||||
setTimeout(function(){
|
||||
caricaMap();
|
||||
}, 2000);
|
||||
|
||||
function caricaMap(){
|
||||
var lat = [<?php echo $lat; ?>];
|
||||
var lng = [<?php echo $lng; ?>];
|
||||
var color = [<?php echo $color; ?>];
|
||||
var descrizioni = [<?php echo $stringa_descrizioni; ?>];
|
||||
var content = [<?php echo $stringa_content; ?>];
|
||||
var svgContent = `<?php echo $svgContent;?>`;
|
||||
const lt = "41.706";
|
||||
const ln = "13.228";
|
||||
var container = L.DomUtil.get("mappa");
|
||||
|
||||
if(container._leaflet_id != null){
|
||||
map.eachLayer(function (layer) {
|
||||
if(layer instanceof L.Marker) {
|
||||
map.removeLayer(layer);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
map = L.map("mappa", {
|
||||
center: [lt, ln],
|
||||
zoom: 6,
|
||||
gestureHandling: true
|
||||
});
|
||||
|
||||
L.tileLayer("<?php echo setting('Tile server OpenStreetMap'); ?>", {
|
||||
maxZoom: 17,
|
||||
attribution: "© OpenStreetMap"
|
||||
}).addTo(map);
|
||||
|
||||
var markerArray = [];
|
||||
if( document.getElementById('mappa') ){
|
||||
for (let i = 0; i < lng.length; i++) {
|
||||
let svgIcon = L.divIcon({
|
||||
html: svgContent.replace('fill="#cccccc"','fill="' + color[i] + '"'),
|
||||
className: '',
|
||||
shadowUrl:globals.rootdir + "/assets/dist/img/leaflet/marker-shadow.png",
|
||||
iconSize: [45, 61],
|
||||
iconAnchor: [12, 41],
|
||||
popupAnchor: [1, -34],
|
||||
shadowSize: [41, 41]
|
||||
});
|
||||
|
||||
markerArray.push(L.marker([ lat[i], lng[i]], {
|
||||
icon: svgIcon,
|
||||
}));
|
||||
|
||||
setTimeout(function() {
|
||||
L.marker([ lat[i], lng[i]], {
|
||||
icon: svgIcon,
|
||||
}).bindTooltip(descrizioni[i],
|
||||
{
|
||||
permanent: false,
|
||||
direction: 'right'
|
||||
}
|
||||
).bindPopup(content[i]
|
||||
).addTo(map);
|
||||
}, 200 * i);
|
||||
}
|
||||
var group = L.featureGroup(markerArray).addTo(map);
|
||||
map.fitBounds(group.getBounds());
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<?php
|
||||
}
|
||||
@ -42,7 +42,7 @@ switch (get('op')) {
|
||||
// Filtri per data
|
||||
$add_query .= ' |date_period(`orario_inizio`,`data_richiesta`)|';
|
||||
|
||||
$query = 'SELECT *, `in_interventi`.`id` AS idintervento, `an_anagrafiche`.`lat` AS lat_anagrafica, `an_anagrafiche`.`lng` AS lng_anagrafica, `an_anagrafiche`.`indirizzo` AS indirizzo_anagrafica, `an_anagrafiche`.`cap` AS cap_anagrafica, `an_anagrafiche`.`citta` AS citta_anagrafica, `an_anagrafiche`.`provincia` AS provincia_anagrafica, `an_sedi`.`lat` AS lat_sede, `an_sedi`.`lng` AS lng_sede, `an_sedi`.`indirizzo` AS indirizzo_sede, `an_sedi`.`cap` AS cap_sede, `an_sedi`.`citta` AS citta_sede, `an_sedi`.`provincia` AS provincia_sede, `in_statiintervento_lang`.`title` AS stato FROM `in_interventi` INNER JOIN `an_anagrafiche` ON `in_interventi`.`idanagrafica`=`an_anagrafiche`.`idanagrafica` LEFT JOIN `an_sedi` ON `in_interventi`.`idsede_destinazione`=`an_sedi`.`id` INNER JOIN `in_statiintervento` ON `in_interventi`.`idstatointervento`=`in_statiintervento`.`id` LEFT JOIN `in_statiintervento_lang` ON (`in_statiintervento_lang`.`id_record` = `in_statiintervento`.`id` AND `in_statiintervento_lang`.`id_lang`= '.prepare(Models\Locale::getDefault()->id).') LEFT JOIN `in_interventi_tecnici` ON `in_interventi_tecnici`.`idintervento` = `in_interventi`.`id` '.$add_query;
|
||||
$query = 'SELECT *, `in_statiintervento`.`colore` AS `colore_stato`, `in_interventi`.`id` AS idintervento, `an_anagrafiche`.`lat` AS lat_anagrafica, `an_anagrafiche`.`lng` AS lng_anagrafica, `an_anagrafiche`.`indirizzo` AS indirizzo_anagrafica, `an_anagrafiche`.`cap` AS cap_anagrafica, `an_anagrafiche`.`citta` AS citta_anagrafica, `an_anagrafiche`.`provincia` AS provincia_anagrafica, `an_sedi`.`lat` AS lat_sede, `an_sedi`.`lng` AS lng_sede, `an_sedi`.`indirizzo` AS indirizzo_sede, `an_sedi`.`cap` AS cap_sede, `an_sedi`.`citta` AS citta_sede, `an_sedi`.`provincia` AS provincia_sede, `in_statiintervento_lang`.`title` AS stato FROM `in_interventi` INNER JOIN `an_anagrafiche` ON `in_interventi`.`idanagrafica`=`an_anagrafiche`.`idanagrafica` LEFT JOIN `an_sedi` ON `in_interventi`.`idsede_destinazione`=`an_sedi`.`id` INNER JOIN `in_statiintervento` ON `in_interventi`.`idstatointervento`=`in_statiintervento`.`id` LEFT JOIN `in_statiintervento_lang` ON (`in_statiintervento_lang`.`id_record` = `in_statiintervento`.`id` AND `in_statiintervento_lang`.`id_lang`= '.prepare(Models\Locale::getDefault()->id).') LEFT JOIN `in_interventi_tecnici` ON `in_interventi_tecnici`.`idintervento` = `in_interventi`.`id` '.$add_query;
|
||||
|
||||
$query = Query::replacePlaceholder($query);
|
||||
$query = Modules::replaceAdditionals(Module::where('name', 'Interventi')->first()->id, $query);
|
||||
@ -53,6 +53,7 @@ switch (get('op')) {
|
||||
|
||||
if (sizeof($records) > 0) {
|
||||
for ($i = 0; $i < sizeof($records); ++$i) {
|
||||
$colore = $records[$i]['colore_stato'];
|
||||
if (!empty($records[$i]['idsede_destinazione'])) {
|
||||
$lat = $records[$i]['lat_sede'];
|
||||
$lng = $records[$i]['lng_sede'];
|
||||
@ -114,7 +115,7 @@ switch (get('op')) {
|
||||
|
||||
$descrizione .= '<hr>';
|
||||
|
||||
$rs[] = ['descrizione' => $descrizione, 'lat' => $lat, 'lng' => $lng];
|
||||
$rs[] = ['descrizione' => $descrizione, 'colore' => $colore, 'lat' => $lat, 'lng' => $lng];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -30,14 +30,28 @@ include_once __DIR__.'/../../core.php';
|
||||
<div id="menu-filtri" class="open-menu">
|
||||
<div style='width:100%;height:50px;background-color:#4d4d4d;padding:8px;font-size:25px;color:white;' class='text-center'>
|
||||
<div class="pull-left"><i class='fa fa-forward clickable' id="menu-filtri-toggle"></i></div>
|
||||
<b>Filtri</b>
|
||||
<b><?php echo tr('Filtri');?></b>
|
||||
</div>
|
||||
|
||||
<div id="lista-filtri" style="padding:20px 40px;height:637px;overflow:auto;">
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12" id="geocomplete">
|
||||
<input type="hidden" name="lat" id="lat" value="">
|
||||
<input type="hidden" name="lng" id="lng" value="">
|
||||
{[ "type": "text", "label": "<?php echo tr('Indirizzo');?>", "name": "gaddress", "value": "", "extra": "data-geo='formatted_address'", "icon-after":"<button type=\"button\" class=\"btn btn-info\" onclick=\"initGeocomplete();\"><i class=\"fa fa-search\"></i></button>", "icon-before":"<button type=\"button\" class=\"btn btn-info\" onclick=\"getLocation();\"><i class=\"fa fa-map-marker\"></i></button>" ]}
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12" id="geocomplete">
|
||||
<input type="hidden" name="lat" id="lat" value="">
|
||||
<input type="hidden" name="lng" id="lng" value="">
|
||||
{[ "type": "number", "label": "<?php echo tr('Nel raggio di');?>", "name": "range", "value": "", "decimals": 0, "icon-after":"m" ]}
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<label style='font-size:12pt;'>Geolocalizzazione attività per anagrafica</label>
|
||||
<label style='font-size:12pt;'><?php echo tr('Geolocalizzazione attività per anagrafica');?></label>
|
||||
<hr>
|
||||
</div>
|
||||
</div>
|
||||
@ -50,7 +64,7 @@ include_once __DIR__.'/../../core.php';
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<label style='font-size:12pt;'>Geolocalizzazione attività per stato</label>
|
||||
<label style='font-size:12pt;'><?php echo tr('Geolocalizzazione attività per stato');?></label>
|
||||
<hr>
|
||||
</div>
|
||||
</div>
|
||||
@ -76,6 +90,9 @@ foreach ($rs_stati as $stato) {
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var indirizzi = [];
|
||||
var coords = [];
|
||||
var circle = "";
|
||||
var ROOTDIR = '<?php echo $rootdir; ?>';
|
||||
|
||||
function caricaMappa() {
|
||||
@ -93,6 +110,91 @@ foreach ($rs_stati as $stato) {
|
||||
attribution: "© OpenStreetMap"
|
||||
}).addTo(map);
|
||||
}
|
||||
|
||||
function initGeocomplete() {
|
||||
$.ajax({
|
||||
url: "https://nominatim.openstreetmap.org/search.php?q=" + encodeURI(input("gaddress").get()) + "&format=jsonv2",
|
||||
type : "GET",
|
||||
dataType: "JSON",
|
||||
success: function(data){
|
||||
input("lat").set(data[0].lat);
|
||||
input("lng").set(data[0].lon);
|
||||
input("gaddress").set(data[0].display_name);
|
||||
|
||||
var latlng = L.latLng(data[0].lat, data[0].lon);
|
||||
map.setView(latlng, 16);
|
||||
|
||||
L.marker(latlng).addTo(map)
|
||||
.bindPopup("You are here").openPopup();
|
||||
|
||||
// Aggiungi cerchio per indicare l'accuratezza
|
||||
if (circle) {
|
||||
map.removeLayer(circle);
|
||||
}
|
||||
|
||||
circle = L.circle(latlng, {
|
||||
radius: $("#range").val().toEnglish()
|
||||
}).addTo(map);
|
||||
|
||||
reload_pointers();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Avvio ricerca indirizzo premendo Invio
|
||||
$("#gaddress, #range").on("keypress", function(e){
|
||||
if(e.which == 13){
|
||||
e.preventDefault();
|
||||
initGeocomplete();
|
||||
}
|
||||
});
|
||||
|
||||
// Funzione per ottenere e visualizzare la geolocalizzazione
|
||||
function getLocation() {
|
||||
if (navigator.geolocation) {
|
||||
navigator.geolocation.getCurrentPosition(onLocationFound, onLocationError);
|
||||
} else {
|
||||
alert("Geolocation is not supported by this browser.");
|
||||
}
|
||||
}
|
||||
|
||||
function onLocationFound(position) {
|
||||
var lat = position.coords.latitude;
|
||||
var lng = position.coords.longitude;
|
||||
|
||||
var latlng = L.latLng(lat, lng);
|
||||
map.setView(latlng, 16);
|
||||
|
||||
if (circle) {
|
||||
map.removeLayer(circle);
|
||||
}
|
||||
|
||||
L.marker(latlng).addTo(map)
|
||||
.bindPopup("You are here").openPopup();
|
||||
|
||||
// Aggiungi cerchio per indicare l'accuratezza
|
||||
circle = L.circle(latlng, {
|
||||
//radius: position.coords.accuracy
|
||||
radius: $("#range").val().toEnglish()
|
||||
}).addTo(map);
|
||||
|
||||
// Invia richiesta per ottenere l'indirizzo
|
||||
$.getJSON('https://nominatim.openstreetmap.org/reverse', {
|
||||
lat: lat,
|
||||
lon: lng,
|
||||
format: 'json'
|
||||
}, function(data) {
|
||||
input("lat").set(data.lat);
|
||||
input("lng").set(data.lon);
|
||||
input("gaddress").set(data.display_name);
|
||||
|
||||
reload_pointers();
|
||||
});
|
||||
}
|
||||
|
||||
function onLocationError(error) {
|
||||
alert("Error: " + error.message);
|
||||
}
|
||||
</script>
|
||||
|
||||
<script type="text/javascript" src="<?php echo $rootdir; ?>/modules/mappa/js/app.js"></script>
|
||||
@ -11,14 +11,6 @@ $(document).ready(function() {
|
||||
|
||||
let map;
|
||||
var markers = [];
|
||||
var icon = new L.Icon({
|
||||
iconUrl: globals.rootdir + "/assets/dist/img/marker-icon.png",
|
||||
shadowUrl:globals.rootdir + "/assets/dist/img/leaflet/marker-shadow.png",
|
||||
iconSize: [25, 41],
|
||||
iconAnchor: [12, 41],
|
||||
popupAnchor: [1, -34],
|
||||
shadowSize: [41, 41]
|
||||
});
|
||||
|
||||
$('#menu-filtri-toggle').click(function() {
|
||||
|
||||
@ -41,9 +33,11 @@ $('#menu-filtri-toggle').click(function() {
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
function reload_pointers() {
|
||||
clearMarkers();
|
||||
var check = [];
|
||||
var svgContent = "";
|
||||
|
||||
$("input[type='checkbox']").each(function() {
|
||||
if($(this).is(':checked')){
|
||||
@ -53,16 +47,61 @@ function reload_pointers() {
|
||||
}
|
||||
});
|
||||
|
||||
$.get(ROOTDIR+'/modules/mappa/actions.php?op=get_markers&idanagrafica='+$('#idanagrafica').val()+'&check='+check, function(data){
|
||||
$.ajax({
|
||||
url: globals.rootdir + '/assets/dist/img/leaflet/place-marker.svg', // Percorso al file SVG
|
||||
dataType: 'text', // Imposta il tipo di dati attesi
|
||||
success: function(data) {
|
||||
svgContent = data; // Inserisci il contenuto SVG nella variabile
|
||||
},
|
||||
error: function() {
|
||||
alert('Failed to load SVG file.');
|
||||
}
|
||||
});
|
||||
|
||||
$.get(globals.rootdir + '/modules/mappa/actions.php?op=get_markers&idanagrafica='+$('#idanagrafica').val()+'&check='+check, function(data){
|
||||
var dettagli = JSON.parse(data);
|
||||
dettagli.forEach(function(dettaglio) {
|
||||
|
||||
if (dettaglio.lat && dettaglio.lng) {
|
||||
let svgIcon = L.divIcon({
|
||||
html: svgContent.replace('fill="#cccccc"','fill="' + dettaglio.colore + '"'),
|
||||
className: '',
|
||||
shadowUrl:globals.rootdir + "/assets/dist/img/leaflet/marker-shadow.png",
|
||||
iconSize: [45, 61],
|
||||
iconAnchor: [12, 41],
|
||||
popupAnchor: [1, -34],
|
||||
shadowSize: [41, 41]
|
||||
});
|
||||
|
||||
L.marker([dettaglio.lat, dettaglio.lng], {
|
||||
icon: icon
|
||||
}).addTo(map);
|
||||
icon: svgIcon
|
||||
}).bindTooltip("",
|
||||
{
|
||||
permanent: false,
|
||||
direction: 'right'
|
||||
}
|
||||
).bindPopup(dettaglio.descrizione
|
||||
).addTo(map);
|
||||
}
|
||||
});
|
||||
|
||||
if (input("lat").get() && input("lng").get()) {
|
||||
const lat = parseFloat(input("lat").get());
|
||||
const lng = parseFloat(input("lng").get());
|
||||
|
||||
var icon = new L.Icon({
|
||||
iconUrl: globals.rootdir + "/assets/dist/img/marker-icon.png",
|
||||
shadowUrl:globals.rootdir + "/assets/dist/img/leaflet/marker-shadow.png",
|
||||
iconSize: [25, 41],
|
||||
iconAnchor: [12, 41],
|
||||
popupAnchor: [1, -34],
|
||||
shadowSize: [41, 41]
|
||||
});
|
||||
|
||||
L.marker([lat, lng], {
|
||||
icon: icon
|
||||
}).addTo(map);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user