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/06/16 14:33:17 UTC

[incubator-dlab] branch DLAB-1874 created (now 9b9d5a2)

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

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


      at 9b9d5a2  [DLAB-1874]: Fixed set of tasks for 'Environment management' page

This branch includes the following new commits:

     new 9b9d5a2  [DLAB-1874]: Fixed set of tasks for 'Environment management' page

The 1 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails.  The revisions
listed as "add" were already present in the repository and have only
been added to this reference.



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


[incubator-dlab] 01/01: [DLAB-1874]: Fixed set of tasks for 'Environment management' page

Posted by dg...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

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

commit 9b9d5a2134995cbd13b47a9243a2e0c10b75dc20
Author: Dmytro_Gnatyshyn <di...@ukr.net>
AuthorDate: Tue Jun 16 17:28:48 2020 +0300

    [DLAB-1874]: Fixed set of tasks for 'Environment management' page
---
 .../management-grid/management-grid.component.html  | 21 ++++++++++++++++++---
 .../management-grid/management-grid.component.scss  |  8 ++++----
 .../management-grid/management-grid.component.ts    | 11 +++++++----
 .../management/management.component.ts              | 11 +++++------
 .../computational-resources-list.component.scss     |  2 +-
 .../resources-grid/resources-grid.component.html    |  4 ++--
 .../resources-grid/resources-grid.component.scss    | 14 ++++++++++++++
 .../resources/webapp/src/assets/styles/_theme.scss  |  4 ++++
 8 files changed, 55 insertions(+), 20 deletions(-)

diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.html b/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.html
index 88b005c..02d9012 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.html
@@ -21,7 +21,11 @@
   <table mat-table [dataSource]="allFilteredEnvironmentData" class="data-grid management mat-elevation-z6">
     <ng-container matColumnDef="checkbox">
       <th mat-header-cell *matHeaderCellDef class="checkbox label-header">
-        <div  class="empty-checkbox header-checkbox" [ngClass]="{'checked': selected?.length === allActiveNotebooks?.length}" (click)="toggleSelectionAll();$event.stopPropagation()" >
+        <div  class="empty-checkbox header-checkbox"
+              *ngIf="allActiveNotebooks?.length>0"
+              [ngClass]="{'checked': selected?.length === allActiveNotebooks?.length}"
+              (click)="toggleSelectionAll();$event.stopPropagation()"
+        >
           <span class="checked-checkbox" *ngIf="selected?.length === allActiveNotebooks?.length"></span>
         </div>
         <button mat-icon-button aria-label="More" class="ar checkbox-border" (click)="toggleFilterRow()">
@@ -32,7 +36,12 @@
         </button>
       </th>
       <td mat-cell *matCellDef="let element">
-        <div *ngIf="element.type !== 'edge node' && (element.status==='running' || element.status==='stopped')" class="empty-checkbox" [ngClass]="{'checked': element.isSelected}" (click)="toggleActionForAll(element);$event.stopPropagation()" >
+        <div
+          *ngIf="element.type !== 'edge node' && (element.status==='running' || element.status==='stopped')"
+           class="empty-checkbox"
+           [ngClass]="{'checked': element.isSelected}"
+           (click)="toggleActionForAll(element);$event.stopPropagation()"
+        >
           <span class="checked-checkbox" *ngIf="element.isSelected"></span>
         </div>
       </td>
@@ -80,7 +89,13 @@
           </i>
         </button> </th>
       <td type mat-cell *matCellDef="let element">
-        <span *ngIf="element.name"  class="computation" (click)="openNotebookDetails(element)">{{element.name}}</span>
+        <span
+          *ngIf="element.name"
+          [ngClass]="{'computation': element.exploratory_urls?.length}"
+          (click)="openNotebookDetails(element)"
+        >
+          {{element.name}}
+        </span>
         <span *ngIf="!element.name">{{element.type}}</span>
       </td>
     </ng-container>
diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.scss b/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.scss
index 99fde37..548451e 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.scss
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.scss
@@ -21,11 +21,10 @@
   &.management {
     .mat-column-checkbox{
       padding-left: 10px;
-      padding-right: 10px;
+      padding-right: 0px;
+      min-width: 68px;
       &.label-header{
-        width: 65px;
-        display: flex;
-        align-items: center;
+
       }
 
     }
@@ -130,4 +129,5 @@ table.management {
 
 .computation{
   cursor: pointer;
+  color: #35afd5;
 }
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 38e4590..cb1c283 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
@@ -124,7 +124,6 @@ export class ManagementGridComponent implements OnInit {
     if (filteredData.length) this.filtering = true;
     if (config) {
       filteredData = filteredData.filter(item => {
-
         const isUser = config.users.length > 0 ? (config.users.indexOf(item.user) !== -1) : true;
         const isTypeName = item.name ? item.name.toLowerCase()
           .indexOf(config.type.toLowerCase()) !== -1 : item.type.toLowerCase().indexOf(config.type.toLowerCase()) !== -1;
@@ -208,7 +207,7 @@ export class ManagementGridComponent implements OnInit {
       return;
     }
     this.dialog.open(DetailDialogComponent, { data:
-        {notebook: data, bucketStatus: {view: true, upload: true, download: true, delete: true},  buckets: [], type: 'environment'},
+        {notebook: data, buckets: [], type: 'environment'},
       panelClass: 'modal-lg'
     })
       .afterClosed().subscribe(() => {});
@@ -251,7 +250,7 @@ export class ManagementGridComponent implements OnInit {
         <div class="resource-name">Notebook</div>
         <div class="clusters-list">
           <div class="clusters-list-item">
-            <div class="cluster">Cluster</div>
+            <div class="cluster"><span *ngIf="isClusterLength">Cluster</span></div>
             <div class="status">Further status</div>
           </div>
         </div>
@@ -304,7 +303,7 @@ export class ManagementGridComponent implements OnInit {
       header a:hover i { color: #35afd5; cursor: pointer; }
       .plur { font-style: normal; }
       .scrolling-content{overflow-y: auto; max-height: 200px; }
-      .cluster { width: 50%; text-align: left; color: #577289;}
+      .cluster { width: 50%; text-align: left;}
       .status { width: 50%;text-align: left;}
       .label { font-size: 15px; font-weight: 500; font-family: "Open Sans",sans-serif;}
       .node { font-weight: 300;}
@@ -325,6 +324,7 @@ export class ManagementGridComponent implements OnInit {
 
 export class ReconfirmationDialogComponent {
   private notebooks;
+  private isClusterLength;
   constructor(
     public dialogRef: MatDialogRef<ReconfirmationDialogComponent>,
     @Inject(MAT_DIALOG_DATA) public data: any
@@ -333,6 +333,9 @@ export class ReconfirmationDialogComponent {
       this.notebooks = JSON.parse(JSON.stringify(data.notebooks));
       this.notebooks = this.notebooks.map(notebook => {
         notebook.resources = notebook.resources.filter(res => res.status !== 'terminated' && res.status.slice(0, 4) !== data.action);
+        if (notebook.resources.length) {
+          this.isClusterLength = true;
+        }
         return notebook;
       });
     }
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 3062a07..ed66061 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
@@ -216,16 +216,15 @@ export class ManagementComponent implements OnInit {
           if (res) {
             notebooks.forEach((env) => {
               this.manageEnvironmentsService.environmentManagement(env.user, 'stop', env.project, env.name)
-                .subscribe(
-                  response => {
-                    console.log(response);
+                .subscribe(response => {
                     this.buildGrid();
                   },
                   error => console.log(error)
                 );
             });
+            this.clearSelection();
           }
-          this.clearSelection();
+          this.isActionsOpen = false;
         });
       } else if (action === 'terminate') {
         this.dialog.open(ReconfirmationDialogComponent, {
@@ -237,13 +236,13 @@ export class ManagementComponent implements OnInit {
                 .subscribe(
                   response => {
                     this.buildGrid();
-
                   },
                   error => console.log(error)
                 );
             });
+            this.clearSelection();
           }
-          this.clearSelection();
+          this.isActionsOpen = false;
         });
       // } else if (action === 'run') {
       //   this.healthStatusService.runEdgeNode().subscribe(() => {
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resources-list/computational-resources-list.component.scss b/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resources-list/computational-resources-list.component.scss
index a4b825e..87126a4 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resources-list/computational-resources-list.component.scss
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resources-list/computational-resources-list.component.scss
@@ -37,7 +37,7 @@
        padding-left: 10px;
 
        .detailed-link {
-         color: #577289;
+         color: #35afd5;
          cursor: pointer;
        }
      }
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html
index 69edcc3..0d46d0f 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html
@@ -22,7 +22,7 @@
     class="data-grid resources mat-elevation-z6">
 
     <ng-container matColumnDef="project">
-      <td mat-cell *matCellDef="let element" [attr.colspan]="8" class="highlight"> {{ element.project }} </td>
+      <td mat-cell *matCellDef="let element" [attr.colspan]="8" class="project-name"> {{ element.project }} </td>
     </ng-container>
 
     <!-- <ng-container *ngFor="let column of filteringColumns; let i = index" matColumnDef="{{ column.name }}"
@@ -105,7 +105,7 @@
         [@detailExpand]="element == expandedElement ? 'expanded' : 'collapsed'" sticky>
 
         <tr *ngFor="let element of element.exploratory; let i = index" class="element-row mat-row">
-          <td class="name-col" (click)="printDetailEnvironmentModal(element)">
+          <td class="name-col highlight" (click)="printDetailEnvironmentModal(element)">
             <span matTooltip="{{ element.name }}" matTooltipPosition="above">{{ element.name }}</span>
           </td>
           <td class="status-col status" ngClass="{{ element.status.toLowerCase() || ''}}">
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.scss b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.scss
index d8a6f0b..c0f0a6f 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.scss
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.scss
@@ -95,11 +95,19 @@ table {
     padding-right: 5px;
     padding-left: 24px;
     background-color: inherit;
+    &.notebook-name{
+
+    }
     .label{
       padding-top: 14px;
     }
   }
 
+  .project-name{
+    font-weight: 600;
+    color: #577289;
+  }
+
   .status-col,
   .shape-col {
     width: 15%;
@@ -107,6 +115,12 @@ table {
       padding-top: 14px;
     }
   }
+  .shape-col{
+    color: #577289;
+    .label{
+      color: rgba(0,0,0,.54);
+    }
+  }
 
   .tag-col {
     width: 13%;
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 bf3529d..48217e9 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
@@ -442,6 +442,10 @@ span.mat-slide-toggle-content {
   margin-top: 2px;
   position: relative;
   cursor: pointer;
+  &.header-checkbox{
+    margin-top: 13px;
+    float: left;
+  }
   &.checked {
     border-color: #35afd5;
     background-color: #35afd5;


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