Skip to content

Commit 8f898e1

Browse files
hikalkanhikalkan
committed
Implemented sidebar menu.
1 parent 907a1ef commit 8f898e1

File tree

8 files changed

+122
-103
lines changed

8 files changed

+122
-103
lines changed

‎aspnet-core/src/AbpCompanyName.AbpProjectName.Web.Mvc/AbpCompanyName.AbpProjectName.Web.Mvc.csproj

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,11 @@
1414
<PropertyGroup Condition=" '$(TargetFramework)' == 'net461' ">
1515
<DefineConstants>FEATURE_SIGNALR</DefineConstants>
1616
</PropertyGroup>
17+
18+
<ItemGroup>
19+
<Content Include="wwwroot\images\user-img-background.jpg" />
20+
<Content Include="wwwroot\images\user.png" />
21+
</ItemGroup>
1722

1823
<ItemGroup>
1924
<None Include="app.config" />

‎aspnet-core/src/AbpCompanyName.AbpProjectName.Web.Mvc/Startup/AbpProjectNameNavigationProvider.cs

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -17,31 +17,31 @@ public override void SetNavigation(INavigationProviderContext context)
1717
PageNames.Home,
1818
L("HomePage"),
1919
url: "",
20-
icon: "fa fa-home",
20+
icon: "home",
2121
requiresAuthentication: true
2222
)
2323
).AddItem(
2424
new MenuItemDefinition(
2525
PageNames.Tenants,
2626
L("Tenants"),
2727
url: "Tenants",
28-
icon: "fa fa-globe",
28+
icon: "business",
2929
requiredPermissionName: PermissionNames.Pages_Tenants
3030
)
3131
).AddItem(
3232
new MenuItemDefinition(
3333
PageNames.Users,
3434
L("Users"),
3535
url: "Users",
36-
icon: "fa fa-users",
36+
icon: "people",
3737
requiredPermissionName: PermissionNames.Pages_Users
3838
)
3939
).AddItem(
4040
new MenuItemDefinition(
4141
PageNames.About,
4242
L("About"),
4343
url: "About",
44-
icon: "fa fa-info"
44+
icon: "info"
4545
)
4646
);
4747
}

‎aspnet-core/src/AbpCompanyName.AbpProjectName.Web.Mvc/Views/Shared/Components/SideBarNav/Default.cshtml

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
@using Abp.Collections.Extensions
2+
@using AbpCompanyName.AbpProjectName.Web.Views
3+
@using AbpCompanyName.AbpProjectName.Web.Views.Shared.Components.SideBarNav
4+
@model SideBarNavViewModel
5+
@{
6+
var calculateMenuUrl = new Func<string, string>((url) =>
7+
{
8+
if (string.IsNullOrEmpty(url))
9+
{
10+
return ApplicationPath;
11+
}
12+
13+
if (UrlChecker.IsRooted(url))
14+
{
15+
return url;
16+
}
17+
18+
return ApplicationPath + url;
19+
});
20+
}
21+
<div class="menu">
22+
<ul class="list">
23+
<li class="header">@L("MainNavigation")</li>
24+
@foreach (var menuItem in Model.MainMenu.Items)
25+
{
26+
<li class="@(Model.ActiveMenuItemName == menuItem.Name ? "active" : "")">
27+
@if (menuItem.Items.IsNullOrEmpty())
28+
{
29+
<a href="@calculateMenuUrl(menuItem.Url)">
30+
@if (!string.IsNullOrWhiteSpace(menuItem.Icon))
31+
{
32+
<i class="material-icons">@menuItem.Icon</i>
33+
}
34+
<span>@menuItem.DisplayName</span>
35+
</a>
36+
}
37+
else
38+
{
39+
<a href="" data-toggle="dropdown">
40+
@if (!string.IsNullOrWhiteSpace(menuItem.Icon))
41+
{
42+
<i class="@menuItem.Icon"></i>
43+
}
44+
@menuItem.DisplayName
45+
</a>
46+
<ul class="dropdown-menu">
47+
@foreach (var subMenuItem in menuItem.Items)
48+
{
49+
<li>
50+
<a href="@calculateMenuUrl(subMenuItem.Url)">
51+
@if (!string.IsNullOrWhiteSpace(subMenuItem.Icon))
52+
{
53+
<i class="@subMenuItem.Icon"></i>
54+
}
55+
@subMenuItem.DisplayName
56+
</a>
57+
</li>
58+
}
59+
</ul>
60+
}
61+
</li>
62+
}
63+
</ul>
64+
</div>

‎aspnet-core/src/AbpCompanyName.AbpProjectName.Web.Mvc/Views/Shared/Components/SideBarNav/SideBarNavViewComponent.cs

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
using System.Threading.Tasks;
2+
using Abp.Application.Navigation;
3+
using Abp.Runtime.Session;
4+
using Microsoft.AspNetCore.Mvc;
5+
6+
namespace AbpCompanyName.AbpProjectName.Web.Views.Shared.Components.SideBarNav
7+
{
8+
public class SideBarNavViewComponent : ViewComponent
9+
{
10+
private readonly IUserNavigationManager _userNavigationManager;
11+
private readonly IAbpSession _abpSession;
12+
13+
public SideBarNavViewComponent(
14+
IUserNavigationManager userNavigationManager,
15+
IAbpSession abpSession)
16+
{
17+
_userNavigationManager = userNavigationManager;
18+
_abpSession = abpSession;
19+
}
20+
21+
public async Task<IViewComponentResult> InvokeAsync(string activeMenu = "")
22+
{
23+
var model = new SideBarNavViewModel
24+
{
25+
MainMenu = await _userNavigationManager.GetMenuAsync("MainMenu", _abpSession.ToUserIdentifier()),
26+
ActiveMenuItemName = activeMenu
27+
};
28+
29+
return View(model);
30+
}
31+
}
32+
}

‎aspnet-core/src/AbpCompanyName.AbpProjectName.Web.Mvc/Views/Shared/Components/SideBarNav/SideBarNavViewModel.cs

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
using Abp.Application.Navigation;
2+
3+
namespace AbpCompanyName.AbpProjectName.Web.Views.Shared.Components.SideBarNav
4+
{
5+
public class SideBarNavViewModel
6+
{
7+
public UserMenu MainMenu { get; set; }
8+
9+
public string ActiveMenuItemName { get; set; }
10+
}
11+
}

‎aspnet-core/src/AbpCompanyName.AbpProjectName.Web.Mvc/Views/Shared/_Layout.cshtml

Lines changed: 6 additions & 99 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
@using Abp.Web.Security.AntiForgery
33
@using Abp.Configuration.Startup
44
@using AbpCompanyName.AbpProjectName.Web.Resources
5+
@using AbpCompanyName.AbpProjectName.Web.Views.Shared.Components.SideBarNav
56
@inject AbpCompanyName.AbpProjectName.Timing.AppTimes AppTimes
67
@inject IAbpAntiForgeryManager AbpAntiForgeryManager
78
@inject IMultiTenancyConfig MultiTenancyConfig
@@ -58,7 +59,7 @@
5859
</script>
5960

6061
</head>
61-
<body>
62+
<body class="theme-red">
6263

6364
<!-- Page Loader -->
6465
<div class="page-loader-wrapper">
@@ -213,84 +214,6 @@
213214
</ul>
214215
</li>
215216
<!-- #END# Notifications -->
216-
<!-- Tasks -->
217-
<li class="dropdown">
218-
<a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown" role="button">
219-
<i class="material-icons">flag</i>
220-
<span class="label-count">9</span>
221-
</a>
222-
<ul class="dropdown-menu">
223-
<li class="header">TASKS</li>
224-
<li class="body">
225-
<ul class="menu tasks">
226-
<li>
227-
<a href="javascript:void(0);">
228-
<h4>
229-
Footer display issue
230-
<small>32%</small>
231-
</h4>
232-
<div class="progress">
233-
<div class="progress-bar bg-pink" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100" style="width: 32%">
234-
</div>
235-
</div>
236-
</a>
237-
</li>
238-
<li>
239-
<a href="javascript:void(0);">
240-
<h4>
241-
Make new buttons
242-
<small>45%</small>
243-
</h4>
244-
<div class="progress">
245-
<div class="progress-bar bg-cyan" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100" style="width: 45%">
246-
</div>
247-
</div>
248-
</a>
249-
</li>
250-
<li>
251-
<a href="javascript:void(0);">
252-
<h4>
253-
Create new dashboard
254-
<small>54%</small>
255-
</h4>
256-
<div class="progress">
257-
<div class="progress-bar bg-teal" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100" style="width: 54%">
258-
</div>
259-
</div>
260-
</a>
261-
</li>
262-
<li>
263-
<a href="javascript:void(0);">
264-
<h4>
265-
Solve transition issue
266-
<small>65%</small>
267-
</h4>
268-
<div class="progress">
269-
<div class="progress-bar bg-orange" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100" style="width: 65%">
270-
</div>
271-
</div>
272-
</a>
273-
</li>
274-
<li>
275-
<a href="javascript:void(0);">
276-
<h4>
277-
Answer GitHub questions
278-
<small>92%</small>
279-
</h4>
280-
<div class="progress">
281-
<div class="progress-bar bg-purple" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100" style="width: 92%">
282-
</div>
283-
</div>
284-
</a>
285-
</li>
286-
</ul>
287-
</li>
288-
<li class="footer">
289-
<a href="javascript:void(0);">View All Tasks</a>
290-
</li>
291-
</ul>
292-
</li>
293-
<!-- #END# Tasks -->
294217
<li class="pull-right"><a href="javascript:void(0);" class="js-right-sidebar" data-close="true"><i class="material-icons">more_vert</i></a></li>
295218
</ul>
296219
</div>
@@ -303,7 +226,7 @@
303226
<!-- User Info -->
304227
<div class="user-info">
305228
<div class="image">
306-
<img src="../../images/user.png" width="48" height="48" alt="User" />
229+
<img src="~/images/user.png" width="48" height="48" alt="User" />
307230
</div>
308231
<div class="info-container">
309232
<div class="name" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">John Doe</div>
@@ -323,25 +246,9 @@
323246
</div>
324247
</div>
325248
<!-- #User Info -->
326-
<!-- Menu -->
327-
<div class="menu">
328-
<ul class="list">
329-
<li class="header">MAIN NAVIGATION</li>
330-
<li class="active">
331-
<a href="@Url.Action("Index","Users")">
332-
<i class="material-icons">home</i>
333-
<span>Users</span>
334-
</a>
335-
</li>
336-
<li>
337-
<a href="../../pages/typography.html">
338-
<i class="material-icons">text_fields</i>
339-
<span>Typography</span>
340-
</a>
341-
</li>
342-
</ul>
343-
</div>
344-
<!-- #Menu -->
249+
250+
@await Component.InvokeAsync(typeof(SideBarNavViewComponent), new { activeMenu = ViewBag.CurrentPageName })
251+
345252
<!-- Footer -->
346253
<div class="legal">
347254
<div class="copyright">

‎aspnet-core/src/AbpCompanyName.AbpProjectName.Web.Mvc/wwwroot/images/user-img-background.jpg

26.2 KB
Loading

‎aspnet-core/src/AbpCompanyName.AbpProjectName.Web.Mvc/wwwroot/images/user.png

1.54 KB
Loading

0 commit comments

Comments
 (0)