(1)软件环境
为了完全安装包括Tomcat6.0.5服务器端工具在内的组件,开发平台采用IBM公司的经典版本Myeclipse8.5,win32位操作系统,。
(2)开发工具
在数据库方面,数据库实现了对数据的存储,同时也能够表达出现实中的具体事务或事务间的关系。数据库提供的数据模型能够将数据之间的逻辑关系归纳起来,并通过数据操作语言对数据进行操作。数据库技术提供诸多便利,是每个系统都要使用到的技术。该在线项目系统主要是运用Mysql5.0数据库完成对数据的存储和操作,与Mysql5.0很好兼容的Mysql_Front进行界面花的数据库管理。
前端界面开发工具则采用Dreamweaver8.0。在Dreamweaver中编写的HTML能在浏览器中的有很高的解析速度和执行速度以及开发使用的方便性使得它比其他编译—链接—测试的语言的性价比高得多。
(3)所用技术及平台总结:
A. 运用面向对象编程技术(Java)
B. 运用静态网页编程语言(Html)
C. 掌握网页动态脚本语言(Javascript)
D. 熟悉使用Myeclipse和Dreamweaver以及Chrome内核浏览器等软件
E. 熟练使用文档工具编写软件文档
图3.1 项目综合管理模块
本系统采用Mysql数据库,数据库名称为ProjectManager。
图3.2管理员ER图
图3.3项目人员ER图
图3.4论文信息ER图
图3.5校园科研项目ER图
根据E-R图可得到以下表:
管理员信息表:administrators(ID,username, pwd ,cx,addtime)
项目信息表: projectinfo (ProductID,ProductName, ProductSort ,Detail,GetTime)
项目人员信息表: renyuan(ID, bianhao, xingming, danwei,addtime)
论文信息表: lunwenxinxi (ProductID, ThesisSort, PublicationID, PublicationName,PublicationLevel, Volume)
子项目信息表: xiangmuleibie(ID, suoshuxiangmu ,renyuanbianhao,fumingcheng ,addtime)
为了尽量避免在关系型数据库中产生插入异常、删除异常、冗余度大等问题,需要在数据库中,对数据库名称、对象名称和形式进行规范化。
在关系数据库中,用范式来衡量数据库规范的层次或深度。区别范式的根据是要区分数据依赖,改变各种范式最终的目的是优化数据库。根据关系模式满足的不同性质和规范化的程度,把关系模式分为第一范式、第二范式、第三范式、BC范式和第四范式等。范式越高、规范化的程度也越高,关系模式则越好。
规范化的利弊:
规范化的优点是明显的。他避免了大量的数据冗余,节省了空间,保持了数据的一致性,如果完全达到3NF,不会在超过一个地方更改同一个值。在记录经常的改变,这个优点会超过所有可能的缺点。它最大的不利是,当信息放置在不同的表中时,增加了操作的难度,同时把多个表连接在一起的花费也是巨大的。规范化设计所带来的性能问题比较严重,就需要进行非规范化了。非规范化是为了获得性能上的利益所进行的违反规范化规则的操作。它是一个性能利益分析,尝试和再尝试和不断的再评估过程。
4 系统的实现
4.1登录模块的实现
登录模块主要是一个登录界面,用于验证用户的账号和密码的正确性,如输入的信息无误,则跳转到相应的界面,如果输入信息有误,则提示错误。其中因为成员和管理员的信息是位于不同的表中,所以登录界面也是分开的,但是两者是可以相互跳转的,登录界面的效果图如下所示:
图4.1登陆界面
本模块是系统登陆界面,实现的功能是检测合法用户,验证其用户名密码,以杜绝非法用户侵入系统。实现本模块的主要HTML代码如下所示:
<form action="registerServlet" method="post" onSubmit="return doCheck();">
<input type="hidden" name="flag" value="login"/><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="31%" height="35" class="login-text02">用户名称:<br /></td>
<td width="69%"><input name="username" type="text" id="username" size="30" onblur="doCheckUsername()" /><span id="username_tip" style="color:red;"></span></td>
</tr>
<tr>
<td height="35" class="login-text02">密 码:<br /></td>
<td><input name="password" type="password" id="password" size="33" /><span id="password_tip" style="color:red;"></span></td>
</tr>
<tr>
<td height="35" class="login-text02">验证图片:<br /></td>
<td><img src="checkCode.jsp?<%=Math.random()%>" width="109" height="40" /> <a href="checkCode.jsp?<%=Math.random()%>" class="login-text03">看不清楚,换张图片</a></td>
</tr>
<tr>
<td height="35" class="login-text02">验证码:</td>
<td><input name="identicpde" type="text" id="identicpde" size="30" onblur="doCheckCode()" /><span id="identicpde_tip" style="color:red;"></span></td>
</tr>
<tr>
<td height="35"> </td>
<td><input name="Submit2" type="submit" class="right-button01" value="确认登陆" />
<input name="Submit232" type="submit" class="right-button02" onClick="doClear();" value="重 置" />
<a href="register.jsp">还没有账号?</a></td>
</tr>
<tr><td colspan="2" style="color:red;font-size:12px;">
<%
if(request.getParameter("flag")!=null){
out.println(request.getParameter("flag"));
}
%>
</td></tr></table>
</form>
实现本模块的主要Javascript代码如下所示:
<script type="text/javascript">
function doCheckUsername(){
var username=document.getElementById('username').value;
if(username=="" ||username==null)username_tip.innerHTML="账号不能为空!";
else _AjaxService_js.isUsername(username,callback1);
}
function callback1(data1){
if(data1==true){username_tip.innerHTML="账号不存在!"}
else username_tip.innerHTML="";
}
function doCheckCode(){
var identicpde=document.getElementById('identicpde').value;
if(identicpde=="")identicpde_tip.innerHTML="请输入验证码!";
else if(identicpde!=<%=(String)session.getAttribute("randomCode")%>) identicpde_tip.innerHTML="验证码错误!";
else identicpde_tip.innerHTML="";
}
4.2 操作主界面
图4.2操作主界面
当用户通过登陆界面的验证后,进入操作界面(图3.10),在此界面可以对系统信息进行相应权限的维护操作。界面可分为三部分,其中上部分为系统名称及欢迎辞等信息;下方左侧为该教师或学生帐号对应权限的所有操作,以树状导航栏展列出来;右侧为操作区域,当未进行任何操作时,显示系统信息。
实现本模块的主要代码如下所示:
<table width="95%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="20" colspan="9" align="center" bgcolor="#EEEEEE"class="tablestyle_title"> 系统项目列表 </td>
</tr>
<tr>
<td height="40" class="font42"><table width="100%" border="0" cellpadding="4" cellspacing="1" bgcolor="#464646" class="newfont03">
<tr>
<td width="8%" height="20" align="center" bgcolor="#EEEEEE">项目名称</td>
<td width="10%" align="center" bgcolor="#EEEEEE">项目起始时间</td>
<td width="10%" align="center" bgcolor="#EEEEEE">项目进度</td>
<td width="10%" align="center" bgcolor="#EEEEEE">主负责人</td>
<td width="10%" align="center" bgcolor="#EEEEEE">所属用户</td>
<td width="8%" align="center" bgcolor="#EEEEEE">项目状态</td>
<td width="16%" align="center" bgcolor="#EEEEEE">详情</td>
</tr>
<%Iterator<Project_VO> it=list.iterator();
while(it.hasNext()){
Project_VO pvo=(Project_VO)it.next();
%>
<tr>
<td height="20" bgcolor="#FFFFFF"><div align="center"><%=pvo.getName() %></div></td>
<td bgcolor="#FFFFFF"><div align="center"><%=pvo.getBeginingtime() %></div></td>
<td bgcolor="#FFFFFF"><div align="center"><%=pvo.getProcess() %></div></td>
<td bgcolor="#FFFFFF"><div align="center"><%=pvo.getAdministrate() %></div></td>
<td bgcolor="#FFFFFF"><div align="center"><%=adminservice.queryUsername(pvo.getUid()) %></div></td>
<td bgcolor="#FFFFFF"><div align="center" class="top-font01" id="lockstatus"><%if(pvo.getLevel()==0){%>未锁定<%}else if(pvo.getLevel()==1){%>锁定<%} %></div></td>
<td bgcolor="#FFFFFF"><div align="center"><a href="listrenwumingxi.jsp?p_id=<%=pvo.getId() %>">查看</a> |
<%if(pvo.getLevel()==0){%>
<a href="#" id="lockorunlock" onclick="getResult('<%=pvo.getId() %>',1)">锁定</a>
<%}else if(pvo.getLevel()==1){%>
<a href="#" id="lockorunlock" onclick="getResult('<%=pvo.getId() %>',0)">解锁</a>
<%}%></div></td>
</tr>
<%
}
%>
</table></td>
</tr>
</table>
4.3项目管理模块
图4.3项目信息管理界面
在此系列页面中,用户可进行所有关于论文项目的管理操作,其中第二个界面图为添加用户操作界面,输入用户名、密码及确认密码后,系统自动将信息读入数据库。
第一个界面图为已有的该项目的管理信息操作,包括信息列表读取,查询该项目下相应的子项目,相应的论文文档等。实现本模块的主要代码如下所示:
<table width="95%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="40" class="font42"><table width="100%" border="0" cellpadding="4" cellspacing="1" bgcolor="#464646" class="newfont03">
<tr>
<td height="20" colspan="9" bgcolor="#EEEEEE" class="tablestyle_title" style="text-align:center;"> 任务细列表 </td>
</tr>
<tr>
<td width="15%" height="20" align="right" bgcolor="#FFFFFF">任务标题:</td>
<td width="85%" align="left" bgcolor="#FFFFFF"><%=pvo.getName()%></td>
</tr>
<tr>
<td height="20" align="right" bgcolor="#FFFFFF">项目负责人:</td>
<td bgcolor="#FFFFFF"><%=pvo.getAdministrate() %></td>
</tr>
<tr>
<td height="20" align="right" bgcolor="#FFFFFF">任务参与人:</td>
<td bgcolor="#FFFFFF"><%=count %></td>
</tr>
<tr>
<td align="right" bgcolor="#FFFFFF">实际开始日期:</td>
<td bgcolor="#FFFFFF"><%=pvo.getBeginingtime() %></td>
</tr>
<tr>
<td align="right" bgcolor="#FFFFFF">实际完成日期:</td>
<td bgcolor="#FFFFFF"><%=pvo.getFinishtime() %></td>
</tr>
<tr>
<td align="right" bgcolor="#FFFFFF">完成进度:</td>
<%if(pvo.getProcess()==0){%>
<td bgcolor="#FFFFFF">未完成</td>
<%}else if(pvo.getProcess()==1){ %>
<td bgcolor="#FFFFFF">已完成</td>
<%} %>
</tr>
<tr>
<td align="right" bgcolor="#FFFFFF" height="80">任务说明:</td>
<td bgcolor="#FFFFFF"><%if(pvo.getDescription()==null)out.print("");else out.print(pvo.getDescription());%></td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
</table>
<table width="95%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="6"><img src="../images/spacer.gif" width="1" height="1" /></td>
</tr>
<tr>
<td height="33"><table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" class="right-font08">
<tr>
<td>
<a href="listshangchuan.jsp?p_id=<%=p_id %>" name="document"/> 项目文档</a>
<a href="listzhiwu.jsp?p_id=<%=p_id %>" name="paticipate">人员分配 </a>
<a href="#" name="subproject"/>子项目 </a>
</td>
</tr>
</table>