Web课程设计高校物资管理系统

、设计作品内容

1、作品名称：高校物资管理系统

2、作品简介：本作品是基于高校物资管理系统，以界面设计为主配合数据库来登陆的页面设计，具有增删改查基础操作模式。

二、设计过程

1. 页面设计

（1）页面展示：

将用户名、密码以及其他的小界面放入整个页面最中间背景为蓝天白云绿色草地，达到了最佳视觉体验，白色的鸽子在空中自由的翱翔，象征着学院学子自由在学校学习，图2.1为演示界面

图2.1      登陆界面

图2.2是登更新陆成功后的界面，可以选择入库、出库、查询、更新任意操作

图2.2登陆成功后界面

图2.1是登陆成功后，出现的界面，本界面主体是以花朵绿色为主要界面·象征着生机，登陆成功后是一个简单得入库操作，同时本作品的一大亮点为删除了返回按钮，用户可以直接点击其余“查询，入库，出库”的操作节省了一步简单操作后又被迫中断返回上一步的操作。

图2.3   入库界面

图1.3为简答的查询操作，已经操作完成得到数据，同样入库更新不再一一演示。

图2.4   查询界面-

（2）设计思路：

在sigen.html文件写入第一副背景照片。

首先第一行写入高校物资管理系统登陆，之后写入用户名、密码以及相应的文本框，并建立name方便与数据库连接。

   让背景图片拉伸且占据整个屏幕，并且铺满整个屏幕。

将页面中功能设计居中并且设计盒子大小以及盒子边界的光效模糊，并且让盒子的背景设为白色，同时让他居中。

将“高校物资管理系统登陆“文字放入指定位置，和颜色。

将用户名密码及文本框放入指定位置：

将登录按钮放入指定位置，并且改变颜色和去除边框，同时变为圆角，设置功能光标放入上面有小手。

设置登录按钮监听器同时与数据库连接，在用户名或密码为空和为错误时显示提示信息

修改doGet()函数，加入用户名密码变量，同时设置data变量用来标记是否在数据库中找到用户名和密码，同时将获取的网页的用户名和密码数据与数据库中的用户名和密码进行比对，如果找到将data的值设置为4，没有找到设置为3，密码错误设置为3。用户名和密码设置为123。

如果data的值为4登陆成功则进行高校物资管理系统的入库操作，输入物资的各种条件并通过数据库中各表的联立进行入库，如果需要其他的操作可以进行出库，查询和更新的内容，同时设置提交按钮，通过提交按钮得到入库或者出库等得到提示，来验证是否成功，本次设计选择不再设置返回按钮，通过页面转换的方式直接进行其他的操作，节省了返回再进行其他操作的步骤，直接一步到位，不需要在进行其他操作后，还要返回界面进行其他的操作，此功能为本次设计的一大亮点。

如果data的值为5、3或者0，将返回到sigen.html文件并输出对应的提示。

2. 数据库设计

1、数据库的名称为gaoxiao，由于登陆和出入库等操作需要两个表，一下为展示截图。

（1）图2.1为users的表，此表的功能是给高校物资管理登陆提供登陆“用户名和密码”确保正常登陆。

User	pwd
123	123

图2.5   数据库数据

图2.6   数据库设计表

（2）图2.2是materlnfo的表，此表的作用是为了高校物资管理系统一系列的增删改差服务，通过界面操作可以将数据储存到数据库中，也可以通过界面来出库、查询和更新等一系列操作。

bh	mc	xh	zl	jg	sl
001	001	001	001	1	1
01	足球	01	02	3	100
02	足球	02	体育器材	10	5
04	羽毛球	004	体育器材	12	0

图2.7   数据库数据

      

图2.8   数据库设计表

3. 主要功能展示

（1）高校物资管理系统页面：

将用户名、密码以及其他的小界面放入整个页面右边靠左，将盒子背景设置为白色，登录按钮和最上边的“高校物资管理系统登陆”设置为白色，背景插上图片并且拉满。

图2.9   登陆界面

（2）输入用户名密码：

在哪一行输入，该行显示黑色框。

鼠标移入登录按钮时鼠标变为箭头。

图2.10    登陆界面

（3）当用户名或密码为空时，显示提示信息：

图2.11    登陆界面

（4）查询操作中输入物资编号得到数据

图2.12    查询界面

（5）入库操作，输入物资编号、名称、规格类型等等，成功后提示入库成功

图2.13    入库界面

（6）出库操作，输入物资编号、物资名称出库数量，得到

图2.14    出库界面

三、技术难点及解决方案

1.在进行eclipse与服务器连接时出现问题

解决办法：通过询问老师和查询百度以及同学的帮助下解决

2.登陆成功后跳转页面时中文显示乱码

      解决办法：通过查询得知将ISO-8859-1更改为UTF-8即可。

四、待改进的问题

在设置网页界面时感觉还是太简洁，可以尽量的使页面元素更加丰富。

五、设计总结

    大学生活让我对计算机理论知识有了一定的了解，但实际操作领域依旧是一片空白。纸上得来终觉浅，绝知此事要躬行。经过本次大作业，让我对自己有了新的认识，并明确了网页设计方面的前进方向。

　　1．继续学习，不断提升理论素养

　　在信息时代，学习是不断地汲取新信息，获得事业进步的动力。现在通过总感觉自己学的不够，要用到知识时总感觉脑袋总是空白。实习后让我明白，为了能更好的适应工作，不得不利用自己空闲时间去弥补学习中的不足。实训内容是与自己所学专业有密切联系的，所以自己在这方面格外侧重，希望能够加强自己的专业知识。

　　2．加强信心，坚持下去

　　希望能把所学习的知识，也能运用到课堂上。对自己多一点信心，多给自己点赞赏，多给自己鼓鼓劲，相信自己总会走出一条宽敞大道。