Skip to content

Commit 12d6919

Browse files
author
Musa Demir
committed
visual changes
1 parent 9d9a8f6 commit 12d6919

File tree

6 files changed

+627
-605
lines changed

6 files changed

+627
-605
lines changed

‎angular/src/app/layout/sidebar-menu.component.ts‎

Lines changed: 168 additions & 168 deletions
Original file line numberDiff line numberDiff line change
@@ -1,186 +1,186 @@
1-
import { Component, Injector, OnInit } from '@angular/core';
2-
import { AppComponentBase } from '@shared/app-component-base';
1+
import {Component, Injector, OnInit} from '@angular/core';
2+
import {AppComponentBase} from '@shared/app-component-base';
33
import {
4-
Router,
5-
RouterEvent,
6-
NavigationEnd,
7-
PRIMARY_OUTLET
4+
Router,
5+
RouterEvent,
6+
NavigationEnd,
7+
PRIMARY_OUTLET
88
} from '@angular/router';
9-
import { BehaviorSubject } from 'rxjs';
10-
import { filter } from 'rxjs/operators';
11-
import { MenuItem } from '@shared/layout/menu-item';
9+
import {BehaviorSubject} from 'rxjs';
10+
import {filter} from 'rxjs/operators';
11+
import {MenuItem} from '@shared/layout/menu-item';
1212

1313
@Component({
14-
selector: 'sidebar-menu',
15-
templateUrl: './sidebar-menu.component.html'
14+
selector: 'sidebar-menu',
15+
templateUrl: './sidebar-menu.component.html'
1616
})
1717
export class SidebarMenuComponent extends AppComponentBase implements OnInit {
18-
menuItems: MenuItem[];
19-
menuItemsMap: { [key: number]: MenuItem } = {};
20-
activatedMenuItems: MenuItem[] = [];
21-
routerEvents: BehaviorSubject<RouterEvent> = new BehaviorSubject(undefined);
22-
homeRoute = '/app/home';
18+
menuItems: MenuItem[];
19+
menuItemsMap: { [key: number]: MenuItem } = {};
20+
activatedMenuItems: MenuItem[] = [];
21+
routerEvents: BehaviorSubject<RouterEvent> = new BehaviorSubject(undefined);
22+
homeRoute = '/app/home';
2323

24-
constructor(injector: Injector, private router: Router) {
25-
super(injector);
26-
this.router.events.subscribe(this.routerEvents);
27-
}
28-
29-
ngOnInit(): void {
30-
this.menuItems = this.getMenuItems();
31-
this.patchMenuItems(this.menuItems);
32-
this.routerEvents
33-
.pipe(filter((event) => event instanceof NavigationEnd))
34-
.subscribe((event) => {
35-
const currentUrl = event.url !== '/' ? event.url : this.homeRoute;
36-
const primaryUrlSegmentGroup = this.router.parseUrl(currentUrl).root
37-
.children[PRIMARY_OUTLET];
38-
if (primaryUrlSegmentGroup) {
39-
this.activateMenuItems('/' + primaryUrlSegmentGroup.toString());
40-
}
41-
});
42-
}
24+
constructor(injector: Injector, private router: Router) {
25+
super(injector);
26+
this.router.events.subscribe(this.routerEvents);
27+
}
4328

44-
getMenuItems(): MenuItem[] {
45-
return [
46-
new MenuItem(this.l('HomePage'), '/app/home', 'fas fa-home'),
47-
new MenuItem(
48-
this.l('Tenants'),
49-
'/app/tenants',
50-
'fas fa-building',
51-
'Pages.Tenants'
52-
),
53-
new MenuItem(
54-
this.l('Users'),
55-
'/app/users',
56-
'fas fa-users',
57-
'Pages.Users'
58-
),
59-
new MenuItem(
60-
this.l('Roles'),
61-
'/app/roles',
62-
'fas fa-theater-masks',
63-
'Pages.Roles'
64-
),
65-
new MenuItem(this.l('About'), '/app/about', 'fas fa-info-circle'),
66-
new MenuItem(this.l('MultiLevelMenu'), '', 'fas fa-circle', '', [
67-
new MenuItem('ASP.NET Boilerplate', '', 'fas fa-dot-circle', '', [
68-
new MenuItem(
69-
'Home',
70-
'https://aspnetboilerplate.com?ref=abptmpl',
71-
'far fa-circle'
72-
),
73-
new MenuItem(
74-
'Templates',
75-
'https://aspnetboilerplate.com/Templates?ref=abptmpl',
76-
'far fa-circle'
77-
),
78-
new MenuItem(
79-
'Samples',
80-
'https://aspnetboilerplate.com/Samples?ref=abptmpl',
81-
'far fa-circle'
82-
),
83-
new MenuItem(
84-
'Documents',
85-
'https://aspnetboilerplate.com/Pages/Documents?ref=abptmpl',
86-
'far fa-circle'
87-
),
88-
]),
89-
new MenuItem('ASP.NET Zero', '', 'fas fa-dot-circle', '', [
90-
new MenuItem(
91-
'Home',
92-
'https://aspnetzero.com?ref=abptmpl',
93-
'far fa-circle'
94-
),
95-
new MenuItem(
96-
'Features',
97-
'https://aspnetzero.com/Features?ref=abptmpl',
98-
'far fa-circle'
99-
),
100-
new MenuItem(
101-
'Pricing',
102-
'https://aspnetzero.com/Pricing?ref=abptmpl#pricing',
103-
'far fa-circle'
104-
),
105-
new MenuItem(
106-
'Faq',
107-
'https://aspnetzero.com/Faq?ref=abptmpl',
108-
'far fa-circle'
109-
),
110-
new MenuItem(
111-
'Documents',
112-
'https://aspnetzero.com/Documents?ref=abptmpl',
113-
'far fa-circle'
114-
)
115-
])
116-
])
117-
];
118-
}
29+
ngOnInit(): void {
30+
this.menuItems = this.getMenuItems();
31+
this.patchMenuItems(this.menuItems);
32+
this.routerEvents
33+
.pipe(filter((event) => event instanceof NavigationEnd))
34+
.subscribe((event) => {
35+
const currentUrl = event.url !== '/' ? event.url : this.homeRoute;
36+
const primaryUrlSegmentGroup = this.router.parseUrl(currentUrl).root
37+
.children[PRIMARY_OUTLET];
38+
if (primaryUrlSegmentGroup) {
39+
this.activateMenuItems('/' + primaryUrlSegmentGroup.toString());
40+
}
41+
});
42+
}
11943

120-
patchMenuItems(items: MenuItem[], parentId?: number): void {
121-
items.forEach((item: MenuItem, index: number) => {
122-
item.id = parentId ? Number(parentId + '' + (index + 1)) : index + 1;
123-
if (parentId) {
124-
item.parentId = parentId;
125-
}
126-
if (parentId || item.children) {
127-
this.menuItemsMap[item.id] = item;
128-
}
129-
if (item.children) {
130-
this.patchMenuItems(item.children, item.id);
131-
}
132-
});
133-
}
44+
getMenuItems(): MenuItem[] {
45+
return [
46+
new MenuItem(this.l('About'), '/app/about', 'fas fa-info-circle'),
47+
new MenuItem(this.l('HomePage'), '/app/home', 'fas fa-home'),
48+
new MenuItem(
49+
this.l('Roles'),
50+
'/app/roles',
51+
'fas fa-theater-masks',
52+
'Pages.Roles'
53+
),
54+
new MenuItem(
55+
this.l('Tenants'),
56+
'/app/tenants',
57+
'fas fa-building',
58+
'Pages.Tenants'
59+
),
60+
new MenuItem(
61+
this.l('Users'),
62+
'/app/users',
63+
'fas fa-users',
64+
'Pages.Users'
65+
),
66+
new MenuItem(this.l('MultiLevelMenu'), '', 'fas fa-circle', '', [
67+
new MenuItem('ASP.NET Boilerplate', '', 'fas fa-dot-circle', '', [
68+
new MenuItem(
69+
'Home',
70+
'https://aspnetboilerplate.com?ref=abptmpl',
71+
'far fa-circle'
72+
),
73+
new MenuItem(
74+
'Templates',
75+
'https://aspnetboilerplate.com/Templates?ref=abptmpl',
76+
'far fa-circle'
77+
),
78+
new MenuItem(
79+
'Samples',
80+
'https://aspnetboilerplate.com/Samples?ref=abptmpl',
81+
'far fa-circle'
82+
),
83+
new MenuItem(
84+
'Documents',
85+
'https://aspnetboilerplate.com/Pages/Documents?ref=abptmpl',
86+
'far fa-circle'
87+
),
88+
]),
89+
new MenuItem('ASP.NET Zero', '', 'fas fa-dot-circle', '', [
90+
new MenuItem(
91+
'Home',
92+
'https://aspnetzero.com?ref=abptmpl',
93+
'far fa-circle'
94+
),
95+
new MenuItem(
96+
'Features',
97+
'https://aspnetzero.com/Features?ref=abptmpl',
98+
'far fa-circle'
99+
),
100+
new MenuItem(
101+
'Pricing',
102+
'https://aspnetzero.com/Pricing?ref=abptmpl#pricing',
103+
'far fa-circle'
104+
),
105+
new MenuItem(
106+
'Faq',
107+
'https://aspnetzero.com/Faq?ref=abptmpl',
108+
'far fa-circle'
109+
),
110+
new MenuItem(
111+
'Documents',
112+
'https://aspnetzero.com/Documents?ref=abptmpl',
113+
'far fa-circle'
114+
)
115+
])
116+
])
117+
];
118+
}
134119

135-
activateMenuItems(url: string): void {
136-
this.deactivateMenuItems(this.menuItems);
137-
this.activatedMenuItems = [];
138-
const foundedItems = this.findMenuItemsByUrl(url, this.menuItems);
139-
foundedItems.forEach((item) => {
140-
this.activateMenuItem(item);
141-
});
142-
}
120+
patchMenuItems(items: MenuItem[], parentId?: number): void {
121+
items.forEach((item: MenuItem, index: number) => {
122+
item.id = parentId ? Number(parentId + '' + (index + 1)) : index + 1;
123+
if (parentId) {
124+
item.parentId = parentId;
125+
}
126+
if (parentId || item.children) {
127+
this.menuItemsMap[item.id] = item;
128+
}
129+
if (item.children) {
130+
this.patchMenuItems(item.children, item.id);
131+
}
132+
});
133+
}
143134

144-
deactivateMenuItems(items: MenuItem[]): void {
145-
items.forEach((item: MenuItem) => {
146-
item.isActive = false;
147-
item.isCollapsed = true;
148-
if (item.children) {
149-
this.deactivateMenuItems(item.children);
150-
}
151-
});
152-
}
135+
activateMenuItems(url: string): void {
136+
this.deactivateMenuItems(this.menuItems);
137+
this.activatedMenuItems = [];
138+
const foundedItems = this.findMenuItemsByUrl(url, this.menuItems);
139+
foundedItems.forEach((item) => {
140+
this.activateMenuItem(item);
141+
});
142+
}
153143

154-
findMenuItemsByUrl(
155-
url: string,
156-
items: MenuItem[],
157-
foundedItems: MenuItem[] = []
158-
): MenuItem[] {
159-
items.forEach((item: MenuItem) => {
160-
if (item.route === url) {
161-
foundedItems.push(item);
162-
} else if (item.children) {
163-
this.findMenuItemsByUrl(url, item.children, foundedItems);
164-
}
165-
});
166-
return foundedItems;
167-
}
144+
deactivateMenuItems(items: MenuItem[]): void {
145+
items.forEach((item: MenuItem) => {
146+
item.isActive = false;
147+
item.isCollapsed = true;
148+
if (item.children) {
149+
this.deactivateMenuItems(item.children);
150+
}
151+
});
152+
}
168153

169-
activateMenuItem(item: MenuItem): void {
170-
item.isActive = true;
171-
if (item.children) {
172-
item.isCollapsed = false;
154+
findMenuItemsByUrl(
155+
url: string,
156+
items: MenuItem[],
157+
foundedItems: MenuItem[] = []
158+
): MenuItem[] {
159+
items.forEach((item: MenuItem) => {
160+
if (item.route === url) {
161+
foundedItems.push(item);
162+
} else if (item.children) {
163+
this.findMenuItemsByUrl(url, item.children, foundedItems);
164+
}
165+
});
166+
return foundedItems;
173167
}
174-
this.activatedMenuItems.push(item);
175-
if (item.parentId) {
176-
this.activateMenuItem(this.menuItemsMap[item.parentId]);
168+
169+
activateMenuItem(item: MenuItem): void {
170+
item.isActive = true;
171+
if (item.children) {
172+
item.isCollapsed = false;
173+
}
174+
this.activatedMenuItems.push(item);
175+
if (item.parentId) {
176+
this.activateMenuItem(this.menuItemsMap[item.parentId]);
177+
}
177178
}
178-
}
179179

180-
isMenuItemVisible(item: MenuItem): boolean {
181-
if (!item.permissionName) {
182-
return true;
180+
isMenuItemVisible(item: MenuItem): boolean {
181+
if (!item.permissionName) {
182+
return true;
183+
}
184+
return this.permission.isGranted(item.permissionName);
183185
}
184-
return this.permission.isGranted(item.permissionName);
185-
}
186186
}

0 commit comments

Comments
 (0)