improve form validation

This commit is contained in:
Peter Maquiran
2021-07-14 09:46:03 +01:00
parent d9f1ef7bba
commit 6176112001
5 changed files with 27 additions and 49 deletions
@@ -42,23 +42,13 @@
</div>
<div *ngIf="Form && validateFrom" >
<div *ngIf="Form.get('Location').invalid " class="input-errror-message">
<div *ngIf="Form.get('Location').errors?.required">
Campo obrigatório.
</div>
<div *ngIf="Form.get('Location').errors?.minlength">
O campo deve ter pelo menos 4 caracteres.
</div>
</div>
</div>
<div class="container-div">
<div class="ion-item-class-2 d-flex">
<div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon>
</div>
<div class="ion-input-class flex-grow-1 justify-center align-center material-inputs ">
<div class="ion-input-class flex-grow-1 justify-center align-center material-inputs " [class.input-error]="Form?.get('CalendarName')?.invalid && validateFrom ">
<mat-form-field appearance="none" class="width-100" color="ion-color-secondary" placeholder="Selecione agenda">
<mat-select [(value)]="postEvent.CalendarName" >
@@ -117,7 +107,7 @@
<mat-form-field class="date-hour-picker">
<input matInput [ngxMatDatetimePicker]="picker1"
placeholder="Choose a date"
[formControl]="dateControlStart"
[(ngModel)]="postEvent.StartDate"
[min]="minDate"
[disabled]="disabled"
>
@@ -144,12 +134,12 @@
<!--
[className]="Form?.get('Subject')?.invalid ? 'input-error ion-input-class flex-grow-1' : 'ion-input-class ion-input-class flex-grow-1' "
-->
<div (click)="openFim()" class="ion-input-class flex-grow-1 justify-center align-center materia-top">
<div (click)="openFim()" class="ion-input-class flex-grow-1 justify-center align-center materia-top" [class.input-error]="Form?.get('dateEnd')?.invalid && validateFrom ">
<mat-form-field class="date-hour-picker">
<input matInput [ngxMatDatetimePicker]="fim"
placeholder="Choose a date"
[formControl]="dateControlEnd"
[(ngModel)]="postEvent.EndDate"
[min]="endMinDate"
[disabled]="disabled"
>
@@ -169,7 +159,6 @@
</div>
<!-- <div class="container-div width-100">
<div class="ion-item-class-2">
<div class="ion-icon-class">
@@ -187,15 +176,14 @@
</div>
</div> -->
<div class="container-div width-100">
<div class="ion-item-class-2 d-flex">
<div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-refresh.svg"></ion-icon>
</div>
<div class="ion-input-class flex-grow-1">
{{ this.postEvent.EventRecurrence.Type }}
<div class="ion-input-class flex-grow-1" [class.input-error]="Form?.get('dateOccurrence')?.invalid && validateFrom ">
<mat-form-field appearance="none" floatLabel="never" class="width-100" value="false" interface="action-sheet" required>
<mat-select placeholder="Selecione repetição*"
@@ -254,13 +242,13 @@
</div>
</div>
<div *ngIf="Form && validateFrom" class="container-div width-100">
<!-- <div *ngIf="Form && validateFrom" class="container-div width-100">
<div *ngIf="Form.get('participantes').invalid " class="input-errror-message">
<div *ngIf="Form.get('participantes').errors?.required">
Adicionar participante.
</div>
</div>
</div>
</div> -->
<div class="container-div width-100">
<div class="ion-item-class-2 d-flex">
@@ -116,13 +116,7 @@ export class NewEventPage implements OnInit {
showLoader = false
get dateStart () {
return this.dateControlStart.value
}
get dateEnd () {
return this.dateControlEnd.value
}
get dateOccurrence () {
return this.dateControlOccurrence.value
@@ -251,22 +245,19 @@ export class NewEventPage implements OnInit {
Categories: new FormControl(this.postEvent.Categories[0], [
Validators.required
]),
dateStart: new FormControl(this.dateStart, [
dateStart: new FormControl(this.postEvent.StartDate, [
Validators.required
]),
dateEnd: new FormControl(this.dateEnd, [
dateEnd: new FormControl(this.postEvent.EndDate, [
Validators.required
]),
dateOccurrence: new FormControl(this.dateOccurrence, [
Validators.required
]),
IsRecurring: new FormControl(this.postEvent.IsRecurring, [
dateOccurrence: new FormControl(this.postEvent.EventRecurrence.Type.toString() == '-1' ? ['ok']: this.dateOccurrence, [
Validators.required
]),
participantes: new FormControl(this.taskParticipants, [
Validators.required
]),
Date: new FormControl(this.dateControlStart.toLocaleString() < this.dateControlEnd.toLocaleString() ? 'ok': null,[
Date: new FormControl(this.postEvent.StartDate.toLocaleString() < this.postEvent.EndDate.toLocaleString() ? 'ok': null,[
Validators.required
]),
@@ -345,8 +336,6 @@ export class NewEventPage implements OnInit {
getDatepickerData() {
if (this.postEvent) {
this.postEvent.StartDate = this.dateStart
this.postEvent.EndDate = this.dateEnd
this.postEvent.EventRecurrence.LastOccurrence = this.dateOccurrence
}
}
@@ -364,7 +353,10 @@ export class NewEventPage implements OnInit {
this.injectValidation()
this.runValidation()
if(this.Form.invalid) return false
if(this.Form.invalid) {
console.log('not passed')
return false
}
this.getDatepickerData()
@@ -437,8 +429,9 @@ export class NewEventPage implements OnInit {
loader.remove()
this.showLoader = false
this.toastService.badRequest('Evento não criado')
});
loader.remove();
});
}
else if(this.loggeduser.Profile == 'PR') {
console.log('PR - Aqui');