feat: add form dialog component (#428)

- Add formfield, input, select base (model)
- Add formfield component
- Add form-group service
- Add form-dialog component

Fixes: #427

src/app/shared/form-dialog/form-dialog.component.ts

@@ -0,0 +1,51 @@
+import { Component, OnInit, Inject } from '@angular/core';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
+import { FormGroup } from '@angular/forms';
+
+import { FormfieldBase } from './formfield/model/formfield-base';
+
+import { FormGroupService } from './form-group.service';
+
+const layoutGap = 2;
+
+@Component({
+  selector: 'mifosx-form-dialog',
+  templateUrl: './form-dialog.component.html',
+  styleUrls: ['./form-dialog.component.scss']
+})
+export class FormDialogComponent implements OnInit {
+
+  layout: {
+    columns: number,
+    columnWidth?: number,
+    flex?: number,
+    gap?: number,
+    cancelButtonText?: string,
+    addButtonText?: string
+  } = {
+    columns: 1,
+    columnWidth: 400,
+    flex: 100,
+    cancelButtonText: 'Cancel',
+    addButtonText: 'Add'
+  };
+
+  form: FormGroup;
+  formfields: FormfieldBase[];
+
+  constructor(public dialogRef: MatDialogRef<FormDialogComponent>,
+              @Inject(MAT_DIALOG_DATA) public data: any,
+              private formGroupService: FormGroupService) {
+    this.dialogRef.disableClose = !data.disableClose;
+    this.formfields = data.formfields.sort((formfieldA: FormfieldBase, formfieldB: FormfieldBase) => formfieldA.order - formfieldB.order);
+    this.layout = { ...this.layout, ...data.layout };
+    this.layout.gap = this.layout.columns > 1 ? layoutGap : 0;
+    this.layout.flex = (this.layout.flex / this.layout.columns) - this.layout.gap;
+  }
+
+  ngOnInit() {
+    this.dialogRef.updateSize(`${this.layout.columnWidth * this.layout.columns}px`);
+    this.form = this.formGroupService.createFormGroup(this.formfields);
+  }
+
+}