Auto-fill data for new planregistraties

B3Partners · May 31, 2024 · 76fbf27 · 76fbf27
1 parent ee97e55
commit 76fbf27
Show file tree

Hide file tree

Showing 13 changed files with 158 additions and 22 deletions.
diff --git a/projects/planmonitor-wonen/src/lib/api/planmonitor-wonen-api-mock.service.ts b/projects/planmonitor-wonen/src/lib/api/planmonitor-wonen-api-mock.service.ts
@@ -2,6 +2,7 @@
 import { PlanmonitorWonenApiServiceModel, PlanregistratieDetails } from './planmonitor-wonen-api.service.model';
 import { Observable, of } from 'rxjs';
 import {
+  AutofillDataModel,
   BetaalbaarheidEnum, KnelpuntenMeerkeuzeEnum, OpdrachtgeverEnum,
   PlanregistratieModel, PlanregistratieSaveModel, PlantypeEnum, ProjectstatusEnum, StatusPlanologischEnum, VertrouwelijkheidEnum,
   WonenEnZorgEnum,
@@ -11,10 +12,15 @@ import { Injectable } from '@angular/core';
 import { NieuwbouwEnum } from '../models/nieuwbouw.enum';
 import { FlexwoningenEnum } from '../models/flexwoningen.enum';
 import { PlanMonitorModelHelper } from '../helpers/planmonitor-model.helper';
+import { GemeenteModel } from '../models/gemeente.model';
 
 @Injectable()
 export class PlanmonitorWonenApiMockService implements PlanmonitorWonenApiServiceModel {
 
+  public getGemeentes$(): Observable<GemeenteModel[]> {
+    return of([]);
+  }
+
   public getPlanregistraties$(): Observable<PlanregistratieModel[]> {
     const registraties: PlanregistratieModel[] = [{
       id: "1",
@@ -114,4 +120,13 @@ export class PlanmonitorWonenApiMockService implements PlanmonitorWonenApiServic
     return of(true);
   }
 
+  public autofillByGeometry$(_geometry: string): Observable<AutofillDataModel> {
+    return of({
+      gemeentes: [],
+      regios: [],
+      provincies: [],
+      woonmilieus: [],
+    });
+  }
+
 }
diff --git a/projects/planmonitor-wonen/src/lib/api/planmonitor-wonen-api.service.model.ts b/projects/planmonitor-wonen/src/lib/api/planmonitor-wonen-api.service.model.ts
@@ -1,12 +1,16 @@
 import { Observable } from 'rxjs';
-import { DetailplanningModel, PlancategorieModel, PlanregistratieModel, PlanregistratieSaveModel } from '../models';
+import {
+  AutofillDataModel, DetailplanningModel, GemeenteModel, PlancategorieModel, PlanregistratieModel, PlanregistratieSaveModel,
+} from '../models';
 
 export interface PlanregistratieDetails {
   plancategorieen: PlancategorieModel[];
   detailplanningen: DetailplanningModel[];
 }
 
 export interface PlanmonitorWonenApiServiceModel {
+  getGemeentes$(args?: { provincie?: string }): Observable<GemeenteModel[]>;
+  autofillByGeometry$(geometry: string): Observable<AutofillDataModel>;
   getPlanregistraties$(): Observable<PlanregistratieModel[]>;
   getPlandetails$(id: string): Observable<PlanregistratieDetails>;
   savePlanregistratie$(planRegistratieSaveModel: PlanregistratieSaveModel): Observable<boolean>;

diff --git a/projects/planmonitor-wonen/src/lib/api/planmonitor-wonen-api.service.ts b/projects/planmonitor-wonen/src/lib/api/planmonitor-wonen-api.service.ts
@@ -1,6 +1,6 @@
 import { Injectable } from '@angular/core';
-import { HttpClient, HttpClientModule, HttpErrorResponse } from '@angular/common/http';
-import { PlanregistratieModel, PlanregistratieSaveModel } from '../models';
+import { HttpClient, HttpClientModule, HttpErrorResponse, HttpParams } from '@angular/common/http';
+import { AutofillDataModel, GemeenteModel, PlanregistratieModel, PlanregistratieSaveModel } from '../models';
 import { catchError, map, Observable, of } from 'rxjs';
 import { PlanmonitorWonenApiServiceModel, PlanregistratieDetails } from './planmonitor-wonen-api.service.model';
 
@@ -14,6 +14,14 @@ export class PlanmonitorWonenApiService implements PlanmonitorWonenApiServiceMod
 
   constructor(private http: HttpClient) {}
 
+  public getGemeentes$(args?: { provincie?: string }): Observable<GemeenteModel[]> {
+    let params = new HttpParams();
+    if (args?.provincie) {
+      params = params.append('provincie', args.provincie);
+    }
+    return this.http.get<GemeenteModel[]>(`${this.apiBaseUrl}/gemeentes`, { params });
+  }
+
   public getPlanregistraties$(): Observable<PlanregistratieModel[]> {
     return this.http.get<PlanregistratieModel[]>(`${this.apiBaseUrl}/planregistraties`);
   }
@@ -44,4 +52,8 @@ export class PlanmonitorWonenApiService implements PlanmonitorWonenApiServiceMod
     );
   }
 
+  public autofillByGeometry$(geometry: string): Observable<AutofillDataModel> {
+    return this.http.post<AutofillDataModel>(`${this.apiBaseUrl}/planregistratie/autofill-by-geometry`, geometry);
+  }
+
 }
diff --git a/projects/planmonitor-wonen/src/lib/helpers/planmonitor-model.helper.ts b/projects/planmonitor-wonen/src/lib/helpers/planmonitor-model.helper.ts
@@ -27,6 +27,7 @@ export class PlanMonitorModelHelper {
       statusPlanologisch: null,
       statusProject: null,
       sleutelproject: null,
+      isNew: true,
       ...initialData,
     };
   }

diff --git a/projects/planmonitor-wonen/src/lib/models/autofill-data.model.ts b/projects/planmonitor-wonen/src/lib/models/autofill-data.model.ts
@@ -0,0 +1,8 @@
+import { WoonmilieuAbf13Enum } from './woonmilieu-abf13.enum';
+
+export interface AutofillDataModel {
+  woonmilieus: WoonmilieuAbf13Enum[];
+  gemeentes: string[];
+  provincies: string[];
+  regios: string[];
+}
diff --git a/projects/planmonitor-wonen/src/lib/models/gemeente.model.ts b/projects/planmonitor-wonen/src/lib/models/gemeente.model.ts
@@ -0,0 +1,6 @@
+export interface GemeenteModel {
+  id: string;
+  naam: string;
+  provincie: string;
+  geometry: string;
+}
diff --git a/projects/planmonitor-wonen/src/lib/models/index.ts b/projects/planmonitor-wonen/src/lib/models/index.ts
@@ -18,3 +18,5 @@ export * from './woningtype.enum';
 export * from './woonmilieu-abf13.enum';
 export * from './woonvisie.enum';
 export * from './planregistratie-save.model';
+export * from './autofill-data.model';
+export * from './gemeente.model';
diff --git a/projects/planmonitor-wonen/src/lib/models/planregistratie.model.ts b/projects/planmonitor-wonen/src/lib/models/planregistratie.model.ts
@@ -29,4 +29,5 @@ export interface PlanregistratieModel {
   beoogdWoonmilieuAbf13: WoonmilieuAbf13Enum | null;
   aantalStudentenwoningen: number;
   sleutelproject: boolean | null;
+  isNew?: boolean;
 }
diff --git a/projects/planmonitor-wonen/src/lib/planmonitor-wonen.module.ts b/projects/planmonitor-wonen/src/lib/planmonitor-wonen.module.ts
@@ -13,6 +13,8 @@ import { PlanregistratieFormComponent } from './planregistratie-form/planregistr
 import { PlancategorieListComponent } from './plancategorie-list/plancategorie-list.component';
 import { PlanmonitorToggleComponent } from './planmonitor-toggle/planmonitor-toggle.component';
 import { PlanmonitorWonenApiService } from './api/planmonitor-wonen-api.service';
+import { filter, take } from 'rxjs';
+import { AutofillDataService } from './services/autofill-data.service';
 
 
 @NgModule({
@@ -36,13 +38,19 @@ export class PlanmonitorWonenModule {
     adminRegistryService: ConfigurationComponentRegistryService,
     viewerRegistryService: ComponentRegistrationService,
     adminFieldRegistrationService: AdminFieldRegistrationService,
+    autofillDataService: AutofillDataService,
   ) {
     adminRegistryService.registerConfigurationComponents(PLANMONITOR_WONEN_COMPONENT_ID, 'Planmonitor wonen', BaseComponentConfigComponent);
     viewerRegistryService.registerComponent("map", { type: PLANMONITOR_WONEN_COMPONENT_ID, component: PlanregistratiesMapComponent }, true);
     viewerRegistryService.registerComponent("map-controls-left", { type: PLANMONITOR_WONEN_COMPONENT_ID + '_toggle', component: PlanmonitorToggleComponent }, true);
-    adminFieldRegistrationService.registerFields(AdminFieldLocation.GROUP, [
-      { type: "choice", label: "Type gebruiker", dataType: "string", key: "typeGebruiker", values: [ "gemeente", "provincie" ] },
-      { type: "text", label: "Gemeente", dataType: "string", key: "gemeente" },
-    ]);
+    autofillDataService.loadGemeentes('Zeeland');
+    autofillDataService.getGemeentes$()
+      .pipe(filter(g => g.length > 0), take(1))
+      .subscribe(gemeentes => {
+        adminFieldRegistrationService.registerFields(AdminFieldLocation.GROUP, [
+          { type: "choice", label: "Type gebruiker", dataType: "string", key: "typeGebruiker", values: [ "gemeente", "provincie" ] },
+          { type: "choice", label: "Gemeente", dataType: "string", key: "gemeente", values: gemeentes.filter(g => g.provincie === 'Zeeland').map(g => g.naam) },
+        ]);
+      });
   }
 }
diff --git a/projects/planmonitor-wonen/src/lib/planregistratie-form/planregistratie-form.component.html b/projects/planmonitor-wonen/src/lib/planregistratie-form/planregistratie-form.component.html
@@ -7,20 +7,29 @@
         <input matInput formControlName="plannaam" />
       </mat-form-field>
       <mat-form-field>
-        <mat-label>Provincie</mat-label>
-        <input matInput formControlName="provincie" />
+        <mat-label>Plaatsnaam</mat-label>
+        <input matInput formControlName="plaatsnaam" />
       </mat-form-field>
       <mat-form-field>
         <mat-label>Gemeente</mat-label>
-        <input matInput formControlName="gemeente" />
+        @if (((gemeentes$ | async) || []).length > 0) {
+          <mat-select formControlName="gemeente">
+            <mat-option></mat-option>
+            @for (gemeente of gemeentes$ | async; track gemeente.naam) {
+              <mat-option [value]="gemeente.naam">{{gemeente.naam}}</mat-option>
+            }
+          </mat-select>
+        } @else {
+          <input matInput formControlName="gemeente" />
+        }
       </mat-form-field>
       <mat-form-field>
         <mat-label>Regio</mat-label>
         <input matInput formControlName="regio" />
       </mat-form-field>
       <mat-form-field>
-        <mat-label>Plaatsnaam</mat-label>
-        <input matInput formControlName="plaatsnaam" />
+        <mat-label>Provincie</mat-label>
+        <input matInput formControlName="provincie" />
       </mat-form-field>
       <mat-form-field>
         <mat-label>Plantype</mat-label>

diff --git a/projects/planmonitor-wonen/src/lib/planregistratie-form/planregistratie-form.component.ts b/projects/planmonitor-wonen/src/lib/planregistratie-form/planregistratie-form.component.ts
@@ -6,7 +6,9 @@ import {
 } from '../models';
 import { FormControl, FormGroup, Validators } from '@angular/forms';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
-import { debounceTime } from 'rxjs';
+import { debounceTime, Observable, of } from 'rxjs';
+import { AutofillDataService } from '../services/autofill-data.service';
+import { GemeenteModel } from '../models/gemeente.model';
 
 @Component({
   selector: 'lib-planregistratie-form',
@@ -59,9 +61,14 @@ export class PlanregistratieFormComponent implements OnInit {
   @Output()
   public planregistratieChanged = new EventEmitter<Partial<PlanregistratieModel> | null>();
 
+  public gemeentes$: Observable<GemeenteModel[]> = of([]);
+
   constructor(
     private destroyRef: DestroyRef,
-  ) { }
+    private autofillDataService: AutofillDataService,
+  ) {
+    this.gemeentes$ = this.autofillDataService.getGemeentes$();
+  }
 
   public ngOnInit(): void {
     this.planregistratieForm.valueChanges

diff --git a/projects/planmonitor-wonen/src/lib/services/autofill-data.service.ts b/projects/planmonitor-wonen/src/lib/services/autofill-data.service.ts
@@ -0,0 +1,45 @@
+import { BehaviorSubject, catchError, Observable, of, take } from 'rxjs';
+import { GemeenteModel } from '../models/gemeente.model';
+import { Inject, Injectable } from '@angular/core';
+import { PLANMONITOR_WONEN_API_SERVICE } from '../api/planmonitor-wonen-api.service.injection-token';
+import { PlanmonitorWonenApiServiceModel } from '../api/planmonitor-wonen-api.service.model';
+import { AutofillDataModel } from '../models';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class AutofillDataService {
+
+  private gemeentesSubject = new BehaviorSubject<GemeenteModel[]>([]);
+
+  constructor(
+    @Inject(PLANMONITOR_WONEN_API_SERVICE) private api: PlanmonitorWonenApiServiceModel,
+  ) {
+  }
+
+  public loadGemeentes(provincie?: string): void {
+    this.api.getGemeentes$({ provincie })
+      .pipe(take(1), catchError(() => of([])))
+      .subscribe(gemeentes => {
+        const newGemeenteNames = new Set(gemeentes.map(gemeente => gemeente.naam));
+        const current = this.gemeentesSubject.value;
+        const filteredGemeentes = current.filter(gemeente => !newGemeenteNames.has(gemeente.naam));
+        this.gemeentesSubject.next([ ...gemeentes, ...filteredGemeentes ]);
+      });
+  }
+
+  public getGemeentes$() {
+    return this.gemeentesSubject.asObservable();
+  }
+
+  public loadAutofillData$(geometry: string): Observable<AutofillDataModel> {
+    return this.api.autofillByGeometry$(geometry)
+      .pipe(catchError(() => of({
+        gemeentes: [],
+        regios: [],
+        provincies: [],
+        woonmilieus: [],
+      })));
+  }
+
+}
diff --git a/projects/planmonitor-wonen/src/lib/services/planregistraties.service.ts b/projects/planmonitor-wonen/src/lib/services/planregistraties.service.ts
@@ -9,6 +9,7 @@ import { PlanValidationHelper } from '../helpers/plan-validation.helper';
 import { PlanregistratieExportHelper } from '../helpers/planregistratie-export.helper';
 import { PlanMonitorModelHelper } from '../helpers/planmonitor-model.helper';
 import { CategorieTableModel } from '../models/categorie-table.model';
+import { AutofillDataService } from './autofill-data.service';
 
 @Injectable({
   providedIn: 'root',
@@ -34,6 +35,7 @@ export class PlanregistratiesService {
 
   constructor(
     @Inject(PLANMONITOR_WONEN_API_SERVICE) private api: PlanmonitorWonenApiServiceModel,
+    private autofillDataService: AutofillDataService,
   ) {
     combineLatest([
       this.getSelectedPlanCategorieen$(),
@@ -170,12 +172,22 @@ export class PlanregistratiesService {
   }
 
   public setNewFeatureGeometry(geometry: string) {
-    const newPlan = PlanMonitorModelHelper.getNewPlanregistratie({ geometrie: geometry });
-    this.planRegistraties.next([
-      ...this.planRegistraties.value,
-      newPlan,
-    ]);
-    this.setSelectedPlanregistratie(newPlan.id);
+    this.autofillDataService.loadAutofillData$(geometry)
+      .pipe(take(1))
+      .subscribe(autofillData => {
+        const newPlan = PlanMonitorModelHelper.getNewPlanregistratie({
+          gemeente: autofillData.gemeentes[0] || '',
+          regio: autofillData.regios[0] || '',
+          provincie: autofillData.provincies[0] || '',
+          beoogdWoonmilieuAbf13: autofillData.woonmilieus[0] || null,
+          geometrie: geometry,
+        });
+        this.planRegistraties.next([
+          ...this.planRegistraties.value,
+          newPlan,
+        ]);
+        this.setSelectedPlanregistratie(newPlan.id);
+      });
   }
 
   public save$() {
@@ -185,15 +197,17 @@ export class PlanregistratiesService {
     if (updatedPlan === null || updatedCategorieen === null || updatedDetailplanningen === null) {
       return of(false);
     }
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    const { isNew, ...planregistratie } = updatedPlan;
     return this.api.savePlanregistratie$({
-      planregistratie: updatedPlan,
+      planregistratie,
       plancategorieen: updatedCategorieen,
       detailplanningen: updatedDetailplanningen,
     })
       .pipe(
         tap(success => {
           if (success) {
-            this.updatePlanAfterSaving(updatedPlan);
+            this.updatePlanAfterSaving(planregistratie);
           }
         }),
       );
@@ -235,6 +249,10 @@ export class PlanregistratiesService {
   }
 
   public cancelChanges() {
+    const hasNew = this.planRegistraties.value.find(r => r.isNew);
+    if (hasNew) {
+      this.planRegistraties.next(this.planRegistraties.value.filter(r => !r.isNew));
+    }
     this.setSelectedPlanregistratie(null);
   }