informacion comunicados
This commit is contained in:
		
							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,74 +614,74 @@ 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>
 | 
			
		||||
          </Dialog>
 | 
			
		||||
        </div>
 | 
			
		||||
      </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