前言：
基于html和JavaScript，利用layui为界面设计，local storage存储数据，注意没有数据库存在，可本地运行，为一个虚构的酒店创建一个允许在线客户订购和管理的网站。
功能需求：
- 客户可以:预订酒店房间新客户将不得不创建一个登录和密码更改或取消房间预订登记入住房间，为客房服务预订膳食，退房，客户必须支付总费用(包括房间预订和退房餐)。在这个网站上，我们将忽略真正的支付处理，只是假装顾客可以通过点击一个按钮来支付。
- 客房管理人员可以:根据房间是否清洁、是否可用、等
- 厨房工作人员可以:更改菜单上的食物列表 当饭做好并送出时，把订单拿掉
- 酒店经理可以:查看和更改系统中的所有数据，添加新员工，包括设置他们的用户名和密码，添加新的房间供使用
- 其他要求:所有用户必须登录不同类型的用户，不同的用户有不同的能力，只能访问与他们相关的信息，检查无效的输入，如空订单、不存在的日期、负数等。一般来说，网站必须看起来和感觉真实。您有责任使用常识来确定需要什么来满足这个需求。例如，在收集新客户详细信息的页面上，web页面显然需要询问客户的电话号码和电子邮件地址，否则需要标记将丢失。
- 技术和软件需求使用JavaScript localStorage(更新:而不是sessionStorage)和JSON来存储
初始数据：
- 共有5间不同的房间，分2个不同的类别(如King, Double)不同的价格和照片
- 菜单上有5种不同的食物可供选择，每一种都有不同的价格照片
效果图：
1、登录界面
2、用户界面
3、订单界面
4、房间管理
5、菜单管理
部分代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>木芽落酒店 - 登录</title>
<link rel="stylesheet" href="layui/css/layui.css" media="all">
<link rel="stylesheet" href="css/style.css" media="all">
<script src="js/index.js"></script>
<script>
//判断是否登录
var user = ReadJson("muya_user");
if (user) {
if (user.level == 0) {
location.href = "user.html";
} else {
location.href = "admin.html";
}
}
</script>
</head>
<body>
<div class="main" id="login">
<div class="login-form">
<h1>Member Login</h1>
<div class="head">
<img src="images/user.png" alt="" />
</div>
<form>
<input type="text" id="name" class="text" value="USERNAME" onfocus="this.value = '';"
onblur="if (this.value == '') {this.value = 'USERNAME';}">
<input type="password" id="password" value="Password" onfocus="this.value = '';"
onblur="if (this.value == '') {this.value = 'Password';}">
<div class="submit">
<input type="button" id="loginbtn" value="LOGIN">
</div>
<p><a href="javascript:reg()">Register ?</a></p>
</form>
</div>
</div>
<div class="main" id="reg">
<div class="login-form">
<h1>Member Register</h1>
<div class="head">
<img src="images/user.png" alt="" />
</div>
<form>
<input type="text" id="regname" class="text" value="USERNAME" onfocus="this.value = '';"
onblur="if (this.value == '') {this.value = 'USERNAME';}">
<input type="password" id="regpass" value="Password" onfocus="this.value = '';"
onblur="if (this.value == '') {this.value = 'Password';}">
<input type="text" id="email" value="Email" onfocus="this.value = '';"
onblur="if (this.value == '') {this.value = 'email';}">
<input type="text" id="tell" value="Tellphone" onfocus="this.value = '';"
onblur="if (this.value == '') {this.value = 'tellphone';}">
<div class="submit">
<input type="button" id="regbtn" value="Register">
</div>
<p><a href="javascript:login()">Login</a></p>
</form>
</div>
</div>
<script src="js/login.js"></script>
</body>
</html>总结
需要整个工程的需要找博主，项目代码有偿分享，请支持一下博客的运行。
peer
2020-04-25 19:49:52
想问下这个酒店管理系统界面设计的源码可以分享不？
庚哥哥
2020-04-25 22:03:15
私聊
小良
2020-05-07 23:28:55
求源码
ioio
2020-05-06 20:04:47
可以分享源码吗
庚哥哥
2020-05-06 22:32:22
可以私聊
小王
2020-05-23 20:29:31
老哥可以分享一下源码？