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 @@
+
+
\ 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();
+ }
+ }
+}