025 安居租赁 · 房屋租赁平台

安居租赁 · 房屋租赁平台

一个前后端分离的房屋租赁管理系统,覆盖房源发布与审核、看房预约、在线签约、账单缴费、评价、收藏、消息通知、投诉建议等完整业务闭环,支持租客 / 房东 / 管理员三种角色。

功能特性

角色 功能
访客/租客 浏览房源列表与详情、搜索筛选、预约看房、在线签约、查看账单并缴费、收藏房源、发表评价、消息通知、提交投诉建议、个人资料管理
房东 房源发布/编辑/上下架、管理预约(确认/完成)、查看合同、查看账单、后台工作台概览
管理员 用户管理(增删改/禁用)、房源审核、投诉处理与回复、公告管理、支付流水查看

功能界面预览

以下截图由无头浏览器(1280×800)基于 sql/house_rent.sql 内置演示数据自动渲染,源文件位于 docs/screenshots/。

公共页面(无需登录)

  • 首页 /home :顶部导航 + 搜索入口,中部直达功能卡片,下方为最新房源轮播与平台公告,底部页脚。

  • 房源列表 /list :按城市 / 租赁类型 / 租金范围筛选,卡片式展示封面、户型、月租、标签与收藏状态。

  • 房源详情 /house/:id :封面轮播、价格与户型指标面板、房源标签 / 地址 / 浏览与评分、房东信息、以及「预约看房」「立即签约」「收藏」入口,下方为房源详情与租客评价。

  • 登录 /login 与注册 /register :JWT 登录、角色差异展示,注册后自动登录并跳转。

租客端

  • 预约看房弹窗 :房源详情页「预约看房」弹出,选择看房日期时间并填写备注,提交后状态流在「我的预约」中可见。

  • 我的预约 /appointments :租约状态流转(待确认 → 已确认 → 已完成 / 已取消),支持取消预约。

  • 我的合同 /contracts :电子合同列表与详情(租金 / 期限 / 付款方式 / 条款),房东可解约、租客可查看账单。

  • 我的账单 /bills :按合同生成的水电 / 租金账单,支持在线缴费并生成支付流水。

  • 我的收藏 /favorites :一键收藏的房源合集,可直接进入详情或取消收藏。

  • 我的评价 /comments :已签约房源发表 / 删除评价,星级 + 文字内容。

  • 消息通知 /messages :系统消息(预约、签约、账单等提醒),支持标记已读 / 全部已读,顶栏带未读数角标。

  • 投诉建议 /complaints :提交问题并跟进管理处回复。

  • 个人资料 /profile :头像更换(上传)与真实姓名 / 手机号维护。

房东后台(/manage/*)

  • 工作台 /manage/overview :统计卡片 + ECharts 数据可视化(房源 / 预约 / 合同状态分布、近 6 个月账单趋势、热门房源 TOP5)。

  • 房源管理 /manage/houses :本人房源列表,支持发布 / 编辑 / 上架下架。

  • 发布房源 /manage/houses/new :完整表单(标题、城市、户型、租金押金、封面/图片上传、描述)。

  • 预约管理 /manage/appointments :查看租客预约,确认 / 取消并通知租客。

  • 合同管理 /manage/contracts :已签合同台账并执行解约。

  • 账单 / 收款 /manage/bills :各合同账单明细与收款状态。

管理后台(admin,/manage/*)

  • 用户管理 /manage/users :租客 / 房东 / 管理员账号增删改、重置密码与禁用启用。

  • 房源审核 /manage/audits :对待审核房源进行通过 / 驳回并通知房东。

  • 投诉处理 /manage/complaints :回复租客投诉并推进闭环。

  • 公告管理 /manage/notices :发布 / 删除平台公告,租客端首页同步展示。

  • 支付流水 /manage/payments :全部缴费记录查询。

技术栈

后端 (backend/)

  • Java 8(JDK 1.8)
  • Spring Boot 2.7.18
  • Spring Security + JWT(jjwt 0.9.1)身份认证与接口鉴权
  • MyBatis-Plus 3.5.3.1
  • MySQL 8.0(驱动 mysql-connector-java 8.0.22)
  • Hibernate Validator 参数校验、Lombok

前端 (frontend/)

  • Vue 3.4(<script setup> 组合式 API)
  • Vite 5.4 + @vitejs/plugin-vue
  • Element Plus 2.7 + @element-plus/icons-vue
  • Vue Router 4(路由级登录/角色守卫)、Pinia 2(用户状态)

环境要求

软件 版本
JDK 1.8(后端为 Java 8 工程,不可用更高版本 JDK 编译)
Maven 3.6+
Node.js 18+
MySQL 8.0
浏览器 Chrome / Edge 等现代浏览器

目录结构

复制代码
house-rent/
├── backend/                         # Spring Boot 后端
│   ├── src/main/java/com/houserent/
│   │   ├── config/                  # 安全、CORS、MyBatis-Plus、数据初始化
│   │   ├── controller/              # 12 个 REST 控制器(/api/**)
│   │   ├── service/                 # 业务层
│   │   ├── mapper/                  # MyBatis-Plus Mapper
│   │   ├── entity/ dto/ vo/         # 实体、请求、返回对象
│   │   ├── security/                # JWT 认证链路
│   │   └── common/                  # 统一返回 Result / 异常处理
│   └── src/main/resources/application.yml
├── frontend/                        # Vue3 前端
│   └── src/
│       ├── api/                     # 接口封装(axios 实例、按模块)
│       ├── views/front/             # 前台页面(首页/房源/预约/合同/账单等)
│       ├── views/manage/            # 后台页面(工作台/房源管理/审核/用户等)
│       ├── views/auth/              # 登录/注册
│       ├── layouts/                 # 前台/后台布局
│       ├── router/ stores/ utils/ components/ styles/
│       └── main.js App.vue
├── docs/screenshots/                # 功能界面截图(README「功能界面预览」配图)
└── sql/house_rent.sql               # 数据库初始化脚本(建库 + 11 张表 + 演示数据)

快速启动

1. 初始化数据库

bash 复制代码
mysql -uroot -p < sql/house_rent.sql

脚本会执行 DROP DATABASE IF EXISTS house_rent 并重建,包含 11 张表:sys_user、house、appointment、contract、bill、payment、favorite、house_comment、message、complaint、notice,并在脚本末尾自带完整的演示数据,导入一次即可直接体验所有页面(详见"演示账号")。

2. 启动后端(端口 8080)

数据库连接、JWT 等配置在 backend/src/main/resources/application.yml:

yaml 复制代码
server.port: 8080
spring.datasource.username: root
spring.datasource.password: "123456"      # 按本机 MySQL 修改
jwt.secret / jwt.expire-hours            # JWT 密钥与有效期(24 小时)
upload.dir: ../upload/                   # 图片上传目录(相对后端运行目录)

命令行方式:

bash 复制代码
cd backend
mvn clean package -DskipTests                 # 打包,JDK 8
java -jar target/house-rent-backend-1.0.0.jar # 运行

或在 IDEA 中直接运行 HouseRentApplication.main。

3. 启动前端(端口 5173)

Vite 已配置开发代理,/api 自动转发到 http://localhost:8080(见 frontend/vite.config.js)。

bash 复制代码
cd frontend
npm install
npm run dev        # 开发模式,访问 http://localhost:5173
npm run build      # 生产构建(产物在 dist/)
npm run preview    # 本地预览构建产物

访问入口

浏览器打开 http://localhost:5173 即可进入系统首页 /home(默认跳转),无需登录即可浏览房源、查看详情与公告。登录后:

  • 租客/房东/管理员:继续使用前台功能(预约、签约、账单、收藏、评价、消息、投诉等)
  • 房东/管理员:点击页面右上角头像菜单中的「进入房东后台/进入管理后台」进入管理端 /manage/overview
  • 游客:点击右上角「登录」进入 /login 使用演示账号登录

演示账号

用户名 密码 角色 说明
admin 123456 管理员 平台管理(用户/审核/投诉/公告/流水)
landlord 123456 房东 王建国,管理自己的 5 套演示房源
tenant 123456 租客 李娜,演示租客端全流程

演示数据:4 套已上架房源(北京/上海/广州/深圳)+ 1 套待审核房源(杭州),房源均带真实图片(存放于 frontend/public/uploads/);3 条平台公告;以及覆盖租客/房东各页面的预约、合同、账单、支付流水、收藏、评价、消息、投诉建议。上述数据统一由 sql/house_rent.sql 内置(密码为 BCrypt 密文,明文均为 123456),随脚本一次性导入,无需额外初始化。

主要页面(路由)

  • 前台:/home 首页、/list 房源列表、/house/:id 房源详情、/appointments 我的预约、/contracts 我的合同、/bills 我的账单、/favorites 我的收藏、/comments 我的评价、/messages 消息通知、/complaints 投诉建议、/profile 个人资料
  • 后台 /manage/*:overview 工作台(统计图表,含房源/预约/合同状态分布、近 6 个月账单趋势、热门房源 TOP5)、houses(含 houses/new、houses/:id/edit)房源管理、appointments 预约管理、contracts 合同管理、bills 账单管理、users 用户管理(admin)、audits 房源审核(admin)、complaints 投诉处理(admin)、notices 公告管理(admin)、payments 支付流水(admin)
  • 登录 /login、注册 /register、404 兜底页

标注 meta.auth 的路由未登录会跳转 /login 并携带 redirect 参数;标注 meta.roles 的路由会校验角色(租客无权进入后台)。

API 一览

所有接口统一返回 Result:{ code, msg, data },code=200 为成功;/api/auth/**、/api/house/list、/api/house/detail/**、/api/comment/house/**、/api/notice/list、/api/upload/** 免登录,其余需带 Authorization: Bearer <token>,/api/admin/** 仅管理员,/api/landlord/** 限房东/管理员。

模块 端点
认证 POST /api/auth/login、POST /api/auth/register、GET /api/auth/me、PUT /api/auth/profile
房源 GET /api/house/list、GET /api/house/detail/{id}、POST /api/house、PUT /api/house/{id}、DELETE /api/house/{id}、PUT /api/house/{id}/status
预约 POST /api/appointment、GET /api/appointment/my(别名 /api/client/appointment/my)、GET /api/landlord/appointments、PUT /api/landlord/appointment/{id}/status
合同 POST /api/contract/sign、GET /api/contract/my、GET /api/contract/{id}、GET /api/landlord/contracts、PUT /api/landlord/contract/{id}/terminate
账单/支付 GET /api/bill/my、POST /api/bill/pay、GET /api/landlord/bills、GET /api/contract/{contractId}/bills
收藏 POST /api/favorite/{houseId}、GET /api/favorite/my
评价 GET /api/comment/house/{houseId}、POST /api/comment、GET /api/comment/my、DELETE /api/comment/{id}
消息 GET /api/message/list、GET /api/message/unread-count、PUT /api/message/read/{id}、PUT /api/message/read-all
投诉 POST /api/complaint、GET /api/complaint/my、GET /api/admin/complaints、PUT /api/admin/complaint/{id}/reply
公告 GET /api/notice/list、POST /api/admin/notice、DELETE /api/admin/notice/{id}
管理 GET/POST/PUT/DELETE /api/admin/user(s.../)、PUT /api/admin/user/{id}/status、GET /api/admin/houses、PUT /api/admin/house/{id}/audit、GET /api/admin/payments
上传 POST /api/upload(multipart 文件,upload.dir 指定存储目录)

常见问题

  • 后端启动失败/连不上数据库 :确认 MySQL 已启动、application.yml 中账号密码正确,且已执行 sql/house_rent.sql。
  • 端口被占用 :8080(后端)被占用时改 application.yml 的 server.port,并同步改 frontend/vite.config.js 的 proxy.target。
  • 中文乱码 :数据库使用 utf8mb4;JVM 启动可加 -Dfile.encoding=UTF-8。
  • 数据缺失或想重置 :演示数据随 sql/house_rent.sql 导入;如需还原,重新导入该脚本后重启后端即可。房源图片需与仓库中 frontend/public/uploads/ 目录保持一致。
相关推荐
weixin_460443562 小时前
2026年新修订《网络安全法》实施:Java私有化考试系统如何做好SBOM、漏洞治理与安全升级?
java·开发语言·在线考试系统·企业培训考试系统·宏远培训考试系统·国企培训考试系统·国产化培训系统
海鸥-w5 小时前
什么是AOP
java
Cc.Y6 小时前
Java零基础入门:可变字符串与包装类:StringBuilder、StringBuffer 与 通讯录管理系统实战
java·开发语言·python
paopaokaka_luck6 小时前
基于springboot+vue的智慧家政管理系统(AI问答、 WebSocket实时沟通、ECharts运营分析、订单规则与服务追踪)
java·javascript·spring boot·数据分析·echarts·mybatis
sm_926787056 小时前
RFID 标签打印的技术实现要点与二次开发实践
java·大数据·前端·c++·编辑器
阿森_dev6 小时前
2027 届毕设选题怎么选:30 个 Java 方向选题的实现难度排序
java·开发语言·spring boot·毕业设计·课程设计
Sarvartha6 小时前
Lambda 表达式和函数式接口
java·开发语言
爱编程的小白L6 小时前
2027 计算机毕业设计选题汇总|深度学习专项(2027最新)
人工智能·深度学习·课程设计
计算机毕业设计杰瑞6 小时前
【计算机毕设精品】基于SpringBoot的一体化教务与学业质量管理系统的设计与实现,附源码_增删改查_java项目_可完美运行部署_网站项目
java·spring boot·课程设计
colinu7 小时前
C++ 异步任务与线程生命周期:`std::async`、`future`、`thread`、`jthread` 与协作式退出
java·jvm·c++