Merge pull request #147 from DeimosPr4/US-17-VerPerfildeinformacióndecomunidaddevivienda

ver perfil comunidada de vivienda
This commit is contained in:
Eduardo Quiros 2022-08-02 05:19:53 +00:00 committed by GitHub
commit 9676e08e6d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 266 additions and 5 deletions

View File

@ -118,6 +118,11 @@ export class AppController {
return this.appService.findUser(paramUserDNI); return this.appService.findUser(paramUserDNI);
} }
@Get('user/findUserById/:id')
findUserById(@Param('id') id: string) {
return this.appService.findUserById(id);
}
@Delete('user/deleteAdminSystem/:id') @Delete('user/deleteAdminSystem/:id')
deleteAdminSystem(@Param('id') id: string) { deleteAdminSystem(@Param('id') id: string) {
return this.appService.deleteAdminSystem(id); return this.appService.deleteAdminSystem(id);

View File

@ -187,6 +187,17 @@ export class AppService {
.pipe(map((message: string) => ({ message }))); .pipe(map((message: string) => ({ message })));
} }
//GET parameter from API
findUserById(id: string) {
const pattern = { cmd: 'findById' };
const payload = { id: id };
return this.clientUserApp
.send<string>(pattern, payload)
.pipe(map((message: string) => ({ message })));
}
// ====================== COMMUNITIES =============================== // ====================== COMMUNITIES ===============================
//POST parameter from API //POST parameter from API

View File

@ -40,6 +40,12 @@ export class UsersController {
return this.userService.findOneByDNI(dni); return this.userService.findOneByDNI(dni);
} }
@MessagePattern({ cmd: 'findById' })
findById(@Payload() id: string) {
let _id = id['id'];
return this.userService.findOne(_id);
}
@MessagePattern({ cmd: 'findGuardsCommunity' }) @MessagePattern({ cmd: 'findGuardsCommunity' })
findGuardsCommunity(@Payload() community_id: string) { findGuardsCommunity(@Payload() community_id: string) {
let pcommunity_id = community_id['community_id']; let pcommunity_id = community_id['community_id'];

View File

@ -7120,6 +7120,15 @@
} }
.icon-khaki {
color: var(--primary-color);
}
.row {
display: flex;
}
.status { .status {
border-radius: var(--border-radius); border-radius: var(--border-radius);
padding: 0.25em 0.5rem; padding: 0.25em 0.5rem;

View File

@ -184,7 +184,7 @@ const App = () => {
to: '/guardasSeguridad', to: '/guardasSeguridad',
}, },
{ {
label: 'Comunidadades', label: 'Comunidades',
icon: PrimeIcons.BUILDING, icon: PrimeIcons.BUILDING,
to: '/comunidadesViviendas', to: '/comunidadesViviendas',
}, },

View File

@ -9,10 +9,11 @@ import classNames from 'classnames';
import { Dialog } from 'primereact/dialog'; import { Dialog } from 'primereact/dialog';
import { Toolbar } from 'primereact/toolbar'; import { Toolbar } from 'primereact/toolbar';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faHome } from '@fortawesome/free-solid-svg-icons'; import { faHome, faUserAlt } from '@fortawesome/free-solid-svg-icons';
import { faMapLocationDot } from '@fortawesome/free-solid-svg-icons'; import { faMapLocationDot } from '@fortawesome/free-solid-svg-icons';
import { faPhoneAlt } from '@fortawesome/free-solid-svg-icons'; import { faPhoneAlt } from '@fortawesome/free-solid-svg-icons';
import { faEllipsis } from '@fortawesome/free-solid-svg-icons'; import { faEllipsis } from '@fortawesome/free-solid-svg-icons';
import { faHashtag } from '@fortawesome/free-solid-svg-icons';
const Communities = () => { const Communities = () => {
let emptyCommunity = { let emptyCommunity = {
@ -47,6 +48,16 @@ const Communities = () => {
const toast = useRef(null); const toast = useRef(null);
const dt = useRef(null); const dt = useRef(null);
//para el perfil de la comunidad
const [tenants, setTenants] = useState([]);
const [communityDialog, setCommunityDialog] = useState(false);
const [editcommunityDialog, setEditCommunityDialog] = useState(false);
const p = provincesList.map((item) => ({ const p = provincesList.map((item) => ({
label: item.name, label: item.name,
value: item.code, value: item.code,
@ -120,7 +131,7 @@ const Communities = () => {
fillDistricts(); fillDistricts();
}, [cantonId]); }, [cantonId]);
const handleProvinces = (event) => { const handleProvinces = (event) => {
const getprovinciaId = event.target.value; const getprovinciaId = event.target.value;
setProvinciaId(getprovinciaId); setProvinciaId(getprovinciaId);
@ -165,6 +176,20 @@ const Communities = () => {
getCommunites(); getCommunites();
}, []); }, []);
async function tenantsList(id) {
await fetch(`http://localhost:4000/user/findTenants/${id}`, { method: 'GET' })
.then((response) => response.json())
.then(data => data.message)
.then(data => {
setTenants(data)
});
}
useEffect(() => {
tenantsList(community._id);
}, [])
const saveCommunity = () => { const saveCommunity = () => {
if ( if (
community.name && community.name &&
@ -233,6 +258,20 @@ const Communities = () => {
} }
}; };
function findNameTenant(tenant_id) {
let name = '';
if (tenant_id == '') {
name = 'Sin inquilino';
} else {
let tenant = tenants.find(t => t._id == tenant_id )
name = tenant['name'] + ' ' + tenant['last_name'];
}
console.log(name);
return name;
}
const onInputChange = (e, name) => { const onInputChange = (e, name) => {
const val = (e.target && e.target.value) || ''; const val = (e.target && e.target.value) || '';
let _community = { ...community }; let _community = { ...community };
@ -241,6 +280,11 @@ const Communities = () => {
setCommunity(_community); setCommunity(_community);
}; };
const hideCommunityDialog = () => {
setSubmitted(false);
setCommunityDialog(false);
};
const hideDeleteCommunityDialog = () => { const hideDeleteCommunityDialog = () => {
setDeleteCommunityDialog(false); setDeleteCommunityDialog(false);
}; };
@ -258,6 +302,19 @@ const Communities = () => {
setDeleteCommunitiesDialog(true); setDeleteCommunitiesDialog(true);
}; };
const infoCommunity = async (community) => {
await tenantsList(community._id);
setCommunity({ ...community });
setCommunityDialog(true);
};
const editCommunity = (community) => {
setCommunity({ ...community });
setEditCommunityDialog(true);
};
const deleteCommunity = () => { const deleteCommunity = () => {
/* fetch('http://localhost:4000/community/deleteCommunity/' + community._id, { /* fetch('http://localhost:4000/community/deleteCommunity/' + community._id, {
cache: 'no-cache', cache: 'no-cache',
@ -330,6 +387,11 @@ const Communities = () => {
const actionsCommunity = (rowData) => { const actionsCommunity = (rowData) => {
return ( return (
<div className="actions"> <div className="actions">
<Button
icon="pi pi-exclamation-circle"
className="p-button-rounded p-button-primary mr-2"
onClick={() => infoCommunity(rowData)}
/>
<Button <Button
icon="pi pi-trash" icon="pi pi-trash"
className="p-button-rounded p-button-danger mt-2" className="p-button-rounded p-button-danger mt-2"
@ -381,6 +443,18 @@ const Communities = () => {
</div> </div>
); );
const communityDialogFooter = (
<>
<Button
label="Cerrar"
icon="pi pi-times"
className="p-button-text"
onClick={hideCommunityDialog}
/>
</>
);
const deleteCommunityDialogFooter = ( const deleteCommunityDialogFooter = (
<> <>
<Button <Button
@ -477,7 +551,7 @@ const Communities = () => {
<> <>
<p> <p>
{' '} {' '}
<FontAwesomeIcon icon={faPhoneAlt} style={{ color: '#D7A86E' }} />{' '} <FontAwesomeIcon icon={faHashtag} style={{ color: '#D7A86E' }} />{' '}
Número de viviendas Número de viviendas
</p> </p>
</> </>
@ -493,6 +567,30 @@ const Communities = () => {
</> </>
); );
//ver perfil comunidad
const headerTenant = (
<>
<p>
{' '}
<FontAwesomeIcon icon={faUserAlt} style={{ color: '#C08135' }} />{' '}
Inquilinos
</p>
</>
);
const tenantsBodyTemplate = (rowData) => {
let tenants = rowData.tenants;
let name = findNameTenant(tenants.tenant_id);
console.log(name);
return (
<>
{name}
</>
)
};
return ( return (
<div className="grid"> <div className="grid">
<div className="col-12"> <div className="col-12">
@ -564,10 +662,142 @@ const Communities = () => {
<Column <Column
field="name_admin" field="name_admin"
sortable sortable
header={headerAdministrator}
style={{ flexGrow: 1, flexBasis: '180px' }} style={{ flexGrow: 1, flexBasis: '180px' }}
></Column> ></Column>
<Column body={actionsCommunity}></Column> <Column
body={actionsCommunity}
style={{ flexGrow: 1, flexBasis: '180px' }}
></Column>
</DataTable> </DataTable>
<Dialog
visible={communityDialog}
style={{ width: '650px' }}
header="Información de la Comunidad"
modal
className="p-fluid"
footer={communityDialogFooter}
onHide={hideCommunityDialog}>
<div className='container text-center'>
<div className='row my-4'>
<div className=" col-12 md:col-12">
<p>Nombre</p>
<div className="p-0 col-2 md:col-2" style={{ margin: '0 auto' }}>
<div className="p-inputgroup align-items-center justify-content-evenly">
<i className="pi pi-home icon-khaki"></i>
<p>{community.name}</p>
</div>
</div>
</div>
</div>
<div className='row my-5'>
<div className=" col-6 md:col-6">
<p>Administrador</p>
<div className="p-0 col-6 md:col-6" style={{ margin: '0 auto' }}>
<div className="p-inputgroup align-items-center justify-content-evenly">
<i className="pi pi-user icon-khaki"></i>
<p>{community.name_admin}</p>
</div>
</div>
</div>
<div className=" col-6 md:col-6">
<p>Teléfono Administrativo</p>
<div className="p-0 col-6 md:col-6" style={{ margin: '0 auto' }}>
<div className="p-inputgroup align-items-center justify-content-evenly">
<i className="pi pi-phone icon-khaki"></i>
<p>{community.phone}</p>
</div>
</div>
</div>
</div>
<div className='row my-5'>
<div className=" col-4 col-md-4 md:col-4">
<p>Provincia</p>
<div className="p-0 col-10 md:col-10">
<div className="p-inputgroup align-items-center justify-content-evenly">
<i className="pi pi-map-marker icon-khaki"></i>
<p>{community.province}</p>
</div>
</div>
</div>
<div className=" col-4 md:col-4">
<p>Cantón</p>
<div className="p-0 col-10 md:col-10">
<div className="p-inputgroup align-items-center justify-content-evenly">
<i className="pi pi-map-marker icon-khaki"></i>
<p>{community.canton}</p>
</div>
</div>
</div>
<div className=" col-4 md:col-4">
<p>Distrito</p>
<div className="p-0 col-10 md:col-10">
<div className="p-inputgroup align-items-center justify-content-evenly">
<i className="pi pi-map-marker icon-khaki"></i>
<p>{community.district}</p>
</div>
</div>
</div>
</div>
<div className='row my-5'>
<div className=" col-12 md:col-12">
<p>Número de Viviendas</p>
<div className="p-0 col-2 md:col-2" style={{ margin: '0 auto' }}>
<div className="p-inputgroup justify-content-evenly">
<i className="pi pi-hashtag icon-khaki"></i>
<p>{community.num_houses}</p>
</div>
</div>
</div>
</div>
<div className='row my-5'>
<div className=" col-12 md:col-12">
<p> <i className="pi pi-home icon-khaki"></i> Viviendas</p>
<div className="p-0 col-12 md:col-12" style={{ margin: '0 auto' }}>
<div className="p-inputgroup justify-content-evenly">
<DataTable
value={community.houses}
paginator
rows={5}
scrollable
scrollHeight="200px"
scrollDirection="both"
rowsPerPageOptions={[5, 10, 25]}
className="datatable-responsive mt-3"
paginatorTemplate="FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink CurrentPageReport RowsPerPageDropdown"
currentPageReportTemplate="Mostrando {first} a {last} de {totalRecords} viviendas"
globalFilter={globalFilter}
>
<Column
field="number_house"
header={headerNumberHouses}
style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px' }}
></Column>
<Column
field="tenants"
header={headerTenant}
body={tenantsBodyTemplate}
style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px' }}
></Column>
</DataTable>
</div>
</div>
</div>
</div>
</div>
</Dialog>
<Dialog <Dialog
visible={deleteCommunityDialog} visible={deleteCommunityDialog}
style={{ width: '450px' }} style={{ width: '450px' }}