MaDgIK
/
openaire-library
13
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

add required validators for url and route fields - dev only

This commit is contained in:
Alex Martzios 2022-01-11 13:15:37 +02:00
parent 97fc6f033a
commit b5330f3bf6
4 changed files with 14 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
dashboard/menu/menu.component.html
View File

@ -106,11 +106,11 @@
<div dashboard-input [formInput]="menuItemForm.get('title')" type="text" label="Name" placeholder="Write a name"></div> <div dashboard-input [formInput]="menuItemForm.get('title')" type="text" label="Name" placeholder="Write a name"></div>
<div dashboard-input [formInput]="menuItemForm.get('type')" type="select" label="Type" placeholder="Choose a type" [options]="getTypeOptions()"></div> <div dashboard-input [formInput]="menuItemForm.get('type')" type="select" label="Type" placeholder="Choose a type" [options]="getTypeOptions()"></div>
<!-- Workflow for EXTERNAL --> <!-- Workflow for EXTERNAL -->
<div dashboard-input *ngIf="menuItemForm.get('type').value === 'external'" [formInput]="menuItemForm.get('url')" type="URL" label="URL *" placeholder="Write a URL"></div> <div dashboard-input *ngIf="menuItemForm.get('type').value === 'external'" [formInput]="menuItemForm.get('url')" [validators]="menuItemForm.get('url').validator" type="URL" label="URL" placeholder="Write a URL"></div>
<!-- Workflow for INTERNAL --> <!-- Workflow for INTERNAL -->
<div *ngIf="menuItemForm.get('type').value === 'internal'"> <div *ngIf="menuItemForm.get('type').value === 'internal'">
<div class="uk-text-center">Select one of the pages</div> <div class="uk-text-center">Select one of the pages</div>
<div dashboard-input [formInput]="menuItemForm.get('route')" type="autocomplete" label="Page" placeholder="Search all pages" [options]="allPages" [showOptionsOnEmpty]="false"> <div dashboard-input [formInput]="menuItemForm.get('route')" [validators]="menuItemForm.get('route').validator" type="autocomplete" label="Page" placeholder="Search all pages" [options]="allPages" [showOptionsOnEmpty]="false">
</div> </div>
<div class="uk-text-center uk-margin-top">Or <a (click)="newPageWindow()">create a new one</a></div> <div class="uk-text-center uk-margin-top">Or <a (click)="newPageWindow()">create a new one</a></div>
<div *ngIf="newPageWindowOpen" class="uk-card uk-card-default uk-card-body uk-margin-top"> <div *ngIf="newPageWindowOpen" class="uk-card uk-card-default uk-card-body uk-margin-top">

12
dashboard/menu/menu.component.ts
View File

@ -212,13 +212,15 @@ export class MenuComponent implements OnInit {
this.typeSub = this.menuItemForm.get('type').valueChanges.subscribe(value => { this.typeSub = this.menuItemForm.get('type').valueChanges.subscribe(value => {
setTimeout(() => { setTimeout(() => {
// console.log(value); // console.log(value);
this.menuItemForm.controls['route'].clearValidators();
this.menuItemForm.controls['url'].clearValidators();
if(value === "internal") { if(value === "internal") {
this.menuItemForm.controls['route'].setValidators([Validators.required]); this.menuItemForm.controls['route'].setValidators([Validators.required]);
this.menuItemForm.controls['route'].updateValueAndValidity();
} else if(value === "external") { } else if(value === "external") {
this.menuItemForm.controls['url'].setValidators([Validators.required]); this.menuItemForm.controls['url'].setValidators([Validators.required, StringUtils.urlValidator()]);
this.menuItemForm.controls['url'].updateValueAndValidity();
} }
this.menuItemForm.controls['route'].updateValueAndValidity();
this.menuItemForm.controls['url'].updateValueAndValidity();
}, 0); }, 0);
}); });
} }
@ -243,8 +245,8 @@ export class MenuComponent implements OnInit {
_id: this._fb.control(menuItem['_id']), _id: this._fb.control(menuItem['_id']),
title: this._fb.control(menuItem.title,Validators.required), title: this._fb.control(menuItem.title,Validators.required),
type: this._fb.control(menuItem['type'],Validators.required), type: this._fb.control(menuItem['type'],Validators.required),
route: this._fb.control(menuItem.route), route: this._fb.control(menuItem.route, (menuItem['type'] == "internal") ? [Validators.required] : []),
url: this._fb.control(menuItem.url), url: this._fb.control(menuItem.url, (menuItem['type'] == "external") ? [Validators.required, StringUtils.urlValidator()] : []),
parentItemId: this._fb.control(menuItem['parentItemId']) parentItemId: this._fb.control(menuItem['parentItemId'])
}); });
this.isChild = isChild; this.isChild = isChild;

4
dashboard/page/pages.component.html
View File

@ -136,7 +136,7 @@
type="text" placeholder="Write a name" type="text" placeholder="Write a name"
label="Page Name"> label="Page Name">
</div> </div>
<ng-template [ngIf]="isPortalAdministrator"> <ng-container *ngIf="isPortalAdministrator">
<div dashboard-input [formInput]="pageForm.get('type')" <div dashboard-input [formInput]="pageForm.get('type')"
type="select" placeholder="Choose a page Type" type="select" placeholder="Choose a page Type"
label="Type" [options]="typeOptions"> label="Type" [options]="typeOptions">
@ -171,7 +171,7 @@
By disabling a position, all contents in this position will be deleted. By disabling a position, all contents in this position will be deleted.
</label> </label>
</div> </div>
</ng-template> </ng-container>
</form> </form>
</modal-alert> </modal-alert>

5
sharedComponents/input/input.component.ts
View File

@ -200,7 +200,7 @@ export class InputComponent implements OnInit, OnDestroy, OnChanges {
@Input() panelWidth: number = 300; @Input() panelWidth: number = 300;
@Input() panelClass: string = null; @Input() panelClass: string = null;
@Input() showOptionsOnEmpty: boolean = true; @Input() showOptionsOnEmpty: boolean = true;
@Input() validators: ValidatorFn[]; @Input() validators: ValidatorFn[] | ValidatorFn;
@Output() focusEmitter: EventEmitter<boolean> = new EventEmitter<boolean>(); @Output() focusEmitter: EventEmitter<boolean> = new EventEmitter<boolean>();
/** LogoUrl information */ /** LogoUrl information */
public secure: boolean = true; public secure: boolean = true;
@ -229,7 +229,7 @@ export class InputComponent implements OnInit, OnDestroy, OnChanges {
} }
ngOnChanges(changes: SimpleChanges) { ngOnChanges(changes: SimpleChanges) {
if (changes.formControl) { if (changes.formControl || changes.validators) {
this.reset(); this.reset();
} }
} }
@ -346,6 +346,7 @@ export class InputComponent implements OnInit, OnDestroy, OnChanges {
resetSearch(event: any) { resetSearch(event: any) {
event.stopPropagation(); event.stopPropagation();
this.searchControl.setValue(''); this.searchControl.setValue('');
this.formControl.markAsDirty(); // TODO check - should it also become dirty on addition?
this.formControl.setValue(null); this.formControl.setValue(null);
} }
} }