开源博客项目Blog .NET Core源码学习(28:App.Hosting项目结构分析-16)

  本文学习并分析App.Hosting项目中后台管理页面的用户管理页面。
  用户管理页面用于显示、检索、新建、编辑、删除用户数据,其附带一新建及编辑页面,以支撑新建和编辑用户数据,同时还附带重置密码页面,以重置用户密码。整个页面使用了layui中的表格、表单、上传组件等样式或模块,并未使用独立的js文件,而是直接在页面内嵌js代码,并调用UserManage/UserController的相关函数处理数据。

在这里插入图片描述
  用户管理页面的上半部分显示搜索框,下半部分以表格形式显示全部用户数据或者检索结果。在这里插入图片描述
  内置的js代码主要用于设置表格样式及处理事件,同时处理搜索事件。调用layui的table.render函数设置表格样式,主要包括:
  1)用elem属性设置表格容器元素,同时用url设置调用UserManage/UserController的Index函数分页获取所有用户数据;
  2)用limit、limits、page属性设置数据分页显示;
  3)用toolbar属性设置头部工具栏,指定的元素id定义在_AminLayout.cshtml内,且根据不同的页面显示不同的工具栏内容,在本页面中工具栏中有添加按钮(按钮在系统管理->按钮管理中配置);
  4)用where属性设置调用Index时附加的其它参数;
  5)用cols属性设置表格显示列,其中第一列采用type:‘number’设置为序号列,其它列对应Index函数返回值的属性,账户状态列(对应字段EnableMark)、性别列(对应字段Gender)采用templet属性以模版函数方式设置列显示样式,最后一列用templet属性以模版选择器形式指定_AminLayout.cshtml文件中定义的按钮模版(按钮在系统管理->按钮管理中配置)。

在这里插入图片描述
  除上述设置之外,还定义了工具栏、操作按钮、检索按钮的响应函数,排序和检索的处理逻辑类似,使用table.reload调用UserManage/UserController的Index函数获取并显示结果,其余的添加、编辑和删除按钮中,删除按钮的事件处理函数逻辑为调用UserManage/UserController的Delete函数删除数据,然后使用table.reload重载页面数据。
在这里插入图片描述
  调用form.on('switch(enabled)'设置表格中账户状态列开关事件的事件处理函数,其内部调用tools.submitConfrim函数提示用户是否在启用和禁用间切换,确定的话则调用UserManage/UserController的Enable函数更新账户状态,同时更新页面数据,取消的话则还原账户状态列之前的显示值。
在这里插入图片描述
  新建和编辑用户数据使用的同一页面,位置为UserManage\Views\User\Form.cshtml页面,使用layui的表单组件、上传组件、日期选择组件设置样式。如果是新建用户,则直接弹出页面填写信息,而编辑数据的话,主页面会通过url传递key参数,在编辑页面中调用UserManage/UserController的GetForm函数获取用户数据初始化编辑页面的对应元素数据,同时调用SystemManage/RoleController的Select函数获取角色数据初始化下拉框数据。新建或编辑完成后,主页面的js中设置了回调函数,最终调用UserManage/UserController的Form函数新增或更新数据。
在这里插入图片描述

  用户管理页面支持按重置用户密码,重置密码页面位于为UserManage\Views\User\Reset.cshtml页面,使用layui的表单组件设置样式。在重置密码页面输入新密码后,主页面的js中设置了回调函数,最终调用UserManage/UserController的Reset函数重置指定用户密码。
在这里插入图片描述
参考文献:
[1]https://gitee.com/miss_you/Blog
[2]https://layui.dev/docs/2/

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/842201.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

SUPRA:无须额外训练,将Transformer变为高效RNN,推理速度倍增

Transformers 已经确立了自己作为首要模型架构的地位,特别是因为它们在各种任务中的出色表现。但是Transformers 的内存密集型性质和随着词元数量的指数扩展推理成本带来了重大挑战。为了解决这些问题,论文“Linearizing Large Language Models”引入了一…

android-mvp模式

mvvm可以理解成使用databing的mvp模式,modleview 通过接口让view和Presenter层解耦 从图中就可以看出,最明显的差别就是view层和model层不再相互可知,完全的解耦,取而代之的presenter层充当了桥梁的作用,用于操作view…

set怎么实现有序

在Java集合框架中,Set接口的实现类主要有三种常见的变体:无序的HashSet、保持插入顺序的LinkedHashSet和按自然顺序或自定义比较器排序的TreeSet。要实现有序的Set,可以使用LinkedHashSet或TreeSet。 有序的Set实现类 LinkedHashSet&#xf…

0基础认识C语言(代码实操)

首先呢大家要知道C语言的常见格式如下 #include <stdio.h> int main() {return 0; } 可能看起来会有点懵&#xff0c;但是不着急&#xff0c;咱们一句一句讲 #include <stdio.h> 这是一个头文件&#xff0c;是标准输入输出&#xff0c;怎么理解呢&#xff0c;你…

芯片设计 | 什么是 NVMe?

文章目录 什么是 NVMe&#xff1f;什么是固态硬盘&#xff1f;为什么 NVMe 很重要&#xff1f;NVMe、SAS 和 SATA 之间的区别只有SSD运行在NVMe上PCIe和NVMe有关系&#xff0c;但它们不是同一个东西NVMe-oF连接SSD到网络NVMe 的工作原理是什么&#xff1f;NVMe SSD 外形尺寸M.2…

零售品牌做好差旅报销管理,真的能省钱

一年一度的“618”如期而至,甚至启动更早了。 各大厂商宣布取消延用了十多年的预售机制,主打“现货开卖”,充分回归“消费者价值”。 零售品牌给消费者省钱,更要给自己省钱。而这前提是充分了解“钱花在哪了”、“怎么花更合理”: ● 商业化BD、促销、营销等市场活动频繁,差…

手动验证 Azure AD 并设置登录状态

几个核心要点 1. client_id&#xff0c;client_secret&#xff0c;username&#xff0c;password 是必须要的 2. 通过 https://login.microsoftonline.com/...... 提交参数&#xff0c;成功就可以拿到 token 3. 自定义一个 CustomAuthenticationStateProvider 类继承自抽象类…

如何知道huggingface/modelscope的大模型的模型层名字

下载模型后&#xff0c;有个文件叫model.safetensors.index.json&#xff0c;里面有。 你下载的大模型位置在用户名/.cache/huggingface/hub/大模型名差不多这个路径。 或者直接print(parameters.name)&#xff0c;但是这样打出来特别多&#xff0c;很难看。差不多这样写&am…

LeetCode hot100-52-G

994. 腐烂的橘子 在给定的 m x n 网格 grid 中&#xff0c;每个单元格可以有以下三个值之一&#xff1a;值 0 代表空单元格&#xff1b;值 1 代表新鲜橘子&#xff1b;值 2 代表腐烂的橘子。每分钟&#xff0c;腐烂的橘子 周围 4 个方向上相邻 的新鲜橘子都会腐烂。返回 直到单…

软件项目管理过程中的会议管理

项目会议类型 软件项目管理中的会议通常包括评审会议、项目例会、技术研讨会、项目启动会、项目回顾会、风险管理会议等多种类型&#xff0c;每种类型的会议都有其特定的目的和参与者。 1. 评审会议&#xff08;Review Meetings&#xff09;&#xff1a; & 需求评审&…

2024年【山东省安全员C证】考试及山东省安全员C证报名考试

题库来源&#xff1a;安全生产模拟考试一点通公众号小程序 2024年【山东省安全员C证】考试及山东省安全员C证报名考试&#xff0c;包含山东省安全员C证考试答案和解析及山东省安全员C证报名考试练习。安全生产模拟考试一点通结合国家山东省安全员C证考试最新大纲及山东省安全员…

VS2022配合Qt与boost.asio实现一个TCP异步通信系统远程操作mysql数据库

上一篇博客我们通过boost.asio搭建了一个简单的异步服务器&#xff0c;但是那是基于命令行的&#xff0c;所有用起来还是相当枯燥的&#xff0c;这次我们配合Qt实现一个简陋的前端页面来控制后端mysql数据库中的表&#xff0c;实现添加密钥的功能(本次博客使用的boost版本是1.8…

数据结构的直接插入排序(C语言版)

一.直接插入排序的基本概念 1.直接插入排序的基本思想 将数组分为已排序和未排序两部分。 每次从未排序部分取出一个元素,将其插入到已排序部分的合适位置,使得已排序部分保持有序。 重复步骤2,直到整个数组有序。 2.排序的工作原理 假设前 i-1 个元素已经有序,现在要将第…

前端开发的设计思路【精炼】(含数据结构设计、组件设计)

数据结构设计 用数据描述所有的内容数据要结构化&#xff0c;易于程序操作(遍历、查找)&#xff0c;比如数组、对象、对象为元素构成的数组&#xff08;每个元素记得设置唯一的 id 属性&#xff0c;以便对元素进行删改操作&#xff09;数据要可扩展&#xff0c;以便增加新的功能…

力扣 42. 接雨水 python AC

双指针 class Solution:def trap(self, heights):l, r 0, len(heights) - 1maxl, maxr 0, 0ans 0while l < r:maxl, maxr max(maxl, heights[l]), max(maxr, heights[r])if maxl < maxr:ans maxl - heights[l]l 1else:ans maxr - heights[r]r - 1return ans单调栈…

清除微信小程序默认button样式

button {background-color: transparent;border: none;color: inherit;font: inherit;line-height: normal;overflow: visible;outline: none;cursor: pointer;padding: 0;margin: 0; }button::after {border: none; }.button-hover {background-color: transparent; }

设置 border 边框单侧样式 - HarmonyOSNext

设置 border 边框单侧样式,通过 api 中查看 border(value: BorderOptions): T; BorderOptions 又包含了若干个子属性 1.width?: EdgeWidths | Length; 2.color?: EdgeColors | ResourceColor; 3.radius?: BorderRadiuses | Length; 4.style?: EdgeStyles | BorderStyle; 其…

Java 为什么使用泛型

目录 概述 1. 如下我们需要不同对象打印内容 2. 这时候就可以引入泛型使用 3. 泛型和Object的区别 概述 Java泛型&#xff08;Generics&#xff09;是JDK5.0引入的一种特性&#xff0c;它允许程序员在定义类、接口和方法时使用类型参数&#xff08;type parameters&#…

MYSQL框架结构

MYSQL框架结构 通过解析器和预处理生成解析树&#xff0c;预处理判断是否合法&#xff0c;如果合法则调用优化器去进行优化。

World Creator v2.1.0 解锁版安装教程 (GPU三维地形生成软件)

前言 World Creator是一款功能相当强大的地形景观生成器&#xff1b;可以完全根据自己的需求来对地形、景观生成您需要三维模型&#xff0c;内置的大量预设&#xff0c;让您的创建拥有无限的可能性。 一、下载地址 下载链接&#xff1a;http://dygod/ITSource 点击搜索&…