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

add featured menu item functionality - admin

This commit is contained in:
Alex Martzios 2022-03-02 12:26:28 +02:00
parent 514cd0dd12
commit a2a34d3958
3 changed files with 22 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -39,7 +39,7 @@
</ul>
</div>
</div>
<div
<div *ngIf="!activeRootMenu.isFeatured"
class="uk-width-1-1 uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid uk-margin-remove-top"
uk-grid>
<div #searchInputComponent search-input [control]="filterForm.controls.keyword" [showSearch]="false"
@ -106,9 +106,13 @@
</div>
</li>
</ul>
<div *ngIf="childrenMenuItems.length == 0"
<div *ngIf="childrenMenuItems.length == 0 && !activeRootMenu.isFeatured"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
<div>No menu items found</div>
</div>
<div *ngIf="activeRootMenu.isFeatured"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
<div>Featured menu items can't have any sub menu items</div>
</div>
</div>
</div>
@ -118,8 +122,14 @@
<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 class="uk-flex" *ngIf="activeRootMenu && !activeRootMenu.items.length">
<div class="uk-text-bold uk-form-label uk-margin-small-right">Featured</div>
<mat-slide-toggle [formControl]="menuItemForm.get('isFeatured')"
uk-tooltip="title:<div class='uk-padding-small uk-width-large'><div class='uk-text-bold '>Enable this to show your custom menu item in the community-specific navigation bar.</div><div class=' uk-margin-top'>If disabled, your custom menu item will appear in the default navigation bar.</div><div class=' uk-margin-top'>*Note that featured menu items can't have any children menu items(as a dropdown).</div></div>">
</mat-slide-toggle>
</div>
<div dashboard-input [formInput]="menuItemForm.get('type')" type="select" label="Type" placeholder="Choose a type"
[options]="getTypeOptions()" [tooltip]="false"></div>
[options]="getTypeOptions(menuItemForm.get('isFeatured').value)" [tooltip]="false"></div>
<!-- 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>

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

@ -132,13 +132,17 @@ export class MenuComponent implements OnInit {
);
}
getTypeOptions() {
getTypeOptions(isFeatured: boolean = false) {
if(this.isChild) {
return this.typeOptions;
} else {
if(isFeatured) {
return this.typeOptions;
} else {
return this.typeOptions.concat(this.rootOnlyTypeOptions);
}
}
}
getActiveRootItem(id: string): MenuItem {
return this.rootMenuItems.find(element => element['_id'] == id);
@ -247,6 +251,7 @@ export class MenuComponent implements OnInit {
route: this._fb.control(""),
url: this._fb.control(""),
isEnabled: this._fb.control(""),
isFeatured: this._fb.control(false),
parentItemId: this._fb.control(isChild ? this.activeRootMenuId : null)
});
this.isChild = isChild;
@ -261,6 +266,7 @@ export class MenuComponent implements OnInit {
type: this._fb.control(menuItem['type'],Validators.required),
route: this._fb.control(menuItem.route, (menuItem['type'] == "internal") ? [Validators.required] : []),
url: this._fb.control(menuItem.url, (menuItem['type'] == "external") ? [Validators.required, StringUtils.urlValidator()] : []),
isFeatured: this._fb.control(menuItem.isFeatured),
parentItemId: this._fb.control(menuItem['parentItemId'])
});
this.isChild = isChild;

1
sharedComponents/menu.ts
View File

@ -15,6 +15,7 @@ export class MenuItem {
icon: string;
open: boolean;
customClass: string = null;
isFeatured: boolean;
constructor(id: string, title: string, url: string, route: string, needsAuthorization: boolean, entitiesRequired: string[], routeRequired: string[], params, icon=null, fragment = null, customClass = null, routeActive = null) {
this._id = id;