html5点餐系统docx.docxVIP

通信工程训练设计报告题目：班级：姓名：学号：指导教师：成绩：电子与信息工程学院信息与通信工程系目录1研究背景31.1发展现状32点餐系统设计与开发32.1手机点餐流程32.1.1用户点餐流程32.1.2餐厅上菜流程42.2系统化框架及设计53具体设计63.1界面设计63.1.1所用技术63.2界面关联103.2.1 所用技术103.3前后台交互113.3.1 所用技术113.4后台及数据库133.4.1 所用技术133.5 兼容问题144总结155心得体会16参考文献171研究背景餐饮业作为我国第三产业中一个传统服务性行业，始终保持着旺盛的增长势头，取得了突飞猛进的发展，展现出繁荣兴旺的新局面。2011年中国餐饮业收入达到20635亿元，同比增长16.9%，占社会消费品零售总额的比重为11.2%。产业规模首次突破2万亿元大关，这距离2006年突破1一万元营业额仅用了5年时间，年均增长2000亿元以上。随着移动互联网的发展，人们越来越倾向于使用移动终端来获取信息和服务，而智能手机无疑是引爆移动互联网浪潮的无比重要的一环。它以全新的操控体验和性能掀起了大屏幕+触控技术+只能的新的移动终端风暴。正式由于上面全方位的分析，我们以移动互联网为基础，抓住移动智能终端大规模应用的契机，以解决传统的餐饮行业在消费者消费行为分析、点餐流程等方面的问题为目的，推出一套完整的餐厅信息化解决方案，并决定设计并实现一个基于HTML5的新一代智能点餐系统。1.1发展现状目前国内的市场上已经出现了各式各样的点餐系统，但仍存在一些问题下单速度缓慢出错可能性大点餐成本高2点餐系统设计与开发2.1手机点餐流程2.1.1用户点餐流程打开微信具体流程用户通过手机上的微信的扫一扫功能扫描餐厅二维码并进入到点餐系统界面，在登录或注册账号之后开始进行点餐，点餐完毕后进入到我的菜单界面进行餐品的确认和结算，当订单确认后，进入下一界面，填写餐桌号码，填写正确的餐桌号码之后将订单提交到数据库。2.1.2餐厅上菜流程菜品上齐否是具体流程餐品汇总界面每十分钟从数据库调用一次数据进行界面刷新，更新菜单，当某一桌的菜品完成后，点击已完成，当前用户的菜单在本界面上移除，数据库进行更新2.2系统化框架及设计具体流程当用户打开界面时，连接服务器并向服务器发送请求，服务器连接成功后，服务器会向数据库发送请求数据的要求，并调用数据库中的数据并返回到服务器，再由服务器发送给用户，当用户确认订单完成并下单后，会再次调用服务器，服务器会将用户的数据传送给数据库并对数据库进行更改。当餐厅打开菜单汇总页面时，连接服务器并向服务器发送请求，服务器连接成功后，服务器会连接数据，将用户的订单获取到并传送给服务器，服务器将获取到的数据发送给餐厅，餐厅根据顾客的订单准备菜品，当菜品完成时，餐厅点击已完成按钮，将再次连接服务器与数据库，对数据库进行修改。3具体设计具体设计分为界面设计、界面关联、前后台交互、后台以数据库、兼容问题共五个模块3.1界面设计3.1.1所用技术界面设计主要是运用HTML5、CSS3样式和Bootstrap框架搭建而成HTML5是超文本标记语言（HTML）的第五个标准，其设计目的是为了在移动设备上支持多媒体。新的语法特征被引进以支持这一点，如：video、audio、canvas等。HTML5引进了许多新的功能，可以真正改变用户与文档的交互方式，包括：·新的解析规则增强了灵活性·新属性·淘汰过时的或冗余的属性·一个HTML5文档到另一个文档间的拖放功能·离线编辑·信息传递的增强·详细的解析规则·多用途互联网邮件扩展（MIME）和协议处理程序注册在SQL数据库中存储数据的通用标准（Web SQL）主界面构建部分代码如下：按钮搭建div class=rowdiv id=menu class=col-xs-12button type=button class=btnbtn-default id=all全部商品/buttonbutton type=button class=btnbtn-default id=new新品上市/buttonbutton type=button class=btnbtn-default id=classical西贝经典/buttonbutton type=button class=btnbtn-default id=cereals五谷杂粮/buttonbutton type=button class=btnbtn-default id=drink自制饮品/button/div菜单列表table class=table id=oTabletheadth class=text-center商品名称/thth class=text-right单价/thth class=text-