mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-06-30 18:15:11 +00:00
[ADF-4068] StartTaskComponent - fix name and description empty space … (#4351)
* [ADF-4068] StartTaskComponent - fix name and description empty space validation * [ADF-4068] StartTakComponent - add unit test
This commit is contained in:
parent
71dca95749
commit
0aaa6bea16
@ -134,7 +134,8 @@
|
|||||||
"ERROR": {
|
"ERROR": {
|
||||||
"REQUIRED": "Field required",
|
"REQUIRED": "Field required",
|
||||||
"DATE": "Date format DD/MM/YYYY",
|
"DATE": "Date format DD/MM/YYYY",
|
||||||
"MAXIMUM_LENGTH": "Length exceeded, {{characters}} characters max."
|
"MAXIMUM_LENGTH": "Length exceeded, {{characters}} characters max.",
|
||||||
|
"MESSAGE": "Enter a different value"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -7,11 +7,11 @@
|
|||||||
<div class="adf-task-name">
|
<div class="adf-task-name">
|
||||||
<mat-form-field fxFlex>
|
<mat-form-field fxFlex>
|
||||||
<mat-label>{{'ADF_TASK_LIST.START_TASK.FORM.LABEL.NAME' | translate}}</mat-label>
|
<mat-label>{{'ADF_TASK_LIST.START_TASK.FORM.LABEL.NAME' | translate}}</mat-label>
|
||||||
<input
|
<input
|
||||||
matInput
|
matInput
|
||||||
id="name_id"
|
id="name_id"
|
||||||
formControlName="name">
|
formControlName="name">
|
||||||
<mat-error *ngIf="nameController.hasError('required')">
|
<mat-error *ngIf="nameController.hasError('required') || nameController.hasError('whitespace')">
|
||||||
{{ 'ADF_TASK_LIST.START_TASK.FORM.ERROR.REQUIRED' | translate }}
|
{{ 'ADF_TASK_LIST.START_TASK.FORM.ERROR.REQUIRED' | translate }}
|
||||||
</mat-error>
|
</mat-error>
|
||||||
<mat-error *ngIf="nameController.hasError('maxlength')">
|
<mat-error *ngIf="nameController.hasError('maxlength')">
|
||||||
@ -28,21 +28,24 @@
|
|||||||
id="description_id"
|
id="description_id"
|
||||||
formControlName="description">
|
formControlName="description">
|
||||||
</textarea>
|
</textarea>
|
||||||
|
<mat-error *ngIf="descriptionController.hasError('whitespace')">
|
||||||
|
{{ 'ADF_TASK_LIST.START_TASK.FORM.ERROR.MESSAGE' | translate }}
|
||||||
|
</mat-error>
|
||||||
</mat-form-field>
|
</mat-form-field>
|
||||||
</div>
|
</div>
|
||||||
<div class="input-row" fxLayout="row" fxLayout.lt-md="column" fxLayoutGap="20px" fxLayoutGap.lt-md="0px">
|
<div class="input-row" fxLayout="row" fxLayout.lt-md="column" fxLayoutGap="20px" fxLayoutGap.lt-md="0px">
|
||||||
<mat-form-field fxFlex>
|
<mat-form-field fxFlex>
|
||||||
<input
|
<input
|
||||||
matInput
|
matInput
|
||||||
(keyup)="onDateChanged($event.srcElement.value)"
|
(keyup)="onDateChanged($event.srcElement.value)"
|
||||||
(dateInput)="onDateChanged($event.value)"
|
(dateInput)="onDateChanged($event.value)"
|
||||||
[matDatepicker]="taskDatePicker"
|
[matDatepicker]="taskDatePicker"
|
||||||
placeholder="{{'ADF_TASK_LIST.START_TASK.FORM.LABEL.DATE'|translate}}"
|
placeholder="{{'ADF_TASK_LIST.START_TASK.FORM.LABEL.DATE'|translate}}"
|
||||||
id="date_id">
|
id="date_id">
|
||||||
<mat-datepicker-toggle
|
<mat-datepicker-toggle
|
||||||
matSuffix
|
matSuffix
|
||||||
[for]="taskDatePicker"></mat-datepicker-toggle>
|
[for]="taskDatePicker"></mat-datepicker-toggle>
|
||||||
<mat-datepicker
|
<mat-datepicker
|
||||||
#taskDatePicker
|
#taskDatePicker
|
||||||
[touchUi]="true">
|
[touchUi]="true">
|
||||||
</mat-datepicker>
|
</mat-datepicker>
|
||||||
@ -54,9 +57,9 @@
|
|||||||
</div>
|
</div>
|
||||||
</mat-form-field>
|
</mat-form-field>
|
||||||
<div fxFlex>
|
<div fxFlex>
|
||||||
<people-widget
|
<people-widget
|
||||||
(peopleSelected)="getAssigneeId($event)"
|
(peopleSelected)="getAssigneeId($event)"
|
||||||
[field]="field"
|
[field]="field"
|
||||||
class="adf-people-widget-content"></people-widget>
|
class="adf-people-widget-content"></people-widget>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -404,4 +404,15 @@ describe('StartTaskComponent', () => {
|
|||||||
fixture.detectChanges();
|
fixture.detectChanges();
|
||||||
expect(logSpy).toHaveBeenCalled();
|
expect(logSpy).toHaveBeenCalled();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('should emit error when description have only white spaces', () => {
|
||||||
|
fixture.detectChanges();
|
||||||
|
let description = component.taskForm.controls['description'];
|
||||||
|
description.setValue(' ');
|
||||||
|
fixture.detectChanges();
|
||||||
|
expect(description.valid).toBeFalsy();
|
||||||
|
description.setValue('');
|
||||||
|
fixture.detectChanges();
|
||||||
|
expect(description.valid).toBeTruthy();
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
@ -102,14 +102,22 @@ export class StartTaskComponent implements OnInit {
|
|||||||
|
|
||||||
buildForm() {
|
buildForm() {
|
||||||
this.taskForm = this.formBuilder.group({
|
this.taskForm = this.formBuilder.group({
|
||||||
name: new FormControl(this.taskDetailsModel.name, [Validators.required, Validators.maxLength(this.maxTaskNameLength)]),
|
name: new FormControl(this.taskDetailsModel.name, [Validators.required, Validators.maxLength(this.maxTaskNameLength), this.whitespaceValidator]),
|
||||||
description: new FormControl(''),
|
description: new FormControl('', [this.whitespaceValidator]),
|
||||||
formKey: new FormControl('')
|
formKey: new FormControl('')
|
||||||
});
|
});
|
||||||
|
|
||||||
this.taskForm.valueChanges.subscribe((taskFormValues) => this.setTaskDetails(taskFormValues));
|
this.taskForm.valueChanges.subscribe((taskFormValues) => this.setTaskDetails(taskFormValues));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public whitespaceValidator(control: FormControl) {
|
||||||
|
if (control.value) {
|
||||||
|
const isWhitespace = (control.value || '').trim().length === 0;
|
||||||
|
const isValid = control.value.length === 0 || !isWhitespace;
|
||||||
|
return isValid ? null : { 'whitespace': true };
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
setTaskDetails(form) {
|
setTaskDetails(form) {
|
||||||
this.taskDetailsModel.name = form.name;
|
this.taskDetailsModel.name = form.name;
|
||||||
this.taskDetailsModel.description = form.description;
|
this.taskDetailsModel.description = form.description;
|
||||||
|
Loading…
x
Reference in New Issue
Block a user