Replace cost unit endpoints for staff member

• cost unit changes are made by patch staff
• so no separate cost unit endpoints anymore

apps/frontend/src/app/staff-list/main-data/dialogs/edit-staff-member-contract.component.ts

 import {
   Component, Inject, OnDestroy, OnInit
 } from '@angular/core';
-import {FormBuilder, FormGroup, Validators} from '@angular/forms';
-import {MAT_DIALOG_DATA, MatDialog} from '@angular/material/dialog';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { MAT_DIALOG_DATA, MatDialog } from '@angular/material/dialog';
 import { Subscription } from 'rxjs';
-import {CostUnitDto, CostUnitStaffDto, StaffMemberFullDto} from '@lib/dto';
-import { contractTypes, payrollIdPrefix } from "@lib/properties";
-import {ConfirmDialogComponent, ConfirmDialogData} from "@lib/iqb-components";
-import {StaffListService} from "../../staff-list.service";
-import {EditCostUnitDataDialogComponent, EditCostUnitDialogData} from "./edit-cost-unit-data-dialog.component";
+import {
+  CostUnitDto, CostUnitStaffDto, EnumEntryDto, StaffMemberFullDto
+} from '@lib/dto';
+import { contractTypes, payrollIdPrefix, getPropertyLabel } from '@lib/properties';
+import { ConfirmDialogComponent, ConfirmDialogData } from '@lib/iqb-components';
+import { StaffListService } from '../../staff-list.service';
+import { EditCostUnitDataDialogComponent, EditCostUnitDialogData } from './edit-cost-unit-data-dialog.component';
+import { AppService } from '../../../app.service';
 
 @Component({
   template: `
@@ -17,14 +20,15 @@ import {EditCostUnitDataDialogComponent, EditCostUnitDialogData} from "./edit-co
       <form [formGroup]="changeDataForm" fxLayout="row" fxLayoutAlign="space-between start">
         <div fxFlex="56%" fxLayout="column">
           <div fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="5px">
-            <mat-label>Personalnummer</mat-label>
-            <span class="payroll-id-prefix" *ngIf="changeDataForm.get('contractType')?.value !== 'hu'">{{localPayrollIdPrefix}}</span>
+            <mat-label>{{getPropertyLabel('payrollId')}}</mat-label>
+            <span class="payroll-id-prefix"
+                  *ngIf="changeDataForm.get('contractType')?.value !== 'hu'">{{localPayrollIdPrefix}}</span>
             <mat-form-field>
               <input matInput formControlName="payrollId">
             </mat-form-field>
           </div>
           <div fxLayout="row">
-            <mat-label fxFlex="110px">Art des Vertrages</mat-label>
+            <mat-label fxFlex="110px">{{getPropertyLabel('contractType')}}</mat-label>
             <mat-radio-group #ct formControlName="contractType">
               <mat-radio-button class="main-radio-button"
                                 *ngFor="let contractTypeOption of localContractTypes"
@@ -34,15 +38,19 @@ import {EditCostUnitDataDialogComponent, EditCostUnitDialogData} from "./edit-co
             </mat-radio-group>
           </div>
           <div fxLayout="row">
-            <mat-label fxFlex="110px" class="payroll-level-label">Vertragsform</mat-label>
+            <mat-label fxFlex="110px" class="payroll-level-label">{{getPropertyLabel('contractTypeLegal')}}</mat-label>
             <mat-form-field>
               <input matInput formControlName="contractTypeLegal">
             </mat-form-field>
           </div>
           <div fxLayout="row">
-            <mat-label fxFlex="110px" class="payroll-level-label">Kostentitel</mat-label>
-            <mat-form-field>
-              <input matInput formControlName="costTitle">
+            <mat-label fxFlex="110px" class="payroll-level-label">{{getPropertyLabel('costTitle')}}</mat-label>
+            <mat-form-field fxFlex="310px">
+              <mat-select formControlName="costTitle">
+                <mat-option *ngFor="let option of costTitleList" [value]="option.id">
+                  {{option.label}}
+                </mat-option>
+              </mat-select>
             </mat-form-field>
           </div>
           <div fxLayout="row" fxLayoutAlign="space-between center" style="margin: 10px 0">
@@ -93,12 +101,13 @@ import {EditCostUnitDataDialogComponent, EditCostUnitDialogData} from "./edit-co
             </div>
           </div>
           <div fxLayout="row" fxLayoutGap="10px">
-            <mat-label fxFlex="100px">Kostenstelle</mat-label>
+            <mat-label fxFlex="100px">{{getPropertyLabel('costUnit')}}</mat-label>
             <div>
               <mat-chip-list #chipListCostUnit>
                 <mat-chip *ngFor="let relation of localCostUnits" (click)="changeCostUnitValue(relation)"
                           removable="true" (removed)="deleteCostUnitRelation(relation)">
-                  {{relation.key}} - {{relation.label}} ({{changeDataForm.get('contractType')?.value === 'stud' ? relation.hours + ' h' : relation.degree + ' %'}})
+                  {{relation.key}} - {{relation.label}} ({{changeDataForm.get('contractType')?.value === 'stud' ?
+                  relation.hours + ' h' : relation.degree + ' %'}})
                   <mat-icon matChipRemove>cancel</mat-icon>
                 </mat-chip>
               </mat-chip-list>
@@ -148,13 +157,14 @@ export class EditStaffMemberContractComponent implements OnInit, OnDestroy {
   localCostUnitsChanged = false;
   filteredCostUnitList: CostUnitDto[] = [];
   staffMemberData: StaffMemberFullDto;
+  costTitleList: EnumEntryDto[] = [];
 
   get changedData(): StaffMemberFullDto {
     const data: StaffMemberFullDto = {
       id: this.staffMemberData.id
     };
     let newPayrollId: string = this.changeDataForm.get('payrollId')?.value;
-    if (newPayrollId) newPayrollId = (newPayrollId as string).padStart(5, '0')
+    if (newPayrollId) newPayrollId = (newPayrollId as string).padStart(5, '0');
     if (newPayrollId !== this.staffMemberData.payrollId) data.payrollId = newPayrollId;
     const newContractType: string = this.changeDataForm.get('contractType')?.value;
     if (newContractType !== this.staffMemberData.contractType) data.contractType = newContractType;
@@ -183,7 +193,8 @@ export class EditStaffMemberContractComponent implements OnInit, OnDestroy {
       data.payrollSchemeLevel = newPayrollSchemeLevel;
     }
     const newPayrollSchemeLevelNext = this.changeDataForm.get('payrollSchemeLevelNext')?.value;
-    if (newPayrollSchemeLevelNext !== this.staffMemberData.payrollSchemeLevelNext) data.payrollSchemeLevelNext = newPayrollSchemeLevelNext;
+    if (newPayrollSchemeLevelNext !==
+      this.staffMemberData.payrollSchemeLevelNext) data.payrollSchemeLevelNext = newPayrollSchemeLevelNext;
     if (this.localCostUnitsChanged) data.costUnits = this.localCostUnits;
     return data;
   }
@@ -191,6 +202,7 @@ export class EditStaffMemberContractComponent implements OnInit, OnDestroy {
   constructor(private fb: FormBuilder,
               public staffListService: StaffListService,
               private deleteConfirmDialog: MatDialog,
+              private appService: AppService,
               private changeCostUnitValueDialog: MatDialog,
               @Inject(MAT_DIALOG_DATA) public data: unknown) {
     this.staffMemberData = data as StaffMemberFullDto;
@@ -206,15 +218,13 @@ export class EditStaffMemberContractComponent implements OnInit, OnDestroy {
     }
     this.localPayrollIdPrefix = this.staffMemberData.contractType === 'hu' ? '' : payrollIdPrefix;
     this.localCostUnits = this.staffMemberData.costUnits ?
-      this.staffMemberData.costUnits.map(cu => {
-        return <CostUnitStaffDto>{
-          costUnitId: cu.costUnitId,
-          staffId: cu.staffId,
-          key: cu.key,
-          label: cu.label,
-          degree: cu.degree,
-          hours: cu.hours
-        }
+      this.staffMemberData.costUnits.map(cu => <CostUnitStaffDto>{
+        costUnitId: cu.costUnitId,
+        staffId: cu.staffId,
+        key: cu.key,
+        label: cu.label,
+        degree: cu.degree,
+        hours: cu.hours
       }) : [];
     this.updateCostUnitList();
     this.changeDataForm = this.fb.group({
@@ -237,6 +247,7 @@ export class EditStaffMemberContractComponent implements OnInit, OnDestroy {
       payrollSchemeLevel: this.fb.control(this.staffMemberData.payrollSchemeLevel),
       payrollSchemeLevelNext: this.fb.control(this.staffMemberData.payrollSchemeLevelNext)
     });
+    this.costTitleList = this.appService.getEnumEntries('cost-title');
   }
 
   ngOnInit() {
@@ -329,6 +340,11 @@ export class EditStaffMemberContractComponent implements OnInit, OnDestroy {
     });
   }
 
+  // eslint-disable-next-line class-methods-use-this
+  getPropertyLabel(propertyKey: string): string {
+    return getPropertyLabel(propertyKey);
+  }
+
   ngOnDestroy(): void {
     if (this.dataChangedSubscription) this.dataChangedSubscription.unsubscribe();
   }