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 d01594a [DLAB-1969]: Added possibility to switch between project on
list of resources (#840)
d01594a is described below
commit d01594ae11a00c3dbe45072c95f8166b110e905e
Author: Dmytro Gnatyshyn <[email protected]>
AuthorDate: Mon Aug 3 13:52:17 2020 +0300
[DLAB-1969]: Added possibility to switch between project on list of
resources (#840)
[DLAB-1969]: Added possibility to switch between project on list of
resources
---
.../reporting-grid/reporting-grid.component.ts | 15 ++++---
.../src/app/resources/resources.component.html | 49 ++++++++++++----------
.../src/app/resources/resources.component.ts | 11 +++--
.../resources/webapp/src/assets/styles/_theme.scss | 20 ++++++++-
4 files changed, 63 insertions(+), 32 deletions(-)
diff --git
a/services/self-service/src/main/resources/webapp/src/app/reports/reporting/reporting-grid/reporting-grid.component.ts
b/services/self-service/src/main/resources/webapp/src/app/reports/reporting/reporting-grid/reporting-grid.component.ts
index ef70e24..bf25aae 100644
---
a/services/self-service/src/main/resources/webapp/src/app/reports/reporting/reporting-grid/reporting-grid.component.ts
+++
b/services/self-service/src/main/resources/webapp/src/app/reports/reporting/reporting-grid/reporting-grid.component.ts
@@ -36,24 +36,24 @@ export class ReportingGridComponent implements OnInit,
AfterViewInit {
fullReport: Array<any>;
isFiltered: boolean = false;
active: object = {};
+ public isScrollButtonsVisible: boolean;
@ViewChild('nameFilter', { static: false }) filter;
@ViewChild('tableWrapper', { static: false }) tableWrapper;
- @ViewChild('table', { static: false }) table;
+ @ViewChild('table', { static: false }) table;
@Output() filterReport: EventEmitter<{}> = new EventEmitter();
@Output() resetRangePicker: EventEmitter<boolean> = new EventEmitter();
@Input() filteredReportData: ReportingConfigModel;
- private isScrollButtonsVisible: boolean;
@HostListener('window:resize', ['$event'])
onResize(event) {
this.isScrollButtonsVisible = this.tableWrapper.nativeElement.offsetWidth
- this.table._elementRef.nativeElement.offsetWidth < 0;
- this.isMaxRight = this.tableWrapper.nativeElement.offsetWidth +
this.tableWrapper.nativeElement.scrollLeft + 2 <=
this.table._elementRef.nativeElement.offsetWidth;
+ this.isMaxRight = this.checkMaxRight();
}
@HostListener('scroll', ['$event'])
scrollTable($event: Event) {
- this.isMaxRight = this.tableWrapper.nativeElement.offsetWidth +
this.tableWrapper.nativeElement.scrollLeft + 2 <=
this.table._elementRef.nativeElement.offsetWidth;
+ this.isMaxRight = this.checkMaxRight();
}
@@ -71,7 +71,7 @@ export class ReportingGridComponent implements OnInit,
AfterViewInit {
ngAfterViewInit() {
window.setTimeout(() => {
this.isScrollButtonsVisible =
this.tableWrapper.nativeElement.offsetWidth -
this.table._elementRef.nativeElement.offsetWidth < 0;
- this.isMaxRight = this.tableWrapper.nativeElement.offsetWidth +
this.tableWrapper.nativeElement.scrollLeft !==
this.table._elementRef.nativeElement.offsetWidth;
+ this.isMaxRight = this.checkMaxRight();
}, 500);
}
@@ -152,4 +152,9 @@ export class ReportingGridComponent implements OnInit,
AfterViewInit {
}
}
+ private checkMaxRight() {
+ return this.isMaxRight = this.tableWrapper.nativeElement.offsetWidth +
+ this.tableWrapper.nativeElement.scrollLeft + 2 <=
this.table._elementRef.nativeElement.offsetWidth;
+ }
+
}
diff --git
a/services/self-service/src/main/resources/webapp/src/app/resources/resources.component.html
b/services/self-service/src/main/resources/webapp/src/app/resources/resources.component.html
index d47559f..d6b9616 100644
---
a/services/self-service/src/main/resources/webapp/src/app/resources/resources.component.html
+++
b/services/self-service/src/main/resources/webapp/src/app/resources/resources.component.html
@@ -18,7 +18,7 @@
-->
<div class="base-retreat">
- <div class="sub-nav">
+ <div class="sub-nav resource-btns">
<div class="selection">
<span
matTooltip="{{!healthStatus?.projectAssigned ? 'You are not assigned
to any project' : 'You have not any active project'}}"
@@ -26,22 +26,21 @@
[matTooltipClass]="'bucket-item-tooltip'"
[matTooltipDisabled]="healthStatus?.projectAssigned &&
resourcesGrid.activeProjectsList?.length !== 0"
>
- <span>{{resourcesGrid.activeProject}}</span>
<button mat-raised-button class="butt butt-create"
(click)="createEnvironment()"
[disabled]="!healthStatus?.projectAssigned ||
!resourcesGrid.activeProjectsList?.length">
<i class="material-icons">add</i>Create new
</button>
</span>
<div class="mat-reset">
- <div class="control selector-wrapper" *ngIf="projects.length">
+ <div class="control selector-wrapper"
*ngIf="resourcesGrid.activeProjectsList?.length">
<mat-form-field>
<mat-label>Select active project</mat-label>
<mat-select [(value)]="resourcesGrid.activeProject">
- <mat-option *ngIf="projects.length > 1"
(click)="setActiveProject()">Show all</mat-option>
- <mat-option *ngFor="let project of projects"
[value]="project.name"
+ <mat-option *ngIf="resourcesGrid.activeProjectsList?.length > 1"
(click)="setActiveProject('')">Show all</mat-option>
+ <mat-option *ngFor="let project of
resourcesGrid.activeProjectsList" [value]="project.name"
(click)="setActiveProject(project.name)">
{{ project.name }}</mat-option>
- <mat-option *ngIf="!projects.length" class="multiple-select
ml-10" disabled>Projects list is empty
+ <mat-option *ngIf="!resourcesGrid.activeProjectsList?.length"
class="multiple-select ml-10" disabled>Projects list is empty
</mat-option>
</mat-select>
<button class="caret">
@@ -60,23 +59,29 @@
>
<button mat-raised-button class="butt butt-tool"
(click)="bucketBrowser(this.bucketStatus?.view)"
[disabled]="!this.bucketStatus?.view ||
resourcesGrid.bucketsList?.length === 0">
- <i class="material-icons"></i>Bucket browser
- </button>
+ <i class="material-icons"></i>Bucket browser
+ </button>
+ </span>
+ <span>
+ <button mat-raised-button class="butt butt-tool"
(click)="manageUngit()">
+ <i class="material-icons"></i>Git credentials
+ </button>
+ </span>
+ <span>
+ <button mat-raised-button class="butt butt-tool show-all-btn"
(click)="toggleFiltering()">
+ <span *ngIf="!resourcesGrid.activeFiltering">
+ <i class="material-icons">visibility_off</i> Show active
+ </span>
+ <span *ngIf="resourcesGrid.activeFiltering">
+ <i class="material-icons">visibility</i> Show all
+ </span>
+ </button>
+ </span>
+ <span>
+ <button mat-raised-button class="butt" (click)="refreshGrid()">
+ <i class="material-icons">autorenew</i>Refresh
+ </button>
</span>
- <button mat-raised-button class="butt butt-tool" (click)="manageUngit()">
- <i class="material-icons"></i>Git credentials
- </button>
- <button mat-raised-button class="butt butt-tool"
(click)="toggleFiltering()">
- <span *ngIf="!resourcesGrid.activeFiltering">
- <i class="material-icons">visibility_off</i> Show active
- </span>
- <span *ngIf="resourcesGrid.activeFiltering">
- <i class="material-icons">visibility</i> Show all
- </span>
- </button>
- <button mat-raised-button class="butt" (click)="refreshGrid()">
- <i class="material-icons">autorenew</i>Refresh
- </button>
</div>
</div>
<mat-divider></mat-divider>
diff --git
a/services/self-service/src/main/resources/webapp/src/app/resources/resources.component.ts
b/services/self-service/src/main/resources/webapp/src/app/resources/resources.component.ts
index 301509d..f5af0e9 100644
---
a/services/self-service/src/main/resources/webapp/src/app/resources/resources.component.ts
+++
b/services/self-service/src/main/resources/webapp/src/app/resources/resources.component.ts
@@ -17,7 +17,7 @@
* under the License.
*/
-import { Component, OnInit, ViewChild } from '@angular/core';
+import {AfterViewInit, Component, OnInit, ViewChild} from '@angular/core';
import { ToastrService } from 'ngx-toastr';
import { MatDialog } from '@angular/material/dialog';
@@ -35,10 +35,10 @@ import {BucketBrowserComponent} from
'./bucket-browser/bucket-browser.component'
styleUrls: ['./resources.component.scss']
})
-export class ResourcesComponent implements OnInit {
+export class ResourcesComponent implements OnInit, AfterViewInit {
public exploratoryEnvironments: Exploratory[] = [];
public healthStatus: any;
- projects: Project[] = [];
+ projects = [];
@ViewChild(ResourcesGridComponent, { static: true }) resourcesGrid:
ResourcesGridComponent;
@@ -53,6 +53,11 @@ export class ResourcesComponent implements OnInit {
ngOnInit() {
this.getEnvironmentHealthStatus();
this.exploratoryEnvironments = this.resourcesGrid.environments;
+ this.projects = this.resourcesGrid.activeProjectsList;
+ }
+
+ ngAfterViewInit() {
+ console.log(this.resourcesGrid);
}
public createEnvironment(): 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 f8fc702..ee719c5 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
@@ -843,7 +843,7 @@ mat-progress-bar {
box-shadow: none;
}
-#range-picker .ng-daterangepicker .calendar{
+#range-picker .ng-daterangepicker .calendar {
z-index: 102;
border: 1px solid rgba(234, 234, 234, 0.64);
border-radius: 0;
@@ -851,9 +851,10 @@ mat-progress-bar {
0 2px 2px 0 rgba(0, 0, 0, 0.14),
0 1px 5px 0 rgba(0, 0, 0, 0.12);
- &.is-to:after{
+ &.is-to:after {
left: 250px;
}
+}
#range-picker .ng-daterangepicker .calendar::after {
border-top: 1px solid rgba(234, 234, 234, 0.64);
@@ -968,4 +969,19 @@ mat-progress-bar {
}
}
+.show-all-btn.mat-raised-button .mat-button-wrapper > *{
+ vertical-align: baseline;
+}
+
+.resource-btns {
+ .mat-raised-button{
+ line-height: 38px;
+ }
+
+ .mat-select-value{
+ margin-top: 1px;
+ }
+}
+
+
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
