refactor: 侧边栏菜单 Active 使用绑定
This commit is contained in:
parent
d1525e0651
commit
41e69b820c
|
@ -1,4 +1,5 @@
|
|||
using Bootstrap.Admin.Models;
|
||||
using Bootstrap.Admin.Extensions;
|
||||
using Bootstrap.Admin.Models;
|
||||
using Bootstrap.Admin.Shared;
|
||||
using Microsoft.AspNetCore.Components;
|
||||
using Microsoft.AspNetCore.Components.Authorization;
|
||||
|
@ -69,7 +70,12 @@ namespace Bootstrap.Admin.Components
|
|||
public string HomeUrl { get; protected set; } = "/Pages";
|
||||
|
||||
/// <summary>
|
||||
///
|
||||
/// 获得/设置 当前请求路径
|
||||
/// </summary>
|
||||
protected string RequestUrl { get; set; } = "";
|
||||
|
||||
/// <summary>
|
||||
/// OnInitializedAsync 方法
|
||||
/// </summary>
|
||||
/// <returns></returns>
|
||||
protected override async Task OnInitializedAsync()
|
||||
|
@ -81,11 +87,31 @@ namespace Bootstrap.Admin.Components
|
|||
}
|
||||
else
|
||||
{
|
||||
Model = new NavigatorBarModel(state.User.Identity.Name);
|
||||
RequestUrl = new UriBuilder(NavigationManager?.Uri ?? "").Path;
|
||||
Model = new NavigatorBarModel(state.User.Identity.Name, RequestUrl.ToMvcMenuUrl());
|
||||
IsAdmin = state.User.IsInRole("Administrators");
|
||||
UserName = state.User.Identity.Name ?? "";
|
||||
DisplayName = Model.DisplayName;
|
||||
}
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
///
|
||||
/// </summary>
|
||||
/// <param name="firstRender"></param>
|
||||
protected override void OnAfterRender(bool firstRender)
|
||||
{
|
||||
if (!firstRender) ResetSideBar();
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// 更新侧边栏方法
|
||||
/// </summary>
|
||||
public void ResetSideBar()
|
||||
{
|
||||
RequestUrl = new UriBuilder(NavigationManager?.Uri ?? "").Path;
|
||||
Model = new NavigatorBarModel(UserName, RequestUrl.ToMvcMenuUrl());
|
||||
SideBar?.Update(Model);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -4,14 +4,23 @@ using Microsoft.AspNetCore.Components;
|
|||
namespace Bootstrap.Admin.Components
|
||||
{
|
||||
/// <summary>
|
||||
///
|
||||
/// 侧边栏组件
|
||||
/// </summary>
|
||||
public class SideBarBase : BootstrapComponentBase
|
||||
{
|
||||
/// <summary>
|
||||
///
|
||||
/// 获得/设置 侧边栏绑定 Model 实例
|
||||
/// </summary>
|
||||
[Parameter]
|
||||
public NavigatorBarModel Model { get; set; } = new NavigatorBarModel("");
|
||||
|
||||
/// <summary>
|
||||
/// 视图更新方法
|
||||
/// </summary>
|
||||
public void Update(NavigatorBarModel model)
|
||||
{
|
||||
Model = model;
|
||||
StateHasChanged();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,4 +1,7 @@
|
|||
namespace Bootstrap.Admin.Extensions
|
||||
using System.Collections.Generic;
|
||||
using System.Linq;
|
||||
|
||||
namespace Bootstrap.Admin.Extensions
|
||||
{
|
||||
/// <summary>
|
||||
/// Url 地址辅助操作类
|
||||
|
@ -6,17 +9,28 @@
|
|||
public static class UrlHelperExtensions
|
||||
{
|
||||
/// <summary>
|
||||
/// 转换为 Blazor 地址 移除开始 ~ 字符
|
||||
/// 转换为 Blazor 地址 ~/Admin/Index => /Admin/Index
|
||||
/// </summary>
|
||||
/// <param name="url"></param>
|
||||
/// <returns></returns>
|
||||
public static string ToBlazorLink(this string url) => url.TrimStart('~');
|
||||
|
||||
/// <summary>
|
||||
/// 转化为 Blazor 菜单地址
|
||||
/// 转化为 Blazor 菜单地址 ~/Admin/Index => /Pages/Admin/Index
|
||||
/// </summary>
|
||||
/// <param name="url"></param>
|
||||
/// <returns></returns>
|
||||
public static string ToBlazorMenuUrl(this string url) => url.Replace("~", "/Pages");
|
||||
|
||||
/// <summary>
|
||||
/// 转化为 Mvc 菜单地址 /Pages/Admin/Index => ~/Admin/Index
|
||||
/// </summary>
|
||||
/// <param name="url"></param>
|
||||
/// <returns></returns>
|
||||
public static string ToMvcMenuUrl(this string url)
|
||||
{
|
||||
var index = new List<string>() { "/Pages", "/Pages/Admin" };
|
||||
return index.Any(u => u.Contains(url, System.StringComparison.OrdinalIgnoreCase)) ? "~/Admin/Index" : url.Replace("/Pages", "~");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -12,6 +12,6 @@
|
|||
else
|
||||
{
|
||||
<li class="nav-item">
|
||||
<a href="@Menu.Url.ToBlazorMenuUrl()" id="@string.Format("menus_{0}",Menu.Id)" class="nav-link @Menu.Active"><i class="@Menu.Icon"></i><span class="flex-fill">@Menu.Name</span></a>
|
||||
<a href="@Menu.Url.ToBlazorMenuUrl()" id="@string.Format("menus_{0}",Menu.Id)" class="@(Menu.Active =="active" ? "nav-link active" : "nav-link")"><i class="@Menu.Icon"></i><span class="flex-fill">@Menu.Name</span></a>
|
||||
</li>
|
||||
}
|
||||
|
|
|
@ -59,8 +59,6 @@
|
|||
var menuId = 'menus_' + id;
|
||||
var $curMenu = $('.sidebar .active').first();
|
||||
if ($curMenu.attr('id') !== menuId) {
|
||||
$curMenu.removeClass('active');
|
||||
var $menu = $('#' + menuId).addClass('active');
|
||||
// set website title
|
||||
$('head title').text($menu.text());
|
||||
this.resetTab(id);
|
||||
|
|
Loading…
Reference in New Issue