基于移动互联网的订餐APP系统设计与实现

悠悠 2024-04-01 11:15 12阅读 0赞

目 录  
1 绪论 1  
1.1 课题背景 1  
1.2 研究意义 1  
1.3 国内外现状 1  
1.4 论文结构 2  
1.5 本章小结 2  
2 技术简介 3  
2.1 开发工具 3  
2.2 数据库 3  
2.3 数据库管理工具 3  
2.4 Web容器 4  
2.5 主要技术简介 4  
2.5.1 JSP 4  
2.5.2 Strust2 4  
2.5.3 Hibernate 4  
2.5.4 Spring 5  
2.5.5 Ajax 5  
2.6 本章小结 5  
3 需求分析 6  
3.1 可行性分析 6  
3.1.1 经济可行性 6  
3.1.2 技术可行性 6  
3.1.3 社会可行性 6  
3.2 性能需求 6  
3.3 功能需求 7  
3.4 本章小结 7  
4 系统设计 8  
4.1 系统架构 8  
4.2 数据库模型设计 8  
4.3 系统流程设计 9  
4.4 数据库设计 9  
4.5 本章小结 12  
5 系统实现 13  
5.1 数据库连接实现 13  
5.2 用户登录实现 13  
5.3 用户注册实现 14  
5.4 餐品类型管理实现 15  
5.5 餐品管理实现 16  
5.6 商户管理实现 17  
5.7 订餐管理实现 19  
5.8 本章小结 20  
6 展望与结论 21  
参考文献 22  
致谢 23  
3 需求分析  
3.1 可行性分析  
3.1.1 经济可行性  
从经济效益的角度分析，随着移动互联软、硬件技术的高速发展，Web开发技术不断提升，软件开发成本日益降低。纵观外卖订餐市场，其销售额直线攀升，开拓网上销售渠道成为食品经销商增加网络销售市场竞争力的重要途径\[12\]。因此，本系统的开发成本与其带来的经济效益不成正比，因此在经济方面具有可行性。  
3.1.2 技术可行性  
在开发工具的选择上，本系统采用优秀的开发工具MyEclipse2014来进行系统的设计开发，使用MYSQL数据库存储数据\[13\]。便捷性、可用性、安全性等方面不用质疑，因此技术方面具有可行性。  
在软件运行模式方面，采用B/S模式，用户仅需要安装浏览器，便于系统的管理及维护，有利于系统升级，应用方便，操作简单。  
系统在开发和使用阶段技术上要求相对较低，具有可行性。  
3.1.3 社会可行性  
商业化平台关于个性推荐的存在很多问题\[14\]。一方面用户想得到个性化推荐，收到自己感兴趣的、价格符合自己需求的产品信息；另一方面，平台需要保障用户的个人隐私，提供安全良好的购物环境。因此，本系统设计从消费者和商家两方面考虑，具有社会可行性。  
3.2 性能需求  
优秀的架构设计具有以下特点：第一，良好的模块化；第二，适应性强，能够适应用户需求的变化，适应技术的更新；第三，对数据进行良好的管理；第四，灵活明确的规划部署。  
性能需求一般来自用户。因为用户不仅需要功能完善，而且用户也要求系统质量。如存取速度，信息安全，界面友好等质量标准，只有用户体验好，功能完善的系统才能被验收成功\[15\]。因此在设计系统架构时，以用户需求为核心，完成用户的功能需求，达到用户期望。  
性能需求通常要求是界面漂亮，操作方便，安全性高。在21世纪现代社会硬件需求非常容易得到最低配置的情况下，我们首先要解决的问题就是系统安全性。  
综上而言，对于本系统的要求如下：  
(1)系统界面漂亮具有现代气息，易于学习掌握，操作简单。设计开发麦香订餐系统目的是节约用户时间，如果操作复杂，就失去本系统价值。  
(2)系统对登录应有验证功能，如果输入错误给出相应提示。  
(3)系统应扩展性高、后期易维护。  
3.3 功能需求  
通过市场调研分析，麦香订餐系统的需求已经基本了解。本系统是的基于移动互联的麦香订餐系统，可由不同商家入驻，发布自己的商品信息。用户通过手机注册账号登录订餐系统或者使用无账号直接点餐，选择美食进行下单，商家根据订单信息对用户订购的菜品制作完成后，由配送人员快速派送至用户所指定地点。本系统的功能如下：  
菜品管理：这个功能由后台管理员进行操作。菜品管理功能主要包括：查询菜品、增加新菜、更新菜品和删除菜品。管理员可以对菜品进行查看，并且能够浏览菜品的详细信息。  
用户登录：用户输入账号及密码进行系统验证，验证通过之后进行下一步操作。  
点餐功能：点餐功能是该订餐系统核心模块。用户选择自己满意的菜谱后，加入购物车，点击订餐按钮即可完成订餐操作，然后商家会根据订单对用户订购的菜品由专门的配送人员派送至用户手中  
信息功能：更新个人基本信息、修改密码等功能。  
3.4 本章小结  
本章节为系统的需求部分，首先分析了系统可行性，然后说明系统性能的要求，最后对系统功能需求进行说明。

4 系统设计  
4.1 系统架构  
系统流程图是系统设计阶段中的一环，只有知道用户的需求以及业务流程才能画出架构图。一般来说，进行逻辑流程，开发架构等设计开发可以参考RUP的用例驱动，系统架构图表现在整个系统。  
用户在Android客户端进行订餐，首先传入后台服务器中进行处理，然后根据后台服务器逻辑处理，接下来对数据库进行增、删、改、查等操作。后台服务器逻辑运算完毕之后，将数据通过移动或者无线网络返回给客户端，完成操作。  
系统架构图如图4.1所示：  
![在这里插入图片描述][657c6281ff214c999a1e9225330c7cf2.png_pic_center]  
图4.1 系统架构图

<!DOCTYPE html>
    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    <%@ taglib prefix="s" uri="/struts-tags"%>
    <%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
    %>
    
    
    <html>
    <head id="Head1">
        <%@ include file="/web/common/common.jsp" %>
        <script type="text/javascript">
            $(function () {
        
                $('#grid1').datagrid({
        
                    title: '管理员列表',
                    nowrap: false,
                    striped: true,
                    fit: true,
                    url: "<%=__APP__%>/User!getList",
                    idField: 'uuid',
                    pagination: true,
                    rownumbers: true,
                    pageSize: 10,
                    pageNumber: 1,
                    singleSelect: true,
                    fitColumns: true,
                    sortName: 'id',
                    sortOrder: 'desc',
                    columns: [
                        [
                            {
        title: 'id', field: 'id', width: 100, hidden: false},
                            {
        title: '用户名', field: 'username', width: 100, sortable: true},
                            {
        title: '密码', width: 100, field: 'passwd'},
                            {
        title:'用户权限',width:100,field:'roletype'}
    
                        ]
                    ],
                    toolbar: [
                        {
        
                            text: '新增',
                            iconCls: 'icon-add',
                            handler: function () {
        
                                $("#action").val("add");
                                $("#managerDialog").dialog('open');
                                $('.validatebox-tip').hide();
                            }
                        },
                        '-',
                        {
        
                            text: '修改',
                            id: 'commit',
                            iconCls: 'icon-edit',
                            handler: function () {
        
                                $("#action").val("edit");
                                var selected = $('#grid1').datagrid('getSelected');
                                if (selected) {
        
                                    edit(selected);
                                    var index = $('#grid1').datagrid('getRowIndex', selected);
    
                                } else {
        
                                    $.messager.alert("提示", "请选择一条记录进行操作");
                                }
                            }
                        },
                        '-',
                        {
        
                            text: '删除',
                            id: 'commit',
                            iconCls: 'icon-remove',
                            handler: function () {
        
                                var rows = $('#grid1').datagrid('getSelected');
                                if (rows) {
        
                                    var rowId = rows.id;
                                    $.messager.confirm('提示', '确定要删除吗？', function (r) {
        
                                        if (r) {
        
                                            deleteItem(rowId);
                                        }
                                    });
                                } else {
        
                                    $.messager.alert("提示", "请选择一条记录进行操作");
                                }
                            }
                        }
                    ]
    
                });
            });
    
            function save() {
        
                $('#managForm').form('submit', {
        
                    url: "<%=__APP__%>/User!add",
                    onSubmit: function () {
        
                        return inputCheck();
                    },
                    success: function (data) {
        
                        closeBackGround();
                        $.messager.alert("提示", data, "info", function () {
        
                            closeFlush();
                        });
                    }
                });
            }
    
            function edit(obj) {
        
                //$.post("controller/userController.php?action=getOne",{id:uuid},function(data){
        
                var username = obj.username;
                var password = obj.passwd;
                var roletype = obj.roletype;
                $("#username").val(username);
                $("#passwd").val(password);
                $("#roletype").combobox('setValue', roletype);
                $("#id").val(obj.id);
                $("#managerDialog").dialog('open');
                //});
            }
    
            function deleteItem(uuid) {
        
                $.post("<%=__APP__%>/User!deleteItem", {
        id: uuid}, function (data) {
        
                    closeFlush();
                });
            }
    
            function cancel() {
        
                $.messager.confirm('提示', '是否要关闭？', function (r) {
        
                    if (r) {
        
                        $("#managerDialog").dialog('close');
                    }
                });
            }
    
            function query() {
        
                /*
                 var username = $("#username").val();
                 var creatTime = $("#creatTm").datebox("getValue");
                 var obj = new Object();
                 obj.username = username;
                 obj.createTime = creatTime
                 $('#grid1').datagrid('options').queryParams = obj;
                 $('#grid1').datagrid("reload");*/
                //$('#grid1').datagrid('loadData',{total:0,rows:[]});
                $('#grid1').datagrid('options').queryParams = serializeObject($('#searchForm'));
                $('#grid1').datagrid("reload");
                //$('#grid1').datagrid('loadData',{total:0,rows:[]});
                //$('#grid1').datagrid('load', serializeObject($('#searchForm')));
            }
    
            function reset() {
        
                searchForm.reset();
            }
    
            function closeFlush() {
        
                managForm.reset();
                $("#managerDialog").dialog('close');
                $("#grid1").datagrid("reload");
            }
    
            function inputCheck() {
        
                if ($("#passwd").val() != $("#password2").val()) {
        
                    $.messager.alert("提示", "两次输入密码不一致!");
                    return false;
                } else if (!($("#managForm").form("validate"))) {
        
                    return false;
                }
                openBackGround();
                return true;
            }
        </script>
    </head>
    <body class="easyui-layout">
    <div region="north" border="false" style="height:3px;overflow: hidden"></div>
    <div region="west" border="false" style="width:3px;"></div>
    <div region="east" border="false" style="width:3px;"></div>
    <div region="south" border="false" style="height:3px;overflow: hidden"></div>
    <div region="center" border="false">
        <div id="main" class="easyui-layout" fit="true" style="width:100%;height:100%;">
            <div region="north" id="" style="height:80%;" class="" title="查询条件">
                <form action="" id="searchForm" name="searchForm" method="post">
                    <table cellpadding="1" cellspacing="0" class="tb_search">
                        <tr>
                            <td width="10%">
                                <label for="susername">用户名：</label>
                                <input type="text" id="susername" name="susername" width="100%" maxlength="32"/>
                            </td>
    
                            <td width="10%">
                                <a href="#" onclick="query();" class="easyui-linkbutton" iconCls="icon-search">查询</a>
                                <a href="#" onclick="reset();" class="easyui-linkbutton" iconCls="icon-redo">重置</a>
                            </td>
                        </tr>
                    </table>
                </form>
            </div>
            <div region="center" border="false" style="padding:3px 0px 0px 0px;overflow:hidden">
    
                <table id="grid1"></table>
    
            </div>
        </div>
    </div>
    
    
    <div id="managerDialog" class="easyui-dialog" title="用户管理" style="width:500px;height:290px;" toolbar="#dlg-toolbar"
         buttons="#dlg-buttons2" resizable="true" modal="true" closed='true'>
        <form id="managForm" name="managForm" method="post">
            <input type="hidden" id="action" name="action"/>
            <input type="hidden" id="id" name="id"/>
            <table cellpadding="1" cellspacing="1" class="tb_custom1">
                <tr>
                    <th width="10%" align="right"><label>用户名：</label></th>
                    <td width="30%">
                        <input id="username" name="user.username" class="easyui-validatebox"
                               style="width:300px;word-wrap: break-word;word-break:break-all;" type="text" required="true"
                               validType="length[0,32]"/><font color='red'>*</font></td>
                </tr>
                <tr>
                    <th width="10%" align="right"><label>权限：</label></th>
                    <td width="30%">
                        <select id="roletype" name="user.roletype" class="easyui-combobox" panelHeight="auto"
                                style="width:300px;word-wrap: break-word;word-break:break-all;" type="text" required="true"
                                validType="length[0,32]">
                            <option value="1" selected="selected">管理员</option>
                            <option value="2">店主</option>
                        </select></td>
                </tr>
                <tr>
                    <th width="10%" align="right"><label>密码：</label></th>
                    <td width="10%">
                        <input id="passwd" name="user.passwd" class="easyui-validatebox" required="true" validType="length[0,32]"
                               style="width:300px"/>
                    </td>
                </tr>
                <tr>
                    <th width="10%" align="right"><label>密码确认：</label></th>
                    <td width="10%">
                        <input id="password2" name="" class="easyui-validatebox" style="width:300px" required="true"
                               validType="length[0,32]"/>
                    </td>
                </tr>
    
            </table>
        </form>
        <div id="dlg-buttons2">
            <a href="#" class="easyui-linkbutton" onclick="save();">保存</a>
            <a href="#" class="easyui-linkbutton" onclick="cancel();">取消</a>
        </div>
    </div>
    
    </body>
    </html>

![在这里插入图片描述][b2df2c6fcff447e0aade014f6d50a3dc.png_pic_center]  
![在这里插入图片描述][4ff399d4ad0e4b3484840bf04f6fb3e8.png_pic_center]  
![在这里插入图片描述][260a12253b644aa09926743934b09020.png_pic_center]  
![在这里插入图片描述][b7262d145dc94792972fc284b2e7c9c3.png_pic_center]  
![在这里插入图片描述][be1e7359800e4b31b32e2501b0a32767.png_pic_center]  
![在这里插入图片描述][17a72ad19f68483888cb2fb8923831ee.png_pic_center]  
![在这里插入图片描述][41a9a8b89ad14ada9ae2c372d34be839.png_pic_center]  
![在这里插入图片描述][809e2bf4bd2c4663909215e4224f9c11.png_pic_center]  
![在这里插入图片描述][1a75998c0fcb45fc991815febfbc25fc.png_pic_center]  
![在这里插入图片描述][e1c6f731af4b435a951b1d46faff4986.png_pic_center]  
![在这里插入图片描述][fc6820dc173e45f794199c61b06bb5d5.png_pic_center]  
![在这里插入图片描述][bbc8f5021a954412a262b456cdc50135.png_pic_center]  
![在这里插入图片描述][478e9c2fa20347d6aa7d2c79dd888e74.png_pic_center]  
![在这里插入图片描述][bff8d787638d4badbae80ce20decbcca.png_pic_center]  
![在这里插入图片描述][97877a63a65b4643ad5e4569e9629074.png_pic_center]  
![在这里插入图片描述][5a1cea32f4244da381e6b4b6a0020b38.png_pic_center]  
![在这里插入图片描述][b3713ab7dad941db871d47c0f5a7c3f1.png_pic_center]  
![在这里插入图片描述][2d705b86a17145c091aad2e3b88627a9.png_pic_center]

[657c6281ff214c999a1e9225330c7cf2.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/56608fae1fce472aa7c32d7821bfa463.png
[b2df2c6fcff447e0aade014f6d50a3dc.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/5255048ef4d14e2abaeabc9d983ef95d.png
[4ff399d4ad0e4b3484840bf04f6fb3e8.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/afce51e18b8641018564755fdba3c488.png
[260a12253b644aa09926743934b09020.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/c16443c1d36243faba9037000dd0c1b1.png
[b7262d145dc94792972fc284b2e7c9c3.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/2a77868734ca4fc994cb2d77e546ce42.png
[be1e7359800e4b31b32e2501b0a32767.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/83cd01621fef4ea4bc90e57249a14ba9.png
[17a72ad19f68483888cb2fb8923831ee.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/2ef45cd8082f4994b4f8f48da0bc8d33.png
[41a9a8b89ad14ada9ae2c372d34be839.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/7dbcaa4e05554f1489fe47430526129a.png
[809e2bf4bd2c4663909215e4224f9c11.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/54ea8a18b5c4481f83cfdae248bb6022.png
[1a75998c0fcb45fc991815febfbc25fc.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/27b8f5174d404fb893aad3f3aeaed4b0.png
[e1c6f731af4b435a951b1d46faff4986.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/6bc9d81464de467ca0d8ea05614edd70.png
[fc6820dc173e45f794199c61b06bb5d5.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/fb4449828a214d4e9b8e7be2268359ed.png
[bbc8f5021a954412a262b456cdc50135.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/748c8bd6a33d4ce48f072b8cd6afad52.png
[478e9c2fa20347d6aa7d2c79dd888e74.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/c02f749df455402cb4bb5335d013eb97.png
[bff8d787638d4badbae80ce20decbcca.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/f67f70c06a1948e09ce1dab64b8e7843.png
[97877a63a65b4643ad5e4569e9629074.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/bd0a42dc3871440e8da091d04b65392e.png
[5a1cea32f4244da381e6b4b6a0020b38.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/1f6a5a9c992549ff8b9ade137491fc47.png
[b3713ab7dad941db871d47c0f5a7c3f1.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/52bbee1f218b45e2a5e3ae446b51314b.png
[2d705b86a17145c091aad2e3b88627a9.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/87a5f2f9064243d1bd1f86ad25c9e79c.png