[免费]微信小程序停车场预约管理系统(Springboot后端+Vue3管理端)【论文+源码+SQL脚本】

大家好，我是java1234_小锋老师，看到一个不错的微信小程序停车场预约管理系统(Springboot后端+Vue3管理端)【论文+源码+SQL脚本】，分享下哈。

项目视频演示

【免费】微信小程序停车场预约管理系统(Springboot后端+Vue3管理端) Java毕业设计_哔哩哔哩_bilibili

项目介绍

当前社会，随着人们生活质量的提高和思想观念的演进，加之经济全球化的推动，互联网技术正以前所未有的速度提高社会综合发展的效能。这一技术正广泛渗透到各行各业中，而传统管理方式已经不能对时间和地点的严格限制而显得力不从心。微信小程序作为一种创新解决方案，有效打破了传统的这些局限。

尤为重要的是，互联网与物联网技术的快速发展极大地促进了微信小程序在停车场预约小程序领域的应用当中，使之变得更加便捷、高效且智能化。在此情况下，本系统采用了先进的B/S架构模式，并借助微信开发者工具，运用Spring Boot框架构建。我们搭建了Java运行环境，部署了Tomcat服务器，并选择了MySQL这一轻量级数据库作为数据存储的核心。这些技术手段的综合运用，保证了系统的高效稳定运行，为用户带来了卓越的使用体验和高效的管理效能。

本系统旨在提升本行业的管理效率和信息化管理，停车场预约小程序的设计与实现也为相关领域的研究提供了对照和参考。通过实践中的应用和优化，本系统可为用户放心使用。

系统展示

部分代码

package com.cl.controller;

import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.cl.annotation.IgnoreAuth;
import com.cl.annotation.SysLog;
import com.cl.entity.UsersEntity;
import com.cl.entity.view.UsersView;
import com.cl.service.TokenService;
import com.cl.service.UsersService;
import com.cl.utils.MPUtil;
import com.cl.utils.PageUtils;
import com.cl.utils.R;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.transaction.annotation.Transactional;
import org.springframework.web.bind.annotation.*;

import javax.servlet.http.HttpServletRequest;
import java.util.Arrays;
import java.util.Date;
import java.util.Map;

/**
 * 管理员
 * 后端接口
 *
 * @author
 * @email
 * @date 2025-02-17 10:09:58
 */
@RestController
@RequestMapping("/users")
public class UsersController {
    @Autowired
    private UsersService usersService;


    @Autowired
    private TokenService tokenService;

    /**
     * 登录
     */
    @IgnoreAuth
    @RequestMapping(value = "/login")
    public R login(String username, String password, String captcha, HttpServletRequest request) {
        UsersEntity u = usersService.selectOne(new EntityWrapper<UsersEntity>().eq("username", username));
        if (u == null || !u.getPassword().equals(password)) {
            return R.error("账号或密码不正确");
        }
        String token = tokenService.generateToken(u.getId(), username, "users", "管理员");
        return R.ok().put("token", token);
    }


    /**
     * 注册
     */
    @IgnoreAuth
    @RequestMapping("/register")
    public R register(@RequestBody UsersEntity users) {
        //ValidatorUtils.validateEntity(users);
        UsersEntity u = usersService.selectOne(new EntityWrapper<UsersEntity>().eq("username", users.getUsername()));
        if (u != null) {
            return R.error("注册用户已存在");
        }
        Long uId = new Date().getTime();
        users.setId(uId);
        users.setPassword(users.getPassword());
        usersService.insert(users);
        return R.ok();
    }


    /**
     * 退出
     */
    @RequestMapping("/logout")
    public R logout(HttpServletRequest request) {
        request.getSession().invalidate();
        return R.ok("退出成功");
    }

    /**
     * 获取用户的session用户信息
     */
    @RequestMapping("/session")
    public R getCurrUser(HttpServletRequest request) {
        Long id = (Long) request.getSession().getAttribute("userId");
        return R.ok().put("data", usersService.selectView(new EntityWrapper<UsersEntity>().eq("id", id)));
    }

    /**
     * 密码重置
     */
    @IgnoreAuth
    @RequestMapping(value = "/resetPass")
    public R resetPass(String username, HttpServletRequest request) {
        UsersEntity u = usersService.selectOne(new EntityWrapper<UsersEntity>().eq("username", username));
        if (u == null) {
            return R.error("账号不存在");
        }
        u.setPassword("123456");
        usersService.updateById(u);
        return R.ok("密码已重置为：123456");
    }


    /**
     * 后台列表
     */
    @RequestMapping("/page")
    public R page(@RequestParam Map<String, Object> params, UsersEntity users,
                  HttpServletRequest request) {
        EntityWrapper<UsersEntity> ew = new EntityWrapper<UsersEntity>();


        PageUtils page = usersService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, users), params), params));
        return R.ok().put("data", page);
    }


    /**
     * 前端列表
     */
    @IgnoreAuth
    @RequestMapping("/list")
    public R list(@RequestParam Map<String, Object> params, UsersEntity users,
                  HttpServletRequest request) {
        EntityWrapper<UsersEntity> ew = new EntityWrapper<UsersEntity>();

        PageUtils page = usersService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, users), params), params));
        return R.ok().put("data", page);
    }

    /**
     * 列表
     */
    @RequestMapping("/lists")
    public R list(UsersEntity users) {
        EntityWrapper<UsersEntity> ew = new EntityWrapper<UsersEntity>();
        ew.allEq(MPUtil.allEQMapPre(users, "users"));
        return R.ok().put("data", usersService.selectListView(ew));
    }

    /**
     * 查询
     */
    @RequestMapping("/query")
    public R query(UsersEntity users) {
        EntityWrapper<UsersEntity> ew = new EntityWrapper<UsersEntity>();
        ew.allEq(MPUtil.allEQMapPre(users, "users"));
        UsersView usersView = usersService.selectView(ew);
        return R.ok("查询管理员成功").put("data", usersView);
    }

    /**
     * 后端详情
     */
    @RequestMapping("/info/{id}")
    public R info(@PathVariable("id") Long id) {
        UsersEntity users = usersService.selectById(id);
        users = usersService.selectView(new EntityWrapper<UsersEntity>().eq("id", id));
        return R.ok().put("data", users);
    }

    /**
     * 前端详情
     */
    @IgnoreAuth
    @RequestMapping("/detail/{id}")
    public R detail(@PathVariable("id") Long id) {
        UsersEntity users = usersService.selectById(id);
        users = usersService.selectView(new EntityWrapper<UsersEntity>().eq("id", id));
        return R.ok().put("data", users);
    }


    /**
     * 后端保存
     */
    @RequestMapping("/save")
    @SysLog("新增管理员")
    public R save(@RequestBody UsersEntity users, HttpServletRequest request) {
        users.setId(new Date().getTime() + new Double(Math.floor(Math.random() * 1000)).longValue());
        //ValidatorUtils.validateEntity(users);
        UsersEntity u = usersService.selectOne(new EntityWrapper<UsersEntity>().eq("username", users.getUsername()));
        if (u != null) {
            return R.error("用户已存在");
        }
        users.setId(new Date().getTime());
        users.setPassword(users.getPassword());
        usersService.insert(users);
        return R.ok();
    }

    /**
     * 前端保存
     */
    @SysLog("新增管理员")
    @RequestMapping("/add")
    public R add(@RequestBody UsersEntity users, HttpServletRequest request) {
        users.setId(new Date().getTime() + new Double(Math.floor(Math.random() * 1000)).longValue());
        //ValidatorUtils.validateEntity(users);
        UsersEntity u = usersService.selectOne(new EntityWrapper<UsersEntity>().eq("username", users.getUsername()));
        if (u != null) {
            return R.error("用户已存在");
        }
        users.setId(new Date().getTime());
        users.setPassword(users.getPassword());
        usersService.insert(users);
        return R.ok();
    }


    /**
     * 修改
     */
    @RequestMapping("/update")
    @Transactional
    @SysLog("修改管理员")
    public R update(@RequestBody UsersEntity users, HttpServletRequest request) {
        //ValidatorUtils.validateEntity(users);
        usersService.updateById(users);//全部更新
        return R.ok();
    }


    /**
     * 删除
     */
    @RequestMapping("/delete")
    @SysLog("删除管理员")
    public R delete(@RequestBody Long[] ids) {
        usersService.deleteBatchIds(Arrays.asList(ids));
        return R.ok();
    }


}

<template>
  <div>
    <div class="login_view">
      <div class="outTitle_view">
        <el-image class="outTitle_img" fit="cover"
                  src="http://clfile.zggen.cn/20240919/adbb126f981544b496bf576a0105c615.png"></el-image>
        <div class="outTilte">停车场预约小程序登录</div>
      </div>
      <el-form :model="loginForm" class="login_form">
        <div v-if="loginType==1" class="list_item">
          <div class="list_label">
            账号：
          </div>
          <input v-model="loginForm.username" class="list_inp" name="username" placeholder="请输入账号"/>
        </div>
        <div v-if="loginType==1" class="list_item">
          <div class="list_label">
            密码：
          </div>
          <input v-model="loginForm.password" class="list_inp" placeholder="请输入密码" type="password"
                 @keydown.enter.native="handleLogin"/>
        </div>
        <div v-if="userList.length>1" class="list_type">
          <div class="list_label">
            用户类型：
          </div>
          <el-select v-model="loginForm.role" placeholder="请选择用户类型">
            <el-option v-for="(item,index) in userList" :label="item.roleName" :value="item.roleName"></el-option>
          </el-select>
        </div>
        <div v-if="loginType==1" class="remember_view">
          <el-checkbox v-model="rememberPassword" :false-label="false" :true-label="true" label="记住密码"
                       size="large"/>
        </div>
        <div class="btn_view">
          <el-button v-if="loginType==1" class="login" type="success" @click="handleLogin">登录</el-button>
         
        </div>


      </el-form>
    </div>
  </div>
</template>
<script setup>
import {getCurrentInstance, onMounted, ref,} from "vue";
import {useStore} from 'vuex'

const store = useStore()
const userList = ref([])
const menus = ref([])
const loginForm = ref({
  role: '',
  username: '',
  password: ''
})
const tableName = ref('')
const loginType = ref(1)
//是否记住密码
const rememberPassword = ref(true)
const context = getCurrentInstance()?.appContext.config.globalProperties;
const handleLogin = () => {
  if (!loginForm.value.username) {
    context?.$toolUtil.message('请输入用户名', 'error')

    return;
  }
  if (!loginForm.value.password) {
    context?.$toolUtil.message('请输入密码', 'error')
    return;
  }
  if (userList.value.length > 1) {
    if (!loginForm.value.role) {
      context?.$toolUtil.message('请选择角色', 'error')
      verifySlider.value.reset()
      return;
    }
    for (let i = 0; i < menus.value.length; i++) {
      if (menus.value[i].roleName == loginForm.value.role) {
        tableName.value = menus.value[i].pathName || menus.value[i].tableName;
      }
    }
  } else {
    tableName.value = userList.value[0].pathName || userList.value[0].tableName;
    loginForm.value.role = userList.value[0].roleName;
  }
  login()
}
const login = () => {
  context?.$http({
    url: `${tableName.value}/login?username=${loginForm.value.username}&password=${loginForm.value.password}`,
    method: 'post'
  }).then(res => {
    //是否保存当前账号密码至缓存
    if (rememberPassword.value) {
      let loginForm1 = JSON.parse(JSON.stringify(loginForm.value))
      delete loginForm1.code
      context?.$toolUtil.storageSet("loginForm", JSON.stringify(loginForm1));
    } else {
      context?.$toolUtil.storageRemove("loginForm")
    }
    context?.$toolUtil.storageSet("Token", res.data.token);
    context?.$toolUtil.storageSet("role", loginForm.value.role);
    context?.$toolUtil.storageSet("sessionTable", tableName.value);
    context?.$toolUtil.storageSet("adminName", loginForm.value.username);
    store.dispatch('user/getSession')	//vuex中获取用户信息并保存
    context?.$router.push('/')
  }, err => {
  })
}
//获取菜单
const getMenu = () => {
  let params = {
    page: 1,
    limit: 1,
    sort: 'id',
  }

  context?.$http({
    url: "menu/list",
    method: "get",
    params: params
  }).then(res => {
    menus.value = JSON.parse(res.data.data.list[0].menujson)
    for (let i = 0; i < menus.value.length; i++) {
      if (menus.value[i].hasBackLogin == '是') {
        userList.value.push(menus.value[i])
      }
    }
    //获取缓存是否有保存的账号密码
    let form = context?.$toolUtil.storageGet('loginForm')
    if (form) {

    } else {
      loginForm.value.role = userList.value[0].roleName
    }
    context?.$toolUtil.storageSet("menus", JSON.stringify(menus.value));
  })
}
//初始化
const init = () => {
  getMenu();
  //获取缓存是否有保存的账号密码
  let form = context?.$toolUtil.storageGet('loginForm')
  if (form) {
    loginForm.value = JSON.parse(form)
  }
}
onMounted(() => {
  init()


})
</script>

<style lang="scss" scoped>
.login_view {
  background-image: url("http://clfile.zggen.cn/20240921/fb6feddfbb544df593bbf3240e3437db.webp");
  // 标题盒子
  .outTitle_view {
    // 标题图片
    .outTitle_img {
    }

    .outTilte {
    }
  }

  // 表单盒子
  .login_form {
  }

  // item盒子
  .list_item {
    // label
    .list_label {
    }

    // 输入框
    .list_inp {
    }
  }

  .list_type {
    .list_label {
    }

    // 下拉框样式
    :deep(.el-select) {
      //去掉默认样式
      .select-trigger {
        height: 100%;

        .el-input {
          height: 100%;
        }
      }
    }
  }

  // 记住密码样式
  .remember_view {

    // 未选中样式
    :deep(.el-checkbox) {
      // 复选框
      .el-checkbox__inner {
      }

      // 提示文字
      .el-checkbox__label {
      }
    }

    // 选中样式
    :deep(.is-checked) {
      //复选框
      .el-checkbox__inner {
      }

      // 提示文字
      .el-checkbox__label {
      }
    }
  }

  // 按钮盒子
  .btn_view {
    // 登录
    .login {
    }
  }
}

</style>
<style>
.login_view {
  min-height: 100vh;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-position: center center;
  background-size: 100% 100% !important;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-origin: initial;
  background-clip: initial;
  background-color: initial;
}

.login_view .outTitle_view img.el-image__inner {
  width: 78px;
  height: 78px;
}

.login_view .outTilte {
  color: #FFFFFF;
  line-height: 26px;
  font-size: 26px;
  margin-top: 30px;
}

.login_view .outTitle_view {
  text-align: center;
}

.login_view .login_form {
  width: 710px;
  background: #F6F6F6;
  border-radius: 60px 60px 0px 0px;
  margin-top: 40px;
  padding: 80px 80px 30px;
  display: flex;
  flex-wrap: wrap;
}

.login_view .list_item {
  background: #fff;
  display: flex;
  padding: 0;
  width: 100%;
  height: 50px;
  margin-bottom: 40px;
  border-radius: 5px;
  order: 1;
}

.login_view .list_label {
  line-height: 50px;
  position: relative;
  margin-right: 10px;
  width: 90px;
  flex-shrink: 0;
  text-align: center;
}

.login_view input.list_inp {
  height: 50px;
  flex: 1;
  border: none;
}

.login_view .list_label:after, .login_view .listCode_label:after {
  content: '';
  position: absolute;
  right: 0;
  height: 30px;
  width: 2px;
  background: linear-gradient(180deg, #FFFFFF 0%, #6F9867 46%, rgba(111, 152, 103, 0) 100%);
  top: 10px;
}

.login_view .list_type {
  width: 100%;
  background: #fff;
  height: 50px;
  display: flex;
  padding: 0;
  margin-bottom: 40px;
  border-radius: 5px;
  order: 2;
}

.login_view .list_type .el-select {
  flex: 1;
}

.login_view .listCode_view {
  width: 100%;
  height: 50px;
  display: flex;
  padding: 0;
  margin-bottom: 40px;
  order: 3;
}

.login_view .listCode_label {
  line-height: 50px;
  width: 90px;
  text-align: center;
  position: relative;
  background: #fff;
  border-radius: 5px 0 0 5px;
}

.login_view input.listCode_inp {
  background: #fff;
  border: none;
  padding-left: 10px;
  width: 250px;
  margin-right: 10px;
  border-radius: 0 5px 5px 0;
}

.login_view .listCode_btn {
  flex: 1;
  background: var(--theme);
  text-align: center;
  line-height: 50px;
  border-radius: 5px;
}

.login_view .btn_view {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  row-gap: 20px;
  justify-content: center;
  column-gap: 20px;
  order: 4;
}

.login_view .el-button.login {
  background: var(--theme);
  border: none;
  width: 100%;
  color: #fff;
  height: 50px;
  order: 1;
}

.login_view .remember_view {
  display: none;
}

.login_view .el-button.register {
  order: 3;
  border: 1px solid var(--theme);
  background: #fff;
  color: var(--theme);
  height: 50px;
  width: 122px;
  margin-left: 0;
}

.login_view .el-button.forget {
  width: 194px;
  order: 20;
  background: #DADEDA;
  height: 50px;
  border-radius: 5px;
  color: var(--theme);
  margin: 0;
}

.login_view .face {
  text-align: center;
  width: 100%;
  margin-top: 30px;
  font-size: 16px;
  order: 4;
}

.login_view .el-button {
  font-size: 16px;
}

.login_view .listCode_btn span {
  font-size: 22px !important;
}

.login_view .el-select, .login_view .el-input {
  border: none;
}
</style>

源码下载

链接：https://pan.baidu.com/s/1hHVU7anVoxqJUeBDe5lcoA
提取码：1234