基于MVC和FineUI的系统开发框架研究

尹向兵，周　婷（.安徽警官职业学院　教务处，安徽　合肥　3003；.安徽城市管理职业学院　国际商务系，安徽　合肥　3060）

基于MVC和FineUI的系统开发框架研究

尹向兵1，周婷2
（1.安徽警官职业学院教务处，安徽合肥230031；2.安徽城市管理职业学院国际商务系，安徽合肥230601）

摘要：为了降低Web系统开发的复杂性，实现团队协作开发，运用FINEUI开发系统界面实现完美用户体验。文章深入研究了MVC模式和FINEUI技术并提出两者进行高效整合的Web系统开发框架，提高系统可扩展性、健壮性和可维护性，并大大缩短MIS开发周期。文章以在线自助组卷系统模块为例研究其原理、实现和应用。

关键词：MVC；FineUI；框架；系统开发

0　引言

通过分析Web系统开发模式的原理以及View层实现的过程，重点研究了基于FineUI框架完成Web系统开发的特点和优势。针对应用系统开发业务过程中团队开发的需求，团队成员专注点不同和快速完成视图设计，提出了使用MVC模式并基于FineUI框架开发的解决方案。系统开发生命周期成本降低，程序员可以集中精力与业务逻辑，界面程序员更集中于表现形式上，视图层和业务逻辑层的分离也使得Web程序代码更易于修改和维护，达到标准定义、松散耦合、分散关注、逻辑复用的目的。

1　系统开发框架设计

实现一个系统开发，要有UI设计师，来设计超炫的界面，有DB设计人员完成优良的数据库设计，还有后台的逻辑代码人员。如何将这些人员有效地管理起来，从软件开发流程上已经有MSF等指导思想且这个流程中的代码编写环节，利用MVC多层式架构实现软件体系架构设计。

采用MVC设计模式开发Web系统，对于开发复杂的应用系统开发，程序人员可以将更多精力集中于业务某一方面，而不需要考虑系统中其他业务逻辑。使用FineUI框架来处理View（视图）中数据显示部分，通过代码移植，能快速开发应用系统视图部分。基于MVC模式和FINEUI架构的Web系统开发实现了高效快速开发的要求。

1.1深入三层架构设计模式

三层系统结构将应用程序分成3个不同的逻辑层次：表示层（UI）、业务逻辑层（BLL）和数据访问层（DAL）［1］。为了更好地在MVC中传递数据，引入模型层（Models），它是将数据库中所有数据表转化成对应实体类。

1.2FINEUI简介

FineUI是一组基于EXT JS的专业ASP.NET控件库，拥有原生的AJAX支持和华丽的UI效果［2］。主要表现为：首先，基于EXT JS，它是一个非常优秀的Ajax框架，用JavaScript编写，与后台技术无关，可以用来开发具有绚丽外观的富客户端应用［3］；其次，丰富ASP.NET控件库，FineUI正是基于.NET服务器控件和HTML控件开发出强大的网络应用程序；最后，FineUI是将二者结合的产物，是一个深度封装的控件库。

1.3系统开发框架技术微软企业类库

微软企业类库又称企业库，主要作用是解决程序开发过程中所面临的Common问题，如Security、Log⁃ging、Data Access、Configuration Manage等，整体封装这些系统通用模块到程序包中，企业库包含.NET类库大部分实践［4］。

2　MVC+FineUI框架结构和运行原理

2.1框架的整体结构

MVC+FineUI框架结构如图1所示，分为表示层、业务逻辑层、数据访问层和实体模型层4个部分。表现层UI是实现用户体验标准界面；系统应用服务层或契约层Service实现用户正面服务；业务逻辑层BLL是操作对象的方法类的集合；数据访问层DAL是操作对象想要获取的数据逻辑存放点；实体模型层Model是操作对象的属性类的集合。

图1　MVC+FineUI框架结构Fig.1 Framework of MVC+FineUI

2.2架构的运行原理

各部分调用关系如图2所示。从图2可以看出，在数据访问中，完全采用了“面向接口编程”思想。用户通过浏览器FineUI控件向服务器发出请求映射，通过表示层中的控制器实现用户正面服务，依赖接口编程，替换简单工厂来实现，在数据库访问接口层实现继承关系，进入数据访问实现层DAO，实现所有子类的增删改查的公用方法，控制器调用通用类完成结果数据到ASP.NET页面，有FineUI控件接收数据，完成结果显示［5］。

图2　MVC+FineUI框架调用关系Fig.2 Calling relationship of MVC+FineUI framework

3　MVC+FineUI开发框架的实现

MVC+FineUI开发框架的应用是以自助式组卷抽题及成绩分析系统为例，研究基于MVC模式的多层开发，降低耦合，提高模块独立性，团队分工协作完成系统开发。该系统主要用户角色有学生、教师、管理员，实现功能有科目管理、章节管理、题库管理、班级管理、学生管理、手动组卷、随机组卷、阅卷管理和成绩查询等，采用当前流行的B/S模式开发。

3.1Models层构建

根据数据库中数据表编写实体类，构建字段并序列化［Serializable］实体类，实体类的属性为Public。以管理员表Manager为例，将数据表Manager转化为实体类Manager，本系统对于多个用户角色使用的不同表，达到统一登录界面，笔者编写的一个视图如下：

create view user_info

as

select ID，ManagerNO as Account，Name，Password，RANK from managers union

select ID，TeacherNO，Name，Password，′4′from teachers union

select ID，StudentNO，Name，Password，′5′from students union

select ID，EnterpriseNO，ConnectMan，Password，′6′from enterprises

3.2表示层（UI）构建

表示层主要使用FineUI框架代替.Net服务器组件完成异步更新，展现高效绚丽的客户端界面，实现良好的用户体验。FineUI和MVC的整合首先需要对FineUI.dll和Newtonsoft.Json.dll的引用，将extjs、ex⁃tjs_builder拷贝到项目根目录下，并配置项目web.config文件，部分配置代码如下：

......

3.3契约层（Services）构建

根据业务正面编写的系统功能清单，在表示层和业务层之间添加契约层，利用业务层类去实现契约层接口，契约层部分代码如下。

查看某管理员信息接口：

Manager GetManager（int managerID）；

新增管理员信息接口：

Result NewManager（Manager manager）；

修改某管理员信息接口：

Result ModifyManager（Manager manager）；

3.4业务层（BLL）构建

业务层是根据表示层业务情况，处理业务功能，在系统中去实现契约层的接口，以Manager业务为例，查看管理员业务信息代码如下：

///功能：查看某管理员信息

public Manager GetManager（int managerID）

{ try

{ //调用数据库查询必要的数据

ManagerDao dal = new ManagerDao（）；

string where = string.Format（"［ID］={0}"，managerID）；

List list = dal.Select（where）；

//结果处理

if（list.Count > 0）

{ return list［0］；}

return null；}

catch（Exception ex）{

LogHelper.Error（ex.Message）；

return null；}

}

3.5数据访问层（DAL）构建

利用数据访问层为Manager实体类构建数据访问类DAO，该数据访问类处理数据库增删改查的基本操作，Manager数据访问类部分代码如下：

public class ManagerDao

{ ///表的插入

/// 实体类

public bool Insert（Manager entity）

{ // SQL语句

string sql ="INSERT INTO［managers］（［ManagerNO］，［Name］，［Password］，［DepartmentID］，［Tele⁃phone］，［Email］，［Rank］，［Remove］）VALUES（@ManagerNO，@Name，@Password，@DepartmentID，@Tele⁃phone，@Email，@Rank，@Remove）"；

// SQL参数

IDataParameter［］cmdParms = new SqlParameter［］{

new SqlParameter（"@ManagerNO"，entity.ManagerNO），...此处省略部分字段...new SqlPa⁃rameter（"@Remove"，entity.Remove），}；

return SqlHelper.Instance.ExecuteNonQuery（System.Data.CommandType.Text，sql，cmdParms）> 0 ? true：false；}

4　结语

通过系统分析MVC模式结构原理以及FineUI界面用户体验，提出MVC模式和FineUI二者技术进行高效整合的Web系统开发模式，采用异步交互，实现高效、华丽、更炫的用户体验，可以提高开发效率和对象组件之间的耦合性，构建一个功能强大、使用灵活、稳定可靠的Web开发框架。

参考文献（References）

［1］密君英.基于三层架构的ASP.NET项目实战教程［M］.北京：中国电力出版社，2011.

［2］SANSHI.FineUI：基于jQuery/ExtJS的ASP.NET控件库［EB/OL］.（2012-02-11）［2015-03-21］.http：//www.cnblogs.com/ sanshi/archive/2012/02/11/2347235.html.

［3］白鹏皋，李兵，陈铁胜.基于FineUI的零部件管理系统［J］.软件导刊，2014，13（4）：61-63.

［4］周文红.基于ASP.NET MVC框架的Web应用开发［J］.计算机与现代化，2013（10）：197-199.

［5］黎吾鑫.基于Extjs_SpringMVC的Web系统框架及应用研究［J］.云南大学学报，2013，35（S2）：110-115.

（责任编辑：范建凤）

System Development Framework Based on MVC and FineUI

YIN Xiangbing1，ZHOU Ting2
（1.Dean′s Office，Anhui Vocational College of Police Officers，Hefei 230031，Anhui，China；2.International Business Department，Anhui Occupational College of City Management，Hefei 230601，Anhui，China）

Abstract：In order to reduce the complexity of Web system development，and realize the team development，used FINEUI development system interface to achieve the perfect user experience.Deeply researched the MVC pattern and FINEUI technology，put forward the efficient integration of Web system development framework，to improve the system scalability，robustness and maintainability，and greatly shorten the development cycle of MIS.Taking the online self test system module as an example to study its theory，implementation and application.

Keywords：MVC；FineUI；frame；system development

作者简介：尹向兵（1981—），男，讲师，硕士，研究方向：网络安全。

基金项目：安徽省省级重点教学研究项目（2013jyxm400）

收稿日期：2015-04-21

DOI：10.16389/j.cnki.cn42-1737/n.2015.04.010

中图分类号：TP391

文献标志码：A

文章编号：1673-0143（2015）04-0336-04