First stage of NewOrganizationComponent

code/moya-management-portal/src/app/organization/new-organization/new-organization.component.html

 <form [formGroup]="organizationForm" (ngSubmit)="onSubmit()">
   <mat-form-field>
-    <input matInput placeholder="Organization name:" formControlName="name">
+    <input matInput required placeholder="Organization name" formControlName="name">
   </mat-form-field>
+
+  <mat-divider [vertical]="true"></mat-divider>
+
+  <mat-form-field>
+    <input matInput placeholder="Address" formControlName="address">
+  </mat-form-field>
+
+  <mat-form-field>
+    <input matInput placeholder="Postal code" formControlName="postcode">
+  </mat-form-field>
+
+  <mat-form-field>
+    <input matInput placeholder="City" formControlName="city">
+  </mat-form-field>
+
+  <mat-divider [vertical]="true"></mat-divider>
+
+  <mat-form-field>
+    <input matInput placeholder="Business ID" formControlName="businessId">
+  </mat-form-field>
+
+  <mat-divider [vertical]="true"></mat-divider>
+
+  <mat-form-field>
+    <input matInput placeholder="Bank name" formControlName="bankName">
+  </mat-form-field>
+
+  <mat-form-field>
+    <input matInput placeholder="IBAN" formControlName="iban">
+  </mat-form-field>
+
+  <mat-divider [vertical]="true"></mat-divider>
+
   <button mat-button type="submit">Submit</button>
 </form>

code/moya-management-portal/src/app/organization/new-organization/new-organization.component.ts

@@ -10,13 +10,29 @@ import {FormControl, FormGroup} from '@angular/forms';
 export class NewOrganizationComponent implements OnInit {
 
   public organizationForm = new FormGroup({
-    name: new FormControl()
+    name: new FormControl(),
+    address: new FormControl(),
+    postcode: new FormControl(),
+    city: new FormControl(),
+    businessId: new FormControl(),
+    bankName: new FormControl(),
+    iban: new FormControl()
   });
 
   constructor() { }
 
   ngOnInit() {
   }
-  onSubmit() { }
+  onSubmit() {
+    const values = {
+      'name': this.organizationForm.get('name').value,
+      'address': this.organizationForm.get('address').value,
+      'postcode': this.organizationForm.get('postcode').value,
+      'city': this.organizationForm.get('city').value,
+      'businessId': this.organizationForm.get('city').value,
+      'bankName': this.organizationForm.get('bankName').value,
+      'iban': this.organizationForm.get('iban').value
+    };
+  }
 
 }

code/moya-management-portal/src/app/organization/organization.module.ts

@@ -8,7 +8,7 @@ import {OrganizationListService} from './organization-list/organization-list.ser
 import {MatCardModule} from '@angular/material/card';
 import { ReactiveFormsModule } from '@angular/forms';
 import { MatInputModule } from '@angular/material/input';
-import { MatButtonModule } from '@angular/material';
+import {MatButtonModule, MatDividerModule} from '@angular/material';
 
 @NgModule({
   imports: [
@@ -17,7 +17,8 @@ import { MatButtonModule } from '@angular/material';
     MatCardModule,
     ReactiveFormsModule,
     MatInputModule,
-    MatButtonModule
+    MatButtonModule,
+    MatDividerModule
   ],
   providers: [OrganizationListService],
   declarations: [NewOrganizationComponent, OrganizationListComponent, EventListComponent],