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

toggle menu & featured menu (TODO: edit child menu item)

This commit is contained in:
Alex Martzios 2022-07-18 14:51:08 +03:00
parent 0f80797035
commit 019429e021
3 changed files with 50 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -38,10 +38,10 @@
<div *ngIf="showLoading" class="uk-position-center">
<loading></loading>
</div>
<div *ngIf="!showLoading">
<div #elements transition-group>
<div *ngIf="!showLoading" class="uk-grid" uk-grid>
<div #elements transition-group class="uk-width-3-4@m">
<div *ngFor="let item of displayMenuItems; let i = index;" transition-group-item>
<div class="uk-width-1-2@m uk-margin-bottom uk-padding-small menu-item">
<div class="uk-width-2-3@m uk-margin-bottom uk-padding-small menu-item">
<div class="uk-flex uk-flex-middle uk-flex-between">
<div>
{{item.title}}
@ -101,7 +101,7 @@
</div>
<div *ngIf="item.items && item.items.length" #subElements transition-group>
<div *ngFor="let subItem of item.items; let j = index" transition-group-item>
<div class="uk-margin-medium-left uk-width-1-2@m uk-margin-bottom uk-padding-small menu-item">
<div class="uk-margin-medium-left uk-width-2-3@m uk-margin-bottom uk-padding-small menu-item">
<div class="uk-flex uk-flex-middle uk-flex-between">
<div>
{{subItem.title}}
@ -159,6 +159,21 @@
</div>
</div>
</div>
<div class="uk-width-1-4@m">
<h6>Menu settings</h6>
<div class="uk-margin-small-bottom">
<label (click)="toggleMenu(true, selectedMenuType == 'normalMenu'? false : true )">
<input class="uk-radio" type="radio" name="menu" [checked]="(selectedMenuType == 'normalMenu' && showNormalMenu) || (selectedMenuType == 'customMenu' && showFeaturedMenu)">
<span class="uk-margin-small-left">Show menu</span>
</label>
</div>
<div>
<label (click)="toggleMenu(false, selectedMenuType == 'normalMenu'? false : true )">
<input class="uk-radio" type="radio" name="menu" [checked]="(selectedMenuType == 'normalMenu' && !showNormalMenu) || (selectedMenuType == 'customMenu' && !showFeaturedMenu)">
<span class="uk-margin-small-left">Hide menu</span>
</label>
</div>
</div>
<div *ngIf="displayMenuItems && displayMenuItems.length == 0"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
<div>No menu items found</div>
@ -174,7 +189,7 @@
placeholder="Name"></div>
<!-- Selecting parent of menu item -->
<div input *ngIf="selectedMenuType == 'normalMenu' && isPortalAdministrator" [formInput]="menuItemForm.get('parentItemId')" type="select"
placeholder="Parent" [options]="parentOptions" [tooltip]="false"></div>
placeholder="Parent" [options]="parentOptions" [tooltip]="false" [disabled]="menuItemForm.get('_id').value"></div>
<!-- Selecting type of menu item -->
<div input [formInput]="menuItemForm.get('type')" type="select" placeholder="Type"
[options]="getTypeOptions(menuItemForm.get('isFeatured').value, menuItemForm.get('parentItemId').value)" [tooltip]="false"></div>

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

@ -54,6 +54,9 @@ export class MenuComponent implements OnInit {
public selectedMenuItem: string;
public selectedMenuItemParent: string;
public isChild: boolean = false;
public showNormalMenu: boolean = false;
public showFeaturedMenu: boolean = false;
public communities: Portal[] = [];
public portal: string;
@ -145,6 +148,8 @@ export class MenuComponent implements OnInit {
data => {
this.featuredMenuItems = data.featuredMenuItems;
this.normalMenuItems = data.menuItems;
this.showFeaturedMenu = data.isFeaturedMenuEnabled;
this.showNormalMenu = data.isMenuEnabled;
this.getPages();
this.getParentOptions();
this.showLoading = false;
@ -297,9 +302,10 @@ export class MenuComponent implements OnInit {
this.destroyTypeSubscription();
this.showLoading = true;
this.menuItemForm.value.target = this.menuItemForm.value['type'] == "internal" ? "_self" : "_blank";
console.log(this.menuItemForm.value);
if(!this.menuItemForm.value._id) {
this.subscriptions.push(
this._helpContentService.saveMenuItem(<MenuItem>this.menuItemForm.value, this.portal).subscribe(
this._helpContentService.saveMenuItem(<MenuItemExtended>this.menuItemForm.getRawValue(), this.portal).subscribe(
menuItem => {
this.menuItemSavedSuccessfully(menuItem, true);
NotificationHandler.rise('Menu item <b>' + menuItem.title + '</b> has been <b>successfully created</b>');
@ -310,7 +316,7 @@ export class MenuComponent implements OnInit {
)
} else {
this.subscriptions.push(
this._helpContentService.updateMenuItem(<MenuItem>this.menuItemForm.value, this.portal).subscribe(
this._helpContentService.updateMenuItem(<MenuItemExtended>this.menuItemForm.getRawValue(), this.portal).subscribe(
menuItem => {
this.menuItemSavedSuccessfully(menuItem, false);
NotificationHandler.rise('Menu item <b>' + menuItem.title + '</b> has been <b>successfully updated</b>');
@ -325,7 +331,6 @@ export class MenuComponent implements OnInit {
public menuItemSavedSuccessfully(menuItem: MenuItem, isNew: boolean) {
if(isNew) {
if(menuItem['parentItemId']) {
console.log('creating child');
let i = this.normalMenuItems.findIndex(_ => _._id == menuItem['parentItemId']);
this.normalMenuItems[i].items.push(menuItem);
} else {
@ -338,6 +343,7 @@ export class MenuComponent implements OnInit {
}
} else {
if(menuItem['parentItemId']) {
// TODO: update
} else {
if(menuItem.isFeatured) {
this.featuredMenuItems[this.index] = menuItem;
@ -396,4 +402,19 @@ export class MenuComponent implements OnInit {
});
}
}
public toggleMenu(status: boolean, isFeatured: boolean) {
this.subscriptions.push(
this._helpContentService.toggleMenu(status, isFeatured, this.portal).subscribe(() => {
if(isFeatured) {
this.showFeaturedMenu = status;
} else {
this.showNormalMenu = status;
}
this._clearCacheService.clearCache("Menu toggled");
}, error => {
this.handleError("System error toggling menu", error);
})
);
}
}

6
services/help-content.service.ts
View File

@ -346,6 +346,12 @@ export class HelpContentService {
.pipe(catchError(this.handleError));
}
toggleMenu(status: boolean, isFeatured: boolean, portalPid: string) {
return this.http.post<Menu>(properties.adminToolsAPIURL + properties.adminToolsPortalType + "/" + portalPid + "/menu/toggle?status=" + status + "&featured=" + isFeatured, {}, CustomOptions.getAuthOptionsWithBody())
.pipe(catchError(this.handleError));
}
// unused
getCommunities( helpContentUrl:string) {
return this.http.get<Array<Portal>>(helpContentUrl + properties.adminToolsPortalType)