毕业设计（论文）
留言者ID留言者姓名留言管理电子邮箱留言内容留言时间联系电话联系人手机 图 4-3 留言信息E-R图
4.2.2 数据表详细设计
我们的网站采用Microsoft Access 2003作为数据库，使用ADODB.Connection连接数据库。
在建立数据模型的时候首先考虑是要避免重复数据。整个数据库共有cms_about、cms_admin、cms_class、cms_config、cms_flash、cms_link、cms_menu、cms_news等表格。
以下根据模块功能划分，分别介绍本系统所需要的表。 1) cms_about该表用来存储单页显示的页面，“关于我们”和“联系我们”就在这个表中。如表4-1所示：
表4-1 cms_about表 字段名称 id title keys des cont 字段名 ID 标题 关键字 描述 链接 数据类型 自动编号 备注 备注 备注 备注 长度 32 50 32 500 500 备注 该字段设为主键 2) cms_admin表显示管理员信息的相关存储，主要用来记录用户登录后台的用户名、密码、登录时间等信息。如表4-2所示：
表4-2 cms_admin表 字段名称 id admin_name admin_pass ci times 字段名 ID 用户名 密码 登陆次数 登陆时间 数据类型 自动编号 备注 备注 数字 备注 13
长度 32 50 32 500 备注 该字段设为主键 3) cms_books该表主要用来记录留言者的留言内容和相关信息，该内容可以在在线留
毕业设计（论文）
言的模块中可以查询的到。如表4-3所示：
表4-3 cms_books表 字段名称 id mingz mail dianhua shouji neirong shijian work
字段名 ID 留言者姓名 留言者电子信箱 留言者联系电话 留言者手机 留言内容 留言时间 留言者工作单位 数据类型 自动编号 文本 文本 文本 文本 备注 文本 文本 长度 32 50 32 50 50 1000 200 备注 该字段设为主键 14
毕业设计（论文）
第5章 界面设计
本系统界面使用了Swing构建的图形用户界面（GUI），应用程序运行在不同的平台上时的显示效果一致。Swing基于AWT架构之上，提供了更强大的用户界面组件，Swing拥有丰富、便捷的用户界面元素组合，对底层的依赖更少，与平台相关的bug更少。
我的设计背景为浅灰色，然后配以深蓝色的色调。我进行这种色调的搭配主要目的是为了迎合海尔官网和海尔服务平台，与它们保持一致。同时，由于近水楼台，我的同事也都是海尔官网的开发人员和维护人员，我可以请教到海尔网站的一些的设计理念，同时一些海尔的经典的框架结构和图片也为我所用，并将这些融入到我的设计中去。在此我要感谢我的同事们。
主界面全屏显示，提示信息以对话框形式居中，使界面更加整齐划一。其中，查询界面的查询结果以表格形式显示使界面变得更加清晰、操作简单。
登录窗体是整个后台的入口，我们必须拥有正确的登录名和密码我们才能登录到海尔企业管理系统中，登录模块也就保证了程序的安全性。登录窗体设计十分简单，由一个用户名文本框、一个密码文本框、一个验证码对话框和一个登录按钮组成，为了窗体的美观，我还添加了一个海尔企业网站的logo。为了使窗体中的各个组件摆放得更加随意美观，项目采用了绝对布局方式。
各个功能已经通过树形导航进行相关的分类，能够帮助用户尽快选择需要的功能。界面的设置中，提示 信息清楚明白，符合我们的一般的操作流程，用户在登录系统之后能够根据提示信息完成相关的操作。
5.1 系统前台界面设计
海尔企业网站logo是我利用photoshop工具制造完成的，海尔企业本身就很注重自身形象的建设，大型动画片《海尔兄弟》更是人们耳熟能详的。因此，我参考了现有的海尔企业网站的logo进行了稍加修改。
在头部的模板的下部就是菜单栏了，在菜单栏中的选项都是和后台管理中的“首页菜单管理”模块是紧密联系的。在后台通过id将要添加的字段送入数据库中，而前台利用数据库中的select语句将数据库中是字段查询出来，id为menu。如果后台数据库中没有数据的话，就利用if语句进行判断，然后弹出“暂无菜单!请登录后台添加”的对话框。前台头部模块具体如下表5-1所示：
表 5-1 头部模块示意图 海尔企业网站logo 设为首页 加入收藏 用户登录 菜单栏 15
毕业设计（论文）
菜单栏主要分为6个模块，分别是：关于我们、新闻资讯、产品中心、联系我们、在线留言、心育在线。
网站首页可以说是网站的门面，大家浏览你的网站首先看到的就是网站首页，所以首页不仅要做得美观，引人浏览，还要有丰富的内容。所以我们在首页就首页聚集了大量的信息。
关于我们这个模块中，主要是进行海尔集团的总体描述，讲述了海尔的过去和现在。通过简短的文字让客户能够大体的了解海尔。
新闻资讯这个模块，主要是将海尔的每日新闻进行及时的更新，有重要的通告能够及时发布。这个是与后台中的“产品管理”模块是关联的。只要管理员在后台将信息录入，在前台就可以查看到了。
产品中心这个模块，主要是推广海尔的产品，将海尔的174个产品大类依次罗列出来，可以让客户能够清晰的查看相关的信息。而且我们还附有贴图和相关的文字描述，让客户能够在购买前充分的了解到产品的性能，选择出最适合自己的产品。
联系我们这个模块，主要是为了客户与销售人员或工程师进行互动，海尔有一句口号：不是每卖出一件产品，我们就拥有了一个客户。近年来，海尔越来越重视售后的服务，努力提高服务质量。因此，设计联系我们这个模块就十分有必要了。通过“联系我们”这个模块，客户可以随时通过电话、邮件甚至是QQ联系到相关工程师，诉说自己在使用产品中遇到的问题，及时解决相应的麻烦。
在线留言这个模块，主要是客户对产品和服务的一种反馈形式。客户可以将自己的感受或者遭遇通过留言的形式进行反馈。通过我在设计网站的过程，设计了一个专门留言查看页面，所有的评价都可以在这个页面中查看出来。通过留言不仅能够及时将批评和建议及时的反馈，而且起到了监督的作用，让我们的服务的更好。
心育在线这个模块，当初设计的目的主要是针对海尔内部的员工。虽然我在海尔工作的时间不长，但是我发现海尔内部员工普遍的压力很大，而且海尔没有明显的心理辅导部门。我在工作时，就有亲身感受，感觉压力无处排遣，在我身边的同事也有因为压力大而辞职的现象。因此，我想到了用心育在线测试的方法来进行心理辅导，疏导员工的压力。
尾部模块就很简单了，主要是进行版权说明.
中间展示部分是采用模板进行的，其中首页是将菜单栏中的所有模块的集合，具体如下表5-2所示：
16
毕业设计（论文）
表 5-2 首页示意图 头部logo 菜单栏 幻灯片 产品分类 消费类产品 商业类产品 解决方案 技术支持 关于我们 产品推荐 友情链接 版权声明 产品小类 在线留言 联系我们 新闻资讯 5.2 系统后台界面设计
人们容易把网站简单理解成一种工具或者商务活动中的孤立环节，这样理解不仅会影响到网站开发质量，重要的是难以充分发挥网站在企业经营过程中的作用。网站后台管理是网站开发及其重要的部分，所以一个好的企业网站，必须有一个良好的网站后台管理。这与传统的企业网站静态网站是不同的。
我做的后台界面主要采用左右框架结构。左边是是控制菜单栏，通过点击菜单栏中的按钮，相应的页面就会在右侧的显示框中显示出来。
登录页面主要实现用户的登录，用户的权限是管理员，管理员可以在系统中可以进行任何操作。登录界面如图5-3所示：
17