Merge branch 'dev' into popups-registros

api-gateway/src/app.controller.ts

@@ -315,6 +315,18 @@ export class AppController {
     );
   }
  
+  @Put('user/changePassword/:id')
+  changePassword(
+    @Param('id') id: string,
+    @Body('password') password: string,
+  ) {
+
+    return this.appService.changePassword(
+      id,
+      password,
+    );
+  }
+
   // #==== API Communities
   @Post('community/createCommunity')
   createCommunity(
@@ -341,6 +353,33 @@ export class AppController {
     );
   }
 
+  @Put('community/updateCommunity/:id')
+  updateCommunity(
+    @Param('id') id: string,
+    @Body('name') name: string,
+    @Body('province') province: string,
+    @Body('canton') canton: string,
+    @Body('district') district: string,
+    @Body('num_houses') num_houses: number,
+    @Body('phone') phone: string,
+    @Body('status') status: string,
+    @Body('date_entry') date_entry: Date,
+    @Body('houses') houses: [],
+  ) {
+    return this.appService.updateCommunity(
+      id,
+      name,
+      province,
+      canton,
+      district,
+      num_houses,
+      phone,
+      status,
+      date_entry,
+      houses,
+    );
+  }
+
   @Get('community/allCommunities')
   allcommunities() {
     return this.appService.allCommunities();

api-gateway/src/app.service.ts

@@ -387,6 +387,16 @@ export class AppService {
   }
 
 
+  changePassword(id: string, password: string) {
+    const pattern = { cmd: 'changePassword' };
+    const payload = { id: id, password: password };
+    return this.clientUserApp
+      .send<string>(pattern, payload)
+      .pipe(map((message: string) => ({ message })));
+  }
+
+  
+
   // ====================== COMMUNITIES ===============================
   changeStatusCommunity(pId: string, pStatus: string) {
     const pattern = { cmd: 'changeStatus' };
@@ -416,6 +426,25 @@ export class AppService {
       .pipe(map((message: string) => ({ message })));
   }
 
+  updateCommunity(id: string, name: string, province: string, canton: string, district: string, num_houses: number, phone: string, status: string, date_entry: Date, houses: unknown) {
+    const pattern = { cmd: 'updateCommunity' };
+    const payload = {
+      id: id,
+      name: name,
+      province: province,
+      canton: canton,
+      district: district,
+      num_houses: num_houses,
+      phone: phone,
+      status: status,
+      date_entry: date_entry,
+      houses: houses,
+    };
+    return this.clientCommunityApp
+      .send<string>(pattern, payload)
+      .pipe(map((message: string) => ({ message })));
+  }
+
   allCommunities() {
     const pattern = { cmd: 'findAllCommunities' };
     const payload = {};

servicio-usuarios/src/schemas/user.schema.ts

@@ -7,20 +7,20 @@ export type UserDocument = User & Document;
 
 @Schema({ collection: 'users'})
 export class User {
-  @Prop({index: true})
+  @Prop()
-  dni!: string;
+  dni: string;
 
-  @Prop({required: true})
+  @Prop()
   name: string;
 
-  @Prop({required: true})
+  @Prop()
   last_name: string;
 
-  @Prop({required: true, unique: true})
+  @Prop()
   email: string; 
 
-  @Prop({required: true, unique: true})
+  @Prop()
-  phone: number;
+  phone: string;
 
   @Prop()
   password: string;

servicio-usuarios/src/users/users.controller.ts

@@ -72,8 +72,6 @@ export class UsersController {
 
   @MessagePattern({ cmd: 'updateUser' })
   update(@Payload() user: UserDocument) {
-    console.log(user);
-    
     return this.userService.update(user['id'], user);
   }
 
@@ -168,4 +166,13 @@ export class UsersController {
     let pstatus = body['status'];
     return this.userService.changeStatus(pid, pstatus);
   }
+
+  @MessagePattern({ cmd: 'changePassword' })
+  changePassword(@Payload() body: string) {
+    let pid = body['id'];
+    let password = body['password'];
+    return this.userService.changePassword(pid, password);
+  }
+
+  
 }

servicio-usuarios/src/users/users.service.ts

@@ -117,9 +117,6 @@ export class UsersService {
   }
 
   async update(id: string, user: UserDocument) {
-    console.log(id)
-    console.log(user)
-
     return this.userModel.findOneAndUpdate({ _id: id }, {
       name: user['name'], last_name: user['last_name'],
       dni: user['dni'], email: user['email'], phone: user['phone']
@@ -193,7 +190,6 @@ export class UsersService {
         }
       });
     });
-
     return userReturn;
   }
 
@@ -211,19 +207,14 @@ export class UsersService {
     return this.userModel.find({ user_type: 2 }).exec();
   }
 
-
   //find inquilinos
   async findTenants(): Promise<User[]> {
     return this.userModel.find({ user_type: 3 }).exec();
   }
 
-
   //find inquilinos
   async findTenantsCommunity(pcommunity_id: string) {
     //let tenants = await this.findCommunityTenants(pcommunity_id);
-
-
-
     return await this.userModel.find({ community_id: pcommunity_id, user_type: 4 })
   }
 
@@ -349,5 +340,14 @@ export class UsersService {
     await this.userModel.updateMany({community_id: community_id, user_type:'3' }, {"$set":{"community_id": '', "status": '-1'} });
     return this.userModel.updateMany({ community_id: community_id, user_type: '4' }, { "$set": { "community_id": '', "status": '-1' }    });
   }
+
+
+  async changePassword(id: string, password: string) {
+    return this.userModel.findOneAndUpdate({ _id: id }, { password: password }, {
+      new: true,
+    });
+  }
+
+  
 }
 

web-ui/web-react/package-lock.json

@@ -22,6 +22,7 @@
                 "chart.js": "3.3.2",
                 "classnames": "^2.2.6",
                 "cors": "^2.8.5",
+                "md5": "^2.3.0",
                 "primeflex": "3.1.0",
                 "primeicons": "^5.0.0",
                 "primereact": "7.2.0",
@@ -4677,6 +4678,14 @@
             "resolved": "https://registry.npmjs.org/chardet/-/chardet-0.7.0.tgz",
             "integrity": "sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA=="
         },
+        "node_modules/charenc": {
+            "version": "0.0.2",
+            "resolved": "https://registry.npmjs.org/charenc/-/charenc-0.0.2.tgz",
+            "integrity": "sha512-yrLQ/yVUFXkzg7EDQsPieE/53+0RlaWTs+wBrvW36cyilJ2SaDWfl4Yj7MtLTXleV9uEKefbAGUPv2/iWSooRA==",
+            "engines": {
+                "node": "*"
+            }
+        },
         "node_modules/chart.js": {
             "version": "3.3.2",
             "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-3.3.2.tgz",
@@ -5384,6 +5393,14 @@
                 "semver": "bin/semver"
             }
         },
+        "node_modules/crypt": {
+            "version": "0.0.2",
+            "resolved": "https://registry.npmjs.org/crypt/-/crypt-0.0.2.tgz",
+            "integrity": "sha512-mCxBlsHFYh9C+HVpiEacem8FEBnMXgU9gy4zmNC+SXAZNB/1idgp/aulFJ4FgCi7GPEVbfyng092GqL2k2rmow==",
+            "engines": {
+                "node": "*"
+            }
+        },
         "node_modules/crypto-browserify": {
             "version": "3.12.0",
             "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.12.0.tgz",
@@ -10589,6 +10606,16 @@
                 "node": ">=0.10.0"
             }
         },
+        "node_modules/md5": {
+            "version": "2.3.0",
+            "resolved": "https://registry.npmjs.org/md5/-/md5-2.3.0.tgz",
+            "integrity": "sha512-T1GITYmFaKuO91vxyoQMFETst+O71VUPEU3ze5GNzDm0OWdP8v1ziTaAEPUr/3kLsY3Sftgz242A1SetQiDL7g==",
+            "dependencies": {
+                "charenc": "0.0.2",
+                "crypt": "0.0.2",
+                "is-buffer": "~1.1.6"
+            }
+        },
         "node_modules/md5.js": {
             "version": "1.3.5",
             "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",
@@ -21618,6 +21645,11 @@
             "resolved": "https://registry.npmjs.org/chardet/-/chardet-0.7.0.tgz",
             "integrity": "sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA=="
         },
+        "charenc": {
+            "version": "0.0.2",
+            "resolved": "https://registry.npmjs.org/charenc/-/charenc-0.0.2.tgz",
+            "integrity": "sha512-yrLQ/yVUFXkzg7EDQsPieE/53+0RlaWTs+wBrvW36cyilJ2SaDWfl4Yj7MtLTXleV9uEKefbAGUPv2/iWSooRA=="
+        },
         "chart.js": {
             "version": "3.3.2",
             "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-3.3.2.tgz",
@@ -22179,6 +22211,11 @@
                 }
             }
         },
+        "crypt": {
+            "version": "0.0.2",
+            "resolved": "https://registry.npmjs.org/crypt/-/crypt-0.0.2.tgz",
+            "integrity": "sha512-mCxBlsHFYh9C+HVpiEacem8FEBnMXgU9gy4zmNC+SXAZNB/1idgp/aulFJ4FgCi7GPEVbfyng092GqL2k2rmow=="
+        },
         "crypto-browserify": {
             "version": "3.12.0",
             "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.12.0.tgz",
@@ -26217,6 +26254,16 @@
                 "object-visit": "^1.0.0"
             }
         },
+        "md5": {
+            "version": "2.3.0",
+            "resolved": "https://registry.npmjs.org/md5/-/md5-2.3.0.tgz",
+            "integrity": "sha512-T1GITYmFaKuO91vxyoQMFETst+O71VUPEU3ze5GNzDm0OWdP8v1ziTaAEPUr/3kLsY3Sftgz242A1SetQiDL7g==",
+            "requires": {
+                "charenc": "0.0.2",
+                "crypt": "0.0.2",
+                "is-buffer": "~1.1.6"
+            }
+        },
         "md5.js": {
             "version": "1.3.5",
             "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",

web-ui/web-react/package.json

@@ -22,6 +22,7 @@
         "chart.js": "3.3.2",
         "classnames": "^2.2.6",
         "cors": "^2.8.5",
+        "md5": "^2.3.0",
         "primeflex": "3.1.0",
         "primeicons": "^5.0.0",
         "primereact": "7.2.0",

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

@@ -16,7 +16,7 @@ import { faHashtag } from '@fortawesome/free-solid-svg-icons';
 import { faCircleQuestion } from '@fortawesome/free-solid-svg-icons';
 
 const Communities = () => {
-  let emptyCommunity = {
+  const emptyCommunity = {
     _id: null,
     name: '',
     province: provinciaId,
@@ -32,7 +32,6 @@ const Communities = () => {
 
   const [communitiesList, setCommunitiesList] = useState([]);
   const [community, setCommunity] = useState(emptyCommunity);
-
   const [housesList, setHousesList] = useState([]);
   const [provincesList, setProvincesList] = useState([]);
   const [provinciaId, setProvinciaId] = useState(null);
@@ -42,6 +41,7 @@ const Communities = () => {
   const [districtId, setDistrictId] = useState(null);
   const [codeHouses, setCodeHouses] = useState('');
   const [submitted, setSubmitted] = useState(false);
+  const [saveButtonLabel, setSaveButtonLabel] = useState('Registrar');
   const [selectedCommunities, setSelectedCommunities] = useState(null);
   const [globalFilter, setGlobalFilter] = useState(null);
   const [deleteCommunityDialog, setDeleteCommunityDialog] = useState(false);
@@ -51,15 +51,11 @@ const Communities = () => {
   const dt = useRef(null);
   const [formCommunityDialog, setFormCommunityDialog] = useState(false);
 
-
-
   //para el perfil de la comunidad
   const [tenants, setTenants] = useState([]);
 
   const [communityDialog, setCommunityDialog] = useState(false);
 
-
-
   const p = provincesList.map((item) => ({
     label: item.name,
     value: item.code,
@@ -77,7 +73,6 @@ const Communities = () => {
     parent: item.parentCode,
   }));
 
-
   async function getProvinces() {
     const response = await fetch('assets/demo/data/provincias.json', {
       method: 'GET',
@@ -99,7 +94,7 @@ const Communities = () => {
 
   async function fillCantons() {
     const resJson = await getCantons();
-    const cantones = await resJson.filter(function (i, n) {
+    const cantones = await resJson.filter((i, _n) => {
       return i.parentCode === provinciaId;
     });
     setCantonsList(await cantones);
@@ -114,13 +109,12 @@ const Communities = () => {
 
   async function fillDistricts() {
     const resJson = await getDistricts();
-    const districts = await resJson.filter(function (i, n) {
+    const districts = await resJson.filter((i, _n) => {
       return i.parentCode === cantonId;
     });
     setDistrictsList(await districts);
   }
 
-
   useEffect(() => {
     fillProvinces();
   }, []);
@@ -133,7 +127,6 @@ const Communities = () => {
     fillDistricts();
   }, [cantonId]);
 
-
   const handleProvinces = (event) => {
     const getprovinciaId = event.target.value;
     setProvinciaId(getprovinciaId);
@@ -163,9 +156,7 @@ const Communities = () => {
     let pList = await getProvinces();
     let cList = await getCantons();
     let dList = await getDistricts();
-    let data = await resJson.message.filter(
+    let data = await resJson.message.filter((val) => val.status != -1);
-      (val) => val.status != -1,
-    )
     await data.map((item) => {
       if (item.status == '1') {
         item.status_text = 'Activo';
@@ -189,21 +180,20 @@ const Communities = () => {
   }, []);
 
   async function tenantsList(id) {
-    await fetch(`http://localhost:4000/user/findTenants/${id}`, { method: 'GET' })
+    await fetch(`http://localhost:4000/user/findTenants/${id}`, {
+      method: 'GET',
+    })
       .then((response) => response.json())
-      .then(data => data.message)
+      .then((data) => data.message)
-      .then(data => {
+      .then((data) => {
-        data = data.filter(
+        data = data.filter((val) => val.status != -1);
-          (val) => val.status != -1,
+        setTenants(data);
-        )
-        setTenants(data)
       });
   }
 
   useEffect(() => {
     tenantsList(community._id);
-  }, [])
+  }, []);
-
 
   const saveCommunity = () => {
     if (
@@ -214,28 +204,74 @@ const Communities = () => {
       districtId &&
       community.phone
     ) {
-      let _communities = [...communitiesList];
+      if (saveButtonLabel === 'Registrar') {
-      let _community = { ...community };
+        let _communities = [...communitiesList];
-      _community.province = provinciaId;
+        let _community = { ...community };
-      _community.canton = cantonId;
+        _community.province = provinciaId;
-      _community.district = districtId;
+        _community.canton = cantonId;
+        _community.district = districtId;
 
-      for (let i = 0; i < _community.num_houses; i++) {
+        for (let i = 0; i < _community.num_houses; i++) {
-        _community.houses.push({
+          _community.houses.push({
-          number_house: codeHouses + (i + 1),
+            number_house: codeHouses + (i + 1),
-        });
+          });
-      }
+        }
-      // console.log(houses)
+        fetch('http://localhost:4000/community/createCommunity', {
-      fetch('http://localhost:4000/community/createCommunity', {
+          cache: 'no-cache',
-        cache: 'no-cache',
+          method: 'POST',
-        method: 'POST',
+          body: JSON.stringify(_community),
-        body: JSON.stringify(_community),
+          headers: {
-        headers: {
+            'Content-Type': 'application/json',
-          'Content-Type': 'application/json',
+          },
-        },
+        })
-      })
+          .then((response) => {
-        .then(function (response) {
+            if (response.status != 201)
-          if (response.status != 201)
+              console.log('Ocurrió un error con el servicio: ' + response.status);
+            else return response.json();
+          })
+          .then(() => {
+            _community.province = provincesList.find(
+              (p) => p.code === _community.province,
+            ).name;
+            _community.canton = cantonsList.find(
+              (p) => p.code === _community.canton,
+            ).name;
+            _community.district = districtsList.find(
+              (p) => p.code === _community.district,
+            ).name;
+
+            _communities.push(_community);
+            toast.current.show({
+              severity: 'success',
+              summary: 'Registro exitoso',
+              detail: 'Comunidad de vivienda Creada',
+              life: 3000,
+            });
+            setCommunitiesList(_communities);
+            setProvinciaId('');
+            setCantonId('');
+            setDistrictId('');
+            setCodeHouses('');
+            getCommunites();
+            setCommunity(emptyCommunity);
+          })
+          .catch((err) => console.log('Ocurrió un error con el fetch', err));
+      } else {
+        let _community = { ...community };
+        _community.province = provinciaId;
+        _community.canton = cantonId;
+        _community.district = districtId;
+        console.log(`Actualizando comunidad: ${_community}`);
+        fetch(`http://localhost:4000/community/updateCommunity/${community._id}`, {
+          method: 'PUT',
+          cache: 'no-cache',
+          body: JSON.stringify(_community),
+          headers: {
+            'Content-Type': 'application/json',
+          }
+        }).then((response) => {
+          getCommunites();
+          if (response.status != 200)
             console.log('Ocurrió un error con el servicio: ' + response.status);
           else return response.json();
         })
@@ -274,14 +310,12 @@ const Communities = () => {
     }
   };
 
-
-
   function findNameTenant(tenant_id) {
     let name = '';
     if (tenant_id == '') {
       name = 'Sin inquilino';
     } else {
-      let tenant = tenants.find(t => t._id == tenant_id)
+      let tenant = tenants.find((t) => t._id == tenant_id);
       name = tenant['name'] + ' ' + tenant['last_name'];
     }
     return name;
@@ -352,7 +386,6 @@ const Communities = () => {
     if (community.status == '1') {
       community.status = '0';
       community.status_text = 'Inactivo';
-
     } else if (community.status == '0') {
       community.status = '1';
       community.status_text = 'Activo';
@@ -366,69 +399,67 @@ const Communities = () => {
       method: 'POST',
       body: JSON.stringify(data),
       headers: {
-        'Content-Type': 'application/json'
+        'Content-Type': 'application/json',
-      }
+      },
     })
-      .then(
+      .then((response) => {
-        function (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 return response.json();
-          else
+      })
-            return response.json();
+      .then((_response) => {
-        }
+        setEditCommunityDialog(false);
-      )
+        toast.current.show({
-      .then(
+          severity: 'success',
-        function (response) {
+          summary: 'Éxito',
-          setEditCommunityDialog(false);
+          detail: 'Comunidad de Viviendas Actualizada',
-          toast.current.show({
+          life: 3000,
-            severity: 'success',
+        });
-            summary: 'Éxito',
+        getCommunites();
-            detail: 'Comunidad de Viviendas Actualizada',
+      })
-            life: 3000,
+      .catch((err) => console.log('Ocurrió un error con el fetch', err));
-          });
+  };
-        }
-      )
-      .catch(
-        err => console.log('Ocurrió un error con el fetch', err)
-      );
-  }
 
   const deleteCommunity = () => {
     fetch('http://localhost:4000/community/deleteCommunity/' + community._id, {
       cache: 'no-cache',
       method: 'DELETE',
       headers: {
-        'Content-Type': 'application/json'
+        'Content-Type': 'application/json',
-      }
+      },
     })
-      .then(
+      .then((response) => {
-        function (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 return response.json();
-          else
+      })
-            return response.json();
+      .then((_response) => {
-        }
+        let _community = communitiesList.filter(
-      )
+          (val) => val._id !== community._id,
-      .then(
+        );
-        function (response) {
+        setCommunitiesList(_community);
-
+        setDeleteCommunityDialog(false);
-          let _community = communitiesList.filter(val => val._id !== community._id);
+        setCommunity(emptyCommunity);
-          setCommunitiesList(_community);
+        toast.current.show({
-          setDeleteCommunityDialog(false);
+          severity: 'success',
-          setCommunity(emptyCommunity);
+          summary: 'Exito',
-          toast.current.show({ severity: 'success', summary: 'Exito', detail: 'Comunidad de Viviendas Eliminada', life: 3000 });
+          detail: 'Comunidad de Viviendas Eliminada',
-        }
+          life: 3000,
-      )
+        });
-      .catch(
+      })
-        err => {
+      .catch((err) => {
-          console.log('Ocurrió un error con el fetch', err)
+        console.log('Ocurrió un error con el fetch', err);
-          toast.current.show({ severity: 'danger', summary: 'Error', detail: 'Comunidad de Viviendas no se pudo eliminar', life: 3000 });
+        toast.current.show({
-        }
+          severity: 'danger',
-      );
+          summary: 'Error',
-    let _communities = communitiesList.filter((val) => val._id !== community._id);
+          detail: 'Comunidad de Viviendas no se pudo eliminar',
-    _communities = _communities.filter(
+          life: 3000,
-      (val) => val.status != -1,
+        });
-    )
+      });
+    let _communities = communitiesList.filter(
+      (val) => val._id !== community._id,
+    );
+    _communities = _communities.filter((val) => val.status != -1);
     setCommunitiesList(_communities);
     setDeleteCommunityDialog(false);
     setCommunity(emptyCommunity);
@@ -453,9 +484,7 @@ const Communities = () => {
                  }
              })
          })*/
-    _communities = _communities.filter(
+    _communities = _communities.filter((val) => val.status != -1);
-      (val) => val.status != -1,
-    )
     setCommunitiesList(_communities);
     setDeleteCommunitiesDialog(false);
     setSelectedCommunities(null);
@@ -467,17 +496,37 @@ const Communities = () => {
     });
   };
 
-  const actionsCommunity = (rowData) => {
+  const updateCommunity = (community) => {
+    setCommunity(community);
+    setSaveButtonLabel('Actualizar');
+    setHousesList(community.houses);
+  };
 
+  const cancelEdit = () => {
+    setCommunity(emptyCommunity);
+    setCantonId('');
+    setHousesList([]);
+    setProvinciaId('');
+    setDistrictId('');
+    setSaveButtonLabel('Registrar');
+  }
+
+  const actionsCommunity = (rowData) => {
     let icono = '';
     if (rowData.status == '0') {
-      icono = "pi pi-eye";
+      icono = 'pi pi-eye';
     } else if (rowData.status == '1') {
-      icono = "pi pi-eye-slash";
+      icono = 'pi pi-eye-slash';
     }
 
     return (
       <div className="actions">
+        <Button
+          icon="pi pi-pencil"
+          className="p-button-rounded p-button-success mt-2 mx-2"
+          onClick={() => updateCommunity(rowData)}
+          title="Editar"
+        />
         <Button
           icon="pi pi-exclamation-circle"
           className="p-button-rounded p-button-info mt-2 mx-2"
@@ -553,7 +602,6 @@ const Communities = () => {
         className="p-button-text"
         onClick={hideCommunityDialog}
       />
-
     </>
   );
 
@@ -626,8 +674,6 @@ const Communities = () => {
     </>
   );
 
-
-
   const headerName = (
     <>
       <p>
@@ -708,12 +754,16 @@ const Communities = () => {
 
   const headerStatus = (
     <>
-      <p> {' '}
+      <p>
-        <FontAwesomeIcon icon={faCircleQuestion} style={{ color: "#D7A86E" }} />{' '}
+        {' '}
+        <FontAwesomeIcon
+          icon={faCircleQuestion}
+          style={{ color: '#D7A86E' }}
+        />{' '}
         Estado
       </p>
     </>
-  )
+  );
 
   //ver perfil comunidad
   const headerTenant = (
@@ -723,7 +773,6 @@ const Communities = () => {
         <FontAwesomeIcon icon={faUserAlt} style={{ color: '#C08135' }} />{' '}
         Inquilinos
       </p>
-
     </>
   );
 
@@ -740,9 +789,7 @@ const Communities = () => {
   const statusBodyTemplate = (rowData) => {
     return (
       <>
-        <span
+        <span className={`status status-${rowData.status}`}>
-          className={`status status-${rowData.status}`}
-        >
           {rowData.status_text}
         </span>
       </>
@@ -756,11 +803,7 @@ const Communities = () => {
       name = findNameTenant(tenants.tenant_id);
     }
 
-    return (
+    return <>{name}</>;
-      <>
-        {name}
-      </>
-    )
   };
 
   return (
@@ -837,15 +880,19 @@ const Communities = () => {
               sortable
               header={headerStatus}
               body={statusBodyTemplate}
-              style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px', wordBreak: 'break-word' }}>
+              style={{
-            </Column>
+                flexGrow: 1,
+                flexBasis: '160px',
+                minWidth: '160px',
+                wordBreak: 'break-word',
+              }}
+            ></Column>
             <Column
               body={actionsCommunity}
               style={{ flexGrow: 1, flexBasis: '160px' }}
             ></Column>
           </DataTable>
 
-
           <Dialog
             visible={communityDialog}
             style={{ width: '650px' }}
@@ -853,9 +900,10 @@ const Communities = () => {
             modal
             className="p-fluid"
             footer={communityDialogFooter}
-            onHide={hideCommunityDialog}>
+            onHide={hideCommunityDialog}
-            <div className='container text-center'>
+          >
-              <div className='row my-4'>
+            <div className="container text-center">
+              <div className="row my-4">
                 <div className=" col-12 md:col-12">
                   <i className="pi pi-home icon-khaki"></i>
 
@@ -867,7 +915,7 @@ const Communities = () => {
                   </div>
                 </div>
               </div>
-              <div className='row my-5'>
+              <div className="row my-5">
                 <div className=" col-6 md:col-6">
                   <i className="pi pi-user icon-khaki"></i>
 
@@ -876,7 +924,6 @@ const Communities = () => {
                     <div className="p-inputgroup align-items-center justify-content-evenly">
                       <p>{community.name_admin}</p>
                     </div>
-
                   </div>
                 </div>
                 <div className=" col-6 md:col-6">
@@ -887,12 +934,11 @@ const Communities = () => {
                     <div className="p-inputgroup align-items-center justify-content-evenly">
                       <p>{community.phone}</p>
                     </div>
-
                   </div>
                 </div>
               </div>
 
-              <div className='row my-5'>
+              <div className="row my-5">
                 <div className=" col-4 col-md-4 md:col-4">
                   <i className="pi pi-map-marker icon-khaki"></i>
 
@@ -901,7 +947,6 @@ const Communities = () => {
                     <div className="p-inputgroup align-items-center justify-content-evenly">
                       <p>{community.province}</p>
                     </div>
-
                   </div>
                 </div>
                 <div className=" col-4 md:col-4">
@@ -912,7 +957,6 @@ const Communities = () => {
                     <div className="p-inputgroup align-items-center justify-content-evenly">
                       <p>{community.canton}</p>
                     </div>
-
                   </div>
                 </div>
                 <div className=" col-4 md:col-4">
@@ -923,11 +967,10 @@ const Communities = () => {
                     <div className="p-inputgroup align-items-center justify-content-evenly">
                       <p>{community.district}</p>
                     </div>
-
                   </div>
                 </div>
               </div>
-              <div className='row my-5'>
+              <div className="row my-5">
                 <div className=" col-12 md:col-12">
                   <i className="pi pi-hashtag icon-khaki"></i>
 
@@ -939,12 +982,16 @@ const Communities = () => {
                   </div>
                 </div>
               </div>
-              <div className='row my-5'>
+              <div className="row my-5">
                 <div className=" col-12 md:col-12">
-
+                  <p>
-
+                    {' '}
-                  <p> <i className="pi pi-home icon-khaki"></i>  Viviendas</p>
+                    <i className="pi pi-home icon-khaki"></i> Viviendas
-                  <div className="p-0 col-12  md:col-12" style={{ margin: '0 auto' }}>
+                  </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}
@@ -968,7 +1015,11 @@ const Communities = () => {
                           field="tenants"
                           header={headerTenant}
                           body={tenantsBodyTemplate}
-                          style={{ flexGrow: 1, flexBasis: '160px', minWidth: '160px' }}
+                          style={{
+                            flexGrow: 1,
+                            flexBasis: '160px',
+                            minWidth: '160px',
+                          }}
                         ></Column>
                       </DataTable>
                     </div>
@@ -976,7 +1027,6 @@ const Communities = () => {
                 </div>
               </div>
             </div>
-
           </Dialog>
 
           <Dialog
@@ -994,7 +1044,8 @@ const Communities = () => {
               />
               {community && (
                 <span>
-                  ¿Estás seguro que desea cambiar estado a <b>{community.name}</b>?
+                  ¿Estás seguro que desea cambiar estado a{' '}
+                  <b>{community.name}</b>?
                 </span>
               )}
             </div>

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

@@ -8,6 +8,13 @@ import { faMapLocationDot } from '@fortawesome/free-solid-svg-icons';
 import { faPhoneAlt } from '@fortawesome/free-solid-svg-icons';
 import { faHashtag } from '@fortawesome/free-solid-svg-icons';
 import { faCircleQuestion } from '@fortawesome/free-solid-svg-icons';
+import { Button } from 'primereact/button';
+import { Toast } from 'primereact/toast';
+import { Dialog } from 'primereact/dialog';
+import { Toolbar } from 'primereact/toolbar';
+import { InputText } from 'primereact/inputtext';
+import classNames from 'classnames';
+import md5 from 'md5';
 
 const PerfilAdminComunidad = () => {
 
@@ -42,6 +49,13 @@ const PerfilAdminComunidad = () => {
         houses: [],
     };
 
+    let emptyNewPassword = {
+        _id: null,
+        passwordOld: '',
+        passwordNew: '',
+        passwordConfirm: ''
+    }
+
     const [admin, setAdmin] = useState(emptyAdminCommunity);
     const [community, setCommunity] = useState(emptyCommunity);
     const [cookies, setCookie] = useCookies();
@@ -52,33 +66,35 @@ const PerfilAdminComunidad = () => {
     const [provincesList, setProvincesList] = useState([]);
     const [cantonsList, setCantonsList] = useState([]);
     const [districtsList, setDistrictsList] = useState([]);
+    const [editAdminDialog, setEditAdminDialog] = useState(false);
+    const [editPasswordDialog, setEditPasswordDialog] = useState(false);
+    const [submitted, setSubmitted] = useState(false);
+    const toast = useRef(null);
+    const [newPassword, setNewPassword] = useState(emptyNewPassword);
+
+
 
     async function getProvinces() {
         const response = await fetch('assets/demo/data/provincias.json', {
-          method: 'GET',
+            method: 'GET',
         });
         return await response.json();
-      }
+    }
 
 
-      async function getCantons() {
+    async function getCantons() {
         const response = await fetch('assets/demo/data/cantones.json', {
-          method: 'GET',
+            method: 'GET',
         });
         return await response.json();
-      }
+    }
 
-    
+    async function getDistricts() {
-      async function getDistricts() {
         const response = await fetch('assets/demo/data/distritos.json', {
-          method: 'GET',
+            method: 'GET',
         });
         return await response.json();
-      }
+    }
-    
-    
-     
-
 
     async function getAdmin() {
         await fetch('http://localhost:4000/user/findUserById/' + cookies.id, { method: 'GET' })
@@ -100,6 +116,7 @@ const PerfilAdminComunidad = () => {
         getAdmin();
     }, [])
 
+
     async function getCommunity() {
         let pList = await getProvinces();
         let cList = await getCantons();
@@ -135,7 +152,106 @@ const PerfilAdminComunidad = () => {
         tenantsList(cookies.community_id);
     }, [])
 
+    const saveAdmin = () => {
+        let _admin = { ...admin };
+        _admin.community_id = cookies.community_id;
 
+        if (_admin.name && _admin.dni &&
+            _admin.last_name && _admin.email &&
+            _admin.phone) {
+
+            console.log(`Actualizando admnistrador de comunidad: ${_admin}`)
+            _admin.community_id = cookies.community_id;
+            console.log(`Actualizando admnistrador de comunidad: ${_admin}`)
+
+            fetch(`http://localhost:4000/user/updateAdminCommunity/${_admin._id}`, {
+                cache: 'no-cache',
+                method: 'PUT',
+                body: JSON.stringify(_admin),
+                headers: {
+                    'Content-Type': 'application/json',
+                },
+            }).then((response) => {
+                if (response.status !== 200)
+                    console.log(`Hubo un error en el servicio: ${response.status}`)
+                else return response.json()
+            }).then((response) => {
+
+                toast.current.show({
+                    severity: 'success',
+                    summary: 'Éxito',
+                    detail: 'Administrador de comunidad actualizado',
+                    life: 3000,
+                })
+
+                setAdmin(response.message);
+                setEditAdminDialog(false);
+
+            })
+
+
+        } else {
+            setSubmitted(true);
+        }
+
+
+    }
+
+    const savePassword = () => {
+        let _admin = { ...admin };
+        let _newPassword = { ...newPassword };
+
+        if (_newPassword.passwordOld && _newPassword.passwordNew &&
+            _newPassword.passwordNew === _newPassword.passwordConfirm) {
+
+            _admin.password = md5(_newPassword.passwordNew);
+            console.log(`Actualizando admnistrador de comunidad: ${_admin}`)
+
+            fetch(`http://localhost:4000/user/changePassword/${_admin._id}`, {
+                cache: 'no-cache',
+                method: 'PUT',
+                body: JSON.stringify(_admin),
+                headers: {
+                    'Content-Type': 'application/json',
+                },
+            }).then((response) => {
+                if (response.status !== 200)
+                    console.log(`Hubo un error en el servicio: ${response.status}`)
+                else return response.json()
+            }).then((response) => {
+
+                toast.current.show({
+                    severity: 'success',
+                    summary: 'Éxito',
+                    detail: 'Administrador de comunidad actualizado',
+                    life: 3000,
+                })
+                setAdmin(_admin);
+                setEditPasswordDialog(false);
+            })
+
+
+        } else {
+            setSubmitted(true);
+        }
+
+
+    }
+
+    const findRepeated = async (name, value) => {
+        let _administrators;
+        await fetch('http://localhost:4000/user/findAdminComunidad/', { method: 'GET' })
+            .then((response) => response.json())
+            .then((data) => data.message)
+            .then(data => {
+                data = data.filter(
+                    (val) => val.status != -1,
+                );
+                _administrators = data;
+            });
+        let value_filtered = await _administrators.filter(item => item[`${name}`] === value);
+        return value_filtered.length;
+    }
 
     function findNameTenant(tenant_id) {
         let name = '';
@@ -148,6 +264,105 @@ const PerfilAdminComunidad = () => {
         return name;
     }
 
+    const onInputChange = (e, name) => {
+        const val = (e.target && e.target.value) || '';
+        let _admin = { ...admin };
+        _admin[`${name}`] = val;
+        setAdmin(_admin);
+    }
+
+
+    const onInputChangePassword = (e, name) => {
+        const val = (e.target && e.target.value) || '';
+        let _pass = { ...newPassword };
+        _pass[`${name}`] = val;
+        setNewPassword(_pass);
+    }
+
+
+    const editAdmin = (admin) => {
+        setAdmin(admin);
+        setEditAdminDialog(true);
+    }
+
+    const editPassword = () => {
+        setNewPassword(emptyNewPassword);
+        setEditPasswordDialog(true);
+    }
+
+    const hideEditAdminDialog = () => {
+        setSubmitted(false);
+        setEditAdminDialog(false);
+    }
+
+    const hideEditPasswordDialog = () => {
+        setSubmitted(false);
+        setEditPasswordDialog(false);
+    }
+
+    const actionsAdminCommunity = (rowData) => {
+        return (
+            <>
+                <div className='container my-2'>
+                    <div className='row justify-content-end'>
+                        <div className='col-3'>
+                            <Button
+                                icon="pi pi-pencil"
+                                className="p-button-rounded p-button-primary mt-2 mx-2"
+                                onClick={() => editAdmin(rowData)}
+                                label="Editar Mis Datos"
+                            />
+
+                        </div>
+                        <div className='col-3'>
+                            <Button
+                                icon="pi pi-pencil"
+                                className="p-button-rounded p-button-primary mt-2 mx-2"
+                                onClick={() => editPassword(rowData)}
+                                label="Modificar Contraseña"
+                            />
+                        </div>
+                    </div>
+                </div>
+            </>
+        )
+    }
+
+
+    const editAdminDialogFooter = (
+        <>
+            <Button
+                label="Guardar Cambios"
+                icon="pi pi-check"
+                className="p-button-primary"
+                onClick={saveAdmin}
+            />
+            <Button
+                label="Cancelar"
+                icon="pi pi-check"
+                className="p-button-text"
+                onClick={hideEditAdminDialog}
+            />
+        </>
+    );
+
+    const editPasswordDialogFooter = (
+        <>
+            <Button
+                label="Guardar Cambios"
+                icon="pi pi-check"
+                className="p-button-primary"
+                onClick={savePassword}
+            />
+            <Button
+                label="Cancelar"
+                icon="pi pi-check"
+                className="p-button-text"
+                onClick={hideEditPasswordDialog}
+            />
+        </>
+    );
+
     const headerNumberHouses = (
         <>
             <p>
@@ -183,11 +398,180 @@ const PerfilAdminComunidad = () => {
         )
     }
 
+
     return (
         <>
+            <div className="grid">
+                <Toast ref={toast} />
+                {actionsAdminCommunity(admin)}
+                <Dialog
+                    visible={editAdminDialog}
+                    style={{ width: '650px' }}
+                    header="Actualizar mi información"
+                    modal
+                    className="p-fluid"
+                    footer={editAdminDialogFooter}
+                    onHide={hideEditAdminDialog}>
+                    <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-user"></i>
+                                    </span>
+                                    <InputText id="name" value={admin.name} onChange={(e) => onInputChange(e, 'name')} required autoFocus className={classNames({ 'p-invalid': submitted && admin.name === '' })} />
+                                </div>
+                                {submitted && admin.name === '' && <small className="p-invalid">Nombre es requirido.</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-user"></i>
+                                    </span>
+                                    <InputText id="last_name" value={admin.last_name} onChange={(e) => onInputChange(e, 'last_name')} required autoFocus className={classNames({ 'p-invalid': submitted && admin.last_name === '' })} />
+                                </div>
+                                {submitted && admin.last_name === '' && <small className="p-invalid">Apellidos es requirido.</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-at"></i>
+                                    </span>
+                                    <InputText id="email" value={admin.email}
+                                        onChange={(e) => onInputChange(e, 'email')} required autoFocus
+                                        className={classNames({
+                                            'p-invalid': submitted &&
+                                                (admin.email === '' || findRepeated('email', admin.email) > 0)
+                                        })} />
+                                </div>
+                                {submitted && admin.email === '' && <small className="p-invalid">Correo electrónico
+                                    es requirido.</small>}
+                                {submitted && findRepeated('email', admin.email) > 0 &&
+                                    <small className="p-invalid">Correo electrónico se encuentra repetido.</small>
+                                }
+                            </div>
+                        </div>
+                        <div className="field col-12 md:col-6">
+                            <label htmlFor="name">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-id-card"></i>
+                                    </span>
+                                    <InputText id="dni" value={admin.dni}
+                                        onChange={(e) => onInputChange(e, 'dni')} required autoFocus
+                                        className={classNames({
+                                            'p-invalid': submitted
+                                                && (admin.dni === '' || findRepeated('dni', admin.dni) > 0)
+                                        })} />
+                                </div>
+                                {submitted && admin.dni === '' && <small className="p-invalid">Identificación es requirida.</small>}
+                                {submitted && findRepeated('dni', admin.dni) > 0 &&
+                                    <small className="p-invalid">Identificación se encuentra repetida.</small>
+                                }
+                            </div>
+                        </div>
+                        <div className="field col-12 md:col-6">
+                            <label htmlFor="name">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={admin.phone} onChange={(e) => onInputChange(e, 'phone')} required autoFocus className={classNames({ 'p-invalid': submitted && admin.phone === '' })} />
+                                </div>
+                                {submitted && admin.phone === '' && <small className="p-invalid">Número de teléfono es requirida.</small>}
+                            </div>
+                        </div>
+                    </div>
+                </Dialog>
+                <Dialog
+                    visible={editPasswordDialog}
+                    style={{ width: '650px' }}
+                    header="Actualizar contraseña"
+                    modal
+                    className="p-fluid"
+                    footer={editPasswordDialogFooter}
+                    onHide={hideEditPasswordDialog}>
+                    <div className="p-fluid formgrid grid">
+                        <div className="field col-12 md:col-12">
+                            <label htmlFor="name">Contraseña Actual</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-lock"></i>
+                                    </span>
+                                    <InputText id="passwordOld" value={newPassword.passwordOld}
+                                        onChange={(e) => onInputChangePassword(e, 'passwordOld')}
+                                        required autoFocus
+                                        className={classNames({
+                                            'p-invalid': submitted
+                                                && newPassword.passwordOld === ''
+                                                && admin.password !== md5(newPassword.passwordOld)
+                                        })} />
+                                </div>
+                                {submitted && newPassword.passwordOld === ''
+                                    && <small className="p-invalid">Contraseña Actual es requirida.</small>}
+
+                                {submitted && admin.password != md5(newPassword.passwordOld)
+                                    && <small className="p-invalid">Contraseña Actual no coincide con la actual.</small>}
+
+                            </div>
+                        </div>
+
+                        <div className="field col-12 md:col-12">
+                            <label htmlFor="name">Contraseña Nueva</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-lock"></i>
+                                    </span>
+                                    <InputText id="passwordNew" value={newPassword.passwordNew}
+                                        onChange={(e) => onInputChangePassword(e, 'passwordNew')}
+                                        required autoFocus
+                                        className={classNames({
+                                            'p-invalid': submitted
+                                                && newPassword.passwordNew === ''
+                                                && admin.password === md5(newPassword.passwordNew)
+                                        })} />
+                                </div>
+                                {submitted && newPassword.passwordNew === ''
+                                    && <small className="p-invalid">Contraseña Nueva es requirida.</small>}
+                            </div>
+                        </div>
+                        <div className="field col-12 md:col-12">
+                            <label htmlFor="name">Contraseña Nueva</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-lock"></i>
+                                    </span>
+                                    <InputText id="passwordConfirm"
+                                        value={newPassword.passwordConfirm}
+                                        onChange={(e) => onInputChangePassword(e, 'passwordConfirm')}
+                                        required autoFocus
+                                        className={classNames({ 'p-invalid': submitted && newPassword.passwordConfirm !== newPassword.passwordNew })} />
+                                </div>
+                                {submitted
+                                    && newPassword.passwordConfirm !== newPassword.passwordNew
+                                    && newPassword.passwordConfirm === ''
+                                    && <small className="p-invalid">No coincide con la nueva contraseña.</small>}
+                            </div>
+                        </div>
+                    </div>
+                </Dialog>
+            </div>
             <div className="grid justify-content-center">
 
-                <div className="col-6" >
+
+                <div className="col-5" >
                     <div className="card">
                         <div className='container text-center'>
                             <div className='row my-4'>
@@ -239,8 +623,9 @@ const PerfilAdminComunidad = () => {
                         </div>
 
                     </div>
+
                 </div>
-                <div className='col-6'>
+                <div className='col-7'>
                     {community && (
                         <div className="card">
                             <div className='container text-center'>
@@ -259,7 +644,7 @@ const PerfilAdminComunidad = () => {
                                     </div>
                                     <div className="col-4 md:col-4">
                                         <i className="pi pi-phone icon-khaki"></i>
-                                        <p><strong>Teléfono Administrativo</strong></p>
+                                        <p><strong>Teléfono</strong></p>
 
                                         <div className="p-0 col-12  md:col-12" style={{ margin: '0 auto' }}>
                                             <div className="p-inputgroup align-items-center justify-content-evenly">
@@ -268,12 +653,12 @@ const PerfilAdminComunidad = () => {
 
                                         </div>
                                     </div>
-                                     <div className=" col-4 col-md-4 md:col-4">
+                                    <div className=" col-4 col-md-4 md:col-4">
                                         <i className="pi pi-map-marker icon-khaki"></i>
 
                                         <p><strong>Ubicación</strong></p>
-                                        <div className="p-0 col-10 md:col-10">
+                                        <div>
-                                            <div className="p-inputgroup align-items-center justify-content-evenly">
+                                            <div className="p-inputgroup justify-content-evenly">
                                                 <p>{community.province}, {community.canton}, {community.district}</p>
                                             </div>