Springboot+Vue实现物业管理系统

本文涉及的产品
RDS MySQL Serverless 基础系列,0.5-2RCU 50GB
云数据库 RDS MySQL,集群系列 2核4GB
推荐场景:
搭建个人博客
云数据库 RDS PostgreSQL,集群系列 2核4GB
简介: Springboot+Vue实现物业管理系统

项目编号:BS-XX-137

 

一,项目简介

使用SpringBoot+Mybatis+BootStrap+Layui+VUE制作的智慧小区物业管理系统。 本系统采用了 B/S 架构,Java、Html、Css、Js 等技术,使用了主流的后台开发框架SpringBoot(SpringMVC+Spring+Mybatis),前端开发框架使用了 LayUI、Vue、JQuery 以及 Vue的前端组件库 Element-UI,采用了开源的轻量级数据库 Mysql 进行开发。实现了小区管理、房产管理、设备管理、业主管理、服务管理、车位管理等主要功能。提升物业管理水平,提高工作效率,降低成本,便于物业快速回收物业费;扩大服务范围和能力,方便住户,提升用户满意度;为物业公司扩展了新的收入渠道:租赁中介、社区团购、物业服务;为住户缴纳物业费、水电、停车费等生活费用,提供在线支付,方便快捷。

二,环境介绍

语言环境:Java:  jdk1.8

数据库:Mysql: mysql5.7

应用服务器:Tomcat:  tomcat8.5.31

开发工具:IDEA或eclipse

后台开发技术:Springboot+Mybatis

前端开发技术:Vue+Layui+Jquery

三,系统展示

用户登陆

首页仪表盘

小区管理

房产管理

业主相关信息管理

车位信息及使用管理

业务相关服务管理模块

小区资产管理

小区收费管理

管理员管理

用户组角色管理

系统设置

1.  导入项目到IDE工具(如Eclipse)


2.  导入数据库文件estatedb.sql到MySQL


3.  修改src/main/resources/application.yml文件中的数据库链接地址、账号密码


4.  运行启动类com.es.estatemanagement.EstateManagementApplication,启动项目,默认端口为8888


5.  浏览器访问http://localhost:8888/,进入首页

四,核心代码展示

package com.es.estatemanagement.controller;
import com.es.estatemanagement.common.MessageConstant;
import com.es.estatemanagement.common.PageResult;
import com.es.estatemanagement.common.Result;
import com.es.estatemanagement.common.StatusCode;
import com.es.estatemanagement.domain.Building;
import com.es.estatemanagement.domain.Community;
import com.es.estatemanagement.service.BuildingService;
import com.es.estatemanagement.service.CommunityService;
import com.github.pagehelper.Page;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import java.util.List;
import java.util.Map;
/**
 * @Auth: znz
 * @Desc:
 */
@RestController
@RequestMapping("/building")
public class BuildingController {
    @Autowired
    private BuildingService buildingService;
    @RequestMapping("/find")
    public Result find(){
        List<Building> all = buildingService.findAll();
        return new Result(false,200,"请求成功adasdasdas",all);
    }
    @RequestMapping("/search")
    public PageResult search(@RequestBody Map searchMap){
        Page<Building> page = buildingService.search(searchMap);
        return new PageResult(true, StatusCode.OK, MessageConstant.COMMUNITY_SEARCH_SUCCESS,page.getResult(),page.getTotal());
    }
    @RequestMapping("/add")
    public Result add(@RequestBody Building community){
        Boolean add = buildingService.add(community);
        return new Result(true,StatusCode.OK,MessageConstant.COMMUNITY_ADD_SUCCESS);
    }
    @RequestMapping("/findById")
    public Result findById(Integer id){
        Building community = buildingService.findById(id);
        return new Result(true,StatusCode.OK,MessageConstant.COMMUNITY_FIND_BY_ID_SUCCESS,community);
    }
    @RequestMapping("/update")
    public Result update(@RequestBody Building community){
        Boolean add = buildingService.update(community);
        return new Result(true,StatusCode.OK,MessageConstant.COMMUNITY_UPDATE_SUCCESS);
    }
    @RequestMapping("/del")
    public Result del(@RequestBody List<Integer> ids){
        Boolean flag = buildingService.del(ids);
        return new Result(true,StatusCode.OK,MessageConstant.COMMUNITY_DELETE_SUCCESS);
    }
}
package com.es.estatemanagement.controller;
import com.es.estatemanagement.common.MessageConstant;
import com.es.estatemanagement.common.PageResult;
import com.es.estatemanagement.common.Result;
import com.es.estatemanagement.common.StatusCode;
import com.es.estatemanagement.domain.Community;
import com.es.estatemanagement.service.CommunityService;
import com.github.pagehelper.Page;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;
import java.util.List;
import java.util.Map;
/**
 * @Auth: zhuan
 * @Desc: 小区管理控制层:只负责接收前端浏览器发送的请求和请求参数,调用service层获取业务逻辑加工处理后的数据
 */
@RestController
@RequestMapping("/community")
public class CommunityController {
    @Autowired
    private CommunityService communityService;
    @RequestMapping("/find")
    public Result find(){
        List<Community> all = communityService.findAll();
        return new Result(false,200,"请求成功adasdasdas",all);
    }
    @RequestMapping("/search")
    public PageResult search(@RequestBody Map searchMap){
        Page<Community> page = communityService.search(searchMap);
        return new PageResult(true, StatusCode.OK, MessageConstant.COMMUNITY_SEARCH_SUCCESS,page.getResult(),page.getTotal());
    }
    @RequestMapping("/add")
    public Result add(@RequestBody Community community){
        Boolean add = communityService.add(community);
        return new Result(true,StatusCode.OK,MessageConstant.COMMUNITY_ADD_SUCCESS);
    }
    @RequestMapping("/findById")
    public Result findById(Integer id){
        Community community = communityService.findById(id);
        return new Result(true,StatusCode.OK,MessageConstant.COMMUNITY_FIND_BY_ID_SUCCESS,community);
    }
    @RequestMapping("/update")
    public Result update(@RequestBody Community community){
        Boolean add = communityService.update(community);
        return new Result(true,StatusCode.OK,MessageConstant.COMMUNITY_UPDATE_SUCCESS);
    }
    // /community/updateStatus/0/1
    @RequestMapping("/updateStatus/{status}/{id}")
    public Result updateStatus(@PathVariable("status") String status,@PathVariable("id") Integer id){
        Boolean flag = communityService.updateStatus(status,id);
        return new Result(true,StatusCode.OK,MessageConstant.COMMUNITY_UPDATE_STATUS_SUCCESS);
    }
    @RequestMapping("/del")
    public Result del(@RequestBody List<Integer> ids){
        Boolean flag = communityService.del(ids);
        return new Result(true,StatusCode.OK,MessageConstant.COMMUNITY_DELETE_SUCCESS);
    }
}
package com.es.estatemanagement.controller;
import java.io.BufferedOutputStream;
import java.io.File;
import java.io.FileOutputStream;
import java.io.IOException;
import java.util.Arrays;
import java.util.HashMap;
import java.util.Iterator;
import java.util.Map;
import java.util.UUID;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.es.estatemanagement.common.MessageConstant;
import com.es.estatemanagement.common.Result;
import com.es.estatemanagement.common.StatusCode;
import org.apache.commons.fileupload.servlet.ServletFileUpload;
import org.springframework.util.FileCopyUtils;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.multipart.MultipartHttpServletRequest;
import com.alibaba.fastjson.JSONObject;
/**
 * @Auth: zhuan
 * @Desc: 文件上传-控制器
 */
@RestController
@RequestMapping("/estate")
public class FileController {
  /**
   * 功能描述: 上传文件
   * @param file  上传文件的参数名,必须和前端参数名称一致
   * @param request 请求对象
   * @param response  响应对象
   * @return : com.es.estatemanagement.common.Result
   */
  @RequestMapping(value="/fileupload")
  public Result uploads(@RequestParam("file")MultipartFile file, HttpServletRequest request,HttpServletResponse response) throws IOException {
    //获取当前项目所在绝对路径
    String absolutePath = System.getProperty("user.dir");
    //当前项目名称,可以自定义
    String projectName = "/estate-management";
    //文件上传后所在绝对路径
    String savePath = absolutePath+"/src/main/resources/static/fileupload/";
    //保存在数据库的文件地址
    String saveUrl = "/fileupload/";
    // 定义允许上传的文件扩展名
    HashMap<String, String> extMap = new HashMap<String, String>();
    extMap.put("image", "gif,jpg,jpeg,png,bmp");
    // 最大文件大小
    long maxSize = 10000000; //10M
    response.setContentType("text/html; charset=UTF-8");
    if (!ServletFileUpload.isMultipartContent(request)) {
      return new Result(false, StatusCode.ERROR,MessageConstant.NO_FILE_SELECTED);
    }
    File uploadDir = new File(savePath);
    // 判断文件夹是否存在,如果不存在则创建文件夹
    if (!uploadDir.exists()) {
      uploadDir.mkdirs();
    }
    // 检查目录写权限
    if (!uploadDir.canWrite()) {
      return new Result(false, StatusCode.ERROR,MessageConstant.NO_WRITE_PERMISSION);
    }
    String dirName = request.getParameter("dir");
    if (dirName == null) {
      dirName = "image";
    }
    if (!extMap.containsKey(dirName)) {
      return new Result(false, StatusCode.ERROR,MessageConstant.INCORRECT_DIRECTORY_NAME);
    }
    MultipartHttpServletRequest mRequest = (MultipartHttpServletRequest) request;
    Map<String, MultipartFile> fileMap = mRequest.getFileMap();
    String fileName = null;
    Iterator<Map.Entry<String, MultipartFile>> iter = fileMap.entrySet().iterator();
    for (String s : fileMap.keySet()) {
    }
    for (Iterator<Map.Entry<String, MultipartFile>> it = fileMap.entrySet().iterator(); it.hasNext();) {
      Map.Entry<String, MultipartFile> entry = it.next();
      MultipartFile mFile = entry.getValue();
      fileName = mFile.getOriginalFilename();
      // 检查文件大小
      if (mFile.getSize() > maxSize) {
        return new Result(false, StatusCode.ERROR,MessageConstant.SIZE_EXCEEDS__LIMIT);
      }
      String fileExt = fileName.substring(fileName.lastIndexOf(".")+1);
      if (!Arrays.<String> asList(extMap.get(dirName).split(",")).contains(fileExt)) {
        return new Result(false, StatusCode.ERROR,MessageConstant.FILE_TYPE_ERROR);
      }
      UUID uuid = UUID.randomUUID();
      String path = savePath + uuid.toString() +"."+ fileExt;
      System.out.println("文件存储地址:【"+path+"】");
      saveUrl = saveUrl  + uuid.toString() +"."+ fileExt;
      try {
        BufferedOutputStream outputStream = new BufferedOutputStream(new FileOutputStream(path));
        FileCopyUtils.copy(mFile.getInputStream(), outputStream);
      } catch (IOException e) {
        e.printStackTrace();
      }
    }
    return new Result(true,StatusCode.OK, MessageConstant.COMMUNITY_PIC_UPLOAD_SUCCESS,saveUrl);
  }
  /**
   * 功能描述: 删除文件
   * @param fileName  文件名称参数,和前台传递的参数保持一致
   * @return : com.es.estatemanagement.common.Result
   */
  @RequestMapping(value="/delfile")
  public Result fileDel(@RequestParam String fileName){
    String name = fileName.replace("/fileupload/","");
    //获取当前项目所在绝对路径
    String absolutePath = System.getProperty("user.dir");
    //当前项目名称,可以自定义
    String projectName = "/estate-management";
    //文件上传后所在绝对路径
    String savePath = absolutePath+projectName+"/src/main/resources/static/fileupload/";
    File file = new File(savePath+name);
    if (file.exists()){//文件是否存在
      file.delete();//删除文件
    }
    return new Result(true,StatusCode.OK, MessageConstant.COMMUNITY_PIC_DEL_SUCCESS);
  }
}

五,项目总结

1. 系统上传的文件会存放在项目目录/src/main/resources/static/fileupload


2. 项目使用的MySQL驱动版本是5.1.30,如果MySQL版本是8.0以上,需要将pom.xml中的MySQL驱动版本改为8.0以上版本,或者直接将`<version>5.1.30</version>`删除即可。因为Springboot使用的默认MySQL驱动版本为8.0.20  


4. 小区管理模块实现了从前端到控制层、业务层、持久层的完整功能,可以参照该模块实现其他功能。


5. 本系统使用了Mybatis插件TkMapper,TkMapper又名通用 Mapper,封装了对单表的 CRUD 操作。通用 Mapper 可以极大的方便开发人员。可以随意的按照自己的需要选择通用方法,还可以很方便的开发自己的通用方法。

 

相关实践学习
如何在云端创建MySQL数据库
开始实验后,系统会自动创建一台自建MySQL的 源数据库 ECS 实例和一台 目标数据库 RDS。
全面了解阿里云能为你做什么
阿里云在全球各地部署高效节能的绿色数据中心,利用清洁计算为万物互联的新世界提供源源不断的能源动力,目前开服的区域包括中国(华北、华东、华南、香港)、新加坡、美国(美东、美西)、欧洲、中东、澳大利亚、日本。目前阿里云的产品涵盖弹性计算、数据库、存储与CDN、分析与搜索、云通信、网络、管理与监控、应用服务、互联网中间件、移动服务、视频服务等。通过本课程,来了解阿里云能够为你的业务带来哪些帮助 &nbsp; &nbsp; 相关的阿里云产品:云服务器ECS 云服务器 ECS(Elastic Compute Service)是一种弹性可伸缩的计算服务,助您降低 IT 成本,提升运维效率,使您更专注于核心业务创新。产品详情: https://www.aliyun.com/product/ecs
相关文章
|
2天前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用
【10月更文挑战第8天】本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用。首先,通过 Spring Initializr 创建并配置 Spring Boot 项目,实现后端 API 和安全配置。接着,使用 Ant Design Pro Vue 脚手架创建前端项目,配置动态路由和菜单,并创建相应的页面组件。最后,通过具体实践心得,分享了版本兼容性、安全性、性能调优等注意事项,帮助读者快速搭建高效且易维护的应用框架。
9 3
|
1天前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 实现动态路由和菜单功能,快速搭建前后端分离的应用框架
本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 实现动态路由和菜单功能,快速搭建前后端分离的应用框架。首先,确保开发环境已安装必要的工具,然后创建并配置 Spring Boot 项目,包括添加依赖和配置 Spring Security。接着,创建后端 API 和前端项目,配置动态路由和菜单。最后,运行项目并分享实践心得,包括版本兼容性、安全性、性能调优等方面。
10 1
|
3天前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用
【10月更文挑战第7天】本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用。首先,通过 Spring Initializr 创建 Spring Boot 项目并配置 Spring Security。接着,实现后端 API 以提供菜单数据。在前端部分,使用 Ant Design Pro Vue 脚手架创建项目,并配置动态路由和菜单。最后,启动前后端服务,实现高效、美观且功能强大的应用框架。
7 2
|
4天前
|
机器学习/深度学习 移动开发 自然语言处理
基于人工智能技术的智能导诊系统源码,SpringBoot作为后端服务的框架,提供快速开发,自动配置和生产级特性
当身体不适却不知该挂哪个科室时,智能导诊系统应运而生。患者只需选择不适部位和症状,系统即可迅速推荐正确科室,避免排错队浪费时间。该系统基于SpringBoot、Redis、MyBatis Plus等技术架构,支持多渠道接入,具备自然语言理解和多输入方式,确保高效精准的导诊体验。无论是线上医疗平台还是大型医院,智能导诊系统均能有效优化就诊流程。
|
8天前
|
JavaScript 前端开发 数据可视化
【SpringBoot+Vue项目实战开发】2020实时更新。。。。。。
【SpringBoot+Vue项目实战开发】2020实时更新。。。。。。
23 0
|
9天前
|
JavaScript 前端开发 Java
Springboot+vue实现文件的下载和上传
这篇文章介绍了如何在Springboot和Vue中实现文件的上传和下载功能,包括后端控制器的创建、前端Vue组件的实现以及所需的依赖配置。
65 0
|
3天前
|
JavaScript 数据可视化
vue-cli学习一:vue脚手架的 vue-cli2和vue-cli3版本 创建vue项目,vue的初始化详解
这篇文章介绍了如何使用vue-cli 2和3版本来创建Vue项目,并详细说明了两者之间的主要区别。
23 5
vue-cli学习一:vue脚手架的 vue-cli2和vue-cli3版本 创建vue项目,vue的初始化详解
|
2天前
|
存储 JavaScript 前端开发
Vue中组件通信方式有哪些?
本文介绍了 Vue 中几种常见的组件间通信方式,包括 Props / $emit、provide / inject、ref / refs、eventBus、Vuex、$parent / $children、$attrs / $listeners 以及通过 vue-router 传参。每种方式都有其适用场景和注意事项,帮助开发者根据具体需求选择合适的通信方式。
10 3
Vue中组件通信方式有哪些?
|
2天前
|
JavaScript
VUE学习二:事件监听(v-on)、条件判断(v-if/v-else-if/v-else)、循环遍历(v-for)
这篇文章是关于Vue.js的学习指南,涵盖了事件监听、条件判断、循环遍历、数组方法响应性、案例分析以及高阶函数的使用。
13 2
VUE学习二:事件监听(v-on)、条件判断(v-if/v-else-if/v-else)、循环遍历(v-for)
|
3天前
|
JavaScript 数据可视化
vue-cli学习二:vue-cli3版本 创建vue项目后,Runtime-Compiler和Runtime-only两个模式详解;vue项目管理器;配置文件的配置在哪,以及如何配置
这篇文章详细介绍了Vue CLI 3版本创建项目时的Runtime-Compiler和Runtime-only两种模式的区别、Vue程序的运行过程、render函数的使用、eslint的关闭方法,以及Vue CLI 2和3版本配置文件的不同和脚手架3版本创建项目的配置文件配置方法。
12 3
vue-cli学习二:vue-cli3版本 创建vue项目后,Runtime-Compiler和Runtime-only两个模式详解;vue项目管理器;配置文件的配置在哪,以及如何配置