feat: rehauled console (#3525)

* new console

* move npm ci to angular build

* rel path for assets

* local grpc copy

* login policy, rm clear views, features rel path

* lock

Co-authored-by: Livio Amstutz <[email protected]>
This commit is contained in:
Max Peintner
2022-04-28 10:35:02 +00:00
committed by GitHub
co-authored by Livio Amstutz
parent 00f7dbe875
commit 08ae39ae19
668 changed files with 47746 additions and 19117 deletions
@@ -1,77 +1,69 @@
<div class="container">
<div class="max-width-container">
<div class="enlarged-container">
<div class="abort-container">
<button (click)="close()" mat-icon-button>
<mat-icon>close</mat-icon>
</button>
<h1 class="abort">{{ 'GRANTS.CREATE.TITLE' | translate }}</h1><span class="abort-2">Step
{{ currentCreateStep }} of
{{ STEPS }}</span>
<button (click)="close()" mat-icon-button>
<mat-icon>close</mat-icon>
</button>
<h1 class="abort">{{ 'GRANTS.CREATE.TITLE' | translate }}</h1><span class="abort-2">Step
{{ currentCreateStep }} of
{{ STEPS }}</span>
</div>
<ng-container *ngIf="currentCreateStep === 1">
<p class="desc">
{{'PROJECT.GRANT.CREATE.ORG_DESCRIPTION' | translate: org}}
<br>
{{'PROJECT.GRANT.CREATE.ORG_DESCRIPTION_DESC' | translate}}
<div class="user-grant-create-content">
<ng-container *ngIf="currentCreateStep === 1">
<p class="user-grant-create-desc cnsl-secondary-text">
{{'PROJECT.GRANT.CREATE.ORG_DESCRIPTION' | translate: org}}
<br>
{{'PROJECT.GRANT.CREATE.ORG_DESCRIPTION_DESC' | translate}}
</p>
<ng-container>
<h2>{{'PROJECT.GRANT.CREATE.SEL_USER' | translate}}</h2>
<h2>{{'PROJECT.GRANT.CREATE.SEL_USER' | translate}}</h2>
<cnsl-search-user-autocomplete class="block" [singleOutput]="true" [users]="user ? [user] : []"
(selectionChanged)="selectUser($event)"
[target]="context === UserGrantContext.USER ? UserTarget.EXTERNAL : UserTarget.SELF">
</cnsl-search-user-autocomplete>
<cnsl-search-user-autocomplete [editState]="context !== UserGrantContext.USER" class="block"
[users]="user ? [user] : []" (selectionChanged)="selectUsers($event)" [target]="UserTarget.SELF">
</cnsl-search-user-autocomplete>
</ng-container>
<ng-container *ngIf="context && (context === UserGrantContext.USER || context === UserGrantContext.NONE)">
<h2>{{'PROJECT.GRANT.CREATE.SEL_PROJECT' | translate}}</h2>
<h2 class="project-search">{{'PROJECT.GRANT.CREATE.SEL_PROJECT' | translate}}</h2>
<cnsl-search-project-autocomplete class="block" [singleOutput]="true"
(selectionChanged)="selectProject($event)">
</cnsl-search-project-autocomplete>
<cnsl-search-project-autocomplete class="block"
(selectionChanged)="selectProject($event.project, $event.type)">
</cnsl-search-project-autocomplete>
</ng-container>
</ng-container>
</ng-container>
<ng-container *ngIf="currentCreateStep === STEPS">
<ng-container *ngIf="currentCreateStep === STEPS">
<h1>{{'PROJECT.GRANT.CREATE.SEL_ROLES' | translate}}</h1>
<ng-container
*ngIf="$any(project)?.id && (context === UserGrantContext.OWNED_PROJECT || context === UserGrantContext.USER || context === UserGrantContext.NONE)">
<cnsl-card>
<cnsl-project-roles (changedSelection)="selectRoles($event)" [projectId]="projectId">
</cnsl-project-roles>
</cnsl-card>
</ng-container>
<ng-container
*ngIf="$any(project)?.projectId && (context === UserGrantContext.GRANTED_PROJECT || context === UserGrantContext.USER || context === UserGrantContext.NONE) && grantedRoleKeysList">
<cnsl-form-field class="form-field" appearance="outline">
<cnsl-label>{{ 'PROJECT.GRANT.ROLENAMESLIST' | translate }}</cnsl-label>
<mat-select multiple (selectionChange)="rolesList = $event.value">
<mat-option *ngFor="let role of grantedRoleKeysList" [value]="role">
{{role}}
</mat-option>
</mat-select>
</cnsl-form-field>
</ng-container>
</ng-container>
<cnsl-card>
<cnsl-project-roles-table
[displayedColumns]="['select', 'key', 'displayname', 'group', 'creationDate', 'changeDate']"
(changedSelection)="selectRoles($event)"
[projectId]="project?.id ? project.id : grantedProject?.projectId ? grantedProject.projectId : ''"
[grantId]="$any(project)?.grantId ? $any(project)?.grantId : ''">
</cnsl-project-roles-table>
</cnsl-card>
</ng-container>
<div class="btn-container">
<div class="btn-container">
<ng-container *ngIf="currentCreateStep === 1">
<button [disabled]="!org || !projectId || !userId" (click)="next()" color="primary" mat-raised-button
class="big-button" cdkFocusInitial>
{{ 'ACTIONS.CONTINUE' | translate }}
</button>
<button [disabled]="!org || !(project?.id || grantedProject?.projectId) || userIds.length < 1"
(click)="next()" color="primary" mat-raised-button class="big-button" cdkFocusInitial>
{{ 'ACTIONS.CONTINUE' | translate }}
</button>
</ng-container>
<ng-container *ngIf="currentCreateStep === STEPS">
<button (click)="previous()" color="primary" mat-button class="small-button" cdkFocusInitial>
{{ 'ACTIONS.BACK' | translate }}
</button>
<button color="primary" (click)="addGrant()" mat-raised-button class="big-button" cdkFocusInitial>
{{ 'ACTIONS.SAVE' | translate }}
</button>
<button (click)="previous()" mat-stroked-button class="small-button">
{{ 'ACTIONS.BACK' | translate }}
</button>
<button color="primary" (click)="addGrant()" mat-raised-button class="big-button" cdkFocusInitial>
{{ 'ACTIONS.SAVE' | translate }}
</button>
</ng-container>
</div>
</div>
</div>
</div>