Merge pull request #191 from DeimosPr4/69-us-37-eliminar-comunicado-de-administrador-de-comunidad

69 us 37 eliminar comunicado de administrador de comunidad

api-gateway/src/app.controller.ts

@@ -489,6 +489,11 @@ export class AppController {
     return this.appService.findPost(paramPost);
   }
 
+  @Delete('post/deletePost/:id')
+  deletePost(@Param('id') id: string) {
+    return this.appService.deletePost(id);
+  }
+
   // #==== API Comment
 
   @Post('post/createComment')

api-gateway/src/app.service.ts

@@ -618,6 +618,15 @@ export class AppService {
       .pipe(map((message: string) => ({ message })));
   }
 
+  //DELETE
+  deletePost(paramPostId: string) {
+    const pattern = { cmd: 'removePost' };
+    const payload = { id: paramPostId };
+    return this.clientPostApp
+      .send<string>(pattern, payload)
+      .pipe(map((message: string) => ({ message })));
+  }
+
   // ====================== COMMNENT POSTS ===============================
 
   //Comment parameter from API

web-ui/web-react/src/components/RegistroComunicado.js

@@ -11,13 +11,9 @@ import { Toolbar } from 'primereact/toolbar';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faHome, faUserAlt } from '@fortawesome/free-solid-svg-icons';
 import { faCommentAlt } from '@fortawesome/free-solid-svg-icons';
-import { faPhoneAlt } from '@fortawesome/free-solid-svg-icons';
-import { faAt } from '@fortawesome/free-solid-svg-icons';
-import { faIdCardAlt } from '@fortawesome/free-solid-svg-icons';
 import { faEllipsis } from '@fortawesome/free-solid-svg-icons';
-import { faHomeAlt } from '@fortawesome/free-solid-svg-icons';
-import { Dropdown } from 'primereact/dropdown';
 import classNames from 'classnames';
+
 const RegistroComunicado = () => {
 
   let emptyComunicado = {
@@ -27,14 +23,14 @@ const RegistroComunicado = () => {
     community_id: ''
   };
 
-    useEffect(()=>{
+  useEffect(() => {
     listaComunis();
-    },[])
-
+  }, [])
 
   const [comunicado, setComunicado] = useState(emptyComunicado);
-    const [comunicados,setComuicados]=useState([]);
+  const [comunicados, setComunicados] = useState([]);
   const [comunicadoId, setComunicadoId] = useState(null);
+  const [showDeleteDialog, setShowDeleteDialog] = useState(false);
   const [submitted, setSubmitted] = useState(false);
   const toast = useRef(null);
   const dt = useRef(null);
@@ -42,13 +38,15 @@ const RegistroComunicado = () => {
   const [globalFilter, setGlobalFilter] = useState(null);
 
   async function listaComunis() {
-      let comunicadosA=await fetch('http://localhost:4000/post/allPosts', {method:'GET'});
-      let comunicadosRes= await comunicadosA.json();
-      setComuicados(comunicadosRes.message);
-      console.log(comunicadosRes.message);
+    let comunicadosResponse = await fetch('http://localhost:4000/post/allPosts', { method: 'GET' });
+    const comunicadosJson = await comunicadosResponse.json();
+    const comunicadosCommunity = comunicadosJson.message.filter((comunicado) => {
+      return comunicado.community_id === cookies.community_id;
+    })
+    setComunicados(comunicadosCommunity);
+    console.log(comunicadosCommunity);
   }
 
-  
   const saveComunicado = () => {
     var data = {
       post: document.getElementById('txt_comunicado').value,
@@ -63,28 +61,20 @@ const RegistroComunicado = () => {
       headers: {
         'Content-Type': 'application/json'
       }
-          })
-            .then(
-              function (response) {
+    }).then((response) => {
       if (response.status != 201)
         console.log('Ocurrió un error con el servicio: ' + response.status);
       else
         return response.json();
-              }
-            )
-            .then(
-              function (response) {
+    }).then((_response) => {
 
-              }
-            )
-            .catch(
+    }).catch(
       err => console.log('Ocurrió un error con el fetch', err)
     );
   }
 
   const header = (
     <React.Fragment>
-
       <div className="flex flex-column md:flex-row md:justify-content-between md:align-items-center">
         <h5 className="m-0">Comunicados de la comunidad</h5>
         <span className="block mt-2 md:mt-0 p-input-icon-left">
@@ -111,21 +101,75 @@ const RegistroComunicado = () => {
         </div>
       </React.Fragment>
     )
-}
+  }
 
-const rightToolbarTemplate = () => {
+  const rightToolbarTemplate = () => {
     return (
       <React.Fragment>
         <Button label="Exportar" icon="pi pi-upload" className="p-button-help" />
       </React.Fragment>
     )
-}
+  }
+
+  const actions = (rowData) => {
+    return (
+      <div className="actions">
+        <Button
+          icon='pi pi-trash'
+          className='p-button-rounded p-button-danger mt-2 mx-2'
+          onClick={() => confirmDelete(rowData)}
+          title='Eliminar Inquilino'
+        />
+      </div>
+    )
+  }
+
+  const confirmDelete = (post) => {
+    setComunicado(post);
+    setShowDeleteDialog(true);
+  }
+
+  const deleteDialogFooter = (
+    <>
+      <Button label="Cancelar" icon="pi pi-times" className="p-button-secondary" onClick={() => setShowDeleteDialog(false)} />
+      <Button label="Eliminar" icon="pi pi-check" className="p-button-danger" onClick={() => deleteComunicado()} />
+    </>
+  );
+
+  const deleteComunicado = () => {
+    fetch(`http://localhost:4000/post/deletePost/${comunicado._id}`, {
+      cache: 'no-cache',
+      method: 'DELETE',
+      headers: { 'Content-Type': 'application/json' }
+    }).then((response) => {
+      if (response.status != 200)
+        console.log('Ocurrió un error con el servicio: ' + response.status);
+      else
+        return response.json();
+    }).then((_response) => {
+      setShowDeleteDialog(false);
+      listaComunis();
+      setComunicado(emptyComunicado);
+    }).catch(err => console.log('Ocurrió un error con el fetch', err));
+  }
 
   return (
     <div className="grid">
       <div className="col-12">
         <Toast ref={toast} />
         <div className="card">
+          <Dialog
+            header="Eliminar comunicado"
+            visible={showDeleteDialog}
+            style={{ width: '450px' }}
+            modal={true} onHide={() => setShowDeleteDialog(false)}
+            footer={deleteDialogFooter}
+          >
+            <div className="flex align-items-center justify-content-center">
+              <i className="pi pi-exclamation-triangle mr-3" style={{ fontSize: '2rem' }} />
+              {comunicado && <span>¿Estás seguro que desea eliminar el aviso "<b>{comunicado.post}</b>"?</span>}
+            </div>
+          </Dialog>
           <Toolbar className="mb-4" left={leftToolbarTemplate} right={rightToolbarTemplate}></Toolbar>
           <DataTable ref={dt} value={comunicados} dataKey="_id" paginator rows={5}
             scrollable scrollHeight="400px" scrollDirection="both" header={header}
@@ -135,7 +179,13 @@ const rightToolbarTemplate = () => {
             globalFilter={globalFilter} emptyMessage="No hay administradores de comunidades registrados.">
             <Column selectionMode="multiple" headerStyle={{ width: '3rem' }}></Column>
             <Column field="post" sortable header={headerPost} style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}></Column>
-        
+            <Column
+              style={{
+                flexGrow: 1,
+                flexBasis: '80px',
+                minWidth: '80px'
+              }}
+              body={actions} />
           </DataTable>
         </div>
       </div>
@@ -150,7 +200,7 @@ const rightToolbarTemplate = () => {
                   <span className="p-inputgroup-addon p-button p-icon-input-khaki">
                     <i className="pi pi-pencil"></i>
                   </span>
-                                    <InputTextarea id="txt_comunicado" rows="4"/>
+                  <InputTextarea id="txt_comunicado" rows="4" />
                 </div>
               </div>
             </div>