Menu component refactoring

Login component refactoring
This commit is contained in:
Pavel Vesely 2020-04-26 20:24:00 +02:00
parent 7097caad69
commit 8dd2677b8f
6 changed files with 175 additions and 164 deletions

View File

@ -1,9 +1,5 @@
@namespace Oqtane.Themes.Controls
@inherits ThemeControlBase
@inject NavigationManager NavigationManager
@inject IUserService UserService
@inject IJSRuntime jsRuntime
@inject IServiceProvider ServiceProvider
@inherits LoginBase
<AuthorizeView>
<Authorizing>
@ -16,38 +12,3 @@
<button type="button" class="btn btn-primary" @onclick="LoginUser">Login</button>
</NotAuthorized>
</AuthorizeView>
@code {
private void LoginUser()
{
var returnurl = PageState.Alias.Path;
if (PageState.Page.Path != "/")
{
returnurl += "/" + PageState.Page.Path;
}
NavigationManager.NavigateTo(NavigateUrl("login", "returnurl=" + returnurl));
}
private async Task LogoutUser()
{
await UserService.LogoutUserAsync(PageState.User);
if (PageState.Runtime == Runtime.Server)
{
// server-side Blazor
var interop = new Interop(jsRuntime);
string antiforgerytoken = await interop.GetElementByName("__RequestVerificationToken");
var fields = new { __RequestVerificationToken = antiforgerytoken, returnurl = (PageState.Alias.Path + "/" + PageState.Page.Path) };
await interop.SubmitForm("/pages/logout/", fields);
}
else
{
// client-side Blazor
var authstateprovider = (IdentityAuthenticationStateProvider)ServiceProvider.GetService(typeof(IdentityAuthenticationStateProvider));
authstateprovider.NotifyAuthenticationChanged();
NavigationManager.NavigateTo(NavigateUrl(PageState.Page.Path, "reload"));
}
}
}

View File

@ -0,0 +1,49 @@
using System;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Components;
using Microsoft.JSInterop;
using Oqtane.Providers;
using Oqtane.Services;
using Oqtane.UI;
namespace Oqtane.Themes.Controls
{
public class LoginBase : ThemeControlBase
{
[Inject] public NavigationManager NavigationManager {get;set;}
[Inject]public IUserService UserService {get;set;}
[Inject]public IJSRuntime jsRuntime {get;set;}
[Inject]public IServiceProvider ServiceProvider {get;set;}
protected void LoginUser()
{
var returnurl = PageState.Alias.Path;
if (PageState.Page.Path != "/")
{
returnurl += "/" + PageState.Page.Path;
}
NavigationManager.NavigateTo(NavigateUrl("login", "returnurl=" + returnurl));
}
protected async Task LogoutUser()
{
await UserService.LogoutUserAsync(PageState.User);
if (PageState.Runtime == Runtime.Server)
{
// server-side Blazor
var interop = new Interop(jsRuntime);
string antiforgerytoken = await interop.GetElementByName("__RequestVerificationToken");
var fields = new { __RequestVerificationToken = antiforgerytoken, returnurl = (PageState.Alias.Path + "/" + PageState.Page.Path) };
await interop.SubmitForm("/pages/logout/", fields);
}
else
{
// client-side Blazor
var authstateprovider = (IdentityAuthenticationStateProvider)ServiceProvider.GetService(typeof(IdentityAuthenticationStateProvider));
authstateprovider.NotifyAuthenticationChanged();
NavigationManager.NavigateTo(NavigateUrl(PageState.Page.Path, "reload"));
}
}
}
}

View File

@ -1,133 +1,20 @@
@namespace Oqtane.Themes.Controls
@inherits ThemeControlBase
@if (menu != string.Empty)
@switch (Orientation)
{
<div class="app-menu">
@((MarkupString)menu)
</div>
case "Horizontal":
<MenuHorizontal/>
break;
default: // Vertical
{
<MenuVertical/>
break;
}
}
@code {
private string menu = string.Empty;
@code{
[Parameter]
public string Orientation { get; set; }
protected override void OnParametersSet()
{
switch (Orientation)
{
case "Horizontal":
CreateHorizontalMenu();
break;
default: // Vertical
CreateVerticalMenu();
break;
}
}
private void CreateVerticalMenu()
{
var level = -1;
var securitylevel = int.MaxValue;
menu = "<ul class=\"nav flex-column\">\n";
foreach (Page p in PageState.Pages.Where(item => item.IsNavigation && !item.IsDeleted))
{
if (UserSecurity.IsAuthorized(PageState.User,PermissionNames.View, p.Permissions) && p.Level <= securitylevel)
{
securitylevel = int.MaxValue;
menu += "<li class=\"nav-item px-3\">";
if (string.IsNullOrEmpty(p.Url))
{
menu += "<a href=\"" + NavigateUrl(p.Path) + "\" class=\"nav-link\" style=\"padding-left: " + ((p.Level + 1) * 15).ToString() + "px !important;\">";
}
else
{
string target = String.Empty;
if (p.Url.StartsWith("http"))
{
target = " target=\"_new\"";
}
menu += "<a href=\"" + p.Url + "\" class=\"nav-link\" style=\"padding-left: " + ((p.Level + 1) * 15).ToString() + "px !important;\"" + target + ">";
}
if (p.HasChildren)
{
menu += "<i class=\"oi oi-chevron-right\"></i>";
}
if (p.Icon != string.Empty)
{
menu += "<span class=\"oi oi-" + p.Icon + "\" aria-hidden=\"true\"></span>";
}
menu += p.Name;
menu += "</a>\n";
menu += "</li>\n";
level = p.Level;
}
else
{
if (securitylevel == int.MaxValue)
{
securitylevel = p.Level;
}
}
}
menu += "</ul>";
}
private void CreateHorizontalMenu()
{
var url = String.Empty;
var target = String.Empty;
menu = "<button class=\"navbar-toggler\" type=\"button\" data-toggle=\"collapse\" data-target=\"#Menu\" aria-controls=\"Menu\" aria-expanded=\"false\" aria-label=\"Toggle navigation\"><span class=\"navbar-toggler-icon\"></span></button>";
menu += "<div class=\"collapse navbar-collapse\" id=\"Menu\">";
menu += "<ul class=\"navbar-nav mr-auto\">";
foreach (Page p in PageState.Pages.Where(item => item.IsNavigation && !item.IsDeleted))
{
if (UserSecurity.IsAuthorized(PageState.User,PermissionNames.View, p.Permissions) && p.ParentId == PageState.Page.ParentId && p.Level == PageState.Page.Level)
{
if (string.IsNullOrEmpty(p.Url))
{
url = NavigateUrl(p.Path);
target = String.Empty;
}
else
{
url = p.Url;
if (p.Url.StartsWith("http"))
{
target = " target=\"_new\"";
}
}
if (p.PageId == PageState.Page.PageId)
{
menu += "<li class=\"nav-item active\">" +
"<a class=\"nav-link\" href=\"" + NavigateUrl(p.Path) + "\">" +
((p.Icon != string.Empty) ? "<span class=\"oi oi-" + p.Icon + "\" aria-hidden=\"true\"></span> " : string.Empty) +
p.Name + " <span class=\"sr-only\">(current)</span></a></li>";
}
else
{
menu += "<li class=\"nav-item\">" +
"<a class=\"nav-link\" href=\"" + NavigateUrl(p.Path) + "\">" +
((p.Icon != string.Empty) ? "<span class=\"oi oi-" + p.Icon + "\" aria-hidden=\"true\"></span> " : string.Empty) +
p.Name + "</a></li>";
}
}
}
menu += "</ul>";
menu += "</div>";
}
}

View File

@ -0,0 +1,45 @@
using System.Collections.Generic;
using System.Linq;
using Oqtane.Models;
using Oqtane.Security;
using Oqtane.Shared;
namespace Oqtane.Themes.Controls
{
public class MenuBase : ThemeControlBase
{
private List<Page> _menuPages;
protected IEnumerable<Page> MenuPages => _menuPages ?? (_menuPages = GetMenuPages().ToList());
protected string GetTarget(Page page)
{
return page.Url.StartsWith("http") ? "_new" : string.Empty;
}
protected string GetUrl(Page page)
{
return string.IsNullOrEmpty(page.Url) ? NavigateUrl(page.Path) : page.Url;
}
private IEnumerable<Page> GetMenuPages()
{
var securityLevel = int.MaxValue;
foreach (Page p in PageState.Pages.Where(item => item.IsNavigation && !item.IsDeleted))
{
if (p.Level <= securityLevel && UserSecurity.IsAuthorized(PageState.User, PermissionNames.View, p.Permissions))
{
securityLevel = int.MaxValue;
yield return p;
}
else
{
if (securityLevel == int.MaxValue)
{
securityLevel = p.Level;
}
}
}
}
}
}

View File

@ -0,0 +1,42 @@
@namespace Oqtane.Themes.Controls
@inherits MenuBase
@if (MenuPages.Any())
{
<div class="app-menu">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#Menu" aria-controls="Menu" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="Menu">
<ul class="navbar-nav mr-auto">
@foreach (var p in MenuPages)
{
if (p.PageId == PageState.Page.PageId)
{
<li class="nav-item active">
<a class="nav-link" href="@NavigateUrl(p.Path)">
@if (p.Icon != string.Empty)
{
<span class="oi oi-@p.Icon" aria-hidden="true"></span>
}
@p.Name<span class="sr-only">(current)</span>
</a>
</li>
}
else
{
<li class="nav-item">
<a class="nav-link" href="@NavigateUrl(p.Path)">
@if (p.Icon != string.Empty)
{
<span class="oi oi-@p.Icon" aria-hidden="true"></span>
}
@p.Name
</a>
</li>
}
}
</ul>
</div>
</div>
}

View File

@ -0,0 +1,27 @@
@namespace Oqtane.Themes.Controls
@inherits MenuBase
@if (MenuPages.Any())
{
<div class="app-menu">
<ul class="nav flex-column">
@foreach (var p in MenuPages)
{
<li class="nav-item px-3">
<a href="@GetUrl(p)" class="nav-link" style="padding-left:@((p.Level + 1) * 15)px !important;" target="@GetTarget(p)">
@if (p.HasChildren)
{
<i class="oi oi-chevron-right"></i>
}
@if (p.Icon != string.Empty)
{
<span class="oi oi-@p.Icon" aria-hidden="true"></span>
}
@p.Name
</a>
</li>
}
</ul>
</div>
}