用戶列表的實現和部門列表是相似的，但我們要根據這個業務對象的特點增加3個功能點：
1. 增加一個分頁的功能。
一個企業的員工數可能有很多，所以我們對用戶列表做一下分頁，
另外我們在設計用戶表的時候將部門名稱也包含進去了的，這樣的設計和數據庫的設計范式相違背，
但好處是取用戶的部門名稱的時候不用再去關聯部門表，提高了查詢效率。
當表的數據量很大而業務對象的改動比較小的時候可以適當的使用這種設計方式，利大於弊的。
2. 增加一個查詢功能。
可以按部門和用戶名查詢，部門是一個下拉列表，用戶名是輸入框接受用戶輸入名稱。
3. 增加刪除功能。
將該用戶信息從數據庫物理刪除。
接下來我們實現用戶列表顯示的功能，在 Auth 文件夾下添加Razor頁 UserList.cshtml ，
然后在菜單中加入【用戶管理】鏈接，地址指向 UserList.cshtml，代碼如下：
<ul class="navbar-nav flex-grow-1"> <li class="nav-item"> <a class="nav-link text-dark" asp-area="" asp-page="/Index">Home</a> </li> <li class="nav-item"> <a class="nav-link text-dark" asp-area="" asp-page="/Auth/DeptList">【部門管理】</a> </li> <li class="nav-item"> <a class="nav-link text-dark" asp-area="" asp-page="/Auth/UserList">【用戶管理】</a> </li> <li class="nav-item"> <a class="nav-link text-dark" asp-area="" asp-page="/Privacy">Privacy</a> </li> <li class="nav-item"> @if (Context.User.Identity.IsAuthenticated) { <a class="nav-link text-dark" asp-area="" asp-page="/Auth/Signout">[登出]</a> } else { <a class="nav-link text-dark" asp-area="" asp-page="/Auth/Signin">[登錄]</a> } </li> </ul>
UserList.cshtml 代碼如下：
@page @model AuthManagement.Pages.Auth.UserListModel @using AuthManagement.DbUtil.Entity @{ ViewData["Title"] = "用戶管理"; } <form id="form1" method="get"> 部門：<select name="did"> <option value="0"> </option> @foreach (TDept item in Model.DeptList) { if (item.DeptId.ToString() == Request.Query["did"]) { <option value="@item.DeptId" selected>@item.DeptName</option> } else { <option value="@item.DeptId">@item.DeptName</option> } } </select> 姓名：<input type="text" name="name" style="width:120px;" value='@Request.Query["name"]' /> <!--將分頁的參數放在form中和查詢條件一起提交，分頁本質也是對數據的一種過濾--> <input type="hidden" id="page" name="page" value="@Model.PageIndex" /> <button type="submit">查詢</button> </form> <table border="1" width="60%" style="margin-top:4px;"> <tr style="background-color:antiquewhite;height:40px;"> <td>編號</td> <td>姓名</td> <td>手機</td> <td>部門</td> <td>賬號</td> <td>創建時間</td> <td><a href="/Auth/UserEdit?userid=0" target="_blank">新增用戶</a></td> </tr> @foreach (TUser item in Model.UserList) //遍歷輸出部門信息 { <tr style="height:30px;"> <td>@item.UserId</td> <td>@item.UserName</td> <td>@item.Mobile</td> <td>@item.DeptName</td> <td>@item.SigninAcc</td> <td>@item.CreateTime</td> <td> <a href="/Auth/UserEdit?userid=@item.UserId" target="_blank">修改</a> <!--注：按約定 asp-page-handler 屬性后的值對應的后台方法是 OnGet+Value,這里是OnGetCancel和OnGetDelete--> <a target="_self" asp-page-handler="Cancel" asp-route-uid="@item.UserId" onclick="return confirm('鎖定后用戶不能登錄，確定要鎖定嗎？');">鎖定</a> <a target="_self" asp-page-handler="Delete" asp-route-uid="@item.UserId" onclick="return confirm('確定要刪除嗎？');">刪除</a> </td> </tr> } @if (Model.UserList.Count == 0) { <tr style="height:30px;"> <td colspan="7" align="center">沒有查詢到用戶信息！</td> </tr> } </table> <span>第 @Model.PageIndex 頁 / 共 @Model.PageCount 頁 每頁 @Model.PageSize 筆 / 共 @Model.RecordCount 筆</span> @if (Model.RecordCount > Model.PageSize) //如果記錄數大於分頁大小就啟用分頁顯示 { <a href="javascript:document.getElementById('page').value=1;document.getElementById('form1').submit();">首頁</a> <!--因為分頁參數page放在form中，所以這里用javascript做加減操作后提交form就可以了--> <a href="javascript:var obj=document.getElementById('page');obj.value=parseInt(obj.value)+1;if(obj.value>@Model.PageCount){obj.value=@Model.PageCount};document.getElementById('form1').submit();">下一頁</a> <a href="javascript:var obj=document.getElementById('page');obj.value=parseInt(obj.value)-1;if(obj.value<1){obj.value=1};document.getElementById('form1').submit();">上一頁</a> <a href="javascript:document.getElementById('page').value=@Model.PageCount;document.getElementById('form1').submit();">尾頁</a> }
UserList.cshtml.cs 代碼如下：
using System; using System.Collections.Generic; using System.Linq; using AuthManagement.DbUtil.Entity; using Microsoft.AspNetCore.Mvc.RazorPages; namespace AuthManagement.Pages.Auth { public class UserListModel : PageModel { private readonly AuthDbContext _context; //在構造函數中對 AuthDbContext 做依賴注入 public UserListModel(AuthDbContext context) { _context = context; } //定義用戶列表屬性，用於傳遞給.cshtml頁面使用(在OnGet()方法中賦值) public IList<TUser> UserList { get; set; } //初始化查詢條件中的部門下拉列表 public IList<TDept> DeptList { get; set; } public readonly int PageSize=3; //定義分頁大小 public int RecordCount = 0;//記錄總數，在InitUser()中根據查詢結果賦具體的值 public int PageCount = 0;//分頁總數，在InitUser()中根據查詢結果賦具體的值 public int PageIndex = 1;//當前頁，在InitUser()中根據查詢結果賦具體的值 public void OnGet() { InitPageIndex(); InitDept(); InitUser(); } private void InitPageIndex() { string page = Request.Query["page"]; int pageIndex = 1; if (int.TryParse(page, out int idx)) { pageIndex = idx; if (pageIndex < 1) { pageIndex = 1; } this.PageIndex = pageIndex; } } private void InitDept() { //初始化查詢條件中的部門 DeptList = _context.TDepts.Where<TDept>(dept => dept.IsValid == 1).ToList<TDept>(); } private void InitUser() { //用戶點查詢時Get方式傳遞查詢條件 string did = Request.Query["did"]; string userName = Request.Query["name"]; //初始化查詢條件 IQueryable<TUser> userList = _context.TUsers.Where<TUser>(user => user.UserId > 0); //加上用戶名稱的過濾條件 if (!string.IsNullOrWhiteSpace(userName)) { //模糊查詢，Contains() 相當於 like '%張%'; //StartsWith()相當於 like '張%',EndsWith()相當於 like '%張' userList = userList.Where<TUser>(user => user.UserName.Contains(userName)); } //加上部門的過濾條件 if (int.TryParse(did, out int deptId)) { if (deptId > 0) { userList = userList.Where<TUser>(user => user.DeptId == deptId); } } //根據查詢結果統計數據 this.RecordCount = userList.Count();//初始化記錄總數 this.PageCount = (int)Math.Ceiling((double)RecordCount / PageSize); //獲取分頁數（取最小整數用 Math.Floor()） if (this.PageIndex > this.PageCount) { this.PageIndex = this.PageCount; } //當前頁不能大於總頁數 //用 Skip() 結合 Take() 實現分頁 //Skip(n):跳過集合中的前n條數據取剩下所有的 //Take(n):取集合中的前n條數據 //比如 [1、2、3、4、5、6、7、8、9、10、11、12] 這樣一個集合 //Skip(5)=[6、7、8、9、10、11、12]; Take(5)=[1、2、3、4、5] //Skip(5).Take(5)=[6、7、8、9、10] 即從集合的第6條數據開始取5條數據 this.UserList = userList.Skip<TUser>((this.PageIndex - 1) * this.PageSize).Take<TUser>(this.PageSize).ToList<TUser>(); } //注：前端頁面如果設置了handler屬性:asp-page-handler="Cancel", //則對應的方法是 OnGetCancel, 即 OnGet + Cancel public void OnGetCancel() { string uid = Request.Query["uid"]; if (int.TryParse(uid, out int userId)) { TUser user = _context.TUsers.Find(userId); user.IsValid = 0; _context.SaveChanges(); } //鎖定后要重新加載數據，否則前端頁面取不到值。 OnGet(); Response.Redirect(Request.Path); } //注：前端頁面如果設置了handler屬性:asp-page-handler="Delete", //則對應的方法是 OnGetDelete, 即 OnGet + Delete public void OnGetDelete() { string uid = Request.Query["uid"]; if (int.TryParse(uid, out int userId)) { TUser user = _context.TUsers.Find(userId); _context.TUsers.Remove(user); _context.SaveChanges(); } //作廢后要重新加載數據，否則前端頁面取不到值。 OnGet(); Response.Redirect(Request.Path); } } }
編譯后運行頁面，效果如下：
