• 基于springboot的体育馆预约系统（前端+后端）

    一、系统简介


    本项目采用idea工具开发，html+springboot+mybatis+jquery+thymeleaf技术编写，数据库采用的是mysql，navicat开发工具。

    系统一共分为2个角色分别是：管理员，用户

    二、模块简介

    管理员

    1、登录

    2、统计管理

    3、用户管理

    4、场地类别管理

    5、场地管理

    6、公告管理

    7、评论管理

    8、预约场地管理

    9、个人信息管理

    用户

    1、登录注册

    2、浏览网站

    3、查看场地

    4、预约场地

    5、查看公告

    6、评论公告

    7、个人信息管理

    8、评论历史记录查询

    9、预约历史记录查询

    项目简介：
    难度等级：✩✩✩
    用户类型：2角色（ 管理员，用户）
    设计模式：MVC
    项目架构：B/S架构
    开发语言：Java语言
    前端技术：bootstrap+HTML、CSS、JS、JQuery、thymeleaf等
    后端技术：springboot+mybatis框架
    运行环境：Windows7或10、JDK1.8
    运行工具：本系统采用idea开发，仅支持idea运行，不支持MyEclipse和eclipse运行，因为三者的骨架不一样，强行导入打开运行可能会导致出现未知的错误。
    数  据  库：MySQL5.5/5.7/8.0版本
    是否基于Maven环境:是
    是否采用框架：是
    数据库表数量：7张表
    JSP页面数量：20多张
    是否有分页：有分页
     

    相关截图

    相关代码

    登录

    1. html>
    2. <html lang="en" xmlns:th="http://www.thymeleaf.org">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <title>体育馆预约系统title>
    6.     <link rel="icon" th:href="@{/public/favicon.ico}" type="image/x-icon"/>
    7.     <link rel="bookmark" th:href="@{/public/favicon.ico}" type="image/x-icon"/>
    8.     <link rel="stylesheet" type="text/css"  th:href="@{/css/bootstrap.css}">
    9.     <link rel="stylesheet" type="text/css"  th:href="@{/css/back.css}">
    10.     <link rel="stylesheet" type="text/css"  th:href="@{/css/bootstrap-theme.css}">
    11.     <script type="text/javascript" th:src="@{/js/jquery-3.6.0.js}">script>
    12.     <script type="text/javascript" th:src="@{/js/login.js}">script>
    13.     <script th:src="@{/layui/layui.js}" charset="utf-8">script>
    14.  
    15.     <script>
    16.         $(function() {
    17.             //防止页面后退
    18.             history.pushState(null, null, document.URL);
    19.             window.addEventListener('popstate', function () {
    20.                 history.pushState(null, null, document.URL);
    21.             });
    22.         })
    23.     script>
    24. head>
    25. <body onload="loadTopWindow()">
    26. <div id="magicalDragScene" class="mc-root mc-ui-absolute-pane">
    27.     <h1 style="margin-left: 56%;margin-top: 8%;font-family: 隶书;font-size: 60px;color: white" >体育馆预约系统h1>
    28.     <br>
    29.     <div id="tmd" style="width: 25%;height: 300px;">
    30.         <form style="margin: 0 auto;width: 80%;height: 300px;" th:action="@{/loginUser}" method="post" onsubmit="return regCheck()">
    31.             <h1 class="h3 mb-3 font-weight-normal" style="color:white;font-family: 隶书;text-align: center;" >登录h1>
    32.             <input id="username" name="username" class="layui-input" type="text"  th:placeholder="请填写用户名"/>
    33.             <input id="password" name="password" class="layui-input" style="margin-top: 5px" type="password" th:placeholder="请填写用户密码" origin-type="password"/>
    34.             <br><br>
    35.             <select name="type" class="form-control" style="width: 75%">
    36.                 <option value="1" selected>管理员option>
    37.  
    38.                 <option value="2">用户option>
    39.  
    40.             select>
    41.             
    42.  
    43.             
    44.          <span id="statusTip" style="color: #d62727;font-size: 15px;margin-left: 40%" th:text="${status}">span>
    45.             <br>
    46.           
    47.  
    48.            <p class="mt-5 mb-3 text-muted text-sm-right" style="margin-top: 10px"><span >还没有账号,span>
    49.                 <a type="button" th:onclick="reg()" >用户注册a>
    50.                
    51.             p>
    52.             <button class="layui-btn1" style="width: 300px;height: 40px;font-size: 16px;color: white" type="submit">登录button>
    53.         form>
    54.     div>
    55.     <br>
    56.  
    57.  
    58.  
    59. div>
    60.  
    61. <script>
    62.     layui.use([ 'form','jquery','layer','upload' ], function() {
    63.         var form = layui.form,
    64.             layer = layui.layer,
    65.             $ = layui.jquery,
    66.             upload = layui.upload;
    67.         form.render();//这句一定要加，占坑
    68.  
    69.         window.reg = function(e){
    70.             layer.open({
    71.                 //调整弹框的大小
    72.                 area:['500px','800px'],
    73.                 shadeClose:true,//点击旁边地方自动关闭
    74.                 //动画
    75.                 anim:2,
    76.                 //弹出层的基本类型
    77.                 type: 2,
    78.                 title: '用户注册',
    79.                 //刚才定义的弹窗页面
    80.                 content: 'register', //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
    81.  
    82.             });
    83.         }
    84.  
    85.     })
    86.  
    87. script>
    88.  
    89.  
    90. body>
    91. html>
    1.    /**
    2.      * 登录
    3.      * @param username
    4.      * @param password
    5.      * @param type
    6.      * @param httpSession
    7.      * @param model
    8.      * @return
    9.      * @throws UnsupportedEncodingException
    10.      */
    11.     @RequestMapping(value = "/loginUser",method = RequestMethod.POST)
    12.     public String loginUser( String username,String password, String type,HttpSession httpSession, Model model) throws UnsupportedEncodingException {
    13.         Admin admin = new Admin();
    14.         if(type !=null&& type.equals("1")){
    15.             admin = loginService.selectAdmin(username,password);
    16.             if (admin != null){
    17.                 httpSession.setAttribute("username",admin.getUsername());
    18.                 httpSession.setAttribute("admin",admin);
    19.                 httpSession.setAttribute("type",type);
    20.                 model.addAttribute("type",type);
    21.                 return "home/homepage";
    22.             }else{
    23.                 model.addAttribute("status","账号或者密码输入错误！");
    24.                 return "login";
    25.             }
    26.         }
    27.        else if(type.equals("2")){//用户
    28.             User user = loginService.selectUser(username,password);
    29.             if(user != null){
    30.                 httpSession.setAttribute("username",user.getRealname());
    31.                 httpSession.setAttribute("user",user);
    32.                 httpSession.setAttribute("type",type);
    33.                 model.addAttribute("type",type);
    34.                 return "redirect:/toIndex";
    35.  
    36.                 //return "home/homepage";
    37.             }else{
    38.                 model.addAttribute("status","账号或者密码输入错误！");
    39.                 return "login";
    40.             }
    41.         }else{
    42.             model.addAttribute("status","账号或者密码输入错误！");
    43.             return "login";
    44.         }
    45.     }

    其他模块代码都是类似的，此项目适合初学者学习借鉴
    喜欢的朋友的点赞加关注，感兴趣的同学可以研究！！！！！

    项目截图中的数据，很多是用来测试的，需要自行添加合适的数据图片！！
    非开源！！！！！！ 感谢  = v =

  • 相关阅读:
    Java基础Integer包装类
    【ICASSP 2023】ST-MVDNET++论文阅读分析与总结
    可见光通信（毕业设计）
    【服务器虚拟化数据恢复】ESXI虚拟机误还原快照的数据恢复案例
    前端工作总结101-根据页面的内容调用
    Android shape记录
    MySQL性能指标TPS\QPS\IOPS如何压测？
    【Dotnet 工具箱】推荐一个使用 C# 开发的轻量级压测工具
    两种方式实现css取消页面鼠标双击选中文字或单击拖动选中文字的效果
    阅读分享--重读Youtube深度学习推荐系统论文，字字珠玑，惊为神文
  • 原文地址：https://blog.csdn.net/qq_43485489/article/details/126428926