Need live location in Employee checkin

1

Dear Team,
In Employee check in , will update data i need live location as default,employee cant able to change or mark the loaction,but now it shows as default as incorrect location and unable to save nad refersh map,how to enable save button how could i change in to live tracking

image
image1721×887 173 KB

image
image1317×741 66.7 KB

need to trigger that button

2

I am experiencing same issue and I hope someone here helps with the solution

3

Hi @Emmanuel_Oreva:

Try a client script:

frm.fields_dict.geo_field.map.locate({setView : true})

Note that will only works under https domain due browser restrictions.
Hope this helps.

1 Like
4

This is the script to get the live location of an employee, but first it throws an error with longitude not found and then shows a wrong location.

frappe.ui.form.on(‘Employee Checkin’, {
onload(frm) {

    function onPositionRecieved(position){
        var longitude= position.coords.longitude;
        var latitude= position.coords.latitude;
        frm.set_value('longitude',longitude);
        frm.set_value('latitude',latitude);
        console.log(longitude);
        console.log(latitude);
        fetch('https://api.opencagedata.com/geocode/v1/json?q='+latitude+'+'+longitude+'&key=de1bf3be66b546b89645e500ec3a3a28')
         .then(response => response.json())
        .then(data => {
            var city=data['results'][0].components.city;
            var state=data['results'][0].components.state;
            var area=data['results'][0].components.residential;
            frm.set_value('city',city);
            frm.set_value('state',state);
            frm.set_value('area',area);
            console.log(data);
        })
        .catch(err => console.log(err));
        frm.set_df_property('my_location','options','<div class="mapouter"><div class="gmap_canvas"><iframe width=100% height="300" id="gmap_canvas" src="https://maps.google.com/maps?q='+latitude+','+longitude+'&t=&z=17&ie=UTF8&iwloc=&output=embed" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"></iframe><a href="https://yt2.org/youtube-to-mp3-ALeKk00qEW0sxByTDSpzaRvl8WxdMAeMytQ1611842368056QMMlSYKLwAsWUsAfLipqwCA2ahUKEwiikKDe5L7uAhVFCuwKHUuFBoYQ8tMDegUAQCSAQCYAQCqAQdnd3Mtd2l6"></a><br><style>.mapouter{position:relative;text-align:right;height:300px;width:100%;}</style><style>.gmap_canvas {overflow:hidden;background:none!important;height:300px;width:100%;}</style></div></div>');
        frm.refresh_field('my_location');
    }
    
    function locationNotRecieved(positionError){
        console.log(positionError);
    }
    
    if(frm.doc.longitude && frm.doc.latitude){
        frm.set_df_property('my_location','options','<div class="mapouter"><div class="gmap_canvas"><iframe width=100% height="300" id="gmap_canvas" src="https://maps.google.com/maps?q='+frm.doc.latitude+','+frm.doc.longitude+'&t=&z=17&ie=UTF8&iwloc=&output=embed" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"></iframe><a href="https://yt2.org/youtube-to-mp3-ALeKk00qEW0sxByTDSpzaRvl8WxdMAeMytQ1611842368056QMMlSYKLwAsWUsAfLipqwCA2ahUKEwiikKDe5L7uAhVFCuwKHUuFBoYQ8tMDegUAQCSAQCYAQCqAQdnd3Mtd2l6"></a><br><style>.mapouter{position:relative;text-align:right;height:300px;width:100%;}</style><style>.gmap_canvas {overflow:hidden;background:none!important;height:300px;width:100%;}</style></div></div>');
        frm.refresh_field('my_location');
    } else {
        if(navigator.geolocation){
            navigator.geolocation.getCurrentPosition(onPositionRecieved,locationNotRecieved,{ enableHighAccuracy: true});
        }
    }
}

})

Screenshot_1
Screenshot_1739×282 56.6 KB

What could be wrong with the script?

1 Like