ver perfil de la comunidad
This commit is contained in:
Mariela
parent
99ecc65b06
commit
ea3d35158f
|
|
@ -112,6 +112,11 @@ export class AppController {
|
|||
return this.appService.findUser(paramUserDNI);
|
||||
}
|
||||
|
||||
@Get('user/findUserById/:id')
|
||||
findUserById(@Param('id') id: string) {
|
||||
return this.appService.findUserById(id);
|
||||
}
|
||||
|
||||
@Delete('user/deleteAdminSystem/:id')
|
||||
deleteAdminSystem(@Param('id') id: string) {
|
||||
return this.appService.deleteAdminSystem(id);
|
||||
|
|
|
|||
|
|
@ -162,6 +162,17 @@ export class AppService {
|
|||
.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 ===============================
|
||||
|
||||
//POST parameter from API
|
||||
|
|
|
|||
|
|
@ -40,6 +40,12 @@ export class UsersController {
|
|||
return this.userService.findOneByDNI(dni);
|
||||
}
|
||||
|
||||
@MessagePattern({ cmd: 'findById' })
|
||||
findById(@Payload() id: string) {
|
||||
let _id = id['id'];
|
||||
return this.userService.findOne(_id);
|
||||
}
|
||||
|
||||
@MessagePattern({ cmd: 'findGuardsCommunity' })
|
||||
findGuardsCommunity(@Payload() community_id: string) {
|
||||
let pcommunity_id = community_id['community_id'];
|
||||
|
|
|
|||
|
|
@ -7118,3 +7118,12 @@
|
|||
.p-button.p-button-danger:enabled:focus {
|
||||
box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px #f7a2a2, 0 1px 2px 0 black;
|
||||
}
|
||||
|
||||
|
||||
.icon-khaki {
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
}
|
||||
|
|
@ -9,10 +9,11 @@ import classNames from 'classnames';
|
|||
import { Dialog } from 'primereact/dialog';
|
||||
import { Toolbar } from 'primereact/toolbar';
|
||||
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 { faPhoneAlt } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faEllipsis } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faHashtag } from '@fortawesome/free-solid-svg-icons';
|
||||
|
||||
const Communities = () => {
|
||||
let emptyCommunity = {
|
||||
|
|
@ -47,6 +48,13 @@ const Communities = () => {
|
|||
const toast = useRef(null);
|
||||
const dt = useRef(null);
|
||||
|
||||
//para el perfil de la comunidad
|
||||
|
||||
const [communityDialog, setCommunityDialog] = useState(false);
|
||||
const [editcommunityDialog, setEditCommunityDialog] = useState(false);
|
||||
|
||||
|
||||
|
||||
const p = provincesList.map((item) => ({
|
||||
label: item.name,
|
||||
value: item.code,
|
||||
|
|
@ -233,6 +241,22 @@ const Communities = () => {
|
|||
}
|
||||
};
|
||||
|
||||
|
||||
|
||||
async function findNameTenant(tenant_id) {
|
||||
let name = '';
|
||||
if (tenant_id == '') {
|
||||
name = 'Sin inquilino';
|
||||
} else {
|
||||
name = await fetch('http://localhost:4000/user/findUserById/' + tenant_id, { method: "GET" });
|
||||
let response = await response.json();
|
||||
let res = await response.message;
|
||||
name = res['name'] + ' ' + res['last_name'];
|
||||
}
|
||||
|
||||
return name;
|
||||
}
|
||||
|
||||
const onInputChange = (e, name) => {
|
||||
const val = (e.target && e.target.value) || '';
|
||||
let _community = { ...community };
|
||||
|
|
@ -241,6 +265,11 @@ const Communities = () => {
|
|||
setCommunity(_community);
|
||||
};
|
||||
|
||||
const hideCommunityDialog = () => {
|
||||
setSubmitted(false);
|
||||
setCommunityDialog(false);
|
||||
};
|
||||
|
||||
const hideDeleteCommunityDialog = () => {
|
||||
setDeleteCommunityDialog(false);
|
||||
};
|
||||
|
|
@ -258,6 +287,17 @@ const Communities = () => {
|
|||
setDeleteCommunitiesDialog(true);
|
||||
};
|
||||
|
||||
|
||||
const infoCommunity = (community) => {
|
||||
setCommunity({ ...community });
|
||||
setCommunityDialog(true);
|
||||
};
|
||||
|
||||
const editCommunity = (community) => {
|
||||
setCommunity({ ...community });
|
||||
setEditCommunityDialog(true);
|
||||
};
|
||||
|
||||
const deleteCommunity = () => {
|
||||
/* fetch('http://localhost:4000/community/deleteCommunity/' + community._id, {
|
||||
cache: 'no-cache',
|
||||
|
|
@ -330,6 +370,11 @@ const Communities = () => {
|
|||
const actionsCommunity = (rowData) => {
|
||||
return (
|
||||
<div className="actions">
|
||||
<Button
|
||||
icon="pi pi-exclamation-circle"
|
||||
className="p-button-rounded p-button-primary mr-2"
|
||||
onClick={() => infoCommunity(rowData)}
|
||||
/>
|
||||
<Button
|
||||
icon="pi pi-trash"
|
||||
className="p-button-rounded p-button-danger mt-2"
|
||||
|
|
@ -381,6 +426,18 @@ const Communities = () => {
|
|||
</div>
|
||||
);
|
||||
|
||||
const communityDialogFooter = (
|
||||
<>
|
||||
<Button
|
||||
label="Cerrar"
|
||||
icon="pi pi-times"
|
||||
className="p-button-text"
|
||||
onClick={hideCommunityDialog}
|
||||
/>
|
||||
|
||||
</>
|
||||
);
|
||||
|
||||
const deleteCommunityDialogFooter = (
|
||||
<>
|
||||
<Button
|
||||
|
|
@ -477,7 +534,7 @@ const Communities = () => {
|
|||
<>
|
||||
<p>
|
||||
{' '}
|
||||
<FontAwesomeIcon icon={faPhoneAlt} style={{ color: '#D7A86E' }} />{' '}
|
||||
<FontAwesomeIcon icon={faHashtag} style={{ color: '#D7A86E' }} />{' '}
|
||||
Número de viviendas
|
||||
</p>
|
||||
</>
|
||||
|
|
@ -502,6 +559,27 @@ 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 (
|
||||
<div className="grid">
|
||||
<div className="col-12">
|
||||
|
|
@ -572,6 +650,134 @@ const Communities = () => {
|
|||
></Column>
|
||||
<Column header={headerOptions} body={actionsCommunity}></Column>
|
||||
</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} comunidades de 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
|
||||
visible={deleteCommunityDialog}
|
||||
style={{ width: '450px' }}
|
||||
|
|
|
|||
Loading…
Reference in New Issue