Merge pull request #209 from DeimosPr4/66-us-36-editar-comunicado-de-administrador-de-comunidad

66 us 36 editar comunicado de administrador de comunidad

api-gateway/src/app.controller.ts

@@ -468,7 +468,7 @@ export class AppController {
   }
 
 
- 
+
 
   // #==== API Reservation
 
@@ -516,7 +516,7 @@ export class AppController {
     return this.appService.deleteReservation(id);
   }
 
-  
+
   // #==== API Post
 
   @Post('post/createPost')
@@ -529,6 +529,16 @@ export class AppController {
     return this.appService.createPost(post, date_entry, user_id, community_id);
   }
 
+  @Put('post/updatePost/:id')
+  updatePost(
+    @Param('id') id: string,
+    @Body('post') post: string,
+    @Body('user_id') user_id: string,
+    @Body('community_id') community_id: string,
+  ) {
+    return this.appService.updatePost(id, post, user_id, community_id);
+  }
+
   @Get('post/allPosts')
   allPosts() {
     return this.appService.allPosts();

api-gateway/src/app.service.ts

@@ -540,7 +540,7 @@ export class AppService {
     const pattern = { cmd: 'createGuest' };
     const payload = {
       name: name, last_name: last_name, dni: dni, number_plate: number_plate, phone: phone,
-      status: status,tenant_id:tenant_id, community_id:community_id,date_entry: date_entry
+      status: status, tenant_id: tenant_id, community_id: community_id, date_entry: date_entry
     };
     return this.clientGuestApp
       .send<string>(pattern, payload)
@@ -571,17 +571,17 @@ export class AppService {
       .send<string>(pattern, payload)
       .pipe(map((message: string) => ({ message })));
   }
-  
+
   // ====================== RESERVATIONS ===============================
 
   //POST parameter from API
   createReservation(date: string, time: string, status: string,
-    date_entry: Date, user_id: string, common_area_id: string, 
+    date_entry: Date, user_id: string, common_area_id: string,
     common_area_name: string, community_id: string) {
     const pattern = { cmd: 'createReservation' };
     const payload = {
       date: date, time: time, status: status,
-      date_entry: date_entry, user_id: user_id, common_area_id: common_area_id, 
+      date_entry: date_entry, user_id: user_id, common_area_id: common_area_id,
       common_area_name: common_area_name, community_id: community_id
     };
     return this.clientReservationApp
@@ -638,6 +638,16 @@ export class AppService {
       .pipe(map((message: string) => ({ message })));
   }
 
+  updatePost(id: string, post: string, user_id: string, community_id: string) {
+    const pattern = { cmd: 'updatePost' };
+    const payload = {
+      post: post, id: id, user_id: user_id, community_id: community_id
+    };
+    return this.clientPostApp
+      .send<string>(pattern, payload)
+      .pipe(map((message: string) => ({ message })));
+  }
+
   allPosts() {
     const pattern = { cmd: 'findAllPosts' };
     const payload = {};

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

@@ -16,7 +16,7 @@ import classNames from 'classnames';
 
 const RegistroComunicado = () => {
 
-  let emptyComunicado = {
+  const emptyComunicado = {
     _id: null,
     post: '',
     user_id: '',
@@ -29,6 +29,7 @@ const RegistroComunicado = () => {
 
   const [comunicado, setComunicado] = useState(emptyComunicado);
   const [comunicados, setComunicados] = useState([]);
+  const [saveButtonLabel, setSaveButtonLabel] = useState('Registrar');
   const [comunicadoId, setComunicadoId] = useState(null);
   const [showDeleteDialog, setShowDeleteDialog] = useState(false);
   const [submitted, setSubmitted] = useState(false);
@@ -48,31 +49,60 @@ const RegistroComunicado = () => {
   }
 
   const saveComunicado = () => {
-    var data = {
+    if (comunicado._id === null) {
-      post: document.getElementById('txt_comunicado').value,
+      var data = {
-      user_id: cookies.id,
+        post: comunicado.post,
-      community_id: cookies.community_id
+        user_id: cookies.id,
-    };
+        community_id: cookies.community_id
+      };
 
-    fetch('http://localhost:4000/post/createPost', {
+      fetch('http://localhost:4000/post/createPost', {
-      cache: 'no-cache',
+        cache: 'no-cache',
-      method: 'POST',
+        method: 'POST',
-      body: JSON.stringify(data),
+        body: JSON.stringify(data),
-      headers: {
+        headers: {
-        'Content-Type': 'application/json'
+          'Content-Type': 'application/json'
-      }
+        }
-    }).then((response) => {
+      }).then((response) => {
-      if (response.status != 201)
+        if (response.status != 201)
-        console.log('Ocurrió un error con el servicio: ' + response.status);
+          console.log('Ocurrió un error con el servicio: ' + response.status);
-      else
+        else
-        return response.json();
+          return response.json();
-    }).then((_response) => {
+      }).then((_response) => {
+        setComunicado(emptyComunicado);
+        listaComunis();
+      }).catch(
+        err => console.log('Ocurrió un error con el fetch', err)
+      );
+    } else {
+      const data = {
+        _id: comunicado._id,
+        post: comunicado.post,
+        user_id: comunicado.user_id,
+        community_id: comunicado.community_id
+      };
 
-    }).catch(
+      fetch(`http://localhost:4000/post/updatePost/${comunicado._id}`, {
-      err => console.log('Ocurrió un error con el fetch', err)
+        cache: 'no-cache',
-    );
+        method: 'PUT',
+        body: JSON.stringify(data),
+        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) => {
+        setComunicado(emptyComunicado);
+        setSaveButtonLabel('Registrar');
+        listaComunis();
+      }).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">
@@ -111,9 +141,27 @@ const RegistroComunicado = () => {
     )
   }
 
+  const edit = (rowData) => {
+    setComunicado(rowData);
+    setComunicadoId(rowData._id);
+    setSaveButtonLabel('Actualizar');
+  }
+
+  const cancelEdit = () => {
+    setComunicado(emptyComunicado);
+    setSaveButtonLabel('Registrar');
+    setComunicadoId(null);
+  }
+
   const actions = (rowData) => {
     return (
       <div className="actions">
+        <Button
+          icon="pi pi-pencil"
+          className="p-button-rounded p-button-success mt-2 mx-2"
+          onClick={() => edit(rowData)}
+          title="Editar"
+        />
         <Button
           icon='pi pi-trash'
           className='p-button-rounded p-button-danger mt-2 mx-2'
@@ -167,7 +215,7 @@ const RegistroComunicado = () => {
           >
             <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>}
+              {comunicado && <span>¿Está seguro que desea eliminar el aviso "<b>{comunicado.post}</b>"?</span>}
             </div>
           </Dialog>
           <Toolbar className="mb-4" left={leftToolbarTemplate} right={rightToolbarTemplate}></Toolbar>
@@ -200,11 +248,35 @@ const RegistroComunicado = () => {
                   <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
+                    value={comunicado.post}
+                    placeholder="Ingrese el contenido del comunicado"
+                    onChange={(e) => setComunicado({ ...comunicado, post: e.target.value })}
+                    id="txt_comunicado"
+                    type="text"
+                    autoResize
+                    rows={5}
+                    cols={50}
+                  />
                 </div>
               </div>
             </div>
-            <Button label="Registrar" onClick={saveComunicado} />
+            <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>
         </div>
       </div>