TheArchive/zitadel
1
0
Fork 0
mirror of https://github.com/zitadel/zitadel.git synced 2025-05-08 04:46:46 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(console): idp create, table, i18n (#870)

Browse Source 
* fix idp removal, add, links

* confirm deletion

* stylelint

* confirmation on multiple delete

* clear after confirm
This commit is contained in:
Max Peintner 2020-10-19 15:48:00 +02:00 committed by GitHub
parent 1b9c2ac92b
commit 4fb6ad3f69
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 191 additions and 90 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
console/src/app/modules/idp-create/idp-create.component.html
View File

@ -11,6 +11,8 @@
<h1>{{'IDP.CREATE.TITLE' | translate}}</h1> <h1>{{'IDP.CREATE.TITLE' | translate}}</h1>
<p>{{'IDP.CREATE.DESCRIPTION' | translate}}</p> <p>{{'IDP.CREATE.DESCRIPTION' | translate}}</p>
<mat-progress-bar *ngIf="loading" color="primary" mode="indeterminate"></mat-progress-bar>
<form (ngSubmit)="addIdp()"> <form (ngSubmit)="addIdp()">
<ng-container [formGroup]="formGroup"> <ng-container [formGroup]="formGroup">
<div class="content"> <div class="content">
@ -48,22 +50,22 @@
</mat-form-field> </mat-form-field>
</div> </div>
<div class="content"> <div class="content">
<mat-form-field class="formfield" appearance="outline"> <mat-form-field class="formfield" appearance="outline">
<mat-label>{{ 'IDP.IDPDISPLAYNAMMAPPING' | translate }}</mat-label> <mat-label>{{ 'IDP.IDPDISPLAYNAMMAPPING' | translate }}</mat-label>
<mat-select formControlName="idpDisplayNameMapping"> <mat-select formControlName="idpDisplayNameMapping">
<mat-option *ngFor="let field of mappingFields" [value]="field"> <mat-option *ngFor="let field of mappingFields" [value]="field">
{{ 'IDP.MAPPINTFIELD.'+field | translate }} {{ 'IDP.MAPPINTFIELD.'+field | translate }}
</mat-option> </mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<mat-form-field class="formfield" appearance="outline"> <mat-form-field class="formfield" appearance="outline">
<mat-label>{{ 'IDP.USERNAMEMAPPING' | translate }}</mat-label> <mat-label>{{ 'IDP.USERNAMEMAPPING' | translate }}</mat-label>
<mat-select formControlName="usernameMapping"> <mat-select formControlName="usernameMapping">
<mat-option *ngFor="let field of mappingFields" [value]="field"> <mat-option *ngFor="let field of mappingFields" [value]="field">
{{ 'IDP.MAPPINTFIELD.'+field | translate }} {{ 'IDP.MAPPINTFIELD.'+field | translate }}
</mat-option> </mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
</div> </div>
</ng-container> </ng-container>
@ -71,4 +73,4 @@
{{ 'ACTIONS.SAVE' | translate }} {{ 'ACTIONS.SAVE' | translate }}
</button> </button>
</form> </form>
</div> </div>

42
console/src/app/modules/idp-create/idp-create.component.ts
View File

@ -7,18 +7,18 @@ import { ActivatedRoute, Params, Router } from '@angular/router';
import { Subscription } from 'rxjs'; import { Subscription } from 'rxjs';
import { take } from 'rxjs/operators'; import { take } from 'rxjs/operators';
import { import {
OidcIdpConfigCreate as AdminOidcIdpConfigCreate, OidcIdpConfigCreate as AdminOidcIdpConfigCreate,
OIDCMappingField as authMappingFields, OIDCMappingField as authMappingFields,
} from 'src/app/proto/generated/admin_pb'; } from 'src/app/proto/generated/admin_pb';
import { AdminService } from 'src/app/services/admin.service'; import { AdminService } from 'src/app/services/admin.service';
import { ManagementService } from 'src/app/services/mgmt.service'; import { ManagementService } from 'src/app/services/mgmt.service';
import { ToastService } from 'src/app/services/toast.service'; import { ToastService } from 'src/app/services/toast.service';
import { PolicyComponentServiceType } from '../policies/policy-component-types.enum';
import { import {
OidcIdpConfigCreate as MgmtOidcIdpConfigCreate, OidcIdpConfigCreate as MgmtOidcIdpConfigCreate,
OIDCMappingField as mgmtMappingFields, OIDCMappingField as mgmtMappingFields,
} from '../../proto/generated/management_pb'; } from '../../proto/generated/management_pb';
import { PolicyComponentServiceType } from '../policies/policy-component-types.enum';
@Component({ @Component({
selector: 'app-idp-create', selector: 'app-idp-create',
@ -37,7 +37,7 @@ export class IdpCreateComponent implements OnInit, OnDestroy {
public formGroup!: FormGroup; public formGroup!: FormGroup;
public createSteps: number = 1; public createSteps: number = 1;
public currentCreateStep: number = 1; public currentCreateStep: number = 1;
public loading: boolean = false;
constructor( constructor(
private router: Router, private router: Router,
private route: ActivatedRoute, private route: ActivatedRoute,
@ -68,8 +68,8 @@ export class IdpCreateComponent implements OnInit, OnDestroy {
case PolicyComponentServiceType.ADMIN: case PolicyComponentServiceType.ADMIN:
this.service = this.injector.get(AdminService as Type<AdminService>); this.service = this.injector.get(AdminService as Type<AdminService>);
this.mappingFields = [ this.mappingFields = [
authMappingFields.OIDCMAPPINGFIELD_PREFERRED_USERNAME, authMappingFields.OIDCMAPPINGFIELD_PREFERRED_USERNAME,
authMappingFields.OIDCMAPPINGFIELD_EMAIL]; authMappingFields.OIDCMAPPINGFIELD_EMAIL];
break; break;
} }
}); });
@ -91,12 +91,12 @@ export class IdpCreateComponent implements OnInit, OnDestroy {
let req: AdminOidcIdpConfigCreate | MgmtOidcIdpConfigCreate; let req: AdminOidcIdpConfigCreate | MgmtOidcIdpConfigCreate;
switch (this.serviceType) { switch (this.serviceType) {
case PolicyComponentServiceType.MGMT: case PolicyComponentServiceType.MGMT:
req = new MgmtOidcIdpConfigCreate(); req = new MgmtOidcIdpConfigCreate();
break; break;
case PolicyComponentServiceType.ADMIN: case PolicyComponentServiceType.ADMIN:
req = new AdminOidcIdpConfigCreate(); req = new AdminOidcIdpConfigCreate();
break; break;
} }
req.setName(this.name?.value); req.setName(this.name?.value);
@ -107,9 +107,15 @@ export class IdpCreateComponent implements OnInit, OnDestroy {
req.setScopesList(this.scopesList?.value); req.setScopesList(this.scopesList?.value);
req.setIdpDisplayNameMapping(this.idpDisplayNameMapping?.value); req.setIdpDisplayNameMapping(this.idpDisplayNameMapping?.value);
req.setUsernameMapping(this.usernameMapping?.value); req.setUsernameMapping(this.usernameMapping?.value);
this.loading = true;
this.service.CreateOidcIdp(req).then((idp) => { this.service.CreateOidcIdp(req).then((idp) => {
this.router.navigate(['idp', idp.getId()]); setTimeout(() => {
this.loading = false;
this.router.navigate([
this.serviceType === PolicyComponentServiceType.MGMT ? 'org' :
this.serviceType === PolicyComponentServiceType.ADMIN ? 'iam' : '',
'idp', idp.getId()]);
}, 2000);
}).catch(error => { }).catch(error => {
this.toast.showError(error); this.toast.showError(error);
}); });
@ -163,7 +169,7 @@ export class IdpCreateComponent implements OnInit, OnDestroy {
return this.formGroup.get('issuer'); return this.formGroup.get('issuer');
} }
public get scopesList(): AbstractControl | null { public get scopesList(): AbstractControl | null {
return this.formGroup.get('scopesList'); return this.formGroup.get('scopesList');
} }
public get idpDisplayNameMapping(): AbstractControl | null { public get idpDisplayNameMapping(): AbstractControl | null {
@ -171,7 +177,7 @@ export class IdpCreateComponent implements OnInit, OnDestroy {
} }
public get usernameMapping(): AbstractControl | null { public get usernameMapping(): AbstractControl | null {
return this.formGroup.get('usernameMapping'); return this.formGroup.get('usernameMapping');
} }
} }

4
console/src/app/modules/idp-create/idp-create.module.ts
View File

@ -6,12 +6,13 @@ import { MatChipsModule } from '@angular/material/chips';
import { MatFormFieldModule } from '@angular/material/form-field'; import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon'; import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input'; import { MatInputModule } from '@angular/material/input';
import { MatProgressBarModule } from '@angular/material/progress-bar';
import { MatSelectModule } from '@angular/material/select';
import { MatTooltipModule } from '@angular/material/tooltip'; import { MatTooltipModule } from '@angular/material/tooltip';
import { TranslateModule } from '@ngx-translate/core'; import { TranslateModule } from '@ngx-translate/core';
import { IdpCreateRoutingModule } from './idp-create-routing.module'; import { IdpCreateRoutingModule } from './idp-create-routing.module';
import { IdpCreateComponent } from './idp-create.component'; import { IdpCreateComponent } from './idp-create.component';
import {MatSelectModule} from '@angular/material/select';
@NgModule({ @NgModule({
declarations: [IdpCreateComponent], declarations: [IdpCreateComponent],
@ -28,6 +29,7 @@ import {MatSelectModule} from '@angular/material/select';
MatChipsModule, MatChipsModule,
MatTooltipModule, MatTooltipModule,
TranslateModule, TranslateModule,
MatProgressBarModule,
], ],
}) })
export class IdpCreateModule { } export class IdpCreateModule { }

41
console/src/app/modules/idp-table/idp-table.component.html
View File

@ -2,18 +2,15 @@
emitRefreshOnPreviousRoute="/iam/idp/create" [timestamp]="idpResult?.viewTimestamp" [selection]="selection"> emitRefreshOnPreviousRoute="/iam/idp/create" [timestamp]="idpResult?.viewTimestamp" [selection]="selection">
<ng-template appHasRole [appHasRole]="['iam.write']" actions> <ng-template appHasRole [appHasRole]="['iam.write']" actions>
<button (click)="deactivateSelectedIdps()" matTooltip="{{'IDP.DEACTIVATE' | translate}}" class="icon-button" <button (click)="deactivateSelectedIdps()" matTooltip="{{'IDP.DEACTIVATE' | translate}}" class="icon-button"
mat-icon-button *ngIf="selection.hasValue() && serviceType!=PolicyComponentServiceType.MGMT" mat-icon-button *ngIf="selection.hasValue()" [disabled]="disabled">
[disabled]="disabled">
<mat-icon>block</mat-icon> <mat-icon>block</mat-icon>
</button> </button>
<button (click)="reactivateSelectedIdps()" matTooltip="{{'IDP.ACTIVATE' | translate}}" class="icon-button" <button (click)="reactivateSelectedIdps()" matTooltip="{{'IDP.ACTIVATE' | translate}}" class="icon-button"
mat-icon-button *ngIf="selection.hasValue() && serviceType!=PolicyComponentServiceType.MGMT" mat-icon-button *ngIf="selection.hasValue()" [disabled]="disabled">
[disabled]="disabled">
<mat-icon>play_circle_outline</mat-icon> <mat-icon>play_circle_outline</mat-icon>
</button> </button>
<button color="warn" (click)="removeSelectedIdps()" matTooltip="{{'IDP.DELETE' | translate}}" <button color="warn" (click)="removeSelectedIdps()" matTooltip="{{'IDP.DELETE' | translate}}"
class="icon-button" mat-icon-button class="icon-button" mat-icon-button *ngIf="selection.hasValue()" [disabled]="disabled">
*ngIf="selection.hasValue() && serviceType!=PolicyComponentServiceType.MGMT" [disabled]="disabled">
<i class="las la-trash"></i> <i class="las la-trash"></i>
</button> </button>
<a [routerLink]="createRouterLink" color="primary" mat-raised-button [disabled]="disabled"> <a [routerLink]="createRouterLink" color="primary" mat-raised-button [disabled]="disabled">
@ -27,11 +24,13 @@
<th mat-header-cell *matHeaderCellDef> <th mat-header-cell *matHeaderCellDef>
<mat-checkbox color="primary" (change)="$event ? masterToggle() : null" <mat-checkbox color="primary" (change)="$event ? masterToggle() : null"
[checked]="selection.hasValue() && isAllSelected()" [checked]="selection.hasValue() && isAllSelected()"
[indeterminate]="selection.hasValue() && !isAllSelected()"> [indeterminate]="selection.hasValue() && !isAllSelected()"
[disabled]="serviceType==PolicyComponentServiceType.MGMT">
</mat-checkbox> </mat-checkbox>
</th> </th>
<td mat-cell *matCellDef="let idp"> <td mat-cell *matCellDef="let idp">
<mat-checkbox color="primary" (click)="$event.stopPropagation()" <mat-checkbox color="primary" (click)="$event.stopPropagation()"
[disabled]="serviceType==PolicyComponentServiceType.MGMT && idp?.providerType == IdpProviderType.IDPPROVIDERTYPE_SYSTEM"
(change)="$event ? selection.toggle(idp) : null" [checked]="selection.isSelected(idp)"> (change)="$event ? selection.toggle(idp) : null" [checked]="selection.isSelected(idp)">
<img *ngIf="idp?.logoSrc?.startsWith('https://'); else genAvatar" [src]="idp.logoSrc" <img *ngIf="idp?.logoSrc?.startsWith('https://'); else genAvatar" [src]="idp.logoSrc"
alt="ipp logo {{idp?.name}}" /> alt="ipp logo {{idp?.name}}" />
@ -46,12 +45,12 @@
<ng-container matColumnDef="name"> <ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef> {{ 'IDP.NAME' | translate }} </th> <th mat-header-cell *matHeaderCellDef> {{ 'IDP.NAME' | translate }} </th>
<td mat-cell *matCellDef="let idp"> {{idp?.name}} </td> <td [routerLink]="routerLinkForRow(idp)" mat-cell *matCellDef="let idp"> {{idp?.name}} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="config"> <ng-container matColumnDef="config">
<th mat-header-cell *matHeaderCellDef> {{ 'IDP.CONFIG' | translate }} </th> <th mat-header-cell *matHeaderCellDef> {{ 'IDP.CONFIG' | translate }} </th>
<td mat-cell *matCellDef="let idp"> <td [routerLink]="routerLinkForRow(idp)" mat-cell *matCellDef="let idp">
<div *ngFor="let elem of idp?.oidcConfig | keyvalue" class="flex-row"> <div *ngFor="let elem of idp?.oidcConfig | keyvalue" class="flex-row">
<span class="key">{{elem.key}}:</span> <span class="key">{{elem.key}}:</span>
<span class="value">{{elem.value}}</span> <span class="value">{{elem.value}}</span>
@ -61,35 +60,45 @@
<ng-container matColumnDef="state"> <ng-container matColumnDef="state">
<th mat-header-cell *matHeaderCellDef> {{ 'IDP.STATE' | translate }} </th> <th mat-header-cell *matHeaderCellDef> {{ 'IDP.STATE' | translate }} </th>
<td mat-cell *matCellDef="let idp"> {{ 'IDP.STATES.'+idp.state | translate }} </td> <td [routerLink]="routerLinkForRow(idp)" mat-cell *matCellDef="let idp">
{{ 'IDP.STATES.'+idp.state | translate }} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="creationDate"> <ng-container matColumnDef="creationDate">
<th mat-header-cell *matHeaderCellDef> {{ 'IDP.CREATIONDATE' | translate }} </th> <th mat-header-cell *matHeaderCellDef> {{ 'IDP.CREATIONDATE' | translate }} </th>
<td class="pointer" mat-cell *matCellDef="let idp"> <td [routerLink]="routerLinkForRow(idp)" class="pointer" mat-cell *matCellDef="let idp">
{{idp.creationDate | timestampToDate | localizedDate: 'dd. MMM, HH:mm' }} </td> {{idp.creationDate | timestampToDate | localizedDate: 'dd. MMM, HH:mm' }} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="changeDate"> <ng-container matColumnDef="changeDate">
<th mat-header-cell *matHeaderCellDef> {{ 'IDP.CHANGEDATE' | translate }} </th> <th mat-header-cell *matHeaderCellDef> {{ 'IDP.CHANGEDATE' | translate }} </th>
<td class="pointer" mat-cell *matCellDef="let idp"> <td [routerLink]="routerLinkForRow(idp)" class="pointer" mat-cell *matCellDef="let idp">
{{idp.changeDate | timestampToDate | localizedDate: 'dd. MMM, HH:mm' }} </td> {{idp.changeDate | timestampToDate | localizedDate: 'dd. MMM, HH:mm' }} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="type"> <ng-container matColumnDef="type">
<th mat-header-cell *matHeaderCellDef> {{ 'IDP.TYPE' | translate }} </th> <th mat-header-cell *matHeaderCellDef> {{ 'IDP.TYPE' | translate }} </th>
<td class="pointer" mat-cell *matCellDef="let idp"> <td [routerLink]="routerLinkForRow(idp)" class="pointer" mat-cell *matCellDef="let idp">
{{'IDP.TYPES.'+idp.providerType | translate }} </td> {{'IDP.TYPES.'+idp.providerType | translate }} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions" stickyEnd>
<th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let idp">
<button
[disabled]="serviceType==PolicyComponentServiceType.MGMT && idp?.providerType == IdpProviderType.IDPPROVIDERTYPE_SYSTEM"
mat-icon-button color="warn" matTooltip="{{'IAM.VIEWS.CLEAR' | translate}}"
(click)="removeIdp(idp)">
<i class="las la-trash"></i>
</button>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr> <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr class="highlight" <tr class="highlight"
[ngClass]="{'disabled': serviceType==PolicyComponentServiceType.MGMT && row?.providerType == IdpProviderType.IDPPROVIDERTYPE_SYSTEM}" [ngClass]="{'disabled': serviceType==PolicyComponentServiceType.MGMT && row?.providerType == IdpProviderType.IDPPROVIDERTYPE_SYSTEM}"
mat-row *matRowDef="let row; columns: displayedColumns;" mat-row *matRowDef="let row; columns: displayedColumns;">
[routerLink]="serviceType==PolicyComponentServiceType.ADMIN ? routerLinkForRow(row): null">
</tr> </tr>
</table> </table>
</div> </div>
<mat-paginator #paginator class="paginator" [length]="idpResult?.totalResult || 0" [pageSize]="10" <mat-paginator #paginator class="paginator" [length]="idpResult?.totalResult || 0" [pageSize]="10"

14
console/src/app/modules/idp-table/idp-table.component.scss
View File

@ -22,12 +22,26 @@
} }
} }
td {
outline: none;
}
tr { tr {
outline: none; outline: none;
&.disabled * { &.disabled * {
color: var(--grey); color: var(--grey);
} }
button {
visibility: hidden;
}
&:hover {
button {
visibility: visible;
}
}
} }
.avatar { .avatar {

67
console/src/app/modules/idp-table/idp-table.component.ts
View File

@ -1,5 +1,6 @@
import { SelectionModel } from '@angular/cdk/collections'; import { SelectionModel } from '@angular/cdk/collections';
import { Component, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core'; import { Component, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { MatPaginator, PageEvent } from '@angular/material/paginator'; import { MatPaginator, PageEvent } from '@angular/material/paginator';
import { MatTableDataSource } from '@angular/material/table'; import { MatTableDataSource } from '@angular/material/table';
import { RouterLink } from '@angular/router'; import { RouterLink } from '@angular/router';
@ -12,6 +13,7 @@ import { ManagementService } from 'src/app/services/mgmt.service';
import { ToastService } from 'src/app/services/toast.service'; import { ToastService } from 'src/app/services/toast.service';
import { PolicyComponentServiceType } from '../policies/policy-component-types.enum'; import { PolicyComponentServiceType } from '../policies/policy-component-types.enum';
import { WarnDialogComponent } from '../warn-dialog/warn-dialog.component';
@Component({ @Component({
selector: 'app-idp-table', selector: 'app-idp-table',
@ -37,7 +39,7 @@ export class IdpTableComponent implements OnInit {
@Output() public changedSelection: EventEmitter<Array<AdminIdpView.AsObject | MgmtIdpView.AsObject>> @Output() public changedSelection: EventEmitter<Array<AdminIdpView.AsObject | MgmtIdpView.AsObject>>
= new EventEmitter(); = new EventEmitter();
constructor(public translate: TranslateService, private toast: ToastService) { constructor(public translate: TranslateService, private toast: ToastService, private dialog: MatDialog) {
this.selection.changed.subscribe(() => { this.selection.changed.subscribe(() => {
this.changedSelection.emit(this.selection.selected); this.changedSelection.emit(this.selection.selected);
}); });
@ -48,6 +50,10 @@ export class IdpTableComponent implements OnInit {
if (this.serviceType === PolicyComponentServiceType.MGMT) { if (this.serviceType === PolicyComponentServiceType.MGMT) {
this.displayedColumns = ['select', 'name', 'config', 'creationDate', 'changeDate', 'state', 'type']; this.displayedColumns = ['select', 'name', 'config', 'creationDate', 'changeDate', 'state', 'type'];
} }
if (!this.disabled) {
this.displayedColumns.push('actions');
}
} }
public isAllSelected(): boolean { public isAllSelected(): boolean {
@ -68,29 +74,70 @@ export class IdpTableComponent implements OnInit {
} }
public deactivateSelectedIdps(): void { public deactivateSelectedIdps(): void {
this.selection.clear();
Promise.all(this.selection.selected.map(value => { Promise.all(this.selection.selected.map(value => {
return this.service.DeactivateIdpConfig(value.id); return this.service.DeactivateIdpConfig(value.id);
})).then(() => { })).then(() => {
this.toast.showInfo('USER.TOAST.SELECTEDDEACTIVATED', true); this.toast.showInfo('IDP.TOAST.SELECTEDDEACTIVATED', true);
this.getData(10, 0); this.refreshPage();
}); });
} }
public reactivateSelectedIdps(): void { public reactivateSelectedIdps(): void {
this.selection.clear();
Promise.all(this.selection.selected.map(value => { Promise.all(this.selection.selected.map(value => {
return this.service.ReactivateIdpConfig(value.id); return this.service.ReactivateIdpConfig(value.id);
})).then(() => { })).then(() => {
this.toast.showInfo('USER.TOAST.SELECTEDREACTIVATED', true); this.toast.showInfo('IDP.TOAST.SELECTEDREACTIVATED', true);
this.getData(10, 0); this.refreshPage();
}); });
} }
public removeSelectedIdps(): void { public removeSelectedIdps(): void {
Promise.all(this.selection.selected.map(value => { const dialogRef = this.dialog.open(WarnDialogComponent, {
return this.service.RemoveIdpConfig(value.id); data: {
})).then(() => { confirmKey: 'ACTIONS.DELETE',
this.toast.showInfo('USER.TOAST.SELECTEDDEACTIVATED', true); cancelKey: 'ACTIONS.CANCEL',
this.getData(10, 0); titleKey: 'IDP.DELETE_SELECTION_TITLE',
descriptionKey: 'IDP.DELETE_SELECTION_DESCRIPTION',
},
width: '400px',
});
dialogRef.afterClosed().subscribe(resp => {
if (resp) {
this.selection.clear();
Promise.all(this.selection.selected.map(value => {
return this.service.RemoveIdpConfig(value.id);
})).then(() => {
this.toast.showInfo('IDP.TOAST.SELECTEDDEACTIVATED', true);
this.refreshPage();
});
}
});
}
public removeIdp(idp: AdminIdpView.AsObject | MgmtIdpView.AsObject): void {
const dialogRef = this.dialog.open(WarnDialogComponent, {
data: {
confirmKey: 'ACTIONS.DELETE',
cancelKey: 'ACTIONS.CANCEL',
titleKey: 'IDP.DELETE_TITLE',
descriptionKey: 'IDP.DELETE_DESCRIPTION',
},
width: '400px',
});
dialogRef.afterClosed().subscribe(resp => {
if (resp) {
this.service.RemoveIdpConfig(idp.id).then(() => {
this.toast.showInfo('IDP.TOAST.REMOVED', true);
setTimeout(() => {
this.refreshPage();
}, 1000);
});
}
}); });
} }

50
console/src/app/pages/iam/iam-policy-grid/iam-policy-grid.component.html
View File

@ -26,31 +26,6 @@
</div> </div>
</ng-template> </ng-template>
<ng-template appHasRole [appHasRole]="['policy.read']">
<div class="p-item card">
<div class="avatar">
<i class="icon las la-gem"></i>
</div>
<div class="title">
<span>{{'ORG.POLICY.LOGIN_POLICY.TITLE' | translate}}</span>
<button mat-icon-button disabled>
<i *ngIf="loginPolicy" class="icon las la-check-circle"></i>
</button>
</div>
<p class="desc">
{{'ORG.POLICY.LOGIN_POLICY.DESCRIPTION' | translate}}</p>
<span class="fill-space"></span>
<div class="btn-wrapper">
<ng-template appHasRole [appHasRole]="['iam.policy.write']">
<button [disabled]="!loginPolicy" [routerLink]="[ 'policy', PolicyComponentType.LOGIN ]"
mat-stroked-button>{{'ORG.POLICY.BTN_EDIT' | translate}}</button>
</ng-template>
</div>
</div>
</ng-template>
<ng-template appHasRole [appHasRole]="['iam.policy.read']"> <ng-template appHasRole [appHasRole]="['iam.policy.read']">
<div class="p-item card"> <div class="p-item card">
<div class="avatar"> <div class="avatar">
@ -75,4 +50,29 @@
</div> </div>
</div> </div>
</ng-template> </ng-template>
<ng-template appHasRole [appHasRole]="['policy.read']">
<div class="p-item card">
<div class="avatar">
<i class="icon las la-gem"></i>
</div>
<div class="title">
<span>{{'ORG.POLICY.LOGIN_POLICY.TITLE' | translate}}</span>
<button mat-icon-button disabled>
<i *ngIf="loginPolicy" class="icon las la-check-circle"></i>
</button>
</div>
<p class="desc">
{{'ORG.POLICY.LOGIN_POLICY.DESCRIPTION' | translate}}</p>
<span class="fill-space"></span>
<div class="btn-wrapper">
<ng-template appHasRole [appHasRole]="['iam.policy.write']">
<button [disabled]="!loginPolicy" [routerLink]="[ 'policy', PolicyComponentType.LOGIN ]"
mat-stroked-button>{{'ORG.POLICY.BTN_EDIT' | translate}}</button>
</ng-template>
</div>
</div>
</ng-template>
</div> </div>

3
console/src/app/pages/orgs/orgs-routing.module.ts
View File

@ -25,6 +25,7 @@ const routes: Routes = [
canActivate: [RoleGuard], canActivate: [RoleGuard],
data: { data: {
roles: ['org.idp.write'], roles: ['org.idp.write'],
serviceType: PolicyComponentServiceType.MGMT,
}, },
}, },
{ {
@ -33,7 +34,7 @@ const routes: Routes = [
canActivate: [RoleGuard], canActivate: [RoleGuard],
data: { data: {
roles: ['iam.idp.read'], roles: ['iam.idp.read'],
serviceType: PolicyComponentServiceType.ADMIN, serviceType: PolicyComponentServiceType.MGMT,
}, },
}, },
], ],

12
console/src/assets/i18n/de.json
View File

@ -730,8 +730,18 @@
"DEACTIVATE":"Deaktivieren", "DEACTIVATE":"Deaktivieren",
"ACTIVATE":"Aktivieren", "ACTIVATE":"Aktivieren",
"DELETE":"Löschen", "DELETE":"Löschen",
"DELETE_TITLE":"Idp löschen",
"DELETE_DESCRIPTION":"Sie sind im Begriff einen Identity Provider zu löschen. Die daruch hervorgerufenen Änderungen sind unwiederruflich. Wollen Sie dies wirklich tun?",
"DELETE_SELECTION_TITLE":"Identity Providers löschen",
"DELETE_SELECTION_DESCRIPTION":"Sie sind im Begriff mehrere Identity Provider zu löschen. Die daruch hervorgerufenen Änderungen sind unwiederruflich. Wollen Sie dies wirklich tun?",
"TOAST": { "TOAST": {
"SAVED": "Erfolgreich gespeichert." "SAVED": "Erfolgreich gespeichert.",
"REACTIVATED":"Idp reaktiviert.",
"DEACTIVATED":"Idp deaktiviert.",
"SELECTEDREACTIVATED":"Selektierte Idps reaktiviert.",
"SELECTEDDEACTIVATED":"Selektierte Idps deaktiviert.",
"SELECTEDKEYSDELETED":"Selektierte Idps gelöscht.",
"DELETED":"Idp erfolgreich gelöscht!"
} }
}, },
"LOGINPOLICY": { "LOGINPOLICY": {

12
console/src/assets/i18n/en.json
View File

@ -730,8 +730,18 @@
"DEACTIVATE":"Deactivate", "DEACTIVATE":"Deactivate",
"ACTIVATE":"Activate", "ACTIVATE":"Activate",
"DELETE":"Delete", "DELETE":"Delete",
"DELETE_TITLE":"Delete Idp",
"DELETE_DESCRIPTION":"You are about to delete an identity provider. The resulting changes are irrevocable. Do you really want to do this?",
"DELETE_SELECTION_TITLE":"Delete Idp",
"DELETE_SELECTION_DESCRIPTION":"You are about to delete an identity provider. The resulting changes are irrevocable. Do you really want to do this?",
"TOAST": { "TOAST": {
"SAVED": "Successfully saved." "SAVED": "Successfully saved.",
"REACTIVATED":"Idp reactivated.",
"DEACTIVATED":"Idp deactivated.",
"SELECTEDREACTIVATED":"Selected idps reactivated.",
"SELECTEDDEACTIVATED":"Selected idps deactivated.",
"SELECTEDKEYSDELETED":"Selected idps deleted.",
"DELETED":"Idp removed successfully!"
} }
}, },
"LOGINPOLICY": { "LOGINPOLICY": {