[Library & Monitor Dashboard | new-theme]: Sidebar & Navbar checks updated to use the same method | "activeMenuItem" in route data (optional) to set which menu item is active when url does not match | Bug fix in <my-tabs>.

1. layout.service.ts: Added "activeMenuItemSubject" to keep value of data['activeMenuItem'].
2. menu.ts: Removed "markAsActive" (not used) | Set RootMenuItem as deprecated (should use only MenuItem) | Added "isTheActiveMenuItem()" method to check if a MenuItem (root or not / sidebar or navbar) is active.
3. navigationBar.component.ts: Updated "isTheActiveMenu()" method to call MenuItem.isTheActiveMenu() | Removed method "isTheActiveMenuItem()".
4. navigationBar.component.html: Always call "isTheActiveMenu()" method.
5. sideBar.component.ts: Added "get currentRoute()" and updated method "isTheActiveMenuItem()".
6. tabs.component.ts: [Bug fix] Removed [class.uk-active] from <li> of tabs (since small-tabs are not currently used it is ok to remove this) - caused by version update of Uikit.
7. monitor-routing.module.ts: Set activeMenuItem: "dashboard" for any path under a stakeholder that has nothing or anything under a topic. | Set activeMenuItem: "search" in paths under search.
8. app-routing.module.ts: Set activeMenuItem: "manage" for paths under admin/:stakeholder.
9. app.component.ts: Updated menu in Admin Dashboard (all items visible and logo of monitor used) | Set value for MenuItem.routeActive when adding menu items of topics and users.
This commit is contained in:
Konstantina Galouni 2022-03-28 11:40:22 +03:00
parent 3d4335c89f
commit 75982b1ede
4 changed files with 71 additions and 49 deletions

View File

@ -42,7 +42,10 @@ const routes: Routes = [
{ {
path: 'admin/:stakeholder', path: 'admin/:stakeholder',
loadChildren: () => import('./admin-stakeholder/admin-stakeholder-routing.module').then(m => m.AdminStakeholderRoutingModule), loadChildren: () => import('./admin-stakeholder/admin-stakeholder-routing.module').then(m => m.AdminStakeholderRoutingModule),
canActivateChild: [AdminDashboardGuard] canActivateChild: [AdminDashboardGuard],
data: {
activeMenuItem: "manage"
}
}, },
{path: 'theme', loadChildren: () => import('./openaireLibrary/utils/theme/theme.module').then(m => m.ThemeModule)}, {path: 'theme', loadChildren: () => import('./openaireLibrary/utils/theme/theme.module').then(m => m.ThemeModule)},
{ {

View File

@ -241,7 +241,8 @@ export class AppComponent implements OnInit, OnDestroy {
if (this.isPublicOrIsMember(topic.visibility)) { if (this.isPublicOrIsMember(topic.visibility)) {
let topicItem: MenuItem = new MenuItem(topic.alias, topic.name, "", ( let topicItem: MenuItem = new MenuItem(topic.alias, topic.name, "", (
'/' + this.stakeholder.alias + '/' + topic.alias), '/' + this.stakeholder.alias + '/' + topic.alias),
null, [], [], {}); null, [], [], {}, null, null, null, (
'/' + this.stakeholder.alias + '/' + topic.alias));
topicItem.icon = topic.icon; topicItem.icon = topic.icon;
items.push(topicItem); items.push(topicItem);
} }
@ -273,26 +274,17 @@ export class AppComponent implements OnInit, OnDestroy {
this.userMenuItems.push(new MenuItem("", "User information", "", "/user-info", false, [], [], {})); this.userMenuItems.push(new MenuItem("", "User information", "", "/user-info", false, [], [], {}));
} }
if (this.stakeholder) { if (this.stakeholder) {
if (!this.hasAdminMenu && this.isFrontPage) {
this.menuHeader = {
route: "/" + this.stakeholder.alias,
url: null,
title: this.stakeholder.name,
logoUrl: 'assets/common-assets/logo-services/monitor/small-inverted.svg',
logoSmallUrl: "assets/common-assets/logo-services/monitor/small-inverted.svg",
position: 'center',
badge: true,
stickyAnimation: true,
menuPosition: "center"
};
this.menuItems.push({ this.menuItems.push({
rootItem: new MenuItem("dashboard", "Dashboard", rootItem: new MenuItem("dashboard", "Dashboard",
"", "/" + this.stakeholder.alias, false, [], null, {}), items: [] "", "/" + this.stakeholder.alias, false, [], null, {}
, null, null, null, null), items: []
}); });
if (this.isPublicOrIsMember(this.stakeholder.visibility)) { if (this.isPublicOrIsMember(this.stakeholder.visibility)) {
this.menuItems.push({ this.menuItems.push({
rootItem: new MenuItem("search", "Search", "", this.properties.searchLinkToResults, rootItem: new MenuItem("search", "Search", "", this.properties.searchLinkToResults,
false, [], null, {resultbestaccessright: '"' + encodeURIComponent("Open Access") + '"'}), false, [], null, {resultbestaccessright: '"' + encodeURIComponent("Open Access") + '"'},
null, null, null, null),
items: [] items: []
}); });
} }
@ -314,29 +306,43 @@ export class AppComponent implements OnInit, OnDestroy {
if (this.isManager(this.stakeholder)) { if (this.isManager(this.stakeholder)) {
this.menuItems.push({ this.menuItems.push({
rootItem: new MenuItem("manage", "Manage", rootItem: new MenuItem("manage", "Manage",
"", "/admin/" + this.stakeholder.alias, false, [], null, {}), items: [] "", "/admin/" + this.stakeholder.alias, false, [], null, {}
, null, null, null, null), items: []
}); });
} }
if (!this.hasAdminMenu && this.isFrontPage) {
this.menuHeader = {
route: "/" + this.stakeholder.alias,
url: null,
title: this.stakeholder.name,
logoUrl: 'assets/common-assets/logo-services/monitor/small-inverted.svg',
logoSmallUrl: "assets/common-assets/logo-services/monitor/small-inverted.svg",
position: 'center',
badge: true,
stickyAnimation: true,
menuPosition: "center"
};
} else { } else {
this.menuHeader = { this.menuHeader = {
route: "/admin/" + this.stakeholder.alias, route: "/" + this.stakeholder.alias,
url: null, url: null,
title: 'Admin - ' + this.stakeholder.name, title: this.stakeholder.name,
logoUrl: null, logoUrl: 'assets/common-assets/logo-services/monitor/small.svg',
logoSmallUrl: null, logoSmallUrl: "assets/common-assets/logo-services/monitor/small.svg",
position: 'center', position: 'center',
badge: false, badge: false,
stickyAnimation: true, stickyAnimation: true,
menuPosition: "center" menuPosition: "center"
}; };
this.menuItems.push({ // this.menuItems.push({
rootItem: new MenuItem("", "Dashboard", // rootItem: new MenuItem("", "Dashboard",
"", '/' + this.stakeholder.alias + '/', false, [], null, {}), items: [] // "", '/' + this.stakeholder.alias + '/', false, [], null, {}), items: []
}); // });
this.adminMenuItems.push(new MenuItem("general", "General", "", "/admin/" + this.stakeholder.alias, false, [], [], {}, "<i uk-icon=\"image\"></i>")); this.adminMenuItems.push(new MenuItem("general", "General", "", "/admin/" + this.stakeholder.alias, false, [], [], {}, "<i uk-icon=\"image\"></i>"));
this.adminMenuItems.push(new MenuItem("indicators", "Indicators", "", "/admin/" + this.stakeholder.alias + '/indicators', false, [], [], {}, "<i uk-icon=\"image\"></i>")); this.adminMenuItems.push(new MenuItem("indicators", "Indicators", "", "/admin/" + this.stakeholder.alias + '/indicators', false, [], [], {}, "<i uk-icon=\"image\"></i>"));
if (this.stakeholder.defaultId) { if (this.stakeholder.defaultId) {
this.adminMenuItems.push(new MenuItem("users", "Users", "", "/admin/" + this.stakeholder.alias + "/users", false, [], [], {}, "<i uk-icon=\"users\"></i>")); this.adminMenuItems.push(new MenuItem("users", "Users", "", "/admin/" + this.stakeholder.alias + "/users", false, [], [], {}, "<i uk-icon=\"users\"></i>", null, null, "/admin/" + this.stakeholder.alias+"/users"));
if (Session.isPortalAdministrator(this.user)) { if (Session.isPortalAdministrator(this.user)) {
this.adminMenuItems.push(new MenuItem("admin-tools", "Pages & Entities", "", "/admin/" + this.stakeholder.alias + "/admin-tools/pages", false, [], [], {}, null, null, null, "/admin/" + this.stakeholder.alias + "/admin-tools")); this.adminMenuItems.push(new MenuItem("admin-tools", "Pages & Entities", "", "/admin/" + this.stakeholder.alias + "/admin-tools/pages", false, [], [], {}, null, null, null, "/admin/" + this.stakeholder.alias + "/admin-tools"));
} }

View File

@ -10,7 +10,10 @@ import {MonitorComponent} from "./monitor.component";
{ {
path: ':stakeholder', path: ':stakeholder',
component: MonitorComponent, component: MonitorComponent,
canDeactivate: [PreviousRouteRecorder] canDeactivate: [PreviousRouteRecorder],
data: {
activeMenuItem: "dashboard"
}
}, },
{ {
path: ':stakeholder/develop', path: ':stakeholder/develop',
@ -36,23 +39,33 @@ import {MonitorComponent} from "./monitor.component";
canDeactivate: [PreviousRouteRecorder], canDeactivate: [PreviousRouteRecorder],
data: { data: {
hasSidebar: false, hasSidebar: false,
isDashboard: true isDashboard: true,
activeMenuItem: "search"
} }
}, },
{ {
path: ':stakeholder/:topic', path: ':stakeholder/:topic',
component: MonitorComponent, component: MonitorComponent,
canDeactivate: [PreviousRouteRecorder] canDeactivate: [PreviousRouteRecorder],
data: {
activeMenuItem: "dashboard"
}
}, },
{ {
path: ':stakeholder/:topic/:category', path: ':stakeholder/:topic/:category',
component: MonitorComponent, component: MonitorComponent,
canDeactivate: [PreviousRouteRecorder] canDeactivate: [PreviousRouteRecorder],
data: {
activeMenuItem: "dashboard"
}
}, },
{ {
path: ':stakeholder/:topic/:category/:subCategory', path: ':stakeholder/:topic/:category/:subCategory',
component: MonitorComponent, component: MonitorComponent,
canDeactivate: [PreviousRouteRecorder] canDeactivate: [PreviousRouteRecorder],
data: {
activeMenuItem: "dashboard"
}
} }
]) ])
] ]

@ -1 +1 @@
Subproject commit dc0544d0d8f54071cb7c9bffec36de19b0bccd68 Subproject commit 99ed7ea6ba683a3b9427a3cb03d6c3b896269bee