基于WEB的小型酒店管理系统的设计与实现

5.2.1 系统登录界面

用户登录时，如果输入用户是已注册用户，则输入正确用户名和密码，正确选择该用户对应的身份，即可成功登录到相应页面。如果输入有误，界面会出现相应提示。如果输入用户不存在，则需要先注册，注册成功后即可实现登录操作[8]。

5.2.2 系统主界面

该系统共分为三个主界面，是所有功能的一个入口。根据登录时选择不同身份（管理员、工作人员、客户），跳转到不同的主界面。主界面主要是由菜单栏、功能模块按钮组成，单击各按钮可以实现不同操作[9]。

（1）客户主界面

通过登录进入客户主界面[10]。在主界面左侧有个可收缩菜单，可选择不同操作。包括个人信息、房间信息查询、我要订房三种操作。打开“个人信息”页面后，打开对应页面，会有一个“编辑”按钮，点击可以对信息进行编辑操作。打开“房间信息查询”页面后，页面上会有搜索框和“查询”按钮，可以输入房间类型对房间信息进行查询。打开“我要订房”后，会有一个“预订”按钮，单击可以进行订房操作[11]。

左侧可伸缩菜单实现代码：

$(function(){

var dataTree=[{

text:'系统管理(客户)',

state:'closed',

children:[{

text:'个人信息',

attributes:{

url:'jsp/userList.jsp'

}

},{

text:'房间信息查询',

attributes:{

url:'jsp/uroominfoList.jsp'

}

},{

text:'我要订房',

attributes:{

url:'jsp/ubookroomList.jsp'

}

}]

}];

这里使用的是jQuery EasyUI的树形菜单实现左侧菜单栏的可伸缩菜单。

（2）工作人员主界面

通过登录进入工作人员主界面。在主界面左侧有个可收缩菜单，可选择不同操作。包括客户信息查询、客房信息查询、客户订房和交房结算四种操作。打开“客户信息查询”和“客房信息查询”页面后，打开对应页面，会有一个“编辑”按钮，点击可以对信息进行编辑操作；一个“添加”按钮，点击可以对信息进行添加操作；一个“删除”按钮，点击可以对信息进行删除操作；还有一个搜索框和“查询”按钮，可以输入用户姓名对用户信息进行查询。打开“客户订房”页面，会有一个“预订”按钮，单击可以进行订房操作。打开“交房结算”页面。

（3）管理员主界面

通过登录进入到管理员主界面。在主界面左侧有个可收缩菜单，可选择不同操作。包括用户信息维护、房间信息维护、房间类型维护、房间状态维护和客房经营管理五种操作。打开“用户信息维护”页面后，打开对应页面，会有一个“编辑”按钮，点击可以对信息进行编辑操作；一个“添加”按钮，点击可以对信息进行添加操作；一个“删除”按钮，点击可以对信息进行删除操作；还有一个搜索框和“查询”按钮，可以输入用户姓名对用户信息进行查询。打开“房间信息维护”、“房间类型维护”、“房间状态维护”页面会出现和“用户信息维护”页面相同的按钮，功能也相同。打开“客房经营管理”页面[12]。

传送门：https://download.csdn.net/download/qq_31151511/86242649

指导联系：首页-软件世家-淘宝网