diff --git a/frontend/src/app/app-routing.module.ts b/frontend/src/app/app-routing.module.ts index fe429e5..76d925c 100644 --- a/frontend/src/app/app-routing.module.ts +++ b/frontend/src/app/app-routing.module.ts @@ -15,6 +15,7 @@ import { NgModule } from '@angular/core'; import { Routes, RouterModule } from '@angular/router'; import { LoginComponent } from './pages/login/login.component'; import { EditAuthComponent } from './pages/edit-auth/edit-auth.component'; +import { SetupComponent } from './pages/setup/setup.component'; const routes: Routes = [ { @@ -29,6 +30,10 @@ const routes: Routes = [ data: { logout: true }, canActivate: [LoggedOutGuard] }, + { + path: 'setup', + component: SetupComponent + }, { path: '', pathMatch: 'prefix', diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts index 6329608..f57b028 100644 --- a/frontend/src/app/app.module.ts +++ b/frontend/src/app/app.module.ts @@ -43,6 +43,7 @@ import { EditAuthComponent } from './pages/edit-auth/edit-auth.component'; import { SelectComponent } from './partials/select/select.component'; import { CreateSlaveComponent } from './pages/create-slave/create-slave.component'; import { UsersComponent } from './pages/users/users.component'; +import { SetupComponent } from './pages/setup/setup.component'; @NgModule({ declarations: [ @@ -72,7 +73,8 @@ import { UsersComponent } from './pages/users/users.component'; SearchComponent, EditAuthLineComponent, EditAuthAddComponent, - EditCredentialsComponent + EditCredentialsComponent, + SetupComponent ], imports: [ BrowserModule, diff --git a/frontend/src/app/pages/setup/setup.component.html b/frontend/src/app/pages/setup/setup.component.html new file mode 100644 index 0000000..abf741e --- /dev/null +++ b/frontend/src/app/pages/setup/setup.component.html @@ -0,0 +1,89 @@ +
+
+

Install PDNS Manager

+
+
+
+
+
+

Database

+ +
+ + +
+ Host can not be empty. +
+
+ +
+ + +
+ User can not be empty. +
+
+ +
+ + +
+ +
+ + +
+ Database can not be empty. +
+
+ +
+ + +
+ Port must be positive integer. +
+
+
+ +
+

Initial admin user

+ +
+ + +
+ Username can not be empty. +
+
+ +
+ + +
+ Password can not be empty. +
+
+ +
+ + +
+ Passwords do not match. +
+
+
+ +
+ + {{ errorMessage }} + +
+
+
+
+ + +
+
+
\ No newline at end of file diff --git a/frontend/src/app/pages/setup/setup.component.scss b/frontend/src/app/pages/setup/setup.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/frontend/src/app/pages/setup/setup.component.ts b/frontend/src/app/pages/setup/setup.component.ts new file mode 100644 index 0000000..8ee5648 --- /dev/null +++ b/frontend/src/app/pages/setup/setup.component.ts @@ -0,0 +1,75 @@ +import { HttpService } from './../../services/http.service'; +import { PasswordValidationUtil } from './../../utils/password-validation.util'; +import { Router } from '@angular/router'; +import { FormGroup, Validators, FormBuilder } from '@angular/forms'; +import { OnInit, Component } from '@angular/core'; + +@Component({ + selector: 'app-setup', + templateUrl: './setup.component.html', + styleUrls: ['./setup.component.scss'] +}) +export class SetupComponent implements OnInit { + + public setupForm: FormGroup; + + public errorMessage = ''; + + public loading = false; + + constructor(private fb: FormBuilder, private router: Router, private http: HttpService) { } + + ngOnInit() { + this.createForm(); + } + + private createForm() { + this.setupForm = this.fb.group({ + db: this.fb.group({ + host: ['', Validators.required], + user: ['', Validators.required], + password: [''], + database: ['', Validators.required], + port: ['3306', [Validators.required, Validators.pattern(/^[0-9]+$/)]] + }), + admin: this.fb.group({ + name: ['', Validators.required], + password: ['', Validators.required], + password2: [''] + }, { validator: PasswordValidationUtil.matchPassword }) + }); + } + + public async onSubmit() { + this.errorMessage = ''; + this.setupForm.disable(); + this.loading = true; + + try { + const res = await this.http.post('/setup', { + db: this.setupForm.value.db, + admin: { + name: this.setupForm.value.admin.name, + password: this.setupForm.value.admin.password + } + }); + + this.router.navigate(['/']); + } catch (e) { + switch (e.response.status) { + case 404: + this.errorMessage = 'The application has already been setup or the backend is misconfigured.'; + break; + case 500: + this.errorMessage = e.response.data.error; + break; + default: + this.errorMessage = e.message; + break; + } + + this.loading = false; + this.setupForm.enable(); + } + } +}