ui fixes on users listing > role editor
This commit is contained in:
parent
e7d6615fbc
commit
2905feca07
|
@ -2,5 +2,6 @@ export enum AppRole {
|
||||||
Admin = "Admin",
|
Admin = "Admin",
|
||||||
Manager = "Manager",
|
Manager = "Manager",
|
||||||
User = "User",
|
User = "User",
|
||||||
DescriptionTemplateEditor = "DescriptionTemplateEditor"
|
DescriptionTemplateEditor = "DescriptionTemplateEditor",
|
||||||
|
TenantAdmin = "TenantAdmin"
|
||||||
}
|
}
|
||||||
|
|
|
@ -62,6 +62,7 @@ export class EnumUtils {
|
||||||
case AppRole.User: return this.language.instant('TYPES.APP-ROLE.USER');
|
case AppRole.User: return this.language.instant('TYPES.APP-ROLE.USER');
|
||||||
case AppRole.Manager: return this.language.instant('TYPES.APP-ROLE.MANAGER');
|
case AppRole.Manager: return this.language.instant('TYPES.APP-ROLE.MANAGER');
|
||||||
case AppRole.DescriptionTemplateEditor: return this.language.instant('TYPES.APP-ROLE.DESCRIPTION-TEMPLATE-EDITOR');
|
case AppRole.DescriptionTemplateEditor: return this.language.instant('TYPES.APP-ROLE.DESCRIPTION-TEMPLATE-EDITOR');
|
||||||
|
case AppRole.TenantAdmin: return this.language.instant('TYPES.APP-ROLE.TENANT-ADMIN');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,32 +1,39 @@
|
||||||
<form class="row user-role-editor" *ngIf="formGroup" [formGroup]="formGroup" (ngSubmit)="formSubmit()">
|
<form class="row user-role-editor" *ngIf="formGroup" [formGroup]="formGroup" (ngSubmit)="formSubmit()">
|
||||||
<div class="row align-items-center">
|
<div class="container-fluid">
|
||||||
<div *ngIf="!this.nowEditing"class="roles col">
|
<div class="row align-items-center">
|
||||||
<ng-container *ngFor="let role of this.formGroup.get('roles').value">
|
<div *ngIf="!this.nowEditing"class="roles col-8">
|
||||||
<div>
|
<div *ngFor="let role of this.formGroup.get('roles').value" class="row">
|
||||||
<span class="user-role" [ngClass]="{'user': role == appRole.User, 'manager': role == appRole.Manager, 'admin': role == appRole.Admin, 'description-template-editor': role == appRole.DescriptionTemplateEditor}">
|
<div class="col-auto p-0">
|
||||||
{{enumUtils.toAppRoleString(role)}}
|
<span class="user-role" [ngClass]="{'user': role == appRole.User, 'manager': role == appRole.Manager, 'admin': role == appRole.Admin, 'description-template-editor': role == appRole.DescriptionTemplateEditor, 'tenant-admin': role == appRole.TenantAdmin}">
|
||||||
</span>
|
{{enumUtils.toAppRoleString(role)}}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</ng-container>
|
<div *ngIf="this.nowEditing" class="pl-0 col-8">
|
||||||
</div>
|
<mat-form-field class="w-100">
|
||||||
<div class="col-8">
|
<mat-select formControlName="roles" [panelWidth]="auto" multiple required>
|
||||||
<mat-form-field *ngIf="this.nowEditing" class="w-100">
|
<ng-container *ngFor="let role of appRoleEnumValues">
|
||||||
<mat-select formControlName="roles" multiple required>
|
<mat-option [value]="role">{{enumUtils.toAppRoleString(role)}}</mat-option>
|
||||||
<ng-container *ngFor="let role of appRoleEnumValues">
|
</ng-container>
|
||||||
<mat-option [value]="role">{{enumUtils.toAppRoleString(role)}}</mat-option>
|
</mat-select>
|
||||||
</ng-container>
|
<mat-error *ngIf="formGroup.get('roles').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||||
</mat-select>
|
</mat-form-field>
|
||||||
<mat-error *ngIf="formGroup.get('roles').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
</div>
|
||||||
</mat-form-field>
|
|
||||||
|
<div *ngIf="!this.nowEditing" class="col-2 p-0">
|
||||||
|
<button mat-icon-button color="primary" type="button" (click)="editItem()">
|
||||||
|
<mat-icon class="mat-24" matTooltip="{{'USER-LISTING.ACTIONS.EDIT' | translate}}">edit</mat-icon>
|
||||||
|
<span class="row-action"></span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div *ngIf="this.nowEditing" class="col-2 p-0">
|
||||||
|
<button class="save-button" mat-icon-button color="primary" type="submit">
|
||||||
|
<mat-icon class="mat-24" matTooltip="{{'USER-LISTING.ACTIONS.SAVE' | translate}}">save</mat-icon>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<button *ngIf="!this.nowEditing" class="col" mat-icon-button color="primary" type="button" (click)="editItem()">
|
|
||||||
<mat-icon class="mat-24" matTooltip="{{'USER-LISTING.ACTIONS.EDIT' | translate}}">edit</mat-icon>
|
|
||||||
<span class="row-action"></span>
|
|
||||||
</button>
|
|
||||||
<button *ngIf="this.nowEditing" class="col-auto save-button" mat-icon-button color="primary" type="submit">
|
|
||||||
<mat-icon class="mat-24" matTooltip="{{'USER-LISTING.ACTIONS.SAVE' | translate}}">save</mat-icon>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</form>
|
</form>
|
||||||
|
|
|
@ -85,6 +85,24 @@
|
||||||
padding-right: 10px;
|
padding-right: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.tenant-admin {
|
||||||
|
// display: flex;
|
||||||
|
// justify-content: center;
|
||||||
|
// align-items: center;
|
||||||
|
min-width: 77px;
|
||||||
|
min-height: 28px;
|
||||||
|
color: #ffa631;
|
||||||
|
background: #ffe6c6 0% 0% no-repeat padding-box;
|
||||||
|
border-radius: 44px;
|
||||||
|
letter-spacing: 0.11px;
|
||||||
|
font-weight: 400;
|
||||||
|
opacity: 1;
|
||||||
|
margin-top: 0.5em;
|
||||||
|
margin-bottom: 0.5em;
|
||||||
|
padding-left: 10px;
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
.description-template-editor {
|
.description-template-editor {
|
||||||
// display: flex;
|
// display: flex;
|
||||||
// justify-content: center;
|
// justify-content: center;
|
||||||
|
|
|
@ -1578,7 +1578,8 @@
|
||||||
"ADMIN": "Admin",
|
"ADMIN": "Admin",
|
||||||
"USER": "User",
|
"USER": "User",
|
||||||
"MANAGER": "Manager",
|
"MANAGER": "Manager",
|
||||||
"DESCRIPTION-TEMPLATE-EDITOR": "Description Template Editor"
|
"DESCRIPTION-TEMPLATE-EDITOR": "Description Template Editor",
|
||||||
|
"TENANT-ADMIN": "Tenant Admin"
|
||||||
},
|
},
|
||||||
"IS-ACTIVE": {
|
"IS-ACTIVE": {
|
||||||
"ACTIVE": "Active",
|
"ACTIVE": "Active",
|
||||||
|
|
Loading…
Reference in New Issue