mirror of
https://github.com/goharbor/harbor.git
synced 2024-11-26 12:15:20 +01:00
Add select-all and unselect-all for robot permissions (#15962)
Signed-off-by: AllForNothing <sshijun@vmware.com>
This commit is contained in:
parent
ab037c35cc
commit
d5a4f0b8bc
@ -6,6 +6,12 @@
|
||||
<clr-icon shape="caret down"></clr-icon>
|
||||
</button>
|
||||
<clr-dropdown-menu [style.height.px]="230" clrPosition="bottom-left" *clrIfOpen>
|
||||
<div>
|
||||
<button class="btn btn-link btn-sm select-all-for-dropdown" (click)="selectAllPermissionOrUnselectAll(defaultAccesses);resetAccess(defaultAccesses)">
|
||||
<span *ngIf="isSelectAll(defaultAccesses)">{{"SYSTEM_ROBOT.SELECT_ALL" | translate}}</span>
|
||||
<span *ngIf="!isSelectAll(defaultAccesses)">{{"SYSTEM_ROBOT.UNSELECT_ALL" | translate}}</span>
|
||||
</button>
|
||||
</div>
|
||||
<div clrDropdownItem *ngFor="let item of defaultAccesses" (click)="chooseDefaultAccess(item)">
|
||||
<clr-icon class="check" shape="check" [style.visibility]="item.checked ? 'visible' : 'hidden'"></clr-icon>
|
||||
<span>{{i18nMap[item.action] | translate}} {{i18nMap[item.resource] | translate}}</span>
|
||||
@ -33,6 +39,12 @@
|
||||
<clr-icon shape="caret down"></clr-icon>
|
||||
</button>
|
||||
<clr-dropdown-menu [style.height.px]="140" clrPosition="bottom-left" *clrIfOpen>
|
||||
<div>
|
||||
<button class="btn btn-link btn-sm select-all-for-dropdown" (click)="selectAllPermissionOrUnselectAll(p.permissions[0].access)">
|
||||
<span *ngIf="isSelectAll(p.permissions[0].access)">{{"SYSTEM_ROBOT.SELECT_ALL" | translate}}</span>
|
||||
<span *ngIf="!isSelectAll(p.permissions[0].access)">{{"SYSTEM_ROBOT.UNSELECT_ALL" | translate}}</span>
|
||||
</button>
|
||||
</div>
|
||||
<div clrDropdownItem *ngFor="let item of p.permissions[0].access" (click)="chooseAccess(item)">
|
||||
<clr-icon class="check" shape="check" [style.visibility]="item.checked ? 'visible' : 'hidden'"></clr-icon>
|
||||
<span>{{i18nMap[item.action] | translate}} {{i18nMap[item.resource] | translate}}</span>
|
||||
|
@ -107,4 +107,23 @@ export class ListAllProjectsComponent implements OnInit {
|
||||
}
|
||||
this.showSelectAll = !this.showSelectAll;
|
||||
}
|
||||
isSelectAll(permissions: FrontAccess[]): boolean {
|
||||
if (permissions?.length) {
|
||||
return permissions.filter(item => item.checked).length < permissions.length / 2;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
selectAllPermissionOrUnselectAll(permissions: FrontAccess[]) {
|
||||
if (permissions?.length) {
|
||||
if (this.isSelectAll(permissions)) {
|
||||
permissions.forEach(item => {
|
||||
item.checked = true;
|
||||
});
|
||||
} else {
|
||||
permissions.forEach(item => {
|
||||
item.checked = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -115,6 +115,12 @@
|
||||
<clr-icon shape="caret down"></clr-icon>
|
||||
</button>
|
||||
<clr-dropdown-menu class="dropdown-menu" [style.height.px]="230" clrPosition="bottom-left" *clrIfOpen>
|
||||
<div>
|
||||
<button class="btn btn-link btn-sm select-all-for-dropdown" (click)="selectAllOrUnselectAll(defaultAccesses)">
|
||||
<span *ngIf="isSelectAll(defaultAccesses)">{{"SYSTEM_ROBOT.SELECT_ALL" | translate}}</span>
|
||||
<span *ngIf="!isSelectAll(defaultAccesses)">{{"SYSTEM_ROBOT.UNSELECT_ALL" | translate}}</span>
|
||||
</button>
|
||||
</div>
|
||||
<div clrDropdownItem *ngFor="let item of defaultAccesses" (click)="chooseAccess(item)">
|
||||
<clr-icon class="check" shape="check" [style.visibility]="item.checked ? 'visible' : 'hidden'"></clr-icon>
|
||||
<span>{{i18nMap[item.action] | translate}} {{i18nMap[item.resource] | translate}}</span>
|
||||
|
@ -457,4 +457,24 @@ export class NewRobotComponent implements OnInit, OnDestroy {
|
||||
shouldShowWarning(): boolean {
|
||||
return new Date() >= this.calculateExpiresAt();
|
||||
}
|
||||
|
||||
isSelectAll(permissions: FrontAccess[]): boolean {
|
||||
if (permissions?.length) {
|
||||
return permissions.filter(item => item.checked).length < permissions.length / 2;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
selectAllOrUnselectAll(permissions: FrontAccess[]) {
|
||||
if (permissions?.length) {
|
||||
if (this.isSelectAll(permissions)) {
|
||||
permissions.forEach(item => {
|
||||
item.checked = true;
|
||||
});
|
||||
} else {
|
||||
permissions.forEach(item => {
|
||||
item.checked = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -96,6 +96,12 @@
|
||||
<clr-icon shape="caret down"></clr-icon>
|
||||
</button>
|
||||
<clr-dropdown-menu class="overflow-y-scroll" [style.height.px]="230" clrPosition="bottom-left" *clrIfOpen>
|
||||
<div>
|
||||
<button class="btn btn-link btn-sm select-all-for-dropdown" (click)="selectAllOrUnselectAll(defaultAccesses)">
|
||||
<span *ngIf="isSelectAll(defaultAccesses)">{{"SYSTEM_ROBOT.SELECT_ALL" | translate}}</span>
|
||||
<span *ngIf="!isSelectAll(defaultAccesses)">{{"SYSTEM_ROBOT.UNSELECT_ALL" | translate}}</span>
|
||||
</button>
|
||||
</div>
|
||||
<div clrDropdownItem *ngFor="let item of defaultAccesses" (click)="chooseAccess(item)">
|
||||
<clr-icon class="check" shape="check" [style.visibility]="item.checked ? 'visible' : 'hidden'"></clr-icon>
|
||||
<span>{{i18nMap[item.action] | translate}} {{i18nMap[item.resource] | translate}}</span>
|
||||
|
@ -295,4 +295,23 @@ export class AddRobotComponent implements OnInit, OnDestroy {
|
||||
shouldShowWarning(): boolean {
|
||||
return new Date() >= this.calculateExpiresAt();
|
||||
}
|
||||
isSelectAll(permissions: FrontAccess[]): boolean {
|
||||
if (permissions?.length) {
|
||||
return permissions.filter(item => item.checked).length < permissions.length / 2;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
selectAllOrUnselectAll(permissions: FrontAccess[]) {
|
||||
if (permissions?.length) {
|
||||
if (this.isSelectAll(permissions)) {
|
||||
permissions.forEach(item => {
|
||||
item.checked = true;
|
||||
});
|
||||
} else {
|
||||
permissions.forEach(item => {
|
||||
item.checked = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -290,3 +290,7 @@ hbr-copy-input {
|
||||
color: $pull-command-icon-hover-color;
|
||||
}
|
||||
}
|
||||
|
||||
.select-all-for-dropdown {
|
||||
color: $select-all-for-dropdown-color !important;
|
||||
}
|
||||
|
@ -47,4 +47,5 @@ $input-autofill-bg-color: #1b2a32;
|
||||
$input-autofill-color: #eaedf0;
|
||||
$pull-command-icon-color: #4aaed9;
|
||||
$pull-command-icon-hover-color: #007CBB;
|
||||
$select-all-for-dropdown-color: #4aaed9;
|
||||
@import "./common.scss";
|
||||
|
@ -49,4 +49,5 @@ $input-autofill-bg-color: #fafafa;
|
||||
$input-autofill-color: #000;
|
||||
$pull-command-icon-color: #007CBB;
|
||||
$pull-command-icon-hover-color: #4aaed9;
|
||||
$select-all-for-dropdown-color: #0072a3;
|
||||
@import "./common.scss";
|
||||
|
Loading…
Reference in New Issue
Block a user