deblan/pdnsmanager
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Added /users/{userId} with basic implementation

Browse source
This commit is contained in:
Lukas Metzger 2018-04-10 19:45:01 +02:00
parent 5d18531ec4
commit ee72dd2620
7 changed files with 125 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
frontend/src/app/operations/users.operations.ts
View file

@ -62,8 +62,12 @@ export class UsersOperation {
return true;
} catch (e) {
console.error(e);
return false;
if (e.response.status || e.response.status === 409) {
throw new Error('User with that name already exists!');
} else {
console.error(e);
return false;
}
}
}

4
frontend/src/app/pages/create-user/create-user.component.html
View file

@ -6,7 +6,7 @@
<div class="form-group">
<label>Name</label>
<input type="text" class="form-control auto-invalid" formControlName="name" />
<input type="text" class="form-control auto-invalid" formControlName="name" appFocus />
<div class="invalid-feedback">
Name can not be empty.
</div>
@ -14,7 +14,7 @@
<div class="form-group">
<label>Password</label>
<input type="password" class="form-control auto-validstate" formControlName="password" appFocus />
<input type="password" class="form-control auto-validstate" formControlName="password" />
<div class="invalid-feedback">
Password is required.
</div>

2
frontend/src/app/pages/create-user/create-user.component.ts
View file

@ -25,7 +25,7 @@ export class CreateUserComponent implements OnInit {
private createForm() {
this.userForm = this.fb.group({
name: ['', Validators.required],
type: ['user', Validators.required],
type: ['user'],
password: ['', Validators.required],
password2: ['']
}, { validator: PasswordValidationUtil.matchPassword });

41
frontend/src/app/pages/edit-user/edit-user.component.html
View file

@ -1,3 +1,38 @@
<p>
Edit user works!
</p>
<div class="row">
<div class="col-12 col-md-6 col-lg-3">
<p class="font-weight-bold">Edit user {{ username }}</p>
<form autocomplete="off" [formGroup]="userForm" (ngSubmit)="onSubmit()">
<div class="form-group" *ngIf="isNative">
<label>Name</label>
<input type="text" class="form-control auto-invalid" formControlName="name" />
<div class="invalid-feedback">
Name can not be empty.
</div>
</div>
<div class="form-group" *ngIf="isNative">
<label>Password</label>
<input type="password" class="form-control auto-valid" formControlName="password" placeholder="(unchanged)"
/>
</div>
<div class="form-group" *ngIf="isNative">
<label>Repeat password</label>
<input type="password" class="form-control auto-validstate" formControlName="password2" placeholder="(unchanged)"
/>
<div class="invalid-feedback">
Passwords do not match.
</div>
</div>
<div class="form-group">
<label>Type</label>
<app-select [options]="['user', 'admin']" notNull formControlName="type"></app-select>
</div>
<button type="submit" class="btn btn-primary float-right" [disabled]="!userForm.valid || userForm.pristine">Save</button>
</form>
</div>
</div>

71
frontend/src/app/pages/edit-user/edit-user.component.ts
View file

@ -1,19 +1,82 @@
import { ActivatedRoute } from '@angular/router';
import { UsersOperation } from './../../operations/users.operations';
import { ModalService } from './../../services/modal.service';
import { ActivatedRoute, ParamMap, Router } from '@angular/router';
import { FormGroup, Validators, FormBuilder } from '@angular/forms';
import { Component, OnInit } from '@angular/core';
import { ModalOptionsDatatype } from '../../datatypes/modal-options.datatype';
import { PasswordValidationUtil } from '../../utils/password-validation.util';
@Component({
selector: 'app-edit-user',
selector: 'app-create-user',
templateUrl: './edit-user.component.html',
styleUrls: ['./edit-user.component.scss']
})
export class EditUserComponent implements OnInit {
public type: string;
public userForm: FormGroup;
constructor(private route: ActivatedRoute) { }
public isNative = false;
public username = '';
public userId = 0;
constructor(private fb: FormBuilder, private route: ActivatedRoute, private users: UsersOperation,
private router: Router, private modal: ModalService) { }
ngOnInit() {
this.createForm();
this.route.paramMap.subscribe((params) => this.initControl(params));
}
private async initControl(params: ParamMap) {
this.userId = +params.get('userId');
const user = await this.users.getSingle(this.userId);
this.username = user.name;
this.isNative = user.native;
this.userForm.reset({
name: user.name,
type: user.type
});
}
private createForm() {
this.userForm = this.fb.group({
name: ['', Validators.required],
type: ['user'],
password: [''],
password2: ['']
}, { validator: PasswordValidationUtil.matchPassword });
}
public async onSubmit() {
try {
const v = this.userForm.value;
if (this.isNative) {
const name = this.userForm.controls['name'].dirty ? v.name : null;
const password = v.password !== '' ? v.password : null;
await this.users.updateUser(this.userId, name, v.type, password);
} else {
await this.users.updateUser(this.userId, null, v.type);
}
this.userForm.reset({
name: v.name,
type: v.type,
password: '',
password2: ''
});
} catch (e) {
await this.modal.showMessage(new ModalOptionsDatatype({
heading: 'Error',
body: e.message,
acceptText: 'OK',
dismisText: '',
acceptClass: 'warning'
}));
}
}
}

3
frontend/src/app/partials/modal-container/modal-container.component.html
View file

@ -9,7 +9,8 @@
</div>
<div class="modal-footer">
<button type="button" *ngIf="options.dismisText.length > 0" class="btn btn-secondary" (click)="onDismis()">{{options.dismisText}}</button>
<button type="button" class="btn" [ngClass]="'btn-' + options.acceptClass" (click)="onAccept()">{{options.acceptText}}</button>
<button type="button" #acceptButton class="btn" [ngClass]="'btn-' + options.acceptClass" (click)="onAccept()"
appFocus>{{options.acceptText}}</button>
</div>
</div>
</div>

10
frontend/src/app/partials/modal-container/modal-container.component.ts
View file

@ -1,4 +1,4 @@
import { Component, OnInit } from '@angular/core';
import { Component, OnInit, ElementRef, ViewChild } from '@angular/core';
import { ModalService } from '../../services/modal.service';
import { ModalOptionsDatatype } from '../../datatypes/modal-options.datatype';
@ -17,6 +17,8 @@ export class ModalContainerComponent implements OnInit {
acceptClass: 'primary'
});
@ViewChild('acceptButton') private acceptButton: ElementRef;
public show = false;
public animate = false;
@ -42,6 +44,8 @@ export class ModalContainerComponent implements OnInit {
this.show = true;
window.setTimeout(() => this.animate = true, 50);
window.setTimeout(() => this.acceptButton.nativeElement.focus(), 50);
return new Promise<void>((resolve, reject) => {
this.currentResolve = resolve;
this.currentReject = reject;
@ -61,6 +65,10 @@ export class ModalContainerComponent implements OnInit {
*/
onDismis() {
this.hideModal();
if (this.options.dismisText.length === 0) {
this.onAccept();
return;
}
if (this.currentReject) {
this.currentReject();
this.currentResolve = null;