EndlessHallucination/IISA_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

WIP

Browse Source
This commit is contained in:
Vasa
2025-08-19 21:07:41 +03:00
parent 5326e545a8
commit 61a1ba59cd
20 changed files with 185 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/app/registration/registration.component.html
View File

@@ -13,7 +13,7 @@
<img [src]="previewUrl" alt="Preview" />
</div>
</div> -->
<app-image-input></app-image-input>
<!-- <app-image-input></app-image-input> -->
<mat-form-field appearance="outline" class="full-width">
<mat-label>Full Name</mat-label>
@@ -37,13 +37,13 @@
<mat-form-field appearance="outline" class="full-width">
<mat-label>Phone Number</mat-label>
<input matInput formControlName="phone" placeholder="+972-XXXXXXX"/>
@if (form.get('phone')?.hasError('required')) {
<input matInput formControlName="phoneNumber" placeholder="+972-XXXXXXX"/>
@if (form.get('phoneNumber')?.hasError('required')) {
<mat-error>
Phone number is required
</mat-error>
}
@if (form.get('phone')?.hasError('pattern')){
@if (form.get('phoneNumber')?.hasError('pattern')){
<mat-error>
Invalid phone number
</mat-error>
@@ -62,8 +62,8 @@
<mat-form-field appearance="outline" class="full-width">
<mat-label>City / Region</mat-label>
<input matInput formControlName="city" />
@if (form.get('city')?.hasError('required')) {
<input matInput formControlName="cityOrRegion" />
@if (form.get('cityOrRegion')?.hasError('required')) {
<mat-error>
Field is required
</mat-error>
@@ -82,13 +82,13 @@
<mat-form-field appearance="outline" class="full-width">
<mat-label>Why I am the perfect candidate</mat-label>
<textarea matInput rows="4" formControlName="reason"></textarea>
@if (form.get('reason')?.hasError('required')) {
<textarea matInput rows="4" formControlName="justification"></textarea>
@if (form.get('justification')?.hasError('required')) {
<mat-error>
Field is required
</mat-error>
}
@if (form.get('reason')?.hasError('maxLength')) {
@if (form.get('justification')?.hasError('maxLength')) {
<mat-error>
Maximum length is 300 characters
</mat-error>

55
src/app/registration/registration.component.ts
View File

@@ -7,6 +7,7 @@ import { MatButtonModule } from '@angular/material/button';
import { MatCardModule } from '@angular/material/card';
import { MatFormFieldModule } from '@angular/material/form-field';
import { ImageInputComponent } from "../image-input/image-input.component";
import { CandidateDataService } from '../candidate-data.service';
const israeliPhoneRegex = /^(?:(?:(\+?972|\(\+?972\)|\+?\(972\))(?:\s|\.|-)?([1-9]\d?))|(0[23489]{1})|(0[57]{1}[0-9]))(?:\s|\.|-)?([^0\D]{1}\d{2}(?:\s|\.|-)?\d{4})$/;
@Component({
@@ -19,24 +20,24 @@ const israeliPhoneRegex = /^(?:(?:(\+?972|\(\+?972\)|\+?\(972\))(?:\s|\.|-)?([1-
MatCardModule,
MatFormFieldModule,
ImageInputComponent
],
],
templateUrl: './registration.component.html',
styleUrls: ['./registration.component.scss'],
})
export class RegistrationComponent implements OnInit {
dataService = inject(CandidateDataService);
fb = inject(FormBuilder);
previewUrl: string | ArrayBuffer | null = null;
form = this.fb.group({
fullName: ['', [Validators.required, Validators.minLength(3)]],
email: ['', [Validators.required, Validators.email]],
phone: ['', [Validators.required, Validators.pattern(israeliPhoneRegex)]],
phoneNumber: ['', [Validators.required, Validators.pattern(israeliPhoneRegex)]],
age: [0, [Validators.required, Validators.min(18), Validators.max(70)]],
city: ['', Validators.required],
cityOrRegion: ['', Validators.required],
hobbies: ['', [Validators.maxLength(300)]],
reason: ['', [Validators.required, Validators.maxLength(300)]],
profileImage: this.fb.control<string | null>(null, Validators.required),
justification: ['', [Validators.required, Validators.maxLength(300)]],
// profileImage: this.fb.control<string | null>(null, Validators.required),
});
ngOnInit(): void {
@@ -53,31 +54,29 @@ export class RegistrationComponent implements OnInit {
}
}
onFileSelected(event: any) {
const file = event.target.files[0];
if (file) {
const reader = new FileReader();
reader.onload = () => {
if (typeof reader.result === 'string') {
this.previewUrl = reader.result;
this.form.patchValue({ profileImage: reader.result });
}
};
reader.readAsDataURL(file);
}
}
// onFileSelected(event: any) {
// const file = event.target.files[0];
// if (file) {
// const reader = new FileReader();
// reader.onload = () => {
// if (typeof reader.result === 'string') {
// this.previewUrl = reader.result;
// this.form.patchValue({ profileImage: reader.result });
// }
// };
// reader.readAsDataURL(file);
// }
// }
onSubmit() {
if (this.form.valid) {
localStorage.setItem(
'registration',
JSON.stringify({
data: this.form.value,
timestamp: Date.now(),
})
);
alert('✅ Application saved! You can re-edit within 3 days.');
if (!this.form.valid) {
alert("Invalid Form");
return;
}
console.log(JSON.stringify(this.form.value));
this.dataService.submitCandidateForm(this.form.value).subscribe(() => {
alert('✅ Application saved! You can re-edit within 3 days.')
});
}
onCheckErrors() {