2022-07-20 01:26:00 +00:00
|
|
|
import { Button } from 'primereact/button';
|
2022-07-20 01:23:36 +00:00
|
|
|
import { Dropdown } from 'primereact/dropdown';
|
2022-07-25 04:38:48 +00:00
|
|
|
import { InputText } from 'primereact/inputtext';
|
|
|
|
import React, { useEffect, useState } from 'react';
|
2022-07-16 07:48:36 +00:00
|
|
|
|
|
|
|
const Inquilinos = () => {
|
2022-07-20 01:22:50 +00:00
|
|
|
const [communitiesList, setCommunitiesList] = useState([]);
|
2022-07-25 04:38:48 +00:00
|
|
|
const communityIdList = communitiesList.map((community) => community.id);
|
2022-07-20 01:22:50 +00:00
|
|
|
async function getCommunites() {
|
2022-07-25 04:38:48 +00:00
|
|
|
let response = await fetch(
|
|
|
|
'http://localhost:4000/community/allCommunities',
|
|
|
|
{ method: 'GET' },
|
|
|
|
);
|
2022-07-20 01:22:50 +00:00
|
|
|
let list = await response.json();
|
|
|
|
setCommunitiesList(list.message);
|
|
|
|
}
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
getCommunites();
|
2022-07-25 04:38:48 +00:00
|
|
|
}, []);
|
2022-07-16 07:48:36 +00:00
|
|
|
function registrarInquilino() {
|
|
|
|
let data = {
|
2022-07-27 02:13:47 +00:00
|
|
|
dni: document.getElementById('identificacion').value,
|
|
|
|
name: document.getElementById('nombre').value,
|
|
|
|
last_name: document.getElementById('apellidos').value,
|
|
|
|
phone: document.getElementById('telefono').value,
|
2022-07-16 07:48:36 +00:00
|
|
|
email: document.getElementById('correo_electronico').value,
|
2022-07-20 01:21:56 +00:00
|
|
|
community_id: document.getElementById('numero_vivienda').value,
|
2022-07-27 02:13:47 +00:00
|
|
|
password: document.getElementById('password').value,
|
2022-07-20 00:28:41 +00:00
|
|
|
user_type: '3',
|
2022-07-16 07:48:36 +00:00
|
|
|
status: '1',
|
2022-07-25 04:38:48 +00:00
|
|
|
};
|
2022-07-20 00:28:41 +00:00
|
|
|
|
|
|
|
fetch('http://localhost:3000/api/createUser', {
|
|
|
|
method: 'POST',
|
|
|
|
cache: 'no-cache',
|
|
|
|
body: JSON.stringify(data),
|
|
|
|
headers: {
|
|
|
|
'Content-Type': 'application/json',
|
|
|
|
},
|
|
|
|
}).then((response) => {
|
|
|
|
if (response.ok) {
|
2022-07-25 04:38:48 +00:00
|
|
|
alert('Inquilino registrado correctamente');
|
2022-07-20 00:28:41 +00:00
|
|
|
} else {
|
2022-07-25 04:38:48 +00:00
|
|
|
alert('Error al registrar inquilino');
|
2022-07-20 00:28:41 +00:00
|
|
|
}
|
2022-07-25 04:38:48 +00:00
|
|
|
});
|
2022-07-16 07:48:36 +00:00
|
|
|
}
|
2022-07-18 01:20:03 +00:00
|
|
|
|
|
|
|
return (
|
|
|
|
<div className="grid">
|
|
|
|
<div className="col-12">
|
|
|
|
<div className="card">
|
2022-07-20 01:23:36 +00:00
|
|
|
<h5 className="card-header">Registrar Inquilino</h5>
|
|
|
|
<div className="p-fluid formgrid grid">
|
2022-07-28 03:02:59 +00:00
|
|
|
<div className="field col-12 md:col-6">
|
2022-07-27 02:13:47 +00:00
|
|
|
<label htmlFor="nombre">Nombre</label>
|
2022-07-27 02:14:32 +00:00
|
|
|
<InputText type="text" className="form-control" id="nombre" />
|
2022-07-27 02:13:47 +00:00
|
|
|
</div>
|
2022-07-28 03:02:59 +00:00
|
|
|
<div className="field col-12 md:col-6">
|
2022-07-27 02:13:47 +00:00
|
|
|
<label htmlFor="apellidos">Apellidos</label>
|
2022-07-27 02:14:32 +00:00
|
|
|
<InputText type="text" className="form-control" id="apellidos" />
|
2022-07-27 02:13:47 +00:00
|
|
|
</div>
|
2022-07-28 03:02:59 +00:00
|
|
|
<div className="field col-12 md:col-6">
|
2022-07-27 02:13:47 +00:00
|
|
|
<label htmlFor="identificacion">Identificación</label>
|
2022-07-27 02:14:32 +00:00
|
|
|
<InputText
|
|
|
|
type="text"
|
|
|
|
className="form-control"
|
|
|
|
id="identificacion"
|
|
|
|
/>
|
2022-07-27 02:13:47 +00:00
|
|
|
</div>
|
2022-07-28 03:02:59 +00:00
|
|
|
<div className="field col-12 md:col-6">
|
2022-07-20 01:23:36 +00:00
|
|
|
<label htmlFor="correo_electronico">Correo electrónico</label>
|
2022-07-25 04:38:48 +00:00
|
|
|
<InputText
|
|
|
|
type="email"
|
|
|
|
className="form-control"
|
|
|
|
id="correo_electronico"
|
|
|
|
/>
|
2022-07-20 01:23:36 +00:00
|
|
|
</div>
|
2022-07-28 03:02:59 +00:00
|
|
|
<div className="field col-12 md:col-6">
|
2022-07-20 01:23:36 +00:00
|
|
|
<label htmlFor="numero_vivienda">Número de Vivienda</label>
|
2022-07-25 04:38:48 +00:00
|
|
|
<Dropdown
|
|
|
|
id="numero_vivienda"
|
|
|
|
value={communityIdList[0]}
|
|
|
|
options={communitiesList}
|
|
|
|
/>
|
2022-07-20 00:28:41 +00:00
|
|
|
</div>
|
2022-07-28 03:02:59 +00:00
|
|
|
<div className="field col-12 md:col-6">
|
2022-07-27 02:13:47 +00:00
|
|
|
<label htmlFor="identificacion">Identificación</label>
|
2022-07-27 02:14:32 +00:00
|
|
|
<InputText
|
|
|
|
type="password"
|
|
|
|
className="form-control"
|
|
|
|
id="identificacion"
|
|
|
|
/>
|
2022-07-27 02:13:47 +00:00
|
|
|
</div>
|
2022-07-25 04:38:48 +00:00
|
|
|
<Button label="Registrar" onClick={registrarInquilino} />
|
2022-07-20 00:28:41 +00:00
|
|
|
</div>
|
2022-07-18 01:20:03 +00:00
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
2022-07-25 04:38:48 +00:00
|
|
|
);
|
|
|
|
};
|
2022-07-18 01:30:06 +00:00
|
|
|
|
2022-07-25 04:38:48 +00:00
|
|
|
export default React.memo(Inquilinos);
|