informacion comunicados
This commit is contained in:
Mariela
parent
33d1a328a5
commit
bc8486e1ba
|
|
@ -636,7 +636,7 @@ const AreasComunes = () => {
|
|||
<Column field="hourMax" sortable header={headerHourMax} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}> </Column>
|
||||
<Column field="bookable" sortable header={headerBookable} body={bookableBodyTemplate} style={{ flexGrow: 1, flexBasis: '200px', minWidth: '200px', wordBreak: 'break-word' }}></Column>
|
||||
<Column field="status" sortable header={headerStatus} body={statusBodyTemplate} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}></Column>
|
||||
<Column style={{ flexGrow: 1, flexBasis: '80px', minWidth: '80px' }} body={actionsCommonArea}></Column>
|
||||
<Column style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px' }} body={actionsCommonArea}></Column>
|
||||
</DataTable>
|
||||
<Dialog
|
||||
visible={areaDialog}
|
||||
|
|
|
|||
|
|
@ -317,7 +317,7 @@ const GuardasSeguridad = () => {
|
|||
return (
|
||||
<React.Fragment>
|
||||
<div className="my-2">
|
||||
<Button
|
||||
<Button
|
||||
label="Agregar Guarda"
|
||||
icon="pi pi-plus"
|
||||
className="p-button-primary mr-2"
|
||||
|
|
@ -549,7 +549,7 @@ const GuardasSeguridad = () => {
|
|||
</div>
|
||||
<div className='row my-5 justify-content-center'>
|
||||
<div className=" col-6 md:col-6">
|
||||
<i className="pi pi-phone icon-khaki"></i>
|
||||
<i className="pi pi-phone icon-khaki"></i>
|
||||
<p><strong>Teléfono</strong></p>
|
||||
<div className="p-0 col-12 md:col-12">
|
||||
<div className="p-inputgroup align-items-center justify-content-evenly">
|
||||
|
|
@ -559,7 +559,7 @@ const GuardasSeguridad = () => {
|
|||
</div>
|
||||
</div>
|
||||
<div className=" col-6 md:col-6">
|
||||
<i className="pi pi-envelope icon-khaki"></i>
|
||||
<i className="pi pi-envelope icon-khaki"></i>
|
||||
|
||||
<p><strong>Correo Electrónico</strong></p>
|
||||
<div className="p-0 col-12 md:col-12" style={{ margin: '0 auto' }}>
|
||||
|
|
@ -614,70 +614,70 @@ const GuardasSeguridad = () => {
|
|||
onHide={hideFormGuardDialog}
|
||||
>
|
||||
<div className="p-fluid formgrid grid">
|
||||
<div className="field col-12 md:col-6">
|
||||
<label htmlFor="name">Nombre</label>
|
||||
<div className="p-0 col-12 md:col-12">
|
||||
<div className="p-inputgroup">
|
||||
<span className="p-inputgroup-addon p-button p-icon-input-khaki">
|
||||
<i className="pi pi-home"></i>
|
||||
</span>
|
||||
<InputText type="text" id="name" value={guarda.name} onChange={(e) => onInputChange(e, 'name')} required autoFocus className={classNames({ 'p-invalid': submitted && guarda.name === '' })} />
|
||||
<div className="field col-12 md:col-6">
|
||||
<label htmlFor="name">Nombre</label>
|
||||
<div className="p-0 col-12 md:col-12">
|
||||
<div className="p-inputgroup">
|
||||
<span className="p-inputgroup-addon p-button p-icon-input-khaki">
|
||||
<i className="pi pi-home"></i>
|
||||
</span>
|
||||
<InputText type="text" id="name" value={guarda.name} onChange={(e) => onInputChange(e, 'name')} required autoFocus className={classNames({ 'p-invalid': submitted && guarda.name === '' })} />
|
||||
</div>
|
||||
{submitted && guarda.name === '' && <small className="p-invalid">Nombre es requerido.</small>}
|
||||
</div>
|
||||
{submitted && guarda.name === '' && <small className="p-invalid">Nombre es requerido.</small>}
|
||||
</div>
|
||||
</div>
|
||||
<div className="field col-12 md:col-6">
|
||||
<label htmlFor="name">Apellido(s)</label>
|
||||
<div className="p-0 col-12 md:col-12">
|
||||
<div className="p-inputgroup">
|
||||
<span className="p-inputgroup-addon p-button p-icon-input-khaki">
|
||||
<i className="pi pi-home"></i>
|
||||
</span>
|
||||
<InputText type="text" id="last_name" value={guarda.last_name} onChange={(e) => onInputChange(e, 'last_name')} required autoFocus className={classNames({ 'p-invalid': submitted && guarda.last_name === '' })} />
|
||||
<div className="field col-12 md:col-6">
|
||||
<label htmlFor="name">Apellido(s)</label>
|
||||
<div className="p-0 col-12 md:col-12">
|
||||
<div className="p-inputgroup">
|
||||
<span className="p-inputgroup-addon p-button p-icon-input-khaki">
|
||||
<i className="pi pi-home"></i>
|
||||
</span>
|
||||
<InputText type="text" id="last_name" value={guarda.last_name} onChange={(e) => onInputChange(e, 'last_name')} required autoFocus className={classNames({ 'p-invalid': submitted && guarda.last_name === '' })} />
|
||||
</div>
|
||||
{submitted && guarda.last_name === '' && <small className="p-invalid">Apellidos son requeridos.</small>}
|
||||
</div>
|
||||
{submitted && guarda.last_name === '' && <small className="p-invalid">Apellidos son requeridos.</small>}
|
||||
</div>
|
||||
</div>
|
||||
<div className="field col-12 md:col-6">
|
||||
<label htmlFor="name">Correo Electrónico</label>
|
||||
<div className="p-0 col-12 md:col-12">
|
||||
<div className="p-inputgroup">
|
||||
<span className="p-inputgroup-addon p-button p-icon-input-khaki">
|
||||
<i className="pi pi-home"></i>
|
||||
</span>
|
||||
<InputText type='email' id="email" value={guarda.email} onChange={(e) => onInputChange(e, 'email')} required autoFocus className={classNames({ 'p-invalid': submitted && guarda.email === '' })} />
|
||||
<div className="field col-12 md:col-6">
|
||||
<label htmlFor="name">Correo Electrónico</label>
|
||||
<div className="p-0 col-12 md:col-12">
|
||||
<div className="p-inputgroup">
|
||||
<span className="p-inputgroup-addon p-button p-icon-input-khaki">
|
||||
<i className="pi pi-home"></i>
|
||||
</span>
|
||||
<InputText type='email' id="email" value={guarda.email} onChange={(e) => onInputChange(e, 'email')} required autoFocus className={classNames({ 'p-invalid': submitted && guarda.email === '' })} />
|
||||
</div>
|
||||
{submitted && guarda.email === '' && <small className="p-invalid">Correo electrónico es requerido.</small>}
|
||||
</div>
|
||||
{submitted && guarda.email === '' && <small className="p-invalid">Correo electrónico es requerido.</small>}
|
||||
</div>
|
||||
</div>
|
||||
<div className="field col-12 md:col-6">
|
||||
<label htmlFor="dni">Identificación</label>
|
||||
<div className="p-0 col-12 md:col-12">
|
||||
<div className="p-inputgroup">
|
||||
<span className="p-inputgroup-addon p-button p-icon-input-khaki">
|
||||
<i className="pi pi-home"></i>
|
||||
</span>
|
||||
<InputText id="dni" value={guarda.dni} onChange={(e) => onInputChange(e, 'dni')} required autoFocus className={classNames({ 'p-invalid': submitted && guarda.dni === '' })} />
|
||||
<div className="field col-12 md:col-6">
|
||||
<label htmlFor="dni">Identificación</label>
|
||||
<div className="p-0 col-12 md:col-12">
|
||||
<div className="p-inputgroup">
|
||||
<span className="p-inputgroup-addon p-button p-icon-input-khaki">
|
||||
<i className="pi pi-home"></i>
|
||||
</span>
|
||||
<InputText id="dni" value={guarda.dni} onChange={(e) => onInputChange(e, 'dni')} required autoFocus className={classNames({ 'p-invalid': submitted && guarda.dni === '' })} />
|
||||
</div>
|
||||
{submitted && guarda.email === '' && <small className="p-invalid">Identificación es requerida.</small>}
|
||||
</div>
|
||||
{submitted && guarda.email === '' && <small className="p-invalid">Identificación es requerida.</small>}
|
||||
</div>
|
||||
</div>
|
||||
<div className="field col-12 md:col-6">
|
||||
<label htmlFor="phone">Número de teléfono</label>
|
||||
<div className="p-0 col-12 md:col-12">
|
||||
<div className="p-inputgroup">
|
||||
<span className="p-inputgroup-addon p-button p-icon-input-khaki">
|
||||
<i className="pi pi-phone"></i>
|
||||
</span>
|
||||
<InputText id="phone" value={guarda.phone} onChange={(e) => onInputChange(e, 'phone')} type='tel' required autoFocus className={classNames({ 'p-invalid': submitted && guarda.phone === '' })} />
|
||||
<div className="field col-12 md:col-6">
|
||||
<label htmlFor="phone">Número de teléfono</label>
|
||||
<div className="p-0 col-12 md:col-12">
|
||||
<div className="p-inputgroup">
|
||||
<span className="p-inputgroup-addon p-button p-icon-input-khaki">
|
||||
<i className="pi pi-phone"></i>
|
||||
</span>
|
||||
<InputText id="phone" value={guarda.phone} onChange={(e) => onInputChange(e, 'phone')} type='tel' required autoFocus className={classNames({ 'p-invalid': submitted && guarda.phone === '' })} />
|
||||
</div>
|
||||
{submitted
|
||||
&& guarda.phone === ''
|
||||
&& <small className="p-invalid">Número de teléfono es requerido.</small>}
|
||||
</div>
|
||||
{submitted
|
||||
&& guarda.phone === ''
|
||||
&& <small className="p-invalid">Número de teléfono es requerido.</small>}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</Dialog>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -37,6 +37,9 @@ const RegistroComunicado = () => {
|
|||
const dt = useRef(null);
|
||||
const [cookies, setCookie] = useCookies();
|
||||
const [globalFilter, setGlobalFilter] = useState(null);
|
||||
const [postDialog, setPostDialog] = useState(false);
|
||||
|
||||
|
||||
|
||||
async function listaComunis() {
|
||||
let comunicadosResponse = await fetch('http://localhost:4000/post/allPosts', { method: 'GET' });
|
||||
|
|
@ -127,6 +130,12 @@ const RegistroComunicado = () => {
|
|||
return (
|
||||
<React.Fragment>
|
||||
<div className="my-2">
|
||||
<Button
|
||||
label="Agregar Comunicado"
|
||||
icon="pi pi-plus"
|
||||
className="p-button-primary mr-2"
|
||||
onClick={openNewPost}
|
||||
/>
|
||||
<Button label="Eliminar" icon="pi pi-trash" className="p-button-danger" />
|
||||
</div>
|
||||
</React.Fragment>
|
||||
|
|
@ -145,6 +154,8 @@ const RegistroComunicado = () => {
|
|||
setComunicado(rowData);
|
||||
setComunicadoId(rowData._id);
|
||||
setSaveButtonLabel('Actualizar');
|
||||
setPostDialog(true)
|
||||
|
||||
}
|
||||
|
||||
const cancelEdit = () => {
|
||||
|
|
@ -177,6 +188,20 @@ const RegistroComunicado = () => {
|
|||
setShowDeleteDialog(true);
|
||||
}
|
||||
|
||||
const openNewPost = () => {
|
||||
setComunicado(emptyComunicado);
|
||||
setPostDialog(true)
|
||||
setSubmitted(false);
|
||||
};
|
||||
|
||||
const hidePostDialog = () => {
|
||||
setSubmitted(false);
|
||||
setPostDialog(false)
|
||||
setComunicado(emptyComunicado);
|
||||
setSaveButtonLabel('Registrar');
|
||||
}
|
||||
|
||||
|
||||
const deleteDialogFooter = (
|
||||
<>
|
||||
<Button label="Cancelar" icon="pi pi-times" className="p-button-secondary" onClick={() => setShowDeleteDialog(false)} />
|
||||
|
|
@ -184,6 +209,23 @@ const RegistroComunicado = () => {
|
|||
</>
|
||||
);
|
||||
|
||||
const postDialogFooter = (
|
||||
<>
|
||||
<Button
|
||||
label={`${saveButtonLabel}`}
|
||||
icon="pi pi-check"
|
||||
className="p-button-primary"
|
||||
onClick={saveComunicado}
|
||||
/>
|
||||
<Button
|
||||
label="Cerrar"
|
||||
icon="pi pi-times"
|
||||
className="p-button-text"
|
||||
onClick={hidePostDialog}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
|
||||
const deleteComunicado = () => {
|
||||
fetch(`http://localhost:4000/post/deletePost/${comunicado._id}`, {
|
||||
cache: 'no-cache',
|
||||
|
|
@ -235,12 +277,15 @@ const RegistroComunicado = () => {
|
|||
}}
|
||||
body={actions} />
|
||||
</DataTable>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-12">
|
||||
<div className="card">
|
||||
<h5>Registro de un comunicado para la comunidad</h5>
|
||||
<div className="p-fluid formgrid grid">
|
||||
<Dialog
|
||||
visible={postDialog}
|
||||
style={{ width: '650px' }}
|
||||
header="Mantenimiento del Comunicado"
|
||||
modal
|
||||
className="p-fluid"
|
||||
footer={postDialogFooter}
|
||||
onHide={hidePostDialog}>
|
||||
<div className="p-fluid formgrid grid">
|
||||
<div className="field col-12 md:col-12">
|
||||
<label htmlFor="name">Contenido del comunicado</label>
|
||||
<div className="p-0 col-12 md:col-12">
|
||||
|
|
@ -261,25 +306,13 @@ const RegistroComunicado = () => {
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style={{
|
||||
display: "flex",
|
||||
justifyContent: "center",
|
||||
gap: "10px",
|
||||
width: "100%"
|
||||
}}>
|
||||
<Button
|
||||
label={`${saveButtonLabel}`}
|
||||
onClick={saveComunicado}
|
||||
/>
|
||||
{saveButtonLabel === 'Actualizar' && (
|
||||
<Button
|
||||
label="Cancelar"
|
||||
onClick={cancelEdit}
|
||||
className="p-button-danger" />)}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</Dialog>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in New Issue