core/user/user-edit.component.ts
selector | c8y-user-edit |
templateUrl | ./user-edit.component.html |
Properties |
Methods |
|
Inputs |
Outputs |
Accessors |
constructor(state: AppStateService, translate: TranslateService, bsModalService: BsModalService, alert: AlertService, userService: UserService, tenantLoginOptionsService: TenantLoginOptionsService, tenantService: TenantService, userPreferencesService: UserPreferencesService, gainsightService: GainsightService)
|
||||||||||||||||||||||||||||||
Parameters :
|
isGainsightBotEnabled |
Type : boolean
|
Default value : true
|
isUsageTrackingEnabled |
Type : boolean
|
Default value : true
|
lang |
Type : string
|
loading |
Type : boolean
|
Default value : false
|
showProductUsageSetting |
Type : boolean
|
Default value : false
|
user |
onCancel |
Type : EventEmitter<void>
|
onGainsightBot |
Type : EventEmitter<boolean>
|
onLanguage |
Type : EventEmitter<string>
|
onProductExperience |
Type : EventEmitter<boolean>
|
onUser |
Type : EventEmitter<User>
|
cancel |
cancel()
|
Returns :
void
|
Async ngOnInit |
ngOnInit()
|
Returns :
any
|
Async onEnablingProductUsageTracking | ||||||
onEnablingProductUsageTracking(isUsageTrackingEnabled: boolean)
|
||||||
Parameters :
Returns :
Promise<void>
|
onNewPasswordChanged | ||||||
onNewPasswordChanged(newPassword: NewPassword)
|
||||||
Parameters :
Returns :
void
|
Async save |
save()
|
Returns :
any
|
setupTotp |
setupTotp()
|
Returns :
void
|
isPhoneRequired |
Default value : false
|
isTfaEnabled |
Type : boolean
|
Public state |
Type : AppStateService
|
Public translate |
Type : TranslateService
|
userCanSetupTotp |
Default value : false
|
userHasActiveTotp |
Default value : false
|
userIsExternal |
Type : boolean
|
user | ||||||
getuser()
|
||||||
setuser(u: User)
|
||||||
Parameters :
Returns :
void
|
langs |
getlangs()
|
<form #userForm="ngForm" (ngSubmit)="userForm.form.valid && save()">
<div class="d-block p-24 p-b-0">
<div class="alert alert-warning" role="alert" *ngIf="userIsExternal" translate>
Some of the user settings are not editable here because they are managed via your
authorization server.
</div>
<c8y-form-group>
<label translate for="userName">Username (for example, email)</label>
<input
id="userName"
class="form-control"
[(ngModel)]="user.userName"
name="userName"
autocomplete="off"
required
maxlength="254"
placeholder="{{ 'e.g. joe.doe@example.com`LOCALIZE`' | translate }}"
[disabled]="user.id"
c8yDefaultValidation="user"
/>
</c8y-form-group>
<c8y-form-group>
<label translate for="displayName">Login alias</label>
<input
id="displayName"
class="form-control"
[(ngModel)]="user.displayName"
name="displayName"
autocomplete="off"
maxlength="254"
placeholder="{{ 'e.g. joe.doe`LOCALIZE`' | translate }}"
[disabled]="userIsExternal"
c8yDefaultValidation="loginAlias"
/>
</c8y-form-group>
<c8y-form-group [hasWarning]="!user.email">
<label translate for="userEmail">Email</label>
<input
id="userEmail"
class="form-control"
type="email"
name="email"
[maxlength]="254"
autocomplete="off"
placeholder="{{ 'e.g. joe.doe@example.com`LOCALIZE`' | translate }}"
[(ngModel)]="user.email"
email
[required]="true"
[disabled]="userIsExternal"
/>
</c8y-form-group>
<div class="row">
<div class="col-sm-6">
<c8y-form-group>
<label translate for="userFirstName">First name</label>
<input
id="userFirstName"
class="form-control"
autocomplete="off"
maxlength="50"
name="firstName"
[(ngModel)]="user.firstName"
[disabled]="userIsExternal"
/>
</c8y-form-group>
</div>
<div class="col-sm-6">
<c8y-form-group>
<label translate for="userLastName">Last name</label>
<input
id="userLastName"
class="form-control"
autocomplete="off"
maxlength="50"
name="lastName"
[(ngModel)]="user.lastName"
[disabled]="userIsExternal"
/>
</c8y-form-group>
</div>
</div>
<c8y-form-group>
<label translate for="userTelephone">Telephone</label>
<input
id="userTelephone"
class="form-control"
autocomplete="off"
name="phone"
maxlength="254"
[(ngModel)]="user.phone"
placeholder="{{ 'e.g. +49 9 876 543 210`LOCALIZE`' | translate }}"
c8yPhoneValidation
c8yDefaultValidation="phoneNumber"
[required]="isPhoneRequired"
[disabled]="userIsExternal"
/>
</c8y-form-group>
<c8y-form-group>
<label translate for="userLang">Language</label>
<div class="c8y-select-wrapper">
<select
id="userLang"
class="form-control"
#selectLang
name="lang"
[(ngModel)]="lang"
(change)="onLanguage.emit(selectLang.value)"
>
<option *ngFor="let lang of langs" [value]="lang">
{{ translate.getNativeLanguage(lang) }}
</option>
</select>
<span></span>
</div>
</c8y-form-group>
<c8y-form-group class="p-t-8 p-b-8 separator-top" *ngIf="showProductUsageSetting">
<strong translate>Product experience</strong>
<label class="c8y-switch" for="productUsageTracking">
<input
id="productUsageTracking"
name="productUsageTracking"
type="checkbox"
(change)="onEnablingProductUsageTracking(isUsageTrackingEnabled)"
[(ngModel)]="isUsageTrackingEnabled"
/>
<span></span>
{{ 'Enable anonymous tracking to enhance the product experience' | translate }}
</label>
<ng-container *ngIf="isUsageTrackingEnabled">
<label class="c8y-switch m-l-0" for="knowledgeHubBot">
<input
id="knowledgeHubBot"
name="knowledgeHubBot"
type="checkbox"
[(ngModel)]="isGainsightBotEnabled"
/>
<span></span>
{{ 'Enable Knowledge Hub' | translate }}
</label>
</ng-container>
</c8y-form-group>
<div class="form-group" *ngIf="!userIsExternal">
<label class="control-label">{{ 'Login options' | translate }}</label>
<c8y-new-password (password)="onNewPasswordChanged($event)"></c8y-new-password>
<button
title="{{ 'Set up two-factor authentication' | translate }}"
class="btn btn-default"
type="button"
(click)="setupTotp()"
*ngIf="userCanSetupTotp && !userHasActiveTotp && isTfaEnabled"
>
{{ 'Set up two-factor authentication' | translate }}
</button>
</div>
<c8y-form-group *ngIf="!!(state.state$ | async).newsletter">
<label translate>Newsletter</label>
<label
title="{{ 'Send me information about outages, maintenance or updates.' | translate }}"
class="c8y-checkbox"
>
<input
type="checkbox"
name="newsletter"
[(ngModel)]="user.newsletter"
[disabled]="userIsExternal"
/>
<span></span>
<span>
{{ 'Send me information about outages, maintenance or updates.' | translate }}
</span>
</label>
</c8y-form-group>
</div>
<div class="modal-footer separator-top bg-white sticky-bottom">
<button
title="{{ 'Cancel' | translate }}"
class="btn btn-default"
type="button"
(click)="cancel()"
>
{{ 'Cancel' | translate }}
</button>
<button
title="{{ 'Save' | translate }}"
class="btn btn-primary"
type="submit"
[disabled]="!userForm.form.valid || userForm.form.pristine || loading"
>
{{ 'Save' | translate }}
</button>
</div>
</form>