Merge pull request #147 from DeimosPr4/US-17-VerPerfildeinformacióndecomunidaddevivienda
ver perfil comunidada de vivienda
This commit is contained in:
GitHub
commit
9676e08e6d
|
|
@ -118,6 +118,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);
|
||||
|
|
|
|||
|
|
@ -187,6 +187,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'];
|
||||
|
|
|
|||
|
|
@ -7120,6 +7120,15 @@
|
|||
}
|
||||
|
||||
|
||||
.icon-khaki {
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
|
||||
.status {
|
||||
border-radius: var(--border-radius);
|
||||
padding: 0.25em 0.5rem;
|
||||
|
|
|
|||
|
|
@ -184,7 +184,7 @@ const App = () => {
|
|||
to: '/guardasSeguridad',
|
||||
},
|
||||
{
|
||||
label: 'Comunidadades',
|
||||
label: 'Comunidades',
|
||||
icon: PrimeIcons.BUILDING,
|
||||
to: '/comunidadesViviendas',
|
||||
},
|
||||
|
|
|
|||
|
|
@ -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,16 @@ const Communities = () => {
|
|||
const toast = 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) => ({
|
||||
label: item.name,
|
||||
value: item.code,
|
||||
|
|
@ -120,7 +131,7 @@ const Communities = () => {
|
|||
fillDistricts();
|
||||
}, [cantonId]);
|
||||
|
||||
|
||||
|
||||
const handleProvinces = (event) => {
|
||||
const getprovinciaId = event.target.value;
|
||||
setProvinciaId(getprovinciaId);
|
||||
|
|
@ -165,6 +176,20 @@ const Communities = () => {
|
|||
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 = () => {
|
||||
if (
|
||||
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 val = (e.target && e.target.value) || '';
|
||||
let _community = { ...community };
|
||||
|
|
@ -241,6 +280,11 @@ const Communities = () => {
|
|||
setCommunity(_community);
|
||||
};
|
||||
|
||||
const hideCommunityDialog = () => {
|
||||
setSubmitted(false);
|
||||
setCommunityDialog(false);
|
||||
};
|
||||
|
||||
const hideDeleteCommunityDialog = () => {
|
||||
setDeleteCommunityDialog(false);
|
||||
};
|
||||
|
|
@ -258,6 +302,19 @@ const Communities = () => {
|
|||
setDeleteCommunitiesDialog(true);
|
||||
};
|
||||
|
||||
|
||||
const infoCommunity = async (community) => {
|
||||
await tenantsList(community._id);
|
||||
|
||||
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 +387,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 +443,18 @@ const Communities = () => {
|
|||
</div>
|
||||
);
|
||||
|
||||
const communityDialogFooter = (
|
||||
<>
|
||||
<Button
|
||||
label="Cerrar"
|
||||
icon="pi pi-times"
|
||||
className="p-button-text"
|
||||
onClick={hideCommunityDialog}
|
||||
/>
|
||||
|
||||
</>
|
||||
);
|
||||
|
||||
const deleteCommunityDialogFooter = (
|
||||
<>
|
||||
<Button
|
||||
|
|
@ -477,7 +551,7 @@ const Communities = () => {
|
|||
<>
|
||||
<p>
|
||||
{' '}
|
||||
<FontAwesomeIcon icon={faPhoneAlt} style={{ color: '#D7A86E' }} />{' '}
|
||||
<FontAwesomeIcon icon={faHashtag} style={{ color: '#D7A86E' }} />{' '}
|
||||
Número de viviendas
|
||||
</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 (
|
||||
<div className="grid">
|
||||
<div className="col-12">
|
||||
|
|
@ -564,10 +662,142 @@ const Communities = () => {
|
|||
<Column
|
||||
field="name_admin"
|
||||
sortable
|
||||
header={headerAdministrator}
|
||||
style={{ flexGrow: 1, flexBasis: '180px' }}
|
||||
></Column>
|
||||
<Column body={actionsCommunity}></Column>
|
||||
<Column
|
||||
body={actionsCommunity}
|
||||
style={{ flexGrow: 1, flexBasis: '180px' }}
|
||||
></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} 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