diff options
Diffstat (limited to 'client/src/app/+admin/users/user-add')
3 files changed, 87 insertions, 0 deletions
diff --git a/client/src/app/+admin/users/user-add/index.ts b/client/src/app/+admin/users/user-add/index.ts new file mode 100644 index 000000000..66d5ca04f --- /dev/null +++ b/client/src/app/+admin/users/user-add/index.ts | |||
@@ -0,0 +1 @@ | |||
export * from './user-add.component'; | |||
diff --git a/client/src/app/+admin/users/user-add/user-add.component.html b/client/src/app/+admin/users/user-add/user-add.component.html new file mode 100644 index 000000000..9b76c7c1b --- /dev/null +++ b/client/src/app/+admin/users/user-add/user-add.component.html | |||
@@ -0,0 +1,29 @@ | |||
1 | <h3>Add user</h3> | ||
2 | |||
3 | <div *ngIf="error" class="alert alert-danger">{{ error }}</div> | ||
4 | |||
5 | <form role="form" (ngSubmit)="addUser()" [formGroup]="form"> | ||
6 | <div class="form-group"> | ||
7 | <label for="username">Username</label> | ||
8 | <input | ||
9 | type="text" class="form-control" id="username" placeholder="Username" | ||
10 | formControlName="username" | ||
11 | > | ||
12 | <div *ngIf="formErrors.username" class="alert alert-danger"> | ||
13 | {{ formErrors.username }} | ||
14 | </div> | ||
15 | </div> | ||
16 | |||
17 | <div class="form-group"> | ||
18 | <label for="password">Password</label> | ||
19 | <input | ||
20 | type="password" class="form-control" id="password" placeholder="Password" | ||
21 | formControlName="password" | ||
22 | > | ||
23 | <div *ngIf="formErrors.password" class="alert alert-danger"> | ||
24 | {{ formErrors.password }} | ||
25 | </div> | ||
26 | </div> | ||
27 | |||
28 | <input type="submit" value="Add user" class="btn btn-default" [disabled]="!form.valid"> | ||
29 | </form> | ||
diff --git a/client/src/app/+admin/users/user-add/user-add.component.ts b/client/src/app/+admin/users/user-add/user-add.component.ts new file mode 100644 index 000000000..ab96fb01d --- /dev/null +++ b/client/src/app/+admin/users/user-add/user-add.component.ts | |||
@@ -0,0 +1,57 @@ | |||
1 | import { Component, OnInit } from '@angular/core'; | ||
2 | import { FormBuilder, FormGroup } from '@angular/forms'; | ||
3 | import { Router } from '@angular/router'; | ||
4 | |||
5 | import { UserService } from '../shared'; | ||
6 | import { FormReactive, USER_USERNAME, USER_PASSWORD } from '../../../shared'; | ||
7 | |||
8 | @Component({ | ||
9 | selector: 'my-user-add', | ||
10 | templateUrl: './user-add.component.html' | ||
11 | }) | ||
12 | export class UserAddComponent extends FormReactive implements OnInit { | ||
13 | error: string = null; | ||
14 | |||
15 | form: FormGroup; | ||
16 | formErrors = { | ||
17 | 'username': '', | ||
18 | 'password': '' | ||
19 | }; | ||
20 | validationMessages = { | ||
21 | 'username': USER_USERNAME.MESSAGES, | ||
22 | 'password': USER_PASSWORD.MESSAGES, | ||
23 | }; | ||
24 | |||
25 | constructor( | ||
26 | private formBuilder: FormBuilder, | ||
27 | private router: Router, | ||
28 | private userService: UserService | ||
29 | ) { | ||
30 | super(); | ||
31 | } | ||
32 | |||
33 | buildForm() { | ||
34 | this.form = this.formBuilder.group({ | ||
35 | username: [ '', USER_USERNAME.VALIDATORS ], | ||
36 | password: [ '', USER_PASSWORD.VALIDATORS ], | ||
37 | }); | ||
38 | |||
39 | this.form.valueChanges.subscribe(data => this.onValueChanged(data)); | ||
40 | } | ||
41 | |||
42 | ngOnInit() { | ||
43 | this.buildForm(); | ||
44 | } | ||
45 | |||
46 | addUser() { | ||
47 | this.error = null; | ||
48 | |||
49 | const { username, password } = this.form.value; | ||
50 | |||
51 | this.userService.addUser(username, password).subscribe( | ||
52 | ok => this.router.navigate([ '/admin/users/list' ]), | ||
53 | |||
54 | err => this.error = err.text | ||
55 | ); | ||
56 | } | ||
57 | } | ||