Added group from in webapp.

src/main/webapp/src/app/app.component.html

@@ -1,2 +1,4 @@
+Osoby:
 <app-person-list></app-person-list>
+Grupy:
 <app-group-list></app-group-list>

src/main/webapp/src/app/component/form/group-form/group-form.component.html

@@ -0,0 +1,19 @@
+<form [formGroup]="formGroup" (ngSubmit)="onSubmit()">
+
+  Prowadzący:
+
+  <app-person-list-control-value-accessor formControlName="grupLeaders">
+
+  </app-person-list-control-value-accessor>
+
+  Studenci:
+
+  <app-person-list-control-value-accessor formControlName="groupMembers">
+
+  </app-person-list-control-value-accessor>
+
+  <button mat-button type="submit" [disabled]="!formGroup.valid">Zapisz</button>
+
+  <button mat-button type="button" (click)="dialogRef.close()">Anuluj</button>
+
+</form>

src/main/webapp/src/app/component/form/group-form/group-form.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { GroupFormComponent } from './group-form.component';
+
+describe('GroupFormComponent', () => {
+  let component: GroupFormComponent;
+  let fixture: ComponentFixture<GroupFormComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ GroupFormComponent ]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(GroupFormComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/main/webapp/src/app/component/form/group-form/group-form.component.ts

@@ -0,0 +1,66 @@
+import {Component, EventEmitter, Inject, OnInit, Output} from '@angular/core';
+import {FormControl, FormGroup} from "@angular/forms";
+import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
+import {GroupService} from "../../../service/group.service";
+import {Group} from "../../../model/group";
+import {GroupMember} from "../../../model/groupMember";
+import {GroupLeader} from "../../../model/groupLeader";
+import {forkJoin, Observable} from "rxjs";
+import {Person} from "../../../model/person";
+import {PersonService} from "../../../service/person.service";
+
+@Component({
+  selector: 'app-group-form',
+  templateUrl: './group-form.component.html',
+  styleUrls: ['./group-form.component.sass']
+})
+export class GroupFormComponent implements OnInit {
+
+  @Output()
+  onCreate: EventEmitter<Group> = new EventEmitter()
+
+  formGroup: FormGroup<{
+    groupMembers: FormControl<Person[] | null>;
+    grupLeaders: FormControl<Person[] | null>
+  }>
+
+  groupMembers: Observable<Person>[];
+  groupLeaders: Observable<Person>[];
+
+  constructor(
+    private groupService: GroupService,
+    private personService: PersonService,
+    public dialogRef: MatDialogRef<GroupFormComponent>,
+    @Inject(MAT_DIALOG_DATA) public data: { group: Group | null }
+  ) {
+    this.groupMembers = this.data.group?.groupMembers.map(groupMember => this.personService.findById(groupMember.personId)) ?? []
+    this.groupLeaders = this.data.group?.groupLeaders.map(groupLeaders => this.personService.findById(groupLeaders.personId)) ?? []
+    this.formGroup = new FormGroup({
+      grupLeaders: new FormControl<Person[]>([]),
+      groupMembers: new FormControl<Person[]>([])
+    });
+  }
+
+  ngOnInit(): void {
+    forkJoin(this.groupMembers).subscribe(people => this.formGroup.controls.groupMembers.patchValue(people));
+    forkJoin(this.groupLeaders).subscribe(people => this.formGroup.controls.grupLeaders.patchValue(people));
+  }
+
+  onSubmit() {
+    const group = this.data.group ?? new Group(null, [], []);
+    if (this.formGroup.controls.groupMembers.value != null) {
+      group.groupMembers = this.formGroup.controls.groupMembers.value?.map(person => new GroupMember(null, person.student?.id ?? -1, group.id, person.id ?? -1));
+    }
+    if (this.formGroup.controls.grupLeaders.value != null) {
+      group.groupLeaders = this.formGroup.controls.grupLeaders.value?.map(person => new GroupLeader(null, person.id ?? -1, group.id));
+    }
+    let action: Observable<Group>;
+    if (group.id != null) {
+      action = this.groupService.update(group);
+    } else {
+      action = this.groupService.create(group);
+    }
+    this.onCreate.next(group);
+    action.subscribe(() => this.dialogRef.close());
+  }
+}

src/main/webapp/src/app/component/group-list/group-list.component.ts

@@ -32,7 +32,8 @@ export class GroupListComponent extends AbstractListComponent<Group, number>{
 
   openFormDialog(group: Group | null = null) {
     const dialogRef = this.dialog.open(GroupFormComponent, {
-      data: { group: group }
+      data: { group: group },
+      width: '500px'
     });
     dialogRef.afterClosed().pipe(
       tap(() => this.getPage())