105 lines
5.1 KiB
HTML
105 lines
5.1 KiB
HTML
<h2>Users</h2>
|
|
|
|
<rb-icon-button icon="add" mode="primary" (click)="addNewUser()">New user</rb-icon-button>
|
|
|
|
<form *ngIf="newUser" #userForm="ngForm">
|
|
<rb-form-input name="name" label="user name" appValidate="username" required [(ngModel)]="newUser.name"
|
|
#nameInput="ngModel">
|
|
<ng-template rbFormValidationMessage="failure">{{nameInput.errors.failure}}</ng-template>
|
|
<ng-template rbFormValidationMessage="required">Cannot be empty</ng-template>
|
|
</rb-form-input>
|
|
<rb-form-input name="email" label="email" email required [(ngModel)]="newUser.email" ngModel>
|
|
<ng-template rbFormValidationMessage="email">Invalid email</ng-template>
|
|
<ng-template rbFormValidationMessage="required">Cannot be empty</ng-template>
|
|
</rb-form-input>
|
|
<rb-form-select name="level" label="level" required [(ngModel)]="newUser.level">
|
|
<option *ngFor="let level of login.levels" [value]="level">{{level}}</option>
|
|
<ng-template rbFormValidationMessage="required">Cannot be empty</ng-template>
|
|
</rb-form-select>
|
|
<rb-form-input name="location" label="location" appValidate="string" required [appValidateArgs]="['alphanum']"
|
|
[(ngModel)]="newUser.location" #locationInput="ngModel">
|
|
<ng-template rbFormValidationMessage="failure">{{locationInput.errors.failure}}</ng-template>
|
|
<ng-template rbFormValidationMessage="required">Cannot be empty</ng-template>
|
|
</rb-form-input>
|
|
<rb-array-input [(ngModel)]="newUser.devices" name="devices" [pushTemplate]="''">
|
|
<rb-form-input *rbArrayInputItem="let item" rbArrayInputListener="devices" [index]="item.i"
|
|
label="device" appValidate="string" [name]="'device-' + item.i" [ngModel]="item.value"
|
|
#deviceInput="ngModel">
|
|
<ng-template rbFormValidationMessage="failure">{{deviceInput.errors.failure}}</ng-template>
|
|
</rb-form-input>
|
|
</rb-array-input>
|
|
<rb-form-input name="passA" type="password" label="new password" appValidate="password" required
|
|
[(ngModel)]="newUserPass" #passAInput="ngModel">
|
|
<ng-template rbFormValidationMessage="failure">{{passAInput.errors.failure}}</ng-template>
|
|
</rb-form-input>
|
|
<rb-form-input name="passB" type="password" label="confirm password" appValidate="equal"
|
|
[appValidateArgs]="[newUserPass]" required #passBInput="ngModel" ngModel>
|
|
<ng-template rbFormValidationMessage="failure">{{passBInput.errors.failure}}</ng-template>
|
|
</rb-form-input>
|
|
<rb-icon-button icon="save" mode="primary" type="submit" [disabled]="!userForm.form.valid" (click)="saveNewUser()">
|
|
Save user
|
|
</rb-icon-button>
|
|
</form>
|
|
|
|
<rb-table>
|
|
<tr>
|
|
<th>Name</th>
|
|
<th>Email</th>
|
|
<th>Level</th>
|
|
<th>Location</th>
|
|
<th>Device</th>
|
|
<th></th>
|
|
</tr>
|
|
|
|
<tr *ngFor="let user of users">
|
|
<ng-container *ngIf="!user.edit; else editUser">
|
|
<td>{{user.name}}</td>
|
|
<td>{{user.email}}</td>
|
|
<td>{{user.level}}</td>
|
|
<td>{{user.location}}</td>
|
|
<td>{{user.devices}}</td>
|
|
<td><span class="rb-ic rb-ic-edit clickable" (click)="user.edit = true"></span></td>
|
|
</ng-container>
|
|
<ng-template #editUser>
|
|
<td>
|
|
<rb-form-input [name]="'name-' + user.name" appValidate="username" required [(ngModel)]="user.name"
|
|
#nameInput="ngModel">
|
|
<ng-template rbFormValidationMessage="failure">{{nameInput.errors.failure}}</ng-template>
|
|
<ng-template rbFormValidationMessage="required">Cannot be empty</ng-template>
|
|
</rb-form-input>
|
|
</td>
|
|
<td>
|
|
<rb-form-input [name]="'email-' + user.name" email required [(ngModel)]="user.email" #emailInput="ngModel">
|
|
<ng-template rbFormValidationMessage="email">Invalid email</ng-template>
|
|
<ng-template rbFormValidationMessage="required">Cannot be empty</ng-template>
|
|
</rb-form-input>
|
|
</td>
|
|
<td>
|
|
<rb-form-select [name]="'level-' + user.name" [(ngModel)]="user.level">
|
|
<option *ngFor="let level of login.levels" [value]="level">{{level}}</option>
|
|
</rb-form-select>
|
|
</td>
|
|
<td>
|
|
<rb-form-input [name]="'location-' + user.name" appValidate="string" required [appValidateArgs]="['alphanum']"
|
|
[(ngModel)]="user.location" #locationInput="ngModel">
|
|
<ng-template rbFormValidationMessage="failure">{{locationInput.errors.failure}}</ng-template>
|
|
<ng-template rbFormValidationMessage="required">Cannot be empty</ng-template>
|
|
</rb-form-input>
|
|
</td>
|
|
<td>
|
|
<rb-array-input [(ngModel)]="user.devices" name="devices" [pushTemplate]="''">
|
|
<rb-form-input *rbArrayInputItem="let item" rbArrayInputListener="devices" [index]="item.i"
|
|
label="device" appValidate="string" [name]="'device-' + item.i" [ngModel]="item.value">
|
|
</rb-form-input>
|
|
</rb-array-input>
|
|
</td>
|
|
<td>
|
|
<rb-icon-button icon="save" mode="primary" (click)="saveUser(user)"
|
|
[disabled]="nameInput.invalid || emailInput.invalid || locationInput.invalid">
|
|
Save
|
|
</rb-icon-button>
|
|
</td>
|
|
</ng-template>
|
|
</tr>
|
|
</rb-table>
|