116 lines
2.2 KiB
PHP
116 lines
2.2 KiB
PHP
<div>
|
|
<div wire:ignore>
|
|
<div id="reader"></div>
|
|
|
|
<div class="d-none">
|
|
<p>Latitud: <span id="latitud">Esperando GPS...</span></p>
|
|
<p>Longitud: <span id="longitud">Esperando GPS...</span></p>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
@push('scripts')
|
|
|
|
<script>
|
|
|
|
let scanner = null;
|
|
let gpsListo = false;
|
|
let yaEscaneado = false;
|
|
let latitud = null;
|
|
let longitud = null;
|
|
|
|
function iniciarScanner(){
|
|
|
|
if(scanner !== null) return;
|
|
|
|
scanner = new Html5Qrcode("reader");
|
|
|
|
scanner.start(
|
|
{ facingMode: "environment" },
|
|
{ fps: 10, qrbox: 250 },
|
|
(mensaje) => {
|
|
|
|
if(!gpsListo){
|
|
Swal.fire("GPS","Esperando ubicación...","warning");
|
|
return;
|
|
}
|
|
|
|
if(yaEscaneado) return;
|
|
yaEscaneado = true;
|
|
|
|
Livewire.dispatch('qrLeido', {
|
|
texto: mensaje,
|
|
lat: latitud,
|
|
lng: longitud
|
|
});
|
|
|
|
}
|
|
).catch(err => {
|
|
|
|
console.error("Error cámara:", err);
|
|
|
|
Swal.fire(
|
|
"Cámara bloqueada",
|
|
"Debes permitir el acceso a la cámara para escanear el QR",
|
|
"error"
|
|
);
|
|
|
|
});
|
|
|
|
}
|
|
|
|
document.addEventListener('livewire:init', () => {
|
|
|
|
if ("geolocation" in navigator) {
|
|
|
|
navigator.geolocation.getCurrentPosition(
|
|
|
|
function(pos){
|
|
|
|
latitud = pos.coords.latitude;
|
|
longitud = pos.coords.longitude;
|
|
gpsListo = true;
|
|
|
|
document.getElementById("latitud").innerText = latitud;
|
|
document.getElementById("longitud").innerText = longitud;
|
|
|
|
iniciarScanner();
|
|
|
|
},
|
|
|
|
function(error){
|
|
Swal.fire(
|
|
"GPS ERROR",
|
|
"Activa el gps y vuelve a intentar",
|
|
"error"
|
|
);
|
|
},
|
|
|
|
{
|
|
enableHighAccuracy:true,
|
|
timeout:15000,
|
|
maximumAge:0
|
|
});
|
|
|
|
}
|
|
|
|
});
|
|
|
|
document.addEventListener("visibilitychange", function() {
|
|
|
|
if(document.hidden && scanner){
|
|
scanner.stop().catch(()=>{});
|
|
scanner = null;
|
|
}
|
|
|
|
if(!document.hidden && gpsListo){
|
|
iniciarScanner();
|
|
}
|
|
|
|
});
|
|
|
|
</script>
|
|
|
|
@endpush
|