Added /domains/create/slave

frontend/src/app/app-routing.module.ts

@@ -1,3 +1,4 @@
+import { CreateSlaveComponent } from './pages/create-slave/create-slave.component';
 import { EditSlaveComponent } from './pages/edit-slave/edit-slave.component';
 import { PasswordComponent } from './pages/password/password.component';
 import { AuthGuard } from './services/auth-guard.service';
@@ -35,6 +36,10 @@ const routes: Routes = [
                 path: 'domains/auth/:domainId',
                 component: EditAuthComponent
             },
+            {
+                path: 'domains/create/slave',
+                component: CreateSlaveComponent
+            },
             {
                 path: 'password',
                 component: PasswordComponent

frontend/src/app/app.module.ts

@@ -28,6 +28,7 @@ import { PasswordComponent } from './pages/password/password.component';
 import { EditSlaveComponent } from './pages/edit-slave/edit-slave.component';
 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';
 
 @NgModule({
   declarations: [
@@ -48,7 +49,8 @@ import { SelectComponent } from './partials/select/select.component';
     EditSlaveComponent,
     EditAuthComponent,
     SelectComponent,
-    StopPropagateClickDirective
+    StopPropagateClickDirective,
+    CreateSlaveComponent
   ],
   imports: [
     BrowserModule,

frontend/src/app/operations/domains.operations.ts

@@ -57,4 +57,27 @@ export class DomainsOperation {
             return false;
         }
     }
+
+    public async create(name: string, type: string, master?: string): Promise<DomainApitype> {
+        let result: DomainApitype;
+        try {
+            if (type === 'SLAVE') {
+                result = new DomainApitype(await this.http.post('/domains', {
+                    name: name,
+                    type: type,
+                    master: master
+                }));
+            } else {
+                result = new DomainApitype(await this.http.post('/domains', {
+                    name: name,
+                    type: type
+                }));
+            }
+
+            return result;
+        } catch (e) {
+            console.error(e);
+            return new DomainApitype({});
+        }
+    }
 }

frontend/src/app/pages/create-slave/create-slave.component.html

@@ -0,0 +1,26 @@
+<div class="row">
+    <div class="col-12 col-md-6 col-lg-3">
+        <p class="font-weight-bold">Create slave zone</p>
+
+        <form autocomplete="off" [formGroup]="slaveForm" (ngSubmit)="onSubmit()">
+
+            <div class="form-group">
+                <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">
+                <label>Master</label>
+                <input type="text" class="form-control auto-invalid" formControlName="master" />
+                <div class="invalid-feedback">
+                    Master can not be empty.
+                </div>
+            </div>
+
+            <button type="submit" class="btn btn-primary float-right" [disabled]="!slaveForm.valid || slaveForm.pristine">Save</button>
+        </form>
+    </div>
+</div>

frontend/src/app/pages/create-slave/create-slave.component.ts

@@ -0,0 +1,34 @@
+import { DomainsOperation } from './../../operations/domains.operations';
+import { ActivatedRoute, ParamMap, Router } from '@angular/router';
+import { FormGroup, Validators, FormBuilder } from '@angular/forms';
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+    selector: 'app-create-slave',
+    templateUrl: './create-slave.component.html',
+    styleUrls: ['./create-slave.component.scss']
+})
+export class CreateSlaveComponent implements OnInit {
+
+    public slaveForm: FormGroup;
+
+    constructor(private fb: FormBuilder, private route: ActivatedRoute, private domains: DomainsOperation, private router: Router) { }
+
+    ngOnInit() {
+        this.createForm();
+    }
+
+    private createForm() {
+        this.slaveForm = this.fb.group({
+            name: ['', Validators.required],
+            master: ['', Validators.required]
+        });
+    }
+
+    public async onSubmit() {
+        const v = this.slaveForm.value;
+        const newDomain = await this.domains.create(v.name, 'SLAVE', v.master);
+        this.slaveForm.reset();
+        this.router.navigate(['/domains/slave', newDomain.id.toString()]);
+    }
+}

frontend/src/app/pages/domains/domains.component.html

@@ -4,7 +4,7 @@
             <button disabled class="btn btn-secondary">Add domain</button>
             <button class="btn btn-secondary">MASTER</button>
             <button class="btn btn-secondary">NATIVE</button>
-            <button class="btn btn-secondary">SLAVE</button>
+            <button routerLink="create/slave" class="btn btn-secondary">SLAVE</button>
         </div>
     </div>
     <div class="col-12 col-md-6 mt-2 mt-md-0">