EF Core 分页查询页码导航

  1 namespace MvcMovie.Utility
  2 {
  3     /// <summary>
  4     /// 分页帮助类
  5     /// </summary>
  6     public class PageHelper
  7     {
  8         public PageHelper(int pageSize, int pageIndex)
  9         {
 10             this.PageSize = pageSize;
 11             this.PageIndex = pageIndex;
 12         }
 13         private long _count = 0;
 14         /// <summary>
 15         /// 总记录数
 16         /// </summary>
 17         public long Count
 18         {
 19             get
 20             {
 21                 return _count;
 22             }
 23             set
 24             {
 25                 _count = value;
 26                 TotalPage = CalacTotalPage(value);
 27             }
 28         }
 29         /// <summary>
 30         /// 总页数
 31         /// </summary>
 32         public int TotalPage { get; private set; } = 1;
 33         /// <summary>
 34         /// 当前页
 35         /// </summary>
 36         public int PageIndex { get; set; } = 1;
 37         /// <summary>
 38         /// 页大小(一页显示的记录条数)
 39         /// </summary>
 40         public int PageSize { get; set; } = 10;
 41         /// <summary>
 42         /// 计算总页数
 43         /// </summary>
 44         /// <param name="count">总记录数</param>
 45         /// <returns></returns>
 46         public int CalacTotalPage(long count)
 47         {
 48             return (int)Math.Ceiling(count * 1.0 / PageSize);
 49         }
 50         /// <summary>
 51         /// 页开始记录位置
 52         /// </summary>
 53         public int StartIndex
 54         {
 55             get
 56             {
 57                 return (int)(PageIndex - 1) * PageSize;
 58             }
 59         }
 60         /// <summary>
 61         /// 是否有上一页
 62         /// </summary>
 63         /// <returns></returns>
 64         public bool HasPrevious
 65         {
 66             get
 67             {
 68                 return PageIndex > 1;
 69             }
 70         }
 71         /// <summary>
 72         /// 是否有下一页
 73         /// </summary>
 74         /// <returns></returns>
 75         public bool HasNext
 76         {
 77             get
 78             {
 79                 return PageIndex < TotalPage;
 80             }
 81         }
 82         /// <summary>
 83         /// 上一页页码
 84         /// </summary>
 85         public int PreviousPageIndex
 86         {
 87             get
 88             {
 89                 int index = PageIndex - 1;
 90                 if (index > 0)
 91                 {
 92                     return index;
 93                 }
 94                 return 1;
 95             }
 96         }
 97         /// <summary>
 98         /// 下一页页码
 99         /// </summary>
100         public int NextPageIndex
101         {
102             get
103             {
104                 int index = PageIndex + 1;
105                 if (index <= TotalPage)
106                 {
107                     return index;
108                 }
109                 return TotalPage;
110             }
111         }
112 
113     }
114 }

public class EmployeeViewModel
   {
 
       public List<Employee>? Employees { get; set; }
       public Employee Employee { get; set; }=new Employee();
 
       public PageHelper PageHelper { get; set; }
   }

public class EmployeeController : Controller
    {
        MvcMovieContext _dbContext;
        IConfiguration _config;
        int _pageSize = 5;
        public EmployeeController(MvcMovieContext dbContext, IConfiguration config)
        {
            _dbContext = dbContext;
            _config = config;
            _pageSize = Convert.ToInt32(config["PageSize"]);
        }
        public async Task<IActionResult> Index(int pageIndex = 1)
        {
            return View(await GetViewModel(pageIndex));
        }
 private async Task<EmployeeViewModel> GetViewModel(int pageIndex = 1)
        {//分页查询
            EmployeeViewModel viewModel = new EmployeeViewModel();
            viewModel.PageHelper = new Utility.PageHelper(_pageSize, pageIndex);
            viewModel.PageHelper.Count = await _dbContext.Employees.LongCountAsync();

            var query = _dbContext.Employees.Skip(viewModel.PageHelper.StartIndex).Take(_pageSize);
            viewModel.Employees = await query.ToListAsync();
            return viewModel;
        }

    }

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

@model EmployeeViewModel
 
<!-- Button trigger modal -->
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal">
    新添员工
</button>
 
<!-- 新添员工 -->
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div id="saveForm" class="modal-content">
            <form id="saveForm" asp-action="Create" method="post">
                <div class="modal-header">
                    <h1 class="modal-title fs-5" id="exampleModalLabel">新添员工</h1>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <label asp-for="Employee.Name" class="control-lable"></label>
                        <input asp-for="Employee.Name" class="form-control" autofocus />
                        <span asp-validation-for="Employee.Name" class="text-danger"></span>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary btnCancel" data-bs-dismiss="modal">Close</button>
                    <button id="btnSave" type="submit" class="btn btn-primary">保存</button>
                </div>
            </form>
        </div>
    </div>
</div>
 
<!--删除员工-->
<div class="modal fade" id="deleteModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <form id="saveForm" method="post">
                <div class="modal-header">
                    <h1 class="modal-title fs-5" id="exampleModalLabel">删除员工</h1>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <h2>你真的想删除这个员工吗？</h2>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary btnCancel" data-bs-dismiss="modal">Close</button>
                    <button id="btnDelete" type="button" class="btn btn-primary">删除</button>
                </div>
            </form>
        </div>
    </div>
</div>
 
<!--编辑-->
<div class="modal fade" id="editModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <form asp-action="Update" id="EditForm" method="post">
                <div class="modal-header">
                    <h1 class="modal-title fs-5" id="exampleModalLabel">修改员工</h1>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <input class="updateId" type="hidden" asp-for="Employee.Id" />
                        <label asp-for="Employee.Name" class="control-lable"></label>
                        <input id="empName" asp-for="Employee.Name" class="form-control" />
                        <span asp-validation-for="Employee.Name" class="text-danger"></span>
 
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary btnCancel" data-bs-dismiss="modal">Close</button>
                    <button id="btnSave" type="submit" class="btn btn-primary">修改</button>
                </div>
            </form>
        </div>
    </div>
</div>
 
<input type="hidden" id="EmpId" />
 
<table class="table">
    <thead class="thead-dark">
        <tr>
            <th scope="col">#</th>
            <th scope="col">Name</th>
            <th scope="col">Actions</th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model.Employees)
        {
            <tr>
                <th scope="row">@item.Id</th>
                <td>@item.Name</td>
                <td>
                    <a class="btn btn-danger" onclick="EditForm(@item.Id)" id="EditForm">编辑</a>|
                    <a class="btn btn-danger" onclick="DeleteForm(@item.Id)" id="showModal">删除</a>
                </td>
            </tr>
        }
    </tbody>
</table>
 
<nav aria-label="分页页码">
    <ul class="pagination">
        @if (Model.PageHelper.HasPrevious)
        {
            string url = $"/Employee/?pageindex={Model.PageHelper.PreviousPageIndex}";
            <li class="page-item"><a class="page-link" href=@url>上一页</a></li>
        }
        else
        {
            <li class="page-item disabled"><a class="page-link" href="#">上一页</a></li>
        }
        @for (int i = 1; i <= Model.PageHelper.TotalPage; i++)
        {
            string url = $"/Employee/?pageindex={@i}";
            <li class="page-item"><a class="page-link" href=@url>@i</a></li>
        }
        @if (Model.PageHelper.HasNext)
        {
            string url = $"/Employee/?pageindex={Model.PageHelper.NextPageIndex}";
            <li class="page-item"><a class="page-link" href=@url>下一页</a></li>
        }
        else
        {
            <li class="page-item disabled"><a class="page-link" href="#">下一页</a></li>
        }
    </ul>
</nav>
 
@section Scripts {
    @{
        await Html.RenderPartialAsync("_ValidationScriptsPartial");
    }
    <script>
        //保存当前Id到 EmpId 文本控件
        var DeleteForm = function (id) {
            $("#EmpId").val(id);
            $("#deleteModal").modal('show');
        }
        //打开对话框并初始化控件
        var EditForm = function (id) {
            $.ajax({
                type: "GET",
                url: "/Employee/GetEmployee",
                data: { id: id },
                success: function (employee) {
                    $("#editModal").modal('show');
                    $("#empName").val(employee.name);
                    $(".updateId").val(employee.id);
                }
            })
        }
        $(document).ready(function () {
            //$("#btnSave").click(function()
            //{
            //    var empForm=$("#saveForm").serialize();
            //    $.ajax({
            //        type:"POST",
            //        url:"/Employee/Create",
            //        data:empForm,
            //        success:function(){
            //            window.location.href="/Employee/Index";
            //        }
            //    })
            //})
            //当点取消按钮时，导航到首页
            $(".btnCancel").click(function () {
                window.location.href = "/Employee/Index";
            })
 
            $("#btnDelete").click(function () {
                var currentId = $("#EmpId").val();
                $.ajax({
                    type: "POST",
                    url: "/Employee/Delete",
                    data: { id: currentId },
                    success: function (result) {
                        if (result) {
                            $("#EmpId").val(null);
                            window.location.href = "/Employee/Index";
                        }
                        else {
                            alert("删除失败");
                        }
                    }
                })
            })
 
 
        })
    </script>
}