feat: GPS autocompleta dirección y CP, 220 colonias reales por CP

This commit is contained in:
2026-05-23 05:38:19 -06:00
parent 0b03370c85
commit 77b9d8754b

View File

@@ -41,6 +41,7 @@ export default function App() {
const [localizando, setLocalizando] = useState(false); const [localizando, setLocalizando] = useState(false);
const [latGPS, setLatGPS] = useState(20.5185); const [latGPS, setLatGPS] = useState(20.5185);
const [lngGPS, setLngGPS] = useState(-100.8450); const [lngGPS, setLngGPS] = useState(-100.8450);
const [coloniasCP, setColoniasCP] = useState([]);
useEffect(() => { useEffect(() => {
cargarSesion(); cargarSesion();
@@ -292,22 +293,11 @@ export default function App() {
const dirAuto = `${lugar.street || ''} ${lugar.streetNumber || ''}`.trim(); const dirAuto = `${lugar.street || ''} ${lugar.streetNumber || ''}`.trim();
const cpAuto = lugar.postalCode || ''; const cpAuto = lugar.postalCode || '';
if (dirAuto) setDireccion(dirAuto); if (dirAuto) setDireccion(dirAuto);
if (cpAuto) setCodigoPostal(cpAuto); if (cpAuto) {
} await buscarColoniasPorCP(cpAuto);
}
const res = await fetch( Alert.alert('📍 Ubicación detectada',
`${API_URL}/domicilios/ruta-por-coordenadas?lat=${latitude}&lng=${longitude}`, `Dirección: ${dirAuto}\nCP: ${cpAuto}\nSelecciona tu colonia del listado`);
{ headers: { 'Authorization': `Bearer ${token}` } }
);
const data = await res.json();
if (data.cobertura) {
setColoniaSeleccionada(data.colonia_sugerida);
Alert.alert(
'📍 Ubicación detectada',
`Zona: ${data.colonia_sugerida}\nRuta: ${data.nombre_ruta}\nDistancia: ${data.distancia_metros}m`
);
} else {
Alert.alert('Sin cobertura', 'Tu ubicación no está dentro de las zonas de Celaya');
} }
} catch { } catch {
Alert.alert('Error', 'No se pudo obtener tu ubicación'); Alert.alert('Error', 'No se pudo obtener tu ubicación');
@@ -315,6 +305,25 @@ export default function App() {
setLocalizando(false); setLocalizando(false);
}; };
const buscarColoniasPorCP = async (cp) => {
setCodigoPostal(cp);
if (cp.length === 5) {
try {
const res = await fetch(`${API_URL}/colonias-por-cp?codigo_postal=${cp}`, {
headers: { 'Authorization': `Bearer ${token}` }
});
const data = await res.json();
if (data.encontrado && data.colonias.length > 0) {
setColoniasCP(data.colonias);
} else {
setColoniasCP([]);
}
} catch { setColoniasCP([]); }
} else {
setColoniasCP([]);
}
};
if (screen === 'splash') return ( if (screen === 'splash') return (
<View style={styles.splashContainer}> <View style={styles.splashContainer}>
<Text style={styles.splashEmoji}>🚛</Text> <Text style={styles.splashEmoji}>🚛</Text>
@@ -373,7 +382,7 @@ export default function App() {
<TextInput style={styles.input} placeholder="Dirección (ej: Calle Morelos 123)" <TextInput style={styles.input} placeholder="Dirección (ej: Calle Morelos 123)"
value={direccion} onChangeText={setDireccion} /> value={direccion} onChangeText={setDireccion} />
<TextInput style={styles.input} placeholder="Código postal (ej: 38000)" <TextInput style={styles.input} placeholder="Código postal (ej: 38000)"
value={codigoPostal} onChangeText={setCodigoPostal} keyboardType="numeric" /> value={codigoPostal} onChangeText={buscarColoniasPorCP} keyboardType="numeric" />
<TouchableOpacity <TouchableOpacity
style={[styles.btnUbicacion, localizando && { opacity: 0.6 }]} style={[styles.btnUbicacion, localizando && { opacity: 0.6 }]}
onPress={usarUbicacion} onPress={usarUbicacion}
@@ -391,7 +400,7 @@ export default function App() {
</TouchableOpacity> </TouchableOpacity>
{mostrarColonias && ( {mostrarColonias && (
<View style={styles.dropdown}> <View style={styles.dropdown}>
{COLONIAS.map(c => ( {(coloniasCP.length > 0 ? coloniasCP : COLONIAS).map(c => (
<TouchableOpacity key={c} style={styles.dropdownItem} <TouchableOpacity key={c} style={styles.dropdownItem}
onPress={() => { setColoniaSeleccionada(c); setMostrarColonias(false); }}> onPress={() => { setColoniaSeleccionada(c); setMostrarColonias(false); }}>
<Text style={styles.dropdownText}>{c}</Text> <Text style={styles.dropdownText}>{c}</Text>