format code and improve readability across files (#47)
Reviewed-on: http://git.simonis.lol/angular/ems-frontend/pulls/47 Co-authored-by: Jan-Marlon Leibl <jleibl@proton.me> Co-committed-by: Jan-Marlon Leibl <jleibl@proton.me>
This commit is contained in:
committed by
Hop In, I Have Puppies AND WiFi

parent
88d9a1a534
commit
545c6194e4
@ -1,23 +1,29 @@
|
||||
import {Component, inject, OnInit} from '@angular/core';
|
||||
import {AbstractControl, FormBuilder, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms";
|
||||
import { Component, inject, OnInit } from '@angular/core';
|
||||
import {
|
||||
AbstractControl,
|
||||
FormBuilder,
|
||||
FormGroup,
|
||||
ReactiveFormsModule,
|
||||
Validators,
|
||||
} from '@angular/forms';
|
||||
import {
|
||||
MAT_DIALOG_DATA,
|
||||
MatDialogActions,
|
||||
MatDialogClose,
|
||||
MatDialogContent,
|
||||
MatDialogRef,
|
||||
MatDialogTitle
|
||||
} from "@angular/material/dialog";
|
||||
import {NgForOf, NgIf} from "@angular/common";
|
||||
import {MatFormField, MatHint} from "@angular/material/form-field";
|
||||
import {MatError, MatInput, MatLabel} from "@angular/material/input";
|
||||
import {MatButton} from "@angular/material/button";
|
||||
import {Employee} from "../Employee";
|
||||
import EmployeeApiService from "../../services/employee-api.service";
|
||||
import QualificationService from "../../services/qualification.service";
|
||||
import {Qualification} from "../../qualification/Qualification";
|
||||
import {MatOption, MatSelect} from "@angular/material/select";
|
||||
import {debounceTime} from "rxjs";
|
||||
MatDialogTitle,
|
||||
} from '@angular/material/dialog';
|
||||
import { NgForOf, NgIf } from '@angular/common';
|
||||
import { MatFormField, MatHint } from '@angular/material/form-field';
|
||||
import { MatError, MatInput, MatLabel } from '@angular/material/input';
|
||||
import { MatButton } from '@angular/material/button';
|
||||
import { Employee } from '../Employee';
|
||||
import EmployeeApiService from '../../services/employee-api.service';
|
||||
import QualificationService from '../../services/qualification.service';
|
||||
import { Qualification } from '../../qualification/Qualification';
|
||||
import { MatOption, MatSelect } from '@angular/material/select';
|
||||
import { debounceTime } from 'rxjs';
|
||||
|
||||
@Component({
|
||||
selector: 'app-edit',
|
||||
@ -40,7 +46,7 @@ import {debounceTime} from "rxjs";
|
||||
],
|
||||
templateUrl: './edit.component.html',
|
||||
standalone: true,
|
||||
styleUrl: './edit.component.css'
|
||||
styleUrl: './edit.component.css',
|
||||
})
|
||||
export class EditComponent implements OnInit {
|
||||
employeeForm!: FormGroup;
|
||||
@ -50,17 +56,17 @@ export class EditComponent implements OnInit {
|
||||
dialogRef: MatDialogRef<EditComponent> = inject(MatDialogRef);
|
||||
employee: Employee = inject(MAT_DIALOG_DATA);
|
||||
qualifications: Qualification[] = [];
|
||||
errorMsgs: { [key: string]: string } = {
|
||||
errorMsgs: Record<string, string> = {
|
||||
firstName: 'First name is required',
|
||||
lastName: 'Last name is required',
|
||||
street: 'Street is required',
|
||||
postcode: 'Postcode must be 5 characters long',
|
||||
city: 'City is required',
|
||||
phone: 'Phone is required',
|
||||
qualifications: 'Qualifications are required'
|
||||
}
|
||||
qualifications: 'Qualifications are required',
|
||||
};
|
||||
|
||||
errors: { [key: string]: string } = {}
|
||||
errors: Record<string, string> = {};
|
||||
|
||||
ngOnInit(): void {
|
||||
this.loadQualifications();
|
||||
@ -68,10 +74,13 @@ export class EditComponent implements OnInit {
|
||||
firstName: [this.employee.firstName, Validators.required],
|
||||
lastName: [this.employee.lastName, Validators.required],
|
||||
street: [this.employee.street, Validators.required],
|
||||
postcode: [this.employee.postcode, [Validators.required, this.validatePostcode]],
|
||||
postcode: [
|
||||
this.employee.postcode,
|
||||
[Validators.required, this.validatePostcode],
|
||||
],
|
||||
city: [this.employee.city, Validators.required],
|
||||
phone: [this.employee.phone, Validators.required],
|
||||
qualifications: [this.employee.skillSet?.map(skill => skill.id) ?? []]
|
||||
qualifications: [this.employee.skillSet?.map((skill) => skill.id) ?? []],
|
||||
});
|
||||
|
||||
Object.keys(this.employeeForm.controls).forEach((controlName: string) => {
|
||||
@ -83,9 +92,9 @@ export class EditComponent implements OnInit {
|
||||
}
|
||||
|
||||
loadQualifications() {
|
||||
this.qualificationService.getAll().subscribe(
|
||||
qualifications => this.qualifications = qualifications
|
||||
);
|
||||
this.qualificationService
|
||||
.getAll()
|
||||
.subscribe((qualifications) => (this.qualifications = qualifications));
|
||||
}
|
||||
|
||||
submit() {
|
||||
@ -102,10 +111,12 @@ export class EditComponent implements OnInit {
|
||||
const formValue = this.employeeForm.value;
|
||||
const employeeData = {
|
||||
...formValue,
|
||||
skillSet: formValue.qualifications
|
||||
skillSet: formValue.qualifications,
|
||||
};
|
||||
|
||||
this.employeeService.update(employeeData as Employee, this.employee.id).subscribe();
|
||||
this.employeeService
|
||||
.update(employeeData as Employee, this.employee.id)
|
||||
.subscribe();
|
||||
this.dialogRef.close(true);
|
||||
}
|
||||
|
||||
@ -118,7 +129,7 @@ export class EditComponent implements OnInit {
|
||||
validatePostcode(control: AbstractControl) {
|
||||
const postcode = control.value as number;
|
||||
if (postcode.toString().length !== 5) {
|
||||
return {invalidPostcode: true};
|
||||
return { invalidPostcode: true };
|
||||
}
|
||||
|
||||
return null;
|
||||
|
Reference in New Issue
Block a user