* Initial plan * Add comprehensive CI/CD workflows and tooling - Add PR validation workflow with lint, format, type check, test, and build steps - Improve Docker build workflow with caching, security scanning, and manual trigger - Add CodeQL security analysis workflow - Add Dependabot configuration for automated dependency updates - Configure ESLint with TypeScript support - Add npm scripts for linting and formatting - Format code with Prettier - Fix linting issues in source code Co-authored-by: THoguet <61246905+THoguet@users.noreply.github.com> * Update README and fix build configuration - Add CI/CD documentation to README - Document code quality tools and scripts - Disable font optimization in production build to avoid network dependency - Add build cache configuration for GitHub Actions Co-authored-by: THoguet <61246905+THoguet@users.noreply.github.com> --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: THoguet <61246905+THoguet@users.noreply.github.com>
69 lines
1.9 KiB
TypeScript
69 lines
1.9 KiB
TypeScript
import { Component, OnInit, OnDestroy, effect } from '@angular/core';
|
|
import { MatFormField, MatLabel } from '@angular/material/form-field';
|
|
import { MatInputModule } from '@angular/material/input';
|
|
import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
|
|
import { UserInputService } from '../../services/user-input-service';
|
|
import { VacationsNumber } from '../../services/calendar-service';
|
|
import { debounceTime, takeUntil, Subject } from 'rxjs';
|
|
import { CalendarSettings } from '../calendar-settings/calendar-settings';
|
|
|
|
@Component({
|
|
selector: 'app-user-input',
|
|
imports: [
|
|
MatFormField,
|
|
MatLabel,
|
|
MatInputModule,
|
|
ReactiveFormsModule,
|
|
CalendarSettings,
|
|
CalendarSettings,
|
|
],
|
|
templateUrl: './user-input.html',
|
|
styleUrl: './user-input.scss',
|
|
})
|
|
export class UserInput implements OnInit, OnDestroy {
|
|
constructor(private userInputService: UserInputService) {
|
|
// Watch for signal changes and update form
|
|
effect(() => {
|
|
const vacationData = this.userInputService.vacationNumberSignal();
|
|
this.userInputForm.patchValue(
|
|
{
|
|
CP: vacationData.cp,
|
|
RTT: vacationData.rtt,
|
|
Others: vacationData.other,
|
|
},
|
|
{ emitEvent: false },
|
|
);
|
|
});
|
|
}
|
|
|
|
private destroy$ = new Subject<void>();
|
|
|
|
userInputForm: FormGroup = new FormGroup({
|
|
CP: new FormControl<number | null>(null),
|
|
RTT: new FormControl<number | null>(null),
|
|
Others: new FormControl<number | null>(null),
|
|
});
|
|
|
|
ngOnInit() {
|
|
this.userInputForm.valueChanges
|
|
.pipe(debounceTime(1500), takeUntil(this.destroy$))
|
|
.subscribe(() => this.submitForm());
|
|
}
|
|
|
|
ngOnDestroy() {
|
|
this.destroy$.next();
|
|
this.destroy$.complete();
|
|
}
|
|
|
|
private submitForm() {
|
|
if (this.userInputForm.valid) {
|
|
const vacationData: VacationsNumber = {
|
|
cp: this.userInputForm.get('CP')?.value || 0,
|
|
rtt: this.userInputForm.get('RTT')?.value || 0,
|
|
other: this.userInputForm.get('Others')?.value || 0,
|
|
};
|
|
this.userInputService.vacationNumberSignal.set(vacationData);
|
|
}
|
|
}
|
|
}
|