-
- handleInputChange('cantidadMinima', e.target.value)}
- margin="normal"
- error={Boolean(errors.cantidadMinima)}
- helperText={errors.cantidadMinima|| 'Campo Obligatorio'}
- />
-
- handleInputChange('cantidadMaxima', e.target.value)}
- margin="normal"
- error={Boolean(errors.cantidadMaxima)}
- helperText={errors.cantidadMaxima|| 'Campo Obligatorio'}
- />
-
-
-
- handleInputChange('dormitorios', e.target.value)}
- error={Boolean(errors.dormitorios)}
- helperText={errors.dormitorios|| 'Campo Obligatorio'}
- />
-
- handleInputChange('camasSimples', e.target.value)}
- margin="normal"
- error={Boolean(errors.camasSimples)}
- helperText={errors.camasSimples|| 'Campo Obligatorio'}
- />
-
- handleInputChange('camasDobles', e.target.value)}
- margin="normal"
- error={Boolean(errors.camasDobles)}
- helperText={errors.camasDobles|| 'Campo Obligatorio'}
- />
-
-
@@ -400,27 +291,6 @@ function HospedajeForm({ onNext }) {
label="Actualmente Disponible"
/>
- handleInputChange('incluyeDesayuno', e.target.checked)}
- className='checkboxs-orange'
- />
- }
- label="Incluye Desayuno"
- />
-
- handleInputChange('incluyeToallasSabanas', e.target.checked)}
- className='checkboxs-orange'
- />
- }
- label="Incluye Toallas y Sábanas"
- />
@@ -430,11 +300,8 @@ function HospedajeForm({ onNext }) {
);
}
-/*HospedajeForm.propTypes = {
- handleNext: PropTypes.func.isRequired,
-};*/
-HospedajeForm.propTypes = {
+CampingForm.propTypes = {
onNext: PropTypes.func.isRequired,
};
-export default HospedajeForm;
\ No newline at end of file
+export default CampingForm;
\ No newline at end of file
diff --git a/src/pages/users/zservicios.jsx b/src/pages/users/zcultura.jsx
similarity index 62%
rename from src/pages/users/zservicios.jsx
rename to src/pages/users/zcultura.jsx
index 910f7f8..16c0666 100644
--- a/src/pages/users/zservicios.jsx
+++ b/src/pages/users/zcultura.jsx
@@ -1,5 +1,5 @@
import '../../styles/users/zservicios.css';
-import { useState } from 'react';
+import { useState, useEffect } from 'react';
import PropTypes from 'prop-types';
import {
TextField,
@@ -13,22 +13,71 @@ import {
Grid,
Typography,
} from '@mui/material';
+//------------new
+import { GoogleMap, LoadScript, Marker } from '@react-google-maps/api'; // Importar componentes de Google Maps
+const mapContainerStyle = {
+ height: "400px",
+ width: "100%"
+};
-const subcategories = [
- { label: 'Gasfiter', value: 'gasfiter' },
- { label: 'Talleres Mecánicos', value: 'talleres-mecanicos' },
- { label: 'Gasolineras', value: 'gasolineras' },
- { label: 'Supermercados', value: 'supermercados' },
- { label: 'Restaurantes', value: 'restaurantes' },
- { label: 'Centros Médicos', value: 'centros-medicos' },
- ];
+const center = {
+ lat: -33.4489, // Cambia esto a la latitud de tu ubicación inicial
+ lng: -70.6693 // Cambia esto a la longitud de tu ubicación inicial
+};
+//-----------new
+
+
+function CulturaForm({ handleNext }) {
+ //-----------new
+ const [markerPosition, setMarkerPosition] = useState(center); // Estado para la posición del marcador
+ const [userLocation, setUserLocation] = useState(null); // Estado para la ubicación del usuario
+
+ const handleMapClick = async (event) => {
+ const lat = event.latLng.lat();
+ const lng = event.latLng.lng();
+ setMarkerPosition({ lat, lng }); // Actualiza la posición del marcador
+ // Aquí puedes agregar lógica para convertir las coordenadas en una dirección si lo deseas
+ //const address = await getAddressFromLatLng(lat, lng); //new
+ setFormData((prev) => ({ ...prev, ubicacion: `Lat: ${lat}, Lng: ${lng}` })); // Actualiza el campo de ubicación
+ };
+
+ useEffect(() => {
+ // Obtener ubicación actual del usuario
+ if (navigator.geolocation) {
+ navigator.geolocation.getCurrentPosition(position => {
+ const newLocation = {
+ lat: position.coords.latitude,
+ lng: position.coords.longitude,
+ };
+ setUserLocation(newLocation);
+ setMarkerPosition(newLocation);
+ //setFormData(prev => ({ ...prev, ubicacion: address })); //new
+ setFormData(prev => ({ ...prev, ubicacion: `Lat: ${position.coords.latitude}, Lng: ${position.coords.longitude}` }));
+ }, () => {
+ alert("No se pudo obtener la ubicación.");
+ });
+ } else {
+ alert("Geolocalización no es soportada en este navegador.");
+ }
+ }, []);
+
+ /*const getAddressFromLatLng = async (lat, lng) => {
+ const apiKey = "AIzaSyAJuzF9SX5VP6CU38hq-lgRopJ66jYgb5E"; // Reemplaza con tu API key
+ const response = await fetch(`https://maps.googleapis.com/maps/api/geocode/json?latlng=${lat},${lng}&key=${apiKey}`);
+ const data = await response.json();
+ if (data.results && data.results.length > 0) {
+ return data.results[0].formatted_address; // Retorna la primera dirección formateada
+ } else {
+ return ''; // Retorna vacío si no se encuentra dirección
+ }
+ };*/
+ //-----------new
-function ServiciosForm({ handleNext }) {
const [formData, setFormData] = useState({
- subcategoria: '',
titulo: '',
descripcion: '',
ubicacion: '',
+ numeroUbicacion: '',
nombreContacto: '',
celularContacto: '',
mailContacto: '',
@@ -36,15 +85,6 @@ function ServiciosForm({ handleNext }) {
facebook: '',
paginaWeb: '',
disponible: false,
- horarios: {
- lunes: { inicio: '', fin: '', abierto: false },
- martes: { inicio: '', fin: '', abierto: false },
- miercoles: { inicio: '', fin: '', abierto: false },
- jueves: { inicio: '', fin: '', abierto: false },
- viernes: { inicio: '', fin: '', abierto: false },
- sabado: { inicio: '', fin: '', abierto: false },
- domingo: { inicio: '', fin: '', abierto: false },
- },
});
const [errors, setErrors] = useState({});
@@ -83,7 +123,6 @@ function ServiciosForm({ handleNext }) {
const validateForm = () => {
const newErrors = {};
- if (!formData.subcategoria) {newErrors.subcategoria = 'Selecciona una tipo de servicio.';}
if (!formData.titulo) {newErrors.titulo = 'Escribe un título.';}
if (!formData.descripcion) {newErrors.descripcion = 'Escribe una descripción.';}
if (!formData.ubicacion) {
@@ -104,13 +143,7 @@ function ServiciosForm({ handleNext }) {
if (formData.paginaWeb && !/^(https?:\/\/)?([\w\-]+\.)+[\w\-]{2,4}(\/[\w\-\.]*)*$/.test(formData.paginaWeb)) {
newErrors.paginaWeb = 'Debes escribir en el formato indicado de página web. Ej: https://www.ejemplo.com';
}
- if (formData.disponible) {
- Object.keys(formData.horarios).forEach(day => {
- if (formData.horarios[day].abierto && (!formData.horarios[day].inicio || !formData.horarios[day].fin)) {
- newErrors[`horario_${day}`] = `A los días seleccionados abiertos debes ponerle hora de inicio y fin.`;
- }
- });
- }
+
setErrors(newErrors);
return Object.keys(newErrors).length === 0;
@@ -129,21 +162,8 @@ function ServiciosForm({ handleNext }) {
return (