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

Work on dynamic menus with actual data - dev only

This commit is contained in:
Alex Martzios 2021-12-23 09:22:07 +02:00
parent 5c215af73e
commit 660c5955f7
3 changed files with 62 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -131,7 +131,26 @@
<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>
<div class="uk-text-center uk-margin-top">Or <a>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>
<button (click)="newPageWindow()" class="uk-close uk-icon uk-float-right" uk-close></button>
<h6 class="uk-text-bold uk-margin-remove-top">Create New Page</h6>
</div>
<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="Route" placeholder="Write a route"></div>
<div>
<div class="uk-text-bold uk-form-label uk-margin-small-bottom">Enable/disable</div>
<mat-slide-toggle
uk-tooltip="title:<div class='uk-padding-small uk-width-large'><div class='uk-text-bold '>Disable a page to hide it from community dashboard portal.</div><div class=' uk-margin-top'>If the page is disabled, a message 'Can't find that page' will appear in case the url of that page is loaded. If the disabled page belongs to the menu, the link will be removed from menu, too.</div></div>">
</mat-slide-toggle>
</div>
<div class="uk-flex uk-flex-right">
<button class="uk-button uk-button-default">Create Page</button>
</div>
</form>
</div>
</div>
</form>
</modal-alert>

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

@ -13,8 +13,6 @@ import {Title} from "@angular/platform-browser";
import {AlertModal} from '../../utils/modal/alert';
import {CheckMenuItem, MenuItem} from '../../sharedComponents/menu';
import {SearchInputComponent} from '../../sharedComponents/search-input/search-input.component';
import {Option} from '../../sharedComponents/input/input.component';
@Component({
selector: 'menuSelector',
@ -42,6 +40,7 @@ export class MenuComponent implements OnInit {
public properties: EnvProperties = properties;
public newPageWindowOpen: boolean = false;
public showLoading = true;
public isPortalAdministrator = null;
public filterForm: FormGroup;
@ -75,6 +74,8 @@ export class MenuComponent implements OnInit {
this.isPortalAdministrator = Session.isPortalAdministrator(user) && !this.portal;
});
this.showLoading = false;
this.getMenuItems();
this.getPages();
}
ngOnDestroy(): void {
@ -87,6 +88,34 @@ export class MenuComponent implements OnInit {
});
}
getMenuItems() {
this.subscriptions.push(
this._helpContentService.getMenuItems(this.portal).subscribe(
data => {
console.log(data);
},
err => console.error("Server error fetching menu items: ", err)
)
);
}
getPages() {
this.subscriptions.push(
this._helpContentService.getAllPages(this.properties.adminToolsAPIURL,this.portal).subscribe(
data => {
let pages = data;
this.allPages = [];
for(let i = 0; i < pages.length; i++) {
if(pages[i] && pages[i].name && pages[i].route) {
this.allPages.push({value: pages[i].route, label: pages[i].name});
}
}
},
err => console.error("Server error fetching pages: ", err)
)
);
}
public newRootMenu() {
this.menuItemForm = this._fb.group({
id: this._fb.control(""),
@ -161,6 +190,10 @@ export class MenuComponent implements OnInit {
console.log('Delete menu item');
}
public newPageWindow() {
this.newPageWindowOpen = !this.newPageWindowOpen;
}
private menuItemsModalOpen(title: string, yesBtn: string) {
this.editModal.cancelButton = true;
this.editModal.okButton = true;

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

@ -14,6 +14,7 @@ import {StatisticsDisplay, StatisticsSummary} from '../connect/statistics/statis
import {CustomOptions} from './servicesUtils/customOptions.class';
import {catchError, map} from "rxjs/operators";
import {properties} from "../../../environments/environment";
import { MenuItem } from '../sharedComponents/menu';
@Injectable()
export class HelpContentService {
@ -264,7 +265,7 @@ export class HelpContentService {
// parameters += "&with_positions="+with_positions;
// }
// }
return this.http.get<Array<Page>>(helpContentUrl + 'page' + (pid?"pid="+pid:""))
return this.http.get<Array<Page>>(helpContentUrl + 'page?' + (pid?"pid="+pid:""))
//.map(res => <Array<Page>> res.json())
.pipe(catchError(this.handleError));
}
@ -314,6 +315,11 @@ export class HelpContentService {
.pipe(catchError(this.handleError));
}
getMenuItems(portalPid: string) {
return this.http.get<Array<MenuItem>>(properties.adminToolsAPIURL + properties.adminToolsPortalType + "/" + portalPid + "/menu/root/full")
.pipe(catchError(this.handleError));
}
// unused
getCommunities( helpContentUrl:string) {
return this.http.get<Array<Portal>>(helpContentUrl + properties.adminToolsPortalType)