遵照Metronic的Bootstrap开发框架经验总结(8)–框架功用完全界面介绍

在前面介绍了一多样的《基于Metronic的Bootstrap开发框架经验总计》的小说小说,小说重假诺介绍各种知识点的情节,对框架的总体性界面没有很好的演讲,本篇小说首要介绍这多少个Bootstrap框架的总体性成效界面,介绍其中使用的知识点和全体性的界面。希望读者对框架有一个更加直观、真实的认识明白,界面设计以及有关思路可以借鉴提升,也得以对相关的始末展开互动探讨,共同提升。

1、《基于Metronic的Bootstrap开发框架》技术特点

1)采纳新式最炫的Bootstrap响应式框架技术

全方位基于Metronic的Bootstrap开发框架,界面部分接纳较新的Bootstrap技术,拔取当下流行的Bootstrap3.x,集成了无数功效强大的Bootstrap控件。

Bootstrap是一个前端的技能框架,很多平台都可以动用,JAVA/PHP/.NET都可以用来做前端界面,整合JQuery能够兑现万分充裕的界面效果,近期也有成百上千Bootstrap的插件可以提供给我们利用,本框架集合了成百上千最为理想的插件,能给大家Web的用户体验提高到一个史无前例的程度。

Metronic是一个海外的基于HTML、JS等技术的Bootstrap开发框架整合,整合了诸多Bootstrap的前端技术和插件的采取,是一个相当正确的技术框架。本框架以这些为底蕴,结合本人对MVC的Web框架的研商,整合了基于MVC的Bootstrap开发框架,使之可以符合实际项目的结构亟待。

框架后台拔取基于C#的MVC技术,是目前.NET开发最为成熟流行的技艺,框架后台数据库扶助Oracle、SqlServer、MySql、Sqlite、Access等正常数据库,可通过部署举行任意切换,使用Enterprise
Library模块举行多少访问的操纵,使得数据访问更便宜自在。

总体框架开发使用Visual Studuio 2013以及页面编辑工具Sublime
Text结合开发,页面以及后台代码,通过代码生成工具Database2夏普(Sharp)举办急忙支付,实现全体性开发的最大频率提高。

框架的共同体布局如下所示:

图片 1

控制器设计:Bootstrap开发框架沿用了我的《Winform开发框架》和《基于EasyUI的Web框架》的诸多架构设计思路和特征,对Controller举行了包装。使得控制器可以取得很好的持续关系,并能以更少的代码,更高效的支付效用,实现Web项目标支出工作,整个控制器的统筹思路如下所示。

图片 2

权力决定:大好的控制器设计规则,可以为Web开发框架本身提供了很好用户访问控制和权杖决定,使得用户界面彰显菜单、Web界面的按钮和情节、Action的交由控制,均能在总体权限效率分配和操纵之下。

图片 3

代码急速生成:美妙的架构使得无论在工作逻辑层、控制器层、Web界面的UI层,均能提供联合的代码逻辑,这么些代码均能经过代码生成工具Database2Sharp举办转移。Web界面代码可以充裕利用代码生成工具Database2Sharp的元数据消息,实现Web界面的快速变化。有效压缩失误的几率,提升Web界面编码的开销效率和意趣,更可以使得公司中间的编码形式开展高效的统一。

图片 4 

Enterprise
Library代码生成,可以长足变动除界面外的全部性的框架代码,Bootstrap的Web界面代码生成,可以很快转移基于Metronic的Bootstrap的前端界面代码和后台控制器代码,界面部分包括查询、分页、数据展现、数据导入导出、新增、编辑、查看、删除等基础效用界面,生成后大家得以按照那些基础上进展简要、急忙的修改即可符合实际需要,极大增进我们Web界面的开发成效。

框架布局:以下是自家全部性项目的总的效果图。

图片 5

【系统菜单栏】的始末,是动态从数据库里面获取的菜谱;【系统顶栏】放置一些信息呈现,以及提供用户对个体数据快捷处理,如查看个人消息、注销、锁屏等操作内容;内容区一般包括【树列表区】、【条件查询区】和【列表数据及分页】内容,内容区域紧虽然可视化体现的数码,可以因而树列表控件、表格控件举办呈现,一般数量还有增删改查、以及分页的内需,由此需要结合各个效用的拍卖。别的,用户的数据,除了查询彰显外,还索要有导入、导出等相关操作,这一个是常规性的数目处理效果。

菜单的处理和显示:一般为了管住有利于,菜单分为三级,选中的菜系和另外菜单样式富有区别,菜单可以折叠最小化,效果如下所示。

图片 6 
 图片 7

 

2、《基于Metronic的Bootstrap开发框架》模块界面介绍

2.1 首页图表模块界面

图片 8

2.2 系统顶栏效率

图片 9

 

图片 10

 

2.3 行业动态效用(政策法规、通告通知、动态音讯)

政策法规/公告通告/动态音讯 列表界面

图片 11

编纂界面如下所示:

图片 12

查看内容界面如下所示:

图片 13

 

2.4 客户信息保管

客户列表界面如下所示:

图片 14

客户音讯编辑界面:

图片 15

客户新闻导入界面:

图片 16

 

2.5 客户联系人管理

图片 17

客户交换人增长/编辑界面

图片 18

客户联系人查看界面

图片 19

附件音讯界面

图片 20

 

2.6 通讯录管理

报导录列表

图片 21

通讯录编辑界面如下所示。

图片 22

 

2.7 权限管理 

1) 系统用户 列表界面

图片 23

系统用户导入界面

图片 24

系统用户编辑界面

图片 25

图片 26

图片 27

系统用户的画像上传和编辑

图片 28

系统用户删除确认对话框。

图片 29

系统用户的RDLC报表界面。

图片 30

 

2)机构管理界面

图片 31

协会单位涵盖用户编辑界面

图片 32

 

3)用户角色管理

图片 33

角色可操作效能汇聚体现

图片 34

角色可访问数据权限决定:

图片 35

角色包含机构管理:

图片 36

4)系统机能管理

图片 37

5)系统菜单管理

图片 38

编制菜单新闻界面:

图片 39

选料菜单图标界面:

图片 40

 

6)系统登录日志管理

图片 41

 

7)通用字典管理

图片 42

8)菜单图标管理

图片 43

9)图片相册管理

图片 44

编纂图片界面如下所示:

图片 45

图片查看界面

图片 46

 

倘诺有趣味,能够继续参照多重作品:

依照Metronic的Bootstrap开发框架经验总计(1)-框架总览及菜单模块的拍卖

据悉Metronic的Bootstrap开发框架经验总计(2)–列表分页处理和插件JSTree的运用

基于Metronic的Bootstrap开发框架经验总括(3)–下拉列表Select2插件的使用

遵照Metronic的Bootstrap开发框架经验总计(4)–Bootstrap图标的提取和采取 

依照Metronic的Bootstrap开发框架经验总结(5)–Bootstrap文件上传插件File
Input的行使

依照Metronic的Bootstrap开发框架经验总括(6)–对话框及指示框的处理和优化

据悉Metronic的Bootstrap开发框架经验总计(7)–数据的导入、导出及附件的查看处理

据悉Metronic的Bootstrap开发框架经验总计(8)–框架功能完全界面介绍

基于Metronic的Bootstrap开发框架经验总括(9)–实现Web页面内容的打印预览和封存操作

 

相关文章