add error handling for menu items and pages, remove tooltip for small options
This commit is contained in:
parent
b5330f3bf6
commit
73491221f0
|
@ -104,7 +104,7 @@
|
||||||
[okDisabled]="menuItemForm && (menuItemForm.invalid || !menuItemForm.dirty)">
|
[okDisabled]="menuItemForm && (menuItemForm.invalid || !menuItemForm.dirty)">
|
||||||
<form *ngIf="menuItemForm" [formGroup]="menuItemForm" class="uk grid uk-child-width-1-1" uk-grid>
|
<form *ngIf="menuItemForm" [formGroup]="menuItemForm" class="uk grid uk-child-width-1-1" uk-grid>
|
||||||
<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()" [tooltip]="false"></div>
|
||||||
<!-- Workflow for EXTERNAL -->
|
<!-- Workflow for EXTERNAL -->
|
||||||
<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>
|
<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 -->
|
||||||
|
|
|
@ -123,11 +123,11 @@ export class MenuComponent implements OnInit {
|
||||||
data => {
|
data => {
|
||||||
this.rootMenuItems = data;
|
this.rootMenuItems = data;
|
||||||
if(data && data.length > 0) {
|
if(data && data.length > 0) {
|
||||||
// this.activeRootMenuId = data[0]['_id'];
|
|
||||||
this.changeActiveRootMenuItem(data[0]);
|
this.changeActiveRootMenuItem(data[0]);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
err => console.error("Server error fetching menu items: ", err)
|
// err => console.error("Server error fetching menu items: ", err)
|
||||||
|
error => this.handleError("Server error fetching menu items", error)
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -163,7 +163,7 @@ export class MenuComponent implements OnInit {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
err => console.error("Server error fetching pages: ", err)
|
error => this.handleError("Server error fetching pages", error)
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -202,7 +202,8 @@ export class MenuComponent implements OnInit {
|
||||||
});
|
});
|
||||||
this.newPageWindowOpen = !this.newPageWindowOpen;
|
this.newPageWindowOpen = !this.newPageWindowOpen;
|
||||||
this.menuItemForm.get('route').setValue(page.route);
|
this.menuItemForm.get('route').setValue(page.route);
|
||||||
}
|
},
|
||||||
|
error => this.handleError('System error creating page', error)
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -211,7 +212,6 @@ export class MenuComponent implements OnInit {
|
||||||
this.destroyTypeSubscription();
|
this.destroyTypeSubscription();
|
||||||
this.typeSub = this.menuItemForm.get('type').valueChanges.subscribe(value => {
|
this.typeSub = this.menuItemForm.get('type').valueChanges.subscribe(value => {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
// console.log(value);
|
|
||||||
this.menuItemForm.controls['route'].clearValidators();
|
this.menuItemForm.controls['route'].clearValidators();
|
||||||
this.menuItemForm.controls['url'].clearValidators();
|
this.menuItemForm.controls['url'].clearValidators();
|
||||||
if(value === "internal") {
|
if(value === "internal") {
|
||||||
|
@ -286,7 +286,8 @@ export class MenuComponent implements OnInit {
|
||||||
pos: 'bottom-right'
|
pos: 'bottom-right'
|
||||||
});
|
});
|
||||||
this.showLoading = false;
|
this.showLoading = false;
|
||||||
}
|
},
|
||||||
|
error => this.handleError("Server error deleting menu item", error)
|
||||||
)
|
)
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
@ -325,7 +326,8 @@ export class MenuComponent implements OnInit {
|
||||||
timeout: 6000,
|
timeout: 6000,
|
||||||
pos: 'bottom-right'
|
pos: 'bottom-right'
|
||||||
});
|
});
|
||||||
}
|
},
|
||||||
|
error => this.handleError("System error creating menu item", error)
|
||||||
)
|
)
|
||||||
)
|
)
|
||||||
} else {
|
} else {
|
||||||
|
@ -338,7 +340,8 @@ export class MenuComponent implements OnInit {
|
||||||
timeout: 6000,
|
timeout: 6000,
|
||||||
pos: 'bottom-right'
|
pos: 'bottom-right'
|
||||||
});
|
});
|
||||||
}
|
},
|
||||||
|
error => this.handleError("System error updating menu item", error)
|
||||||
)
|
)
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
@ -362,8 +365,18 @@ export class MenuComponent implements OnInit {
|
||||||
this.showLoading = false;
|
this.showLoading = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
handleError(message: string, error) {
|
||||||
|
UIkit.notification(message, {
|
||||||
|
status: 'danger',
|
||||||
|
timeout: 6000,
|
||||||
|
pos: 'bottom-right'
|
||||||
|
});
|
||||||
|
console.log('Server responded: ' + error);
|
||||||
|
this.showLoading = false;
|
||||||
|
}
|
||||||
|
|
||||||
public applyFilters() {
|
public applyFilters() {
|
||||||
this.childrenMenuItems = this.activeRootMenu.items.filter(item => item.title.toLowerCase().includes(this.searchText));
|
this.childrenMenuItems = this.activeRootMenu.items.filter(item => item.title.toLowerCase().includes(this.searchText) || (item.url||'').toLowerCase().includes(this.searchText) || (item.route||'').toLowerCase().includes(this.searchText));
|
||||||
}
|
}
|
||||||
|
|
||||||
public onSearchClose() {
|
public onSearchClose() {
|
||||||
|
|
|
@ -77,7 +77,7 @@ export interface Option {
|
||||||
(openedChange)="stopPropagation()" [formControl]="formControl"
|
(openedChange)="stopPropagation()" [formControl]="formControl"
|
||||||
[disableOptionCentering]="true">
|
[disableOptionCentering]="true">
|
||||||
<mat-option *ngIf="placeholder" class="uk-hidden" [value]="''">{{placeholder}}</mat-option>
|
<mat-option *ngIf="placeholder" class="uk-hidden" [value]="''">{{placeholder}}</mat-option>
|
||||||
<mat-option *ngFor="let option of options" [value]="option.value" [attr.uk-tooltip]="option.label">
|
<mat-option *ngFor="let option of options" [value]="option.value" [attr.uk-tooltip]="(tooltip) ? option.label : null">
|
||||||
{{option.label}}
|
{{option.label}}
|
||||||
</mat-option>
|
</mat-option>
|
||||||
</mat-select>
|
</mat-select>
|
||||||
|
@ -211,6 +211,7 @@ export class InputComponent implements OnInit, OnDestroy, OnChanges {
|
||||||
public filteredOptions: Observable<Option[]>;
|
public filteredOptions: Observable<Option[]>;
|
||||||
public searchControl: FormControl;
|
public searchControl: FormControl;
|
||||||
private subscriptions: any[] = [];
|
private subscriptions: any[] = [];
|
||||||
|
@Input() tooltip: boolean = true;
|
||||||
@ViewChild('select') select: MatSelect;
|
@ViewChild('select') select: MatSelect;
|
||||||
@ViewChild('searchInput') searchInput: ElementRef;
|
@ViewChild('searchInput') searchInput: ElementRef;
|
||||||
focused: boolean = false;
|
focused: boolean = false;
|
||||||
|
|
Loading…
Reference in New Issue