Merge branch 'improvements' of onunez/soma-frontend into development

src/app/components/assets/assets.component.html

@@ -160,11 +160,12 @@
                     <i class="fa fa-chart-bar"></i>
                   </button>
                   <button title="Línea" [ngClass]="[chartActive[1]==true ? 'btn  btn-success' : 'btn btn-dark']" (click)="changeGraphicType('line')"> 
-                    <i class="fa fa-chart-line"></i>
+                    <i class="fa fa-chart-area"></i>
                   </button>
+                  <!--
                   <button title="Area" [ngClass]="[chartActive[2]==true ? 'btn  btn-success' : 'btn btn-dark']" (click)="changeGraphicType('radar')"> 
                     <i class="fa fa-chart-area"></i>
-                  </button>
+                  </button>-->
                   <button title="Tabla" [ngClass]="[chartActive[3]==true ? 'btn  btn-success' : 'btn btn-dark']" (click)="changeToTable()"> 
                     <i class="fa fa-table"></i>
                   </button>
@@ -173,11 +174,14 @@
             </div>
           </div>
 
-
           <div class="chart-container" id="chart-wrapper">
             <canvas id="canvas">{{ chart1 }}</canvas>
           </div>
-          
+          <div class="no-data">
+            <h2>
+              Información no disponible
+            </h2>
+          </div>
           <div id="toogleTable">
             <ng-container class="example-container mat-elevation-z8" *ngIf="showTable" >
               <div class="example-table-container">
@@ -200,10 +204,8 @@
                     IMPRIMIR
                   </button>
                 </div>
-                
 
                 <mat-table  matTableExporter #table [dataSource]="dataSource"  #exporter="matTableExporter" id="measuresTable">
-          
                   <div *ngFor="let disCol of displayedColumns; let colIndex = index" matColumnDef="{{disCol}}">
                     <mat-header-cell *matHeaderCellDef>{{disCol}}</mat-header-cell>
                     <mat-cell *matCellDef="let element"> {{element[colIndex]}}
@@ -213,12 +215,9 @@
                   <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
                   <mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
                 </mat-table>
-
-
-
               </div>
             </ng-container>
-            <mat-paginator class="hiddenonload" [pageSizeOptions]="[5, 10, 25, dataSource.data.length] " [length]="dataSource.data.length" [pageIndex]="0" [pageSize]="5"></mat-paginator>
+            <mat-paginator class="hiddenonload" [pageSizeOptions]="[5, 10, 25, dataSource.data.length] " [length]="dataSource.data.length" [pageIndex]="0" [pageSize]="10"></mat-paginator>
           </div>
 
         </div>

src/app/components/assets/assets.component.scss

@@ -161,7 +161,7 @@ table {
     }
 
     span.savings-skin {
-      color: #548c2f;
+      color: #47a44b;
       background: #fff;
       border: none;
       font-size: 48px;
@@ -185,7 +185,7 @@ table {
         margin-right: 8px;
       }
       h3 {
-        color: #39843c;
+        color: #47a44b;
         margin: 0;
       }
     }
@@ -194,12 +194,12 @@ table {
       font-size: 14px;
       i {
         font-size: 16px;
-        color: #196d21;
+        color: #47a44b;
       }
 
       span {
         border: none;
-        color: #055;
+        color: #47a44b;
         font-size: 20px;
         line-height: 0;
         text-align: center;
@@ -239,12 +239,14 @@ table {
         border: none;
         font-size: 1.2rem;
         font-weight: bold;
-        color: #386641;
+        color: #47a44b;
         vertical-align: middle;
       }
     }
 
   }
+
+
 }
 
 .btn {
@@ -261,6 +263,16 @@ table {
 }
 
 
+.no-data {
+  text-align: center;
+  z-index: 20;
+  position: absolute;
+  top: 50%;
+  left: 30%;
+  right: 30%;
+  visibility: hidden;
+}
+
 
 @media screen and (min-width: 960px) {
   .mini-stats {

src/app/components/assets/assets.component.ts

@@ -17,6 +17,7 @@ import { formatDate, DatePipe } from '@angular/common';
 import {AngularMyDatePickerDirective,IAngularMyDpOptions, IMyDateModel} from 'angular-mydatepicker';
 import printJS from 'print-js'
 import { ExportType,ExcelOptions, Options } from 'mat-table-exporter';
+import * as $ from "jquery";
 
 @Component({
   selector: 'app-assets',
@@ -193,7 +194,7 @@ export class AssetsComponent implements OnInit {
     //this.chartjs = true;
     setTimeout(()=>{
       Swal.close();
-    }, 2700);
+    }, 2500);
   }
   
   // Default check asset dropdown if a value is equal to an assetID
@@ -372,9 +373,11 @@ export class AssetsComponent implements OnInit {
         this.savings_logs_data.push(this.savings_logs[savingDate]["ahorro"]);
       }
 
+      
       // Get the measures according to the meters, given the params required
       this.logsService.getEnergyProducedByParams(assetId,interval,dateRange).toPromise()
       .then((data: any) => {
+
         this.metersData = [];      
         this.metersKeys = Object.keys(data["data"]["dataset"]);
         
@@ -395,7 +398,7 @@ export class AssetsComponent implements OnInit {
           this.metersData.push({"label": label, backgroundColor: this.barChartColors[prop], data: measure_values, borderColor: this.borderChartColors[prop] });
           this.tableData.push({headers: label+" [kWh]", dataValues: measure_values});
         }
-        
+
         // this.metersData.push({ "label": "Ahorro", data: [10,30,30,40,30,20,15,25,30,35], type: "line", backgroundColor: "#e57272", borderColor: "#ce2525", borderWidth: 2, yAxisID: 'y-axis-ahorro',})
         // Initialization of arrays for the table view of the measure values
         this.array1 = this.array2 = this.array3 = [];
@@ -443,7 +446,7 @@ export class AssetsComponent implements OnInit {
         // According to the selected interval in the option buttons of the chart, the date is given an specific format 
         switch (view){
           case "day": 
-            this.barChartLabels = this.metersValues[0]["data"].map(obj => formatDate(obj.dateMax, 'HH:mm ','es-Es','-0600')).reverse();
+            this.barChartLabels = this.metersValues[0]["data"].map(obj => formatDate(obj.dateMin, 'HH:mm ','es-Es','-0600')).reverse();
             break; 
           case 'week':
             this.barChartLabels = this.metersValues[0]["data"].map(obj => formatDate(obj.dateMax, 'EEEE dd','es-Es','-0600')).reverse();
@@ -463,6 +466,14 @@ export class AssetsComponent implements OnInit {
           this.displayedColumns.push(this.tableData[v]["headers"]);
         }
         this.tableData2 = this.array1;
+        if (this.array1.length == 0){
+          $(".no-data").css('visibility', 'visible');
+          $(".chart-container").css('visibility', 'hidden');
+        }
+        else {
+          $(".no-data").css('visibility', 'hidden');
+          $(".chart-container").css('visibility', 'visible');
+        }
 
         this.dataSource.data = this.tableData2;
         this.dataSource.paginator = this.paginator;
@@ -508,13 +519,21 @@ export class AssetsComponent implements OnInit {
               yAxes: [
                 {
                   stacked: true,
-                  position: "left"
+                  position: "left",
+                  scaleLabel: {
+                    display: true,
+                    labelString: 'Kilowatts hora [kWh]'
+                  },
                 },
                 {
                   display: true,
                   stacked: true,
                   position: 'right',
                   id: 'y-axis-ahorro',
+                  scaleLabel: {
+                    display: true,
+                    labelString: 'Ahorro [US$]'
+                  },
                   gridLines: {
                     drawOnChartArea: false
                   }
@@ -533,7 +552,7 @@ export class AssetsComponent implements OnInit {
     });
     setTimeout(()=>{
       Swal.close();
-    }, 1500)
+    }, 1600)
   }
 
   getDateWithFormat(view:string, date:string){
@@ -606,7 +625,7 @@ export class AssetsComponent implements OnInit {
 
     this.chart1Type = chartType;
 
-    if (this.chart1 != undefined){
+    if (this.chart1 != undefined || this.chart1 == undefined){
       this.chart1.destroy();
     }
     this.chart1 = undefined;
@@ -648,13 +667,21 @@ export class AssetsComponent implements OnInit {
           yAxes: [
             {
               stacked: true,
-              position: "left"
+              position: "left",
+              scaleLabel: {
+                display: true,
+                labelString: 'Kilowatts hora [kWh]'
+              }
             },
             {
               display: true,
               stacked: false,
               position: 'right',
               id: 'y-axis-ahorro',
+              scaleLabel: {
+                display: true,
+                labelString: 'Ahorro [US$]'
+              },
               gridLines: {
                 drawOnChartArea: false
               }

src/app/components/dashboard/dashboard.component.ts

@@ -139,6 +139,7 @@ export class DashboardComponent implements OnInit {
     setTimeout(() => {
        if (this.listAssets != undefined) {
         this.addMarkers();
+        this.sendPlantId(this.listAssets[0].id);
       }
       Swal.close();
     }, 1800);

src/app/components/organizations/organization/organization.component.html

@@ -62,6 +62,19 @@
                     <textarea name="address" class="form-control" rows="2" readonly formControlName="address"></textarea>
                   </div>
                   <!--<div *ngIf="error" class="alert alert-danger mt-3 mb-0">{{error}}</div>-->
+                  <br>
+                  <div cass="action-buttons">
+                    <a class="btn btn-primary btn-sm" [routerLink]="['/organization', organizationId, 'edit']" >
+                      Editar
+                    </a>
+                    <a class="btn btn-danger btn-sm" (click)="delete_organization2(organizationId)" >
+                      Eliminar
+                    </a>
+                    <!--
+                    <a class="btn btn-danger btn-sm" (click)="delete_organization(row.id)" *ngIf="allowedUser()" >
+                      Eliminar
+                    </a>-->
+                  </div>
                 </form>
               </div>
             </div>

src/app/components/organizations/organization/organization.component.scss

@@ -0,0 +1,3 @@
+.btn.btn-danger.btn-sm {
+  color: #fff;
+}

src/app/components/organizations/organization/organization.component.ts

@@ -51,4 +51,73 @@ export class OrganizationComponent implements OnInit {
   ngOnInit() { 
   }
 
+  delete_organization(id: string){
+    Swal.fire({
+      allowOutsideClick: false,
+      type: 'warning',
+      title: '¿Esta seguro?',
+      text: 'No podrá revertir esta acción',
+      showCancelButton: true,
+      confirmButtonColor: '#3085d6',
+      cancelButtonColor: '#d33',
+      confirmButtonText: 'Borrar registro',
+    })
+    .then((result) => {
+        if (result.value) {
+          this.delete_organization2(id);
+        }
+    });
+  }
+
+  delete_organization2(id: string){
+    this.orgService.deleteOrganization(id)
+    .subscribe(
+      data => {
+        if (data["success"] == true) {
+          //document.getElementById(id).remove();
+          Swal.fire({
+            allowOutsideClick: false,
+            type: 'success',
+            text: 'Registro eliminado con exito'
+          }).then((result) => {
+            if (result.value) {
+              this.reloadComponent();
+            }
+          });
+          //window.location.href="#/organizations";
+        }
+        else {
+          Swal.fire({
+            allowOutsideClick: false,
+            type: 'error',
+            text: "No tienes permiso para eliminar el registro"
+          });
+        }  
+      },
+      err => {
+        Swal.fire({
+          type: 'error',
+          title: 'Error en el servidor',
+          text: err.message
+        });
+      });
+  }
+
+  reloadComponent(){
+    this.router.routeReuseStrategy.shouldReuseRoute = () => false;
+    this.router.onSameUrlNavigation = 'reload';
+    this.router.navigate(['/organizations']);
+  }
+
+  allowedUser(){
+    let is_allowed: boolean;
+    if(+this.authService.getUserLevel() < 3){
+      is_allowed = false;
+    }
+    else {
+      is_allowed = true;
+    }
+    return is_allowed
+  }
+
 }

src/app/components/plants/edit-plant/edit-plant.component.html

@@ -72,7 +72,7 @@
                   <div class="form-group">
                     <label for="categoria_tarifaria">Categoría tarifaria: </label>
                     <select class="custom-select" formControlName="categoria_tarifaria" [ngClass]="{ 'is-invalid': submitted && f.categoria_tarifaria.errors }">
-                      <option *ngFor="let item of categoria_tarifaria" [value]="item" [selected]="item==listPlant.categoria_tarifaria" >{{item}}</option>
+                      <option *ngFor="let item of categoria_tarifaria" [value]="item.key" [selected]="item.key==listPlant.categoria_tarifaria" >{{item.value}}</option>
                     </select>
                     <div *ngIf="submitted && f.categoria_tarifaria.errors" class="invalid-feedback">
                       <div *ngIf="f.categoria_tarifaria.errors.required">Campo requerido</div>
@@ -82,7 +82,7 @@
                   <div class="form-group">
                     <label for="cod_tarifa">Código de tarifa: </label>
                     <select class="custom-select" formControlName="cod_tarifa" [ngClass]="{ 'is-invalid': submitted && f.cod_tarifa.errors }">
-                      <option *ngFor="let item of codigo_tarifa" [value]="item" [selected]="item==listPlant.cod_tarifa" >{{item}}</option>
+                      <option *ngFor="let item of codigo_tarifa" [value]="item.key" [selected]="item.key==listPlant.cod_tarifa" >{{item.value}}</option>
                     </select>
                     <div *ngIf="submitted && f.cod_tarifa.errors" class="invalid-feedback">
                       <div *ngIf="f.cod_tarifa.errors.required">Campo requerido</div>

src/app/components/plants/edit-plant/edit-plant.component.ts

@@ -19,10 +19,24 @@ export class EditPlantComponent implements OnInit {
   role_number: any;
   assetExists:boolean;
   distributor = ["EEO","CAESS","DELSUR","CLESA","DEUSEM","ABRUZZO","EDESAL","B&D","DEL SUR"];
-  categoria_tarifaria = ["PD", "MD", "GD"];
-  codigo_tarifa = ["R","G","AP","MD CMP - BT","MD CMP - MT","MD CMH - BT","MD CMH - MT","GD CMH - BT", "GD CMH - MT"];
-
+  categoria_tarifaria = [
+    { key: "PD", value: "PD Pequeña Demanda" },
+    { key: "MD", value: "MD Mediana Demanda" },
+    { key: "GD", value: "GD Gran Demanda" }
+  ];
 
+  codigo_tarifa = [
+    { key:"R", value: "R Residencial" },
+    { key:"G", value: "G General" },
+    { key:"AP", value: "AP Alumbrado Público" },
+    { key:"MD CMP - BT" ,value: "MD CMP-BT Mediana Demanda Con Medicion de Potencia Baja Tensión" },
+    { key:"MD CMP - MT" ,value: "MD CMP-MT Mediana Demanda Con Medicion de Potencia  Media Tensión" },
+    { key:"MD CMH - BT" ,value: "MD CMH-BT Mediana Demanda Con Medicion Horaria Baja Tensión" },
+    { key:"MD CMH - MT" ,value: "MD CMH-MT Mediana Demanda Con Medicion Horaria Media Tensión" },
+    { key:"GD CMH - BT", value: "GD CMH-BT Gran Demanda Con Medicion Horaria Baja Tensión" },
+    { key:"GD CMH - MT", value: "GD CMH-MT Gran Demanda Con Medicion Horaria Media Tensión" }
+  ];
+  
   constructor(private plantsService: PlantsService, private formBuilder: FormBuilder, private route: ActivatedRoute) {
     
     this.route.params.subscribe(params => {

src/app/components/plants/new-plant/new-plant.component.html

@@ -74,7 +74,7 @@
                   <div class="form-group">
                     <label for="categoria_tarifaria">Categoría tarifaria: </label>
                     <select class="custom-select" formControlName="categoria_tarifaria" [ngClass]="{ 'is-invalid': submitted && f.categoria_tarifaria.errors }">
-                      <option *ngFor="let item of categoria_tarifaria" [value]="item" >{{item}}</option>
+                      <option *ngFor="let item of categoria_tarifaria" [value]="item.key" >{{item.value}}</option>
                     </select>
                     <div *ngIf="submitted && f.categoria_tarifaria.errors" class="invalid-feedback">
                       <div *ngIf="f.categoria_tarifaria.errors.required">Campo requerido</div>
@@ -84,7 +84,7 @@
                   <div class="form-group">
                     <label for="cod_tarifa">Código de tarifa: </label>
                     <select class="custom-select" formControlName="cod_tarifa" [ngClass]="{ 'is-invalid': submitted && f.cod_tarifa.errors }">
-                      <option *ngFor="let item of codigo_tarifa" [value]="item" >{{item}}</option>
+                      <option *ngFor="let item of codigo_tarifa" [value]="item.key" >{{item.value}}</option>
                     </select>
                     <div *ngIf="submitted && f.cod_tarifa.errors" class="invalid-feedback">
                       <div *ngIf="f.cod_tarifa.errors.required">Campo requerido</div>

src/app/components/plants/new-plant/new-plant.component.ts

@@ -14,9 +14,24 @@ export class NewPlantComponent implements OnInit {
   submitted: boolean = false;
   role_number: any;
   distributor = ["EEO","CAESS","DELSUR","CLESA","DEUSEM","ABRUZZO","EDESAL","B&D","DEL SUR"];
-  categoria_tarifaria = ["PD", "MD", "GD"];
-  codigo_tarifa = ["R","G","AP","MD CMP - BT","MD CMP - MT","MD CMH - BT","MD CMH - MT","GD CMH - BT", "GD CMH - MT"];
+  
+  categoria_tarifaria = [
+    { key: "PD", value: "PD Pequeña Demanda" },
+    { key: "MD", value: "MD Mediana Demanda" },
+    { key: "GD", value: "GD Gran Demanda" }
+  ];
 
+  codigo_tarifa = [
+    { key:"R", value: "R Residencial" },
+    { key:"G", value: "G General" },
+    { key:"AP", value: "AP Alumbrado Público" },
+    { key:"MD CMP - BT" ,value: "MD CMP-BT Mediana Demanda Con Medicion de Potencia Baja Tensión" },
+    { key:"MD CMP - MT" ,value: "MD CMP-MT Mediana Demanda Con Medicion de Potencia  Media Tensión" },
+    { key:"MD CMH - BT" ,value: "MD CMH-BT Mediana Demanda Con Medicion Horaria Baja Tensión" },
+    { key:"MD CMH - MT" ,value: "MD CMH-MT Mediana Demanda Con Medicion Horaria Media Tensión" },
+    { key:"GD CMH - BT", value: "GD CMH-BT Gran Demanda Con Medicion Horaria Baja Tensión" },
+    { key:"GD CMH - MT", value: "GD CMH-MT Gran Demanda Con Medicion Horaria Media Tensión" }
+  ];
   constructor(private plantService: PlantsService, private formBuilder: FormBuilder) { }
 
   ngOnInit() {

src/app/components/plants/plant/plant.component.html

@@ -64,6 +64,16 @@
                     <label for="cod_tarifa">Código de tarifa: </label>
                     <input type="text" readonly formControlName="cod_tarifa" class="form-control" />
                   </div>
+                  <br>
+                  <div class="action-buttons">
+                    <a class="btn btn-primary btn-sm" [routerLink]="['/plant', assetID, 'edit']" >
+                      Editar
+                    </a>
+                    <!--
+                    <a class="btn btn-danger btn-sm" (click)="delete_organization(row.id)" *ngIf="allowedUser()" >
+                      Eliminar
+                    </a>-->
+                  </div>
 
                 </form>
               </div>

src/app/components/plants/plant/plant.component.ts

@@ -20,6 +20,24 @@ export class PlantComponent implements OnInit {
   role_number: any;
   assetExists:boolean;
   distributor = ['CAESS', 'DEL SUR', 'AES-CLESA', 'EEO', 'DEUSEM'];
+  
+  categoria_tarifaria = [
+    { key: "PD", value: "PD Pequeña Demanda" },
+    { key: "MD", value: "MD Mediana Demanda" },
+    { key: "GD", value: "GD Gran Demanda" }
+  ];
+
+  codigo_tarifa = [
+    { key:"R", value: "R Residencial" },
+    { key:"G", value: "G General" },
+    { key:"AP", value: "AP Alumbrado Público" },
+    { key:"MD CMP - BT" ,value: "MD CMP-BT Mediana Demanda Con Medicion de Potencia Baja Tensión" },
+    { key:"MD CMP - MT" ,value: "MD CMP-MT Mediana Demanda Con Medicion de Potencia  Media Tensión" },
+    { key:"MD CMH - BT" ,value: "MD CMH-BT Mediana Demanda Con Medicion Horaria Baja Tensión" },
+    { key:"MD CMH - MT" ,value: "MD CMH-MT Mediana Demanda Con Medicion Horaria Media Tensión" },
+    { key:"GD CMH - BT", value: "GD CMH-BT Gran Demanda Con Medicion Horaria Baja Tensión" },
+    { key:"GD CMH - MT", value: "GD CMH-MT Gran Demanda Con Medicion Horaria Media Tensión" }
+  ];
 
   constructor(private plantsService: PlantsService, private formBuilder: FormBuilder, private route: ActivatedRoute) {
     this.route.params.subscribe(params => {

src/app/models/organization.ts

@@ -8,4 +8,4 @@ export interface Organization {
     country: string;
     city: string;
     address: string;
-}
+}

src/assets/scss/material-dashboard.scss

@@ -79,7 +79,7 @@
 }
 
 .green-skin {
-  background-color: #548c2f;
+  background-color: #47a44b;
   border-color: #104911 !important;
 }