You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@dlab.apache.org by dg...@apache.org on 2020/02/05 16:13:17 UTC

[incubator-dlab] branch develop updated: [DLAB-1509]: Removed actions from quota popup (#586)

This is an automated email from the ASF dual-hosted git repository.

dgnatyshyn pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/incubator-dlab.git


The following commit(s) were added to refs/heads/develop by this push:
     new b08bd24  [DLAB-1509]: Removed actions from quota popup (#586)
b08bd24 is described below

commit b08bd2466bafd8bb51540955fb16ef6d67e81335
Author: Dmytro Gnatyshyn <42...@users.noreply.github.com>
AuthorDate: Wed Feb 5 18:13:06 2020 +0200

    [DLAB-1509]: Removed actions from quota popup (#586)
    
    [DLAB-1509]: Removed actions from quota popup
---
 .../manage-environment-dilog.component.html        | 73 +++++++++++++---------
 .../manage-environment-dilog.component.scss        | 40 ++----------
 .../manage-environment-dilog.component.ts          | 14 ++---
 .../management-grid/management-grid.component.ts   |  2 +-
 .../management/management.component.ts             | 26 ++++----
 .../project/project-list/project-list.component.ts |  4 +-
 .../services/applicationServiceFacade.service.ts   |  1 +
 .../reporting-grid/reporting-grid.component.html   |  2 +-
 .../reporting-grid/reporting-grid.component.ts     |  5 +-
 .../src/app/reporting/reporting.component.ts       | 38 +++++++----
 .../resources/webapp/src/assets/styles/_theme.scss |  8 +--
 11 files changed, 105 insertions(+), 108 deletions(-)

diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/management/manage-environment/manage-environment-dilog.component.html b/services/self-service/src/main/resources/webapp/src/app/administration/management/manage-environment/manage-environment-dilog.component.html
index d4380ba..ba8e6f7 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/management/manage-environment/manage-environment-dilog.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/management/manage-environment/manage-environment-dilog.component.html
@@ -30,7 +30,7 @@
             <mat-list-item class="list-header">
               <div class="username">Project</div>
               <div class="quotes">Limit</div>
-              <div class="action">Actions</div>
+<!--              <div class="action">Actions</div>-->
             </mat-list-item>
             <div class="scrolling-content" id="scrolling" formArrayName="projects">
               <mat-list-item *ngFor="let item of usersEnvironments.controls; let i=index" [formGroupName]="i"
@@ -48,41 +48,52 @@
                     *ngIf="manageUsersForm?.controls['projects']['controls'][i].controls['budget'].hasError('overrun')">Per-user
                     quotes cannot be greater than total budget</span>
                 </div>
-                <div class="action">
-                  <span
-                    *ngIf="manageUsersForm?.controls['projects']['controls'][i].controls['canBeStopped'].value; else not_allowed_stop"
-                    matTooltip="Stop" matTooltipPosition="above" (click)="applyAction('stop', item)">
-                    <i class="material-icons">pause_circle_outline</i>
-                  </span>
-                  <ng-template #not_allowed_stop>
-                    <span matTooltip="Unable to stop project because all resources are already stopped'"
-                      matTooltipPosition="above" class="not-active">
-                      <i class="material-icons">pause_circle_outline</i>
-                    </span>
-                  </ng-template>
+<!--                <div class="action">-->
+<!--                  <span-->
+<!--                    *ngIf="manageUsersForm?.controls['projects']['controls'][i].controls['canBeStopped'].value; else not_allowed_stop"-->
+<!--                    matTooltip="Stop" matTooltipPosition="above" (click)="applyAction('stop', item)">-->
+<!--                    <i class="material-icons">pause_circle_outline</i>-->
+<!--                  </span>-->
+<!--                  <ng-template #not_allowed_stop>-->
+<!--                    <span matTooltip="Unable to stop project because all resources are already stopped'"-->
+<!--                      matTooltipPosition="above" class="not-active">-->
+<!--                      <i class="material-icons">pause_circle_outline</i>-->
+<!--                    </span>-->
+<!--                  </ng-template>-->
 
-                  <span
-                    *ngIf="manageUsersForm?.controls['projects']['controls'][i].controls['canBeTerminated'].value; else not_allowed_terminate"
-                    matTooltip="Terminate" matTooltipPosition="above" (click)="applyAction('terminate', item)">
-                    <i class="material-icons">phonelink_off</i>
-                  </span>
-                  <ng-template #not_allowed_terminate>
-                    <span matTooltip="Unable to terminate project because all resources are already terminated"
-                      matTooltipPosition="above" class="not-active">
-                      <i class="material-icons">phonelink_off</i>
-                    </span>
-                  </ng-template>
+<!--                  <span-->
+<!--                    *ngIf="manageUsersForm?.controls['projects']['controls'][i].controls['canBeTerminated'].value; else not_allowed_terminate"-->
+<!--                    matTooltip="Terminate" matTooltipPosition="above" (click)="applyAction('terminate', item)">-->
+<!--                    <i class="material-icons">phonelink_off</i>-->
+<!--                  </span>-->
+<!--                  <ng-template #not_allowed_terminate>-->
+<!--                    <span matTooltip="Unable to terminate project because all resources are already terminated"-->
+<!--                      matTooltipPosition="above" class="not-active">-->
+<!--                      <i class="material-icons">phonelink_off</i>-->
+<!--                    </span>-->
+<!--                  </ng-template>-->
 
-                </div>
+<!--                </div>-->
               </mat-list-item>
             </div>
             <div class="control-group total-budget">
-              <label class="label">Total budget</label>
-              <div class="control">
-                <input type="number" (keypress)="CheckUtils.numberOnly($event)" formControlName="total"
-                  placeholder="Enter total budget, in USD">
-                <span class="error" *ngIf="manageUsersForm?.controls['total'].hasError('overrun')">Total budget cannot be lower than a sum of users quotes</span>
-              </div>
+
+              <mat-list-item class="list-item">
+                <div class="username ellipsis">
+                  <span class="ellipsis">Total budget</span>
+                </div>
+                <div class="quotes">
+                  <input type="number" (keypress)="CheckUtils.numberOnly($event)" formControlName="total"
+                         placeholder="Enter total budget, in USD">
+                  <span class="error" *ngIf="manageUsersForm?.controls['total'].hasError('overrun')">Total budget cannot be lower than a sum of users quotes</span>
+                </div>
+<!--              <label class="username">Total budget</label>-->
+<!--              <div class="quotes">-->
+<!--                <input type="number" (keypress)="CheckUtils.numberOnly($event)" formControlName="total"-->
+<!--                  placeholder="Enter total budget, in USD">-->
+<!--                <span class="error" *ngIf="manageUsersForm?.controls['total'].hasError('overrun')">Total budget cannot be lower than a sum of users quotes</span>-->
+<!--              </div>-->
+              </mat-list-item>
             </div>
             <div class="text-center m-top-30">
               <button mat-raised-button type="button" (click)="dialogRef.close()" class="butt action">Cancel</button>
diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/management/manage-environment/manage-environment-dilog.component.scss b/services/self-service/src/main/resources/webapp/src/app/administration/management/manage-environment/manage-environment-dilog.component.scss
index a034d8f..0245506 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/management/manage-environment/manage-environment-dilog.component.scss
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/management/manage-environment/manage-environment-dilog.component.scss
@@ -43,7 +43,7 @@
   }
 
   .quotes {
-    width: 40%;
+    width: 55%;
     margin-right: 10px;
     position: relative;
 
@@ -55,46 +55,14 @@
     }
   }
 
-  .action {
-    width: 15%;
-
-    span {
-      padding: 3px;
-      cursor: pointer;
-
-      &:hover {
-        color: #35afd5;
-      }
-
-      &.not-active {
-        &:hover {
-          color: #6b8299;
-        }
-      }
-
-      i {
-        font-size: 20px;
-      }
-    }
-
-    .disabled {
-      cursor: not-allowed !important;
-      pointer-events: all;
-      opacity: .6;
-
-      &:hover {
-        color: #6b8299;
-      }
-    }
-  }
-
   .total-budget {
     border-top: 1px solid #edf1f5;
     padding-top: 15px;
 
     .control {
       position: relative;
-      width: 56%;
+      width: 45%;
+      margin-right: 10px;
 
       .error {
         position: absolute;
@@ -104,7 +72,7 @@
     }
 
     .label {
-      width: 44%;
+      width: 55%;
     }
   }
 }
diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/management/manage-environment/manage-environment-dilog.component.ts b/services/self-service/src/main/resources/webapp/src/app/administration/management/manage-environment/manage-environment-dilog.component.ts
index c9bc231..a3ae8d2 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/management/manage-environment/manage-environment-dilog.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/management/manage-environment/manage-environment-dilog.component.ts
@@ -49,19 +49,19 @@ export class ManageEnvironmentComponent implements OnInit {
     !this.manageUsersForm && this.initForm();
     this.setProjectsControl();
     this.manageUsersForm.controls['total'].setValue(this.data.total.conf_max_budget || '');
-    this.onFormChange()
+    this.onFormChange();
   }
 
   public onFormChange() {
     this.manageUsersForm.valueChanges.subscribe(value => {
-      if((this.getCurrentTotalValue() && this.getCurrentTotalValue() >= this.getCurrentUsersTotal())) {
+      if ((this.getCurrentTotalValue() && this.getCurrentTotalValue() >= this.getCurrentUsersTotal())) {
         this.manageUsersForm.controls['projects']['controls'].forEach(v => {
             v.controls['budget'].setErrors(null);
         }
         );
-        this.manageUsersForm.controls['total'].setErrors(null)
+        this.manageUsersForm.controls['total'].setErrors(null);
       }
-    })
+    });
   }
 
   get usersEnvironments(): FormArray {
@@ -69,10 +69,10 @@ export class ManageEnvironmentComponent implements OnInit {
   }
 
   public setBudgetLimits(value) {
-    if(this.getCurrentTotalValue() >= this.getCurrentUsersTotal()){
+    if (this.getCurrentTotalValue() >= this.getCurrentUsersTotal()) {
       this.dialogRef.close(value);
-    }else{
-      this.manageUsersForm.controls['total'].setErrors({ overrun: true })
+    } else {
+      this.manageUsersForm.controls['total'].setErrors({ overrun: true });
     }
   }
 
diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.ts b/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.ts
index f8f6b84..216d79c 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.ts
@@ -76,7 +76,7 @@ export class ManagementGridComponent implements OnInit {
   }
 
   getEnvironmentData() {
-    setTimeout(() => {this.progressBarService.startProgressBar();} , 0);
+    setTimeout(() => {this.progressBarService.startProgressBar(); } , 0);
     this.environmentsDataService._data.subscribe(data => {
       if (data) {
         this.allEnvironmentData = EnvironmentModel.loadEnvironments(data);
diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/management/management.component.ts b/services/self-service/src/main/resources/webapp/src/app/administration/management/management.component.ts
index 0449e08..da2122b 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/management/management.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/management/management.component.ts
@@ -97,8 +97,8 @@ export class ManagementComponent implements OnInit {
   openManageEnvironmentDialog() {
     this.projectService.getProjectsManagingList().subscribe(projectsList => {
       this.getTotalBudgetData().subscribe(total => {
-        this.dialogRef = this.dialog.open(ManageEnvironmentComponent, { data: { projectsList, total }, panelClass: 'modal-xl-s' });
-        this.dialogRef.componentInstance.manageEnv.subscribe((data) => this.manageEnvironment(data));
+        this.dialogRef = this.dialog.open(ManageEnvironmentComponent, { data: { projectsList, total }, panelClass: 'modal-sm' });
+        // this.dialogRef.componentInstance.manageEnv.subscribe((data) => this.manageEnvironment(data));
         this.dialogRef.afterClosed().subscribe(result => result && this.setBudgetLimits(result));
       }, () => this.toastr.error('Failed users list loading!', 'Oops!'));
     });
@@ -126,23 +126,23 @@ export class ManagementComponent implements OnInit {
     }, error => this.toastr.error(error.message, 'Oops!'));
   }
 
-  manageEnvironment(event: { action: string, project: any }) {
-    if (event.action === 'stop')
-      this.projectService.stopProjectAction(event.project.project_name)
-        .subscribe(() => this.handleSuccessAction(event.action), error => this.toastr.error(error.message, 'Oops!'));
-
-    if (event.action === 'terminate')
-      this.projectService.deleteProject(event.project.project_name)
-        .subscribe(() => this.handleSuccessAction(event.action), error => this.toastr.error(error.message, 'Oops!'));
-  }
+  // manageEnvironment(event: { action: string, project: any }) {
+  //   if (event.action === 'stop')
+  //     this.projectService.stopProjectAction(event.project.project_name)
+  //       .subscribe(() => this.handleSuccessAction(event.action), error => this.toastr.error(error.message, 'Oops!'));
+  //
+  //   if (event.action === 'terminate')
+  //     this.projectService.deleteProject(event.project.project_name)
+  //       .subscribe(() => this.handleSuccessAction(event.action), error => this.toastr.error(error.message, 'Oops!'));
+  // }
 
   handleSuccessAction(action) {
     this.toastr.success(`Action ${action} is processing!`, 'Processing!');
     this.projectService.getProjectsManagingList().subscribe(data => {
-      this.dialogRef.componentInstance.data.projectsList = data
+      this.dialogRef.componentInstance.data.projectsList = data;
       this.dialogRef.componentInstance.setProjectsControl();
     });
-    this.buildGrid()
+    this.buildGrid();
   }
 
   get creatingBackup(): boolean {
diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.ts b/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.ts
index 9010480..9238b7f 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.ts
@@ -28,6 +28,8 @@ import { Project, Endpoint } from '../project.component';
 import { CheckUtils } from '../../../core/util';
 import {ProgressBarService} from '../../../core/services/progress-bar.service';
 import {EdgeActionDialogComponent} from '../../../shared/modal-dialog/edge-action-dialog';
+import {EndpointService} from '../../../core/services';
+
 
 @Component({
   selector: 'project-list',
@@ -112,7 +114,7 @@ export class ProjectListComponent implements OnInit, OnDestroy {
           return endpoint.status === 'STOPPED';
         }
         if (action === 'terminate') {
-          return endpoint.status === 'RUNNING' || endpoint.status == 'STOPPED';
+          return endpoint.status === 'RUNNING' || endpoint.status === 'STOPPED';
         }
       });
       this.dialog.open(EdgeActionDialogComponent, {data: {type: action, item: endpoints}, panelClass: 'modal-sm'})
diff --git a/services/self-service/src/main/resources/webapp/src/app/core/services/applicationServiceFacade.service.ts b/services/self-service/src/main/resources/webapp/src/app/core/services/applicationServiceFacade.service.ts
index 6e2aab3..0056039 100644
--- a/services/self-service/src/main/resources/webapp/src/app/core/services/applicationServiceFacade.service.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/core/services/applicationServiceFacade.service.ts
@@ -347,6 +347,7 @@ export class ApplicationServiceFacade {
       data,
       { responseType: 'text', observe: 'response' });
   }
+
   public buildGetBackupStatusRequest(uuid): Observable<any> {
     return this.buildRequest(HTTPMethod.GET,
       this.requestRegistry.Item(ApplicationServiceFacade.BACKUP),
diff --git a/services/self-service/src/main/resources/webapp/src/app/reporting/reporting-grid/reporting-grid.component.html b/services/self-service/src/main/resources/webapp/src/app/reporting/reporting-grid/reporting-grid.component.html
index c21bb07..6e3de79 100644
--- a/services/self-service/src/main/resources/webapp/src/app/reporting/reporting-grid/reporting-grid.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/reporting/reporting-grid/reporting-grid.component.html
@@ -212,7 +212,7 @@
 
     <tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true" class="header-row"></tr>
 
-    <tr [hidden]="!collapseFilterRow" mat-header-row *matHeaderRowDef="displayedFilterColumns; sticky: true"
+    <tr [hidden]="!collapseFilterRow || !PROVIDER" mat-header-row *matHeaderRowDef="displayedFilterColumns; sticky: true"
       class="filter-row"></tr>
     <tr mat-row *matRowDef="let row; columns: displayedColumns;" class="DATA"></tr>
 
diff --git a/services/self-service/src/main/resources/webapp/src/app/reporting/reporting-grid/reporting-grid.component.ts b/services/self-service/src/main/resources/webapp/src/app/reporting/reporting-grid/reporting-grid.component.ts
index 74308ab..1856688 100644
--- a/services/self-service/src/main/resources/webapp/src/app/reporting/reporting-grid/reporting-grid.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/reporting/reporting-grid/reporting-grid.component.ts
@@ -17,9 +17,10 @@
  * under the License.
  */
 
-import { Component, OnInit, Output, EventEmitter, ViewChild } from '@angular/core';
+import {Component, OnInit, Output, EventEmitter, ViewChild, Input} from '@angular/core';
 
 import { DICTIONARY, ReportingConfigModel } from '../../../dictionary/global.dictionary';
+import {logger} from 'codelyzer/util/logger';
 
 @Component({
   selector: 'dlab-reporting-grid',
@@ -37,12 +38,12 @@ export class ReportingGridComponent implements OnInit {
   reportData: Array<any> = [];
   fullReport: Array<any>;
   isFiltered: boolean = false;
-  private PROVIDER: string = 'aws';
 
   @ViewChild('nameFilter', { static: false }) filter;
 
   @Output() filterReport: EventEmitter<{}> = new EventEmitter();
   @Output() resetRangePicker: EventEmitter<boolean> = new EventEmitter();
+  @Input() PROVIDER: string;
   displayedColumns: string[] = ['name', 'user', 'project', 'type', 'status', 'shape', 'service', 'charge'];
   displayedFilterColumns: string[] = ['name-filter', 'user-filter', 'project-filter', 'type-filter', 'status-filter', 'shape-filter', 'service-filter', 'actions'];
 
diff --git a/services/self-service/src/main/resources/webapp/src/app/reporting/reporting.component.ts b/services/self-service/src/main/resources/webapp/src/app/reporting/reporting.component.ts
index 83d7bc6..1768440 100644
--- a/services/self-service/src/main/resources/webapp/src/app/reporting/reporting.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/reporting/reporting.component.ts
@@ -21,7 +21,7 @@
 import { Component, OnInit, OnDestroy, ViewChild } from '@angular/core';
 import { ToastrService } from 'ngx-toastr';
 
-import { BillingReportService, HealthStatusService } from '../core/services';
+import {BillingReportService, EndpointService, HealthStatusService} from '../core/services';
 import { ReportingGridComponent } from './reporting-grid/reporting-grid.component';
 import { ToolbarComponent } from './toolbar/toolbar.component';
 
@@ -38,7 +38,7 @@ import {ProgressBarService} from '../core/services/progress-bar.service';
                   (setRangeOption)="setRangeOption($event)">
     </dlab-toolbar>
     <mat-divider></mat-divider>
-    <dlab-reporting-grid (filterReport)="filterReport($event)" (resetRangePicker)="resetRangePicker()"></dlab-reporting-grid>
+    <dlab-reporting-grid [PROVIDER]="PROVIDER" (filterReport)="filterReport($event)" (resetRangePicker)="resetRangePicker()"></dlab-reporting-grid>
   </div>
 
   `,
@@ -68,25 +68,41 @@ export class ReportingComponent implements OnInit, OnDestroy {
   data: any;
   billingEnabled: boolean;
   admin: boolean;
-  private PROVIDER: string = 'aws';
+  public PROVIDER: string;
 
   constructor(
     private billingReportService: BillingReportService,
     private healthStatusService: HealthStatusService,
     public toastr: ToastrService,
     private progressBarService: ProgressBarService,
+    private endpointService: EndpointService,
   ) { }
 
   ngOnInit() {
-    this.rebuildBillingReport();
+    this.getBillingProvider();
   }
 
   ngOnDestroy() {
     this.clearStorage();
   }
 
+  getBillingProvider() {
+    this.getEnvironmentHealthStatus();
+    this.endpointService.getEndpointsData().subscribe(list => {
+      // @ts-ignore
+      const endpoints = [...list];
+      const localEndpoint = endpoints.filter(endpoint => endpoint.name === 'local');
+      if (localEndpoint.length) {
+        this.PROVIDER = localEndpoint[0].cloudProvider.toLowerCase();
+        if (this.PROVIDER) {
+              this.rebuildBillingReport();
+            }
+      }
+    });
+  }
+
   getGeneralBillingData() {
-    setTimeout(() => {this.progressBarService.startProgressBar();} , 0);
+    setTimeout(() => {this.progressBarService.startProgressBar(); } , 0);
     this.billingReportService.getGeneralBillingData(this.reportData)
       .subscribe(data => {
         this.data = data;
@@ -113,12 +129,12 @@ export class ReportingComponent implements OnInit, OnDestroy {
   }
 
   rebuildBillingReport($event?): void {
-    this.clearStorage();
-    this.resetRangePicker();
-    this.reportData.defaultConfigurations();
-
-    this.getEnvironmentHealthStatus();
-    this.getGeneralBillingData();
+    if (this.PROVIDER) {
+      this.clearStorage();
+      this.resetRangePicker();
+      this.reportData.defaultConfigurations();
+      this.getGeneralBillingData();
+    }
   }
 
   exportBillingReport(): void {
diff --git a/services/self-service/src/main/resources/webapp/src/assets/styles/_theme.scss b/services/self-service/src/main/resources/webapp/src/assets/styles/_theme.scss
index 7ac6252..abf72ad 100644
--- a/services/self-service/src/main/resources/webapp/src/assets/styles/_theme.scss
+++ b/services/self-service/src/main/resources/webapp/src/assets/styles/_theme.scss
@@ -301,7 +301,7 @@ span.mat-slide-toggle-content {
 
 .project-form,
 .create-environment{
-  .ng-invalid{
+  .mat-select:not(.ng-pristine){
     .mat-form-field-label {
       line-height: 22px !important;
       font-size: 15px !important;
@@ -316,18 +316,16 @@ span.mat-slide-toggle-content {
 .project-form,
 .create-environment,
 .create-cluster{
-
-
   .mat-select-value{
     overflow: visible;
   }
 }
 
 .create-cluster {
-  .ng-invalid {
+  .mat-select:not(.ng-pristine) {
     .mat-form-field-label {
       padding-top: 5px;
-      line-height: 16px !important;
+      line-height: 55px !important;
       font-size: 15px !important;
     }
   }


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@dlab.apache.org
For additional commands, e-mail: commits-help@dlab.apache.org