.NET 6 + EF Core + MySQL + Docker + Identity +MVC 学习笔记 （三）

本文主要是介绍.NET 6 + EF Core + MySQL + Docker + Identity +MVC 学习笔记 （三），对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

环境准备：

1、VS 2022 免费社区版

本章目标：

　　1、增加 用户 列表显示页面；

　　2、增加 角色 维护主页面；

　　3、增加 编辑 角色下属 用户 界面；

　　4、

1、增加 用户列表 显示页面

 　　新建一个 UserAdmin的控制器：

 　  就选择 MVC 控制器-空：

 　　名称： UserAdminController

　　打开UserAdminController.cs后，在默认的 Index 右键选择 添加视图：

 　　简单一点，就用空视图： 

   　名字不用改，就Index.cshtml 

　　会自动在 Views目录下，增加 UserAdmin 目录，并增加空的 Index.cshtml ,并自动打开：

　　在Index.cshtml 视图中插入 显示用户列表的 View，代码如下：

@using Microsoft.AspNetCore.Identity
@model IEnumerable<IdentityUser>
@{
    ViewBag.Title = "Index";
}
<div class="panel panel-primary">
    <div class="panel-heading">
        用户列表
    </div>
    <table class="table table-striped">
        <tr><th>Name</th><th>Email</th><th>PhoneNumber</th><th></th></tr>
        @if (Model.Count() == 0)
        {
            <tr><td colspan="4" class="text-center">无用户</td></tr>
        }
        else
        {
            foreach (IdentityUser user in Model)
            {
                <tr>        
                    <td>@user.UserName</td>
                    <td>@user.Email</td>
                    <td>@user.PhoneNumber</td>
                    <td>
                            @Html.ActionLink("密码重置", "ResetPassword", new { id = user.Id },
                                new { @class = "btn btn-warning btn-xs" })
                            @Html.ActionLink("编辑", "Edit", new { id = user.Id },
                                new { @class = "btn btn-primary btn-xs" })
                            @Html.ActionLink("删除", "Delete", new { id = user.Id },
                            new { @class = "btn btn-danger btn-xs" })
                    </td>
                </tr>
            }
        }
    </table>
</div>

　　修改 UserAdminController ，先把 UserManager 传入，再修改 Index View的返回为所有 User：

using Microsoft.AspNetCore.Identity;
using Microsoft.AspNetCore.Mvc;

namespace POSystem.Controllers
{
    public class UserAdminController : Controller
    {
        private readonly UserManager<IdentityUser> _userManager;

        public UserAdminController(UserManager<IdentityUser> userManager)
        {
            _userManager = userManager;
        }

        public IActionResult Index()
        {
            return View(_userManager.Users);
        }
    }
}

　　先把这个UserAdmin的按钮入口 放在 Home和Privacy菜单的中间，修改_Layout.cshtml 

　　　　　　　　　　<div class="navbar-collapse collapse d-sm-inline-flex justify-content-between">
                    <ul class="navbar-nav flex-grow-1">
                        <li class="nav-item">
                            <a class="nav-link text-dark" asp-area="" asp-controller="Home" asp-action="Index">Home</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-dark" asp-area="" asp-controller="UserAdmin" asp-action="Index">用户管理</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-dark" asp-area="" asp-controller="Home" asp-action="Privacy">Privacy</a>
                        </li>
                    </ul>
                    <partial name="_LoginPartial" />
                </div>

　　列表效果：

 　　注：密码重置、编辑、删除 待补充。

2、增加 角色 维护主页面；

　　增加一个角色维护管理页面来为用户分配角色；先添加一个RoleAdminController 控制器：

 　　同样再加个Index View：

  　　修改 RoleAdminController,  传入 RoleManager, Index返回所有Role给View:

using Microsoft.AspNetCore.Identity;
using Microsoft.AspNetCore.Mvc;

namespace POSystem.Controllers
{
    public class RoleAdminController : Controller
    {
        private readonly RoleManager<IdentityRole> _roleManager;

        public RoleAdminController(RoleManager<IdentityRole> roleManager)
        {
            _roleManager = roleManager;
        }
        public IActionResult Index()
        {
            return View(_roleManager.Roles);
        }
    }
}

　　　修改Index View，先最简单的显示一个列表：

@using Microsoft.AspNetCore.Identity
@model IEnumerable<IdentityRole>
@{
    ViewBag.Title = "Index";
}
<div class="panel panel-primary">
    <div class="panel-heading">
        角色列表
    </div>
    <table class="table table-striped">
        <tr><th>Name</th><th></th></tr>
        @if (Model.Count() == 0)
        {
            <tr><td colspan="4" class="text-center">无角色</td></tr>
        }
        else
        {
            foreach (IdentityRole role in Model)
            {
                <tr>
                    <td>@role.Name</td>                    
                    <td>                        
                        @Html.ActionLink("编辑", "Edit", new { id = role.Id },
                            new { @class = "btn btn-primary btn-xs" })
                        @Html.ActionLink("删除", "Delete", new { id = role.Id },
                        new { @class = "btn btn-danger btn-xs" })
                    </td>
                </tr>
            }
        }
    </table>
</div>@Html.ActionLink("新建", "Create","RoleAdmin",null, new { @class = "btn btn-primary btn-xs" })

　　　　继续修改  _Layout.cshtml :

                 <div class="navbar-collapse collapse d-sm-inline-flex justify-content-between">
                    <ul class="navbar-nav flex-grow-1">
                        <li class="nav-item">
                            <a class="nav-link text-dark" asp-area="" asp-controller="Home" asp-action="Index">Home</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-dark" asp-area="" asp-controller="UserAdmin" asp-action="Index">用户管理</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-dark" asp-area="" asp-controller="RoleAdmin" asp-action="Index">角色管理</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-dark" asp-area="" asp-controller="Home" asp-action="Privacy">Privacy</a>
                        </li>
                    </ul>
                    <partial name="_LoginPartial" />
                </div>

　　跑起来看到有角色管理这个按钮了：

  　　但是一点就出错：

  　　初步研究，应该是没有加这个：

builder.Services.AddDefaultIdentity<IdentityUser>(options => options.SignIn.RequireConfirmedAccount = true)
.AddRoles<IdentityRole>()
.AddRoleManager<RoleManager<IdentityRole>>()
.AddEntityFrameworkStores<ApplicationDbContext>();

　　加完，能正常显示RoleAdmin的Index:

 　　在RoleAdmin 控制器中增加 Create Action :

        public ActionResult Create()
        {
            return View();
        }

        [HttpPost]
        public async Task<ActionResult> Create([Required] string name)
        {
            if (ModelState.IsValid)
            {
                IdentityResult result = await _roleManager.CreateAsync(new IdentityRole(name));
                if (result.Succeeded)
                {
                    return RedirectToAction("Index");
                }
                else
                {
                    AddErrorsFromResult(result);
                }
            }
            return View();
        }

        private void AddErrorsFromResult(IdentityResult result)
        {
            foreach (IdentityError error in result.Errors)
            {
                ModelState.AddModelError("", error.Description);
            }
        }

　　再为Create Action 添加一个空视图，并把以下视图代码加入：

@model string
@{ ViewBag.Title = "新增角色";}
<h2>新增角色</h2>
@Html.ValidationSummary(false)
@using (Html.BeginForm())
{
    <div class="form-group">
        <label>Name</label>
        <input name="name" value="@Model" class="form-control" />
    </div>
    <button type="submit" class="btn btn-primary">新增</button>
    @Html.ActionLink("取消", "Index", "RoleAdmin", null, new { @class = "btn btn-default btn-xs" })
}

　　运行后，点击 新建 按钮：

　　建一个 Admin 、ReadOnlyUser 、OperationUser :

3、增加 编辑 角色下属 用户 界面；

　　考虑在角色界面，显示每个角色对应的用户；并增加角色维护用户页面（即 编辑 页面）

　　先增加两个ViewModel:　

using Microsoft.AspNetCore.Identity;

namespace POSystem.Models
{
    public class RoleViewModel
    {
        public IdentityRole Role { get; set; }
        public IEnumerable<IdentityUser> Members { get; set; }
        public IEnumerable<IdentityUser> NonMembers { get; set; }
    }
}

using System.ComponentModel.DataAnnotations;

namespace POSystem.Models
{
    public class RoleModificationModel
    {
        [Required]
        public string RoleName { get; set; }
        public string[]? IdsToAdd { get; set; }
        public string[]? IdsToDelete { get; set; }
    }
}

        private readonly RoleManager<IdentityRole> _roleManager;
        private readonly UserManager<IdentityUser> _userManager;

        public RoleAdminController(RoleManager<IdentityRole> roleManager, UserManager<IdentityUser> userManager)
        {
            _roleManager = roleManager;
            _userManager = userManager;
        }    

　　RoleAdmin改写成以上，首先是把  RoleManager<IdentityRole> roleManager, UserManager<IdentityUser> userManager  传进来；

　　增加 Edit 两个Action， 一个HTTP GET 一个对应HTTP POST：

        public async Task<ActionResult> Edit(string id)
        {
            IdentityRole role = await _roleManager.FindByIdAsync(id);

            IEnumerable<IdentityUser> members
                    = await _userManager.GetUsersInRoleAsync(role.Name);

            List<IdentityUser> nonMembers = new List<IdentityUser>();
            foreach (IdentityUser user in _userManager.Users)
            {
                if (!members.Any(x => x.Id.Equals(user.Id)))
                {
                    nonMembers.Add(user);
                }
            }

            return View(new RoleViewModel
            {
                Role = role,
                Members = members,
                NonMembers = nonMembers
            });
        }


        [HttpPost]
        public async Task<ActionResult> Edit(RoleModificationModel model)
        {
            IdentityResult result;
            if (ModelState.IsValid)
            {
                foreach (string userId in model.IdsToAdd ?? new string[] { })
                {
                    var user = await _userManager.FindByIdAsync(userId);

                    result = await _userManager.AddToRoleAsync(user, model.RoleName);
                    if (!result.Succeeded)
                    {
                        return View("Error", result.Errors);
                    }
                }
                foreach (string userId in model.IdsToDelete ?? new string[] { })
                {
                    var user = await _userManager.FindByIdAsync(userId);
                    result = await _userManager.RemoveFromRoleAsync(user,
                       model.RoleName);
                    if (!result.Succeeded)
                    {
                        return View("Error", result.Errors);
                    }
                }
                return RedirectToAction("Index");
            }
            return View("Error", new string[] { "Role Not Found" });
        }

　　增加Edit的视图，用空视图，然后用以下代码代替：

@using POSystem.Models
@using Microsoft.AspNetCore.Identity
@model RoleViewModel
@{ ViewBag.Title = "Edit Role";}
@Html.ValidationSummary()
@using (Html.BeginForm())
{
    <input type="hidden" name="roleName" value="@Model.Role.Name" />
    <div class="panel panel-primary">
        <div class="panel-heading">添加用户至角色：@Model.Role.Name</div>
        <table class="table table-striped">
            @if (Model.NonMembers.Count() == 0)
            {
                <tr><td colspan="2">所有用户已添加</td></tr>
            }
            else
            {
                <tr><td>用户名</td><td>添加至角色</td></tr>
                foreach (IdentityUser user in Model.NonMembers)
                {
                    <tr>
                        <td>@user.UserName</td>
                        <td>
                            <input type="checkbox" name="IdsToAdd" value="@user.Id">
                        </td>
                    </tr>
                }
            }
        </table>
    </div>
    <div class="panel panel-primary">
        <div class="panel-heading">从角色：@Model.Role.Name 中移除用户</div>
        <table class="table table-striped">
            @if (Model.Members.Count() == 0)
            {
                <tr><td colspan="2">无下属用户</td></tr>
            }
            else
            {
                <tr><td>用户名</td><td>从角色中移除</td></tr>
                foreach (IdentityUser user in Model.Members)
                {
                    <tr>
                        <td>@user.UserName</td>
                        <td>
                            <input type="checkbox" name="IdsToDelete" value="@user.Id">
                        </td>
                    </tr>
                }
            }
        </table>
    </div>
    <button type="submit" class="btn btn-primary">保存</button>
    @Html.ActionLink("取消", "Index", null, null, new { @class = "btn btn-default" })
}

　　点击 ReadOnlyUser 角色的编辑按钮，可以勾选用户添加至角色：

 　　上一步点保存后，再点击 ReadOnlyUser 角色的编辑按钮，可以看到 已经在角色列表，并可以勾选移除：

　　为了直观的显示每个角色下面有哪些用户，则考虑修改Index Action和视图：　

        public async Task<IActionResult> Index()
        {
            List<RoleViewModel> roleviewmodels = new List<RoleViewModel>();
            foreach (IdentityRole role in _roleManager.Roles.ToList())
            {
                RoleViewModel newrole = new RoleViewModel();
                newrole.Role = role;
                newrole.Members = await _userManager.GetUsersInRoleAsync(role.Name);
                roleviewmodels.Add(newrole);
            }
            return View(roleviewmodels);
        }

　　此处有个 MySQL 和 MSSQL不同的地方，如果红色的 .ToList() 不加，则会报错，提示： 

InvalidOperationException: This MySqlConnection is already in use. See https://fl.vu/mysql-conn-reuse

　　最后经过查询，知道MySQL不支持一个特性：MultipleActiveResultSets  

 　　修改Index 视图如下：

@using Microsoft.AspNetCore.Identity
@model IEnumerable<RoleViewModel>
@{
    ViewBag.Title = "Index";
}
<div class="panel panel-primary">
    <div class="panel-heading">
        角色列表
    </div>
    <table class="table table-striped">
        <tr><th>角色名</th><th>下属用户</th><th></th></tr>
        @if (Model.Count() == 0)
        {
            <tr><td colspan="4" class="text-center">无角色</td></tr>
        }
        else
        {
            foreach (RoleViewModel roleview in Model)
            {
                <tr>
                    <td>@roleview.Role.Name</td>
                    <td>
                        @foreach (IdentityUser user in @roleview.Members)
                        {
                            @user.UserName@Html.Label(";")                            
                        }
                    </td>
                    <td>@Html.ActionLink("编辑", "Edit", new { id = roleview.Role.Id },new { @class = "btn btn-primary btn-xs" })
                        @Html.ActionLink("删除", "Delete", new { id = roleview.Role.Id },new { @class = "btn btn-danger btn-xs" })
                    </td>
                </tr>
            }
        }
    </table>
</div>
@Html.ActionLink("新建", "Create","RoleAdmin",null, new { @class = "btn btn-primary btn-xs" })

　　最后体现结果：

这篇关于.NET 6 + EF Core + MySQL + Docker + Identity +MVC 学习笔记 （三）的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！