Gallardo7761/huertos-bellavista-web
1
0
Fork 0
Code Issues Pull Requests Actions Releases Activity

back to desktop pc

Browse Source
This commit is contained in:
Jose
2026-01-30 11:35:10 +01:00
parent 3f4571af5e
commit 665ac85701
4 changed files with 222 additions and 216 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/Solicitudes/PreUserForm.jsx → src/components/Solicitudes/NewUserForm.jsx
View File

@@ -6,12 +6,12 @@ import PropTypes from 'prop-types';
import { generateSecurePassword } from '../../util/passwordGenerator';
const PreUserForm = ({ onSubmit, userType, plotNumber, errors = {} }) => {
const NewUserForm = ({ onSubmit, userType, plotNumber, errors = {} }) => {
const { getData } = useDataContext();
const fetchedOnce = useRef(false);
const [form, setForm] = useState({
userName: '',
username: '',
password: generateSecurePassword(8),
displayName: '',
dni: '',
@@ -53,10 +53,10 @@ const PreUserForm = ({ onSubmit, userType, plotNumber, errors = {} }) => {
const nuevoUsername = trimmedName
? trimmedName.split(' ')[0].toLowerCase() : "";
if (form.userName !== nuevoUsername) {
setForm(prev => ({ ...prev, userName: nuevoUsername }));
if (form.username !== nuevoUsername) {
setForm(prev => ({ ...prev, username: nuevoUsername }));
}
}, [form.memberNumber, form.displayName, form.userName]);
}, [form.memberNumber, form.displayName, form.username]);
const handleChange = (e) => {
const { name, value, type } = e.target;
@@ -86,7 +86,7 @@ const PreUserForm = ({ onSubmit, userType, plotNumber, errors = {} }) => {
{[
{ label: 'Nombre completo', name: 'displayName', type: 'text', required: true },
{ label: 'Nombre de usuario', name: 'userName', type: 'text', required: true },
{ label: 'Nombre de usuario', name: 'username', type: 'text', required: true },
{ label: 'DNI', name: 'dni', type: 'text', required: true, maxLength: 9 },
{ label: 'Teléfono', name: 'phone', type: 'tel', required: true },
{ label: 'Correo electrónico', name: 'email', type: 'email', required: true },
@@ -139,11 +139,11 @@ const PreUserForm = ({ onSubmit, userType, plotNumber, errors = {} }) => {
);
};
PreUserForm.propTypes = {
NewUserForm.propTypes = {
userType: PropTypes.number.isRequired,
plotNumber: PropTypes.number.isRequired,
onSubmit: PropTypes.func.isRequired,
errors: PropTypes.object
};
export default PreUserForm;
export default NewUserForm;

209
src/components/Solicitudes/SolicitudCard.jsx
View File

@@ -15,117 +15,100 @@ const MotionCard = _motion.create(Card);
const parseDate = (date) => {
if (!date) return 'NO';
const d = new Date(date);
return `${d.getDate().toString().padStart(2, '0')}/${(d.getMonth() + 1).toString().padStart(2, '0')}/${d.getFullYear()}`;
return `${d.getDate().toString().padStart(2, '0')}/${(d.getMonth() + 1)
.toString().padStart(2, '0')}/${d.getFullYear()}`;
};
const getTipoSolicitud = (tipo) => ['Alta', 'Baja', 'Añadir Colaborador', 'Quitar Colaborador', 'Añadir parcela invernadero', 'Dejar parcela invernadero'][tipo] ?? 'Desconocido';
const getEstadoSolicitud = (estado) => ['Pendiente', 'Aceptada', 'Rechazada'][estado] ?? 'Desconocido';
const getTipoSolicitud = (tipo) =>
['Alta', 'Baja', 'Añadir Colaborador', 'Quitar Colaborador', 'Añadir parcela invernadero', 'Dejar parcela invernadero'][tipo]
?? 'Desconocido';
const getEstadoSolicitud = (estado) =>
['Pendiente', 'Aceptada', 'Rechazada'][estado] ?? 'Desconocido';
const getPFP = (tipo) => {
const base = '/images/icons/';
const map = {
0: 'list.svg',
1: 'farmer.svg',
2: 'green_house.svg',
0: 'list.svg',
3: 'join.svg',
4: 'subvencion4.svg',
5: 'programmer.svg'
3: 'join.svg'
};
return base + (map[tipo] || 'farmer.svg');
};
const renderDescripcionSolicitud = (data, onProfile) => {
console.log(data);
const m = data.metadata;
switch (data.type) {
case 0:
if (data.requestedByName) {
return `${data.requestedByName} quiere darse de alta.`;
} else if (data.status !== 1 && data.preDisplayName) {
return `${data.preDisplayName} quiere darse de alta.`;
} else if (data.status !== 1) {
return `Alguien quiere darse de alta.`;
} else {
return `Se ha aceptado esta solicitud de alta.`;
}
return data.status === 1
? 'Se ha aceptado esta solicitud de alta.'
: `${m?.displayName ?? 'Alguien'} quiere darse de alta.`;
case 1:
return onProfile
? "Has solicitado darte de baja."
: data.requestedByName
? `${data.requestedByName} quiere darse de baja.`
: data.status !== 1
? `Alguien quiere darse de baja.`
: `Se ha aceptado esta solicitud de baja.`;
? 'Has solicitado darte de baja.'
: `${m?.displayName ?? 'Alguien'} quiere darse de baja.`;
case 2:
if (onProfile) {
switch (data.status) {
case 0: return "Has solicitado añadir un colaborador.";
case 1: return "Tu solicitud de colaborador ha sido aceptada.";
case 2: return "Tu solicitud de colaborador ha sido rechazada.";
default: return "Solicitud de colaborador desconocida.";
}
} else {
switch (data.status) {
case 0:
return data.requestedByName
? `${data.requestedByName} quiere añadir a ${data.preDisplayName || "un colaborador"} como colaborador.`
: `Alguien quiere añadir a ${data.preDisplayName || "un colaborador"} como colaborador.`;
case 1:
return `La solicitud de colaborador de ${data.requestedByName || "alguien"} ha sido aceptada.`;
case 2:
return `La solicitud de colaborador de ${data.requestedByName || "alguien"} ha sido rechazada.`;
default:
return "Solicitud de colaborador desconocida.";
}
return [
'Has solicitado añadir un colaborador.',
'Tu solicitud de colaborador ha sido aceptada.',
'Tu solicitud de colaborador ha sido rechazada.'
][data.status] ?? 'Solicitud de colaborador.';
}
return data.status === 0
? `${m?.displayName ?? 'Alguien'} quiere añadir un colaborador.`
: `La solicitud de colaborador ha sido ${
data.status === 1 ? 'aceptada' : 'rechazada'
}.`;
case 3:
return onProfile
? "Has solicitado quitar tu colaborador."
: data.requestedByName
? `${data.requestedByName} quiere quitar su colaborador.`
: data.status !== 1
? `Alguien quiere quitar su colaborador.`
: `Se ha aceptado esta solicitud de baja de colaborador.`;
return `${m?.displayName ?? 'Alguien'} quiere quitar su colaborador.`;
case 4:
return onProfile
? "Has solicitado una parcela en el invernadero."
: data.requestedByName
? `${data.requestedByName} quiere una parcela en el invernadero.`
: data.status !== 1
? `Alguien quiere una parcela en el invernadero.`
: `Se ha aceptado esta solicitud de parcela en el invernadero.`;
return `${m?.displayName ?? 'Alguien'} quiere una parcela en el invernadero.`;
case 5:
return onProfile
? "Has solicitado dejar tu parcela del invernadero."
: data.requestedByName
? `${data.requestedByName} quiere dejar su parcela del invernadero.`
: data.status !== 1
? `Alguien quiere dejar su parcela del invernadero.`
: `Se ha aceptado esta solicitud de salida del invernadero.`;
return `${m?.displayName ?? 'Alguien'} quiere dejar su parcela del invernadero.`;
default:
return "Tipo de solicitud desconocido.";
return 'Tipo de solicitud desconocido.';
}
};
const SolicitudCard = ({ data, onAccept, onReject, onDelete, editable = true, onProfile = false }) => {
const handleDelete = () => typeof onDelete === "function" && onDelete(data.requestId);
const SolicitudCard = ({
data,
onAccept,
onReject,
onDelete,
editable = true,
onProfile = false
}) => {
const m = data.metadata;
const handleDelete = () =>
typeof onDelete === 'function' && onDelete(data.requestId);
return (
<MotionCard className="solicitud-card shadow-sm rounded-4 h-100">
<Card.Header className="rounded-top-4 d-flex justify-content-between align-items-center">
<div className="d-flex align-items-center">
<img src={getPFP(data.preType)} width="36" className="rounded me-3" alt="PFP" />
<img
src={getPFP(m?.type)}
width="36"
className="rounded me-3"
alt="PFP"
/>
<div>
<Card.Title className="mb-0">
Solicitud #{data.idx} - {getTipoSolicitud(data.type)}
Solicitud #{data.requestId?.slice(0, 8)} – {getTipoSolicitud(data.type)}
</Card.Title>
<small className='state-small'>Estado: <strong>{getEstadoSolicitud(data.status)}</strong></small>
<small className="state-small">
Estado: <strong>{getEstadoSolicitud(data.status)}</strong>
</small>
</div>
</div>
@@ -133,10 +116,18 @@ const SolicitudCard = ({ data, onAccept, onReject, onDelete, editable = true, on
<AnimatedDropdown
className="end-0"
buttonStyle="card-button"
icon={<FontAwesomeIcon icon={faEllipsisVertical} className="fa-xl" />}>
icon={<FontAwesomeIcon icon={faEllipsisVertical} className="fa-xl" />}
>
{({ closeDropdown }) => (
<div className="dropdown-item d-flex align-items-center text-danger" onClick={() => { handleDelete(); closeDropdown(); }}>
<FontAwesomeIcon icon={faTrash} className="me-2" />Eliminar
<div
className="dropdown-item d-flex align-items-center text-danger"
onClick={() => {
handleDelete();
closeDropdown();
}}
>
<FontAwesomeIcon icon={faTrash} className="me-2" />
Eliminar
</div>
)}
</AnimatedDropdown>
@@ -157,27 +148,73 @@ const SolicitudCard = ({ data, onAccept, onReject, onDelete, editable = true, on
</ListGroup.Item>
</ListGroup>
{data.preDisplayName && (
{m && (
<>
<Card.Subtitle className="card-subtitle mt-3 mb-2">Datos del futuro socio</Card.Subtitle>
<Card.Subtitle className="card-subtitle mt-3 mb-2">
Datos asociados a la solicitud
</Card.Subtitle>
<ListGroup variant="flush" className="border rounded-3">
<ListGroup.Item><FontAwesomeIcon icon={faUser} className="me-2" />Nombre: <strong>{data.preDisplayName}</strong></ListGroup.Item>
<ListGroup.Item><FontAwesomeIcon icon={faIdCard} className="me-2" />DNI: <strong>{data.preDni}</strong></ListGroup.Item>
<ListGroup.Item><FontAwesomeIcon icon={faPhone} className="me-2" />Teléfono: <strong>{data.prePhone}</strong></ListGroup.Item>
<ListGroup.Item><FontAwesomeIcon icon={faEnvelope} className="me-2" />Email: <strong>{data.preEmail}</strong></ListGroup.Item>
<ListGroup.Item><FontAwesomeIcon icon={faHome} className="me-2" />Dirección: <strong>{data.preAddress ?? 'NO'}</strong></ListGroup.Item>
<ListGroup.Item><FontAwesomeIcon icon={faMapMarkerAlt} className="me-2" />Ciudad: <strong>{data.preCity ?? 'NO'} ({data.preZipCode ?? 'NO'})</strong></ListGroup.Item>
<ListGroup.Item><FontAwesomeIcon icon={faHashtag} className="me-2" />Nº socio: <strong>{data.preMemberNumber ?? 'NO'}</strong> | Nº huerto: <strong>{data.prePlotNumber ?? 'NO'}</strong></ListGroup.Item>
<ListGroup.Item><FontAwesomeIcon icon={faSeedling} className="me-2" />Tipo: <strong>{['Lista de Espera', 'Hortelano', 'Hortelano + Invernadero', 'Colaborador'][data.preType]}</strong></ListGroup.Item>
<ListGroup.Item><FontAwesomeIcon icon={faUserShield} className="me-2" />Rol: <strong>{['Usuario', 'Admin', 'Desarrollador'][data.preRole]}</strong></ListGroup.Item>
<ListGroup.Item>
<FontAwesomeIcon icon={faUser} className="me-2" />
Nombre: <strong>{m.displayName}</strong>
</ListGroup.Item>
<ListGroup.Item>
<FontAwesomeIcon icon={faIdCard} className="me-2" />
DNI: <strong>{m.dni}</strong>
</ListGroup.Item>
<ListGroup.Item>
<FontAwesomeIcon icon={faPhone} className="me-2" />
Teléfono: <strong>{m.phone ?? 'NO'}</strong>
</ListGroup.Item>
<ListGroup.Item>
<FontAwesomeIcon icon={faEnvelope} className="me-2" />
Email: <strong>{m.email}</strong>
</ListGroup.Item>
<ListGroup.Item>
<FontAwesomeIcon icon={faUserShield} className="me-2" />
Usuario: <strong>{m.username}</strong>
</ListGroup.Item>
<ListGroup.Item>
<FontAwesomeIcon icon={faHome} className="me-2" />
Dirección: <strong>{m.address ?? 'NO'}</strong>
</ListGroup.Item>
<ListGroup.Item>
<FontAwesomeIcon icon={faMapMarkerAlt} className="me-2" />
Ciudad:{' '}
<strong>
{m.city ?? 'NO'} ({m.zipCode ?? 'NO'})
</strong>
</ListGroup.Item>
<ListGroup.Item>
<FontAwesomeIcon icon={faHashtag} className="me-2" />
Nº socio: <strong>{m.memberNumber ?? 'NO'}</strong> | Nº huerto:{' '}
<strong>{m.plotNumber ?? 'NO'}</strong>
</ListGroup.Item>
<ListGroup.Item>
<FontAwesomeIcon icon={faSeedling} className="me-2" />
Tipo: <strong>{['Lista de espera', 'Hortelano', 'Hortelano + Invernadero', 'Colaborador'][m.type]}</strong>
</ListGroup.Item>
</ListGroup>
</>
)}
{editable && data.status === 0 && (
<div className="d-flex justify-content-end gap-2 mt-3">
<Button variant="danger" size="sm" onClick={() => onReject?.(data)}>Rechazar</Button>
<Button variant="success" size="sm" onClick={() => onAccept?.(data)}>Aceptar</Button>
<Button variant="danger" size="sm" onClick={() => onReject?.(data)}>
Rechazar
</Button>
<Button variant="success" size="sm" onClick={() => onAccept?.(data)}>
Aceptar
</Button>
</div>
)}
</Card.Body>
@@ -194,4 +231,4 @@ SolicitudCard.propTypes = {
onProfile: PropTypes.bool
};
export default SolicitudCard;
export default SolicitudCard;