1、参考和具体实现的效果对比
参照的界面效果如下所示。
2、 快速构建系统参数管理界面及后台业务代码
系统参数的信息,应该设计为包含一个大类参数目录和一个具体的参数项目,如下基于SQLServer的数据库表设计所示(基于PoweDesigner设计,便于生成Sql执行)。
然后利用代码生成工具生成相关的代码即可。
SqlSugar框架Winform界面生成】。
因此我们在生成的窗体界面上,增加SplitContainerControl的一个拆分面板区域的控件,并把左侧放置树形列表及查询框,如下界面效果。
3、快速构建系统参数管理的后台业务代码
上面介绍的是Winform的界面生成,为了使得系统能够顺利的跑起来,我们还需要对相关的系统参数表目录和项目访问所需的业务代码,一般的业务代码都需要有CRUD等常规操作的代码,不过还好基于框架的基础上,我们只需要生成一个简单的类,继承自基类就默认具有了这些操作,不需要重复编写代码,简化了代码的处理并提高开发效率。
/// <summary> /// 系统参数配置 应用层服务接口实现 /// </summary> public class SystemParamsService : MyCrudService<SystemParamsInfo,string, SystemParamsPagedDto>, ISystemParamsService { //相关代码 }
详细类文件如下所示,生成了相关的排序条件、查询条件等处理信息。
我们再次回到UI界面的处理上来,由于默认我们生成的界面,都具有了分页查询及编辑明细的功能,因此这部分代码我们不需要调整,我们额外增加了树展示和过滤的功能,因此需要适当修改一下生成的界面代码。
/// <summary> /// 编写初始化窗体的实现,可以用于刷新 /// </summary> public override void FormOnLoad( { InitSearchControl(; InitTree(; BindTree(; InitDictItem(; BindData(; }
标注红色的部分是我们需要额外增加的代码。
/// <summary> /// 初始化树控件 /// </summary> private void InitTree( { this.tree.Columns.Clear(; //控件扩展函数封装处理 this.tree.CreateColumn("CategoryName", "系统参数目录", 160, true; this.tree.InitTree(Id_FieldName, "PID", null, false, false; this.tree.OptionsDragAndDrop.DragNodesMode = DragNodesMode.Single; //设置树的图标集合及逐级图标 this.tree.SelectImageList = this.imageList1; this.tree.CustomDrawNodeImages += (object sender, CustomDrawNodeImagesEventArgs e => { int maxCount = this.imageList1.Images.Count; var index = e.Node.Level < maxCount ? e.Node.Level : 0; e.SelectImageIndex = index; }; //初始化树节点选择事件 this.tree.FocusedNodeChanged += delegate (object sender, FocusedNodeChangedEventArgs e { this.FocusedNodeChanged(; }; this.tree.MouseDoubleClick += (s, e => { menu_EditType_Click(null, null; }; }
而对于树节点的过滤,我们对查询的输入框架进行如下处理代码即可。
/// <summary> /// 实现树节点的过滤查询 /// </summary> private void InitSearchControl( { this.searchControl1.Client = this.tree; this.tree.FilterNode += (object sender, FilterNodeEventArgs e => { if (tree.DataSource == null return; string nodeText = e.Node.GetDisplayText("CategoryName";//参数填写FieldName if (string.IsNullOrWhiteSpace(nodeText return; bool isExist = nodeText.IndexOf(searchControl1.Text, StringComparison.OrdinalIgnoreCase >= 0; if (isExist { var node = e.Node.ParentNode; while (node != null { if (!node.Visible { node.Visible = true; node = node.ParentNode; } else break; } } e.Node.Visible = isExist; e.Handled = true; }; }
触发树节点查询,以及绑定树数据源的处理如下代码所示
/// <summary> /// 选中树节点触发的查询处理 /// </summary> private void FocusedNodeChanged( { if (this.tree.FocusedNode != null { BindData(; } } /// <summary> /// 绑定树的数据源 /// </summary> private async void BindTree( { var result = await BLLFactory<ISystemParamsDirService>.Instance.GetAllAsync(; if (result != null { this.tree.DataSource = result.Items; this.tree.ExpandAll(; } }
其中数据源的获取,我们直接调用基类函数获取对应的列表项目就可以了,如上的代码
BLLFactory<ISystemParamsDirService>.Instance.GetAllAsync(;
对于编辑参数明细的界面项目,我们如果需要微调界面,修改下即可。
系列文章:
《基于SqlSugar的开发框架循序渐进介绍(2)-- 基于中间表的查询处理》
《基于SqlSugar的开发框架循序渐进介绍(4)-- 在数据访问基类中对GUID主键进行自动赋值处理 》
《基于SqlSugar的开发框架循序渐进介绍(6)-- 在基类接口中注入用户身份信息接口 》
《基于SqlSugar的开发框架循序渐进介绍(8)-- 在基类函数封装实现用户操作日志记录》
《基于SqlSugar的开发框架循序渐进介绍(10)-- 利用axios组件的封装,实现对后端API数据的访问和基类的统一封装处理》
《基于SqlSugar的开发框架循序渐进介绍(12)-- 拆分页面模块内容为组件,实现分而治之的处理》
《基于SqlSugar的开发框架循序渐进介绍(14)-- 基于Vue3+TypeScript的全局对象的注入和使用》
《基于SqlSugar的开发框架循序渐进介绍(16)-- 工作流模块的功能介绍》
《基于SqlSugar的开发框架循序渐进介绍(18)-- 基于代码生成工具Database2Sharp,快速生成Vue3+TypeScript的前端界面和Winform端界面》
《基于SqlSugar的开发框架循序渐进介绍(20)-- 在基于UniApp+Vue的移动端实现多条件查询的处理》
《基于SqlSugar的开发框架循序渐进介绍(22)-- Vue3+TypeScript的前端工作流模块中实现统一的表单编辑和表单详情查看处理 》
《基于SqlSugar的开发框架循序渐进介绍(24)-- 使用Serialize.Linq对Lambda表达式进行序列化和反序列化 》
基于SqlSugar的开发框架循序渐进介绍(26)-- 实现本地上传、FTP上传、阿里云OSS上传三者合一处理
基于SqlSugar的开发框架循序渐进介绍(28)-- 快速构建系统参数管理界面