Hello，我是Bug终结者，一名热爱后端Java的风趣且幽默的程序员~，本周技术分享为大家带来一个基于SpingBoot + Ajax实现个人账目管理系统，篇幅幽默，继续往下看吧~
快来发现我的宇宙哦~
广播站CSDN博客之星参选博主：Bug终结者.
链接：https://blog.csdn.net/weixin_45526437?spm=1001.2101.3001.5343
五星好评，您的每一分对我都贡献巨大，感谢您投的每一票
再次感谢您的投票，谢谢！
项目简介本项目主要记录个人的进出账目和总金额
个人资产管理页面
- 上方是新增人员的姓名和初始资产总额，保存后提交到数据表 t_user_all_money 中
- 下方是所有人员总资产的列表。
- 人员总资产只可以初始化新增、不可以修改和删除
- 进出记录数： 是人员对应在 t_user_iomoney 表中的进出金额的记录数
- 点击保存按钮，列表将马上显示人员的资产总额的记录。
- 初始资产总额允许为空，如果空着，则为 初始资产为 0 元
- 点击明细，可以进入到该用户对应的明细页面
- 点击明细进入资产收支明细页面，需要携带参数 user_id , 即明细的超级链接类似 user_iomoney.html?user_id=1
- 点击保存按钮无论成功与否，提示信息都要显示在 下方提示信息区域
个人资产收支明细页面
- 本页面需要拿到当前的用户的id ，需要使用javascript 从地址中获取 user_id 的参数，从url中读取参数的办法见下文： https://blog.csdn.net/cuipy/article/details/122084823
- 页面中要显示当前人员的姓名和总资产
- 点击返回按钮要回到 user_all_money.html 页面
- 点击保存按钮，将收入/支出明细保存到 t_user_iomoney 表中
- 金额不允许为空，也不允许为0
- 点击保存后，根据支出/收入对该人员的总资产进行相应的变动
- 列表要列出当前用户的所有收入支出的明细。
- 保存收入/支出明细成功后，马上在列表上显示出来。
- 点击保存按钮无论成功与否，提示信息都要显示在 下方提示信息区域
- 点击删除按钮，要提示：您是否确信删除这条记录？
- 删除后，要相应的更新当前人员的总资产。
- 支出的金额不允许小于当前人员的总资产。
前端：Jquery+Ajax+Bootstrap+HTML+CSS+Javascript
后端：Spring Boot+MyBatis
IDE：Jetbrains IDEA
JDK：jdk1.8
效果图 数据表user_all_money表
CREATE TABLE `t_user_all_money` ( `noid` int(11) NOT NULL AUTO_INCREMENT, `username` varchar(32) NOT NULL COMMENT '用户姓名', `all_money` decimal(10,2) NOT NULL DEFAULT '0.00' COMMENT '总金额', PRIMARY KEY (`noid`) ) ENGINE=InnoDB AUTO_INCREMENT=7 DEFAULT CHARSET=utf8mb4
t_user_iomoney表
CREATE TABLE `t_user_iomoney` ( `noid` int(11) NOT NULL AUTO_INCREMENT, `user_id` int(11) NOT NULL COMMENT '对应t_user_all_money.noid', `iotype` tinyint(4) NOT NULL DEFAULT '0' COMMENT '收入/支出； 1 收入 ；2 支出', `iodetail` varchar(128) DEFAULT NULL COMMENT '收入或支出说明', `iotime` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP COMMENT '收入或支出时间', `iomoney` decimal(10,2) NOT NULL COMMENT '收入或支出金额', PRIMARY KEY (`noid`) ) ENGINE=InnoDB AUTO_INCREMENT=10 DEFAULT CHARSET=utf8mb4项目结构 前端结构 后端结构 依赖文件
4.0.0 org.springframework.boot spring-boot-starter-parent 2.6.2 com.wanshi test_springboot 0.0.1-SNAPSHOT test_springboot test_springboot 1.8 org.springframework.boot spring-boot-starter-web org.springframework.boot spring-boot-starter-logging org.springframework.boot spring-boot-starter-log4j 1.3.8.RELEASE org.springframework.boot spring-boot-test 2.1.7.RELEASE org.springframework spring-test 5.1.9.RELEASE org.springframework.boot spring-boot-starter-test test junit junit 4.12 com.google.code.gson gson 2.8.5 org.springframework.boot spring-boot-starter-jdbc com.alibaba druid-spring-boot-starter 1.1.20 mysql mysql-connector-java org.mybatis.spring.boot mybatis-spring-boot-starter 2.1.2 joda-time joda-time 2.10.5 commons-codec commons-codec 1.11 org.apache.commons commons-lang3 3.9 org.apache.poi poi-ooxml 5.0.0 com.googlecode.juniversalchardet juniversalchardet 1.0.3 org.springframework.boot spring-boot-maven-plugin src/main/java ***.jar
application.yml
server:
port: 8345
servlet:
context-path: /springbootajax/
spring:
servlet:
multipart:
enabled: true
max-file-size: 300MB
max-request-size: 300MB
jackson:
date-format: yyyy-MM-dd HH:mm:ss
time-zone: Asia/Shanghai
mvc:
async:
request-timeout: 30000
datasource:
driverClassName: com.mysql.cj.jdbc.Driver
url: jdbc:mysql://127.0.0.1:3306/db_zhuangaothree?useUnicode=true&characterEncoding=utf-8&serverTimezone=Asia/Shanghai&useSSL=true
username: root
password: 111111
type: com.alibaba.druid.pool.DruidDataSource
initialSize: 2
minIdle: 2
maxActive: 120
maxWait: 60000
timeBetweenEvictionRunsMillis: 60000
minEvictableIdleTimeMillis: 300000
validateQuery: SELECt 1 FROM DUAL
testWhileIdle: true
testOnBorrow: false
testOnReturn: false
poolPreparedStatements: true
maxPoolPreparedStatementPerConnectionSize: 20
filters: stat,wall,log4j
connectionProperties: druid.stat.mergeSql=true;druid.stat.slowSqlMillis=5000
logging:
config: classpath:log4j.properties
核心源码
ResultBean统一返回格式类
package com.wanshi.bean; public class ResultBean{ private Integer code; private String msg; private C data; private ResultBean(Integer code, String msg, C data) { this.code = code; this.msg = msg; this.data = data; } public static ResultBean create(Integer code, String msg, Object data) { ResultBean res = new ResultBean(code, msg, data); return res; } public Integer getCode() { return code; } public void setCode(Integer code) { this.code = code; } public String getMsg() { return msg; } public void setMsg(String msg) { this.msg = msg; } public C getData() { return data; } public void setData(C data) { this.data = data; } }
UserIOMoneyController类
package com.wanshi.controller;
import com.wanshi.bean.ResultBean;
import com.wanshi.bean.UserIOMoney;
import com.wanshi.service.UserIOMoneyService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;
import java.util.List;
@RestController
@CrossOrigin
@RequestMapping("/user_iomoney")
public class UserIOMoneyController {
@Autowired
private UserIOMoneyService userIOMoneyService;
@PostMapping("/list")
public ResultBean> list(UserIOMoney param) {
ResultBean> res = userIOMoneyService.list(param);
return res;
}
@PostMapping("/insert")
public ResultBean insert(UserIOMoney param) {
ResultBean res = userIOMoneyService.insert(param);
return res;
}
@PostMapping("/delete")
public ResultBean delete(UserIOMoney param) {
ResultBean res = userIOMoneyService.delete(param);
return res;
}
}
博主寄语
至此，系统到此完美结束，该案例通俗易懂，详细一步步带入，通过本案例，可提高你的学习能力以及训练自己的逻辑思维能力，认真学习的你很耀眼，相信你的技术一定会有一个质的飞跃，好啦，本周技术分享到此结束
GitEE地址：https://gitee.com/javawhc/individual_accounts_manager_system
GieEE教程直达：https://blog.csdn.net/weixin_45526437/article/details/121596998?spm=1001.2014.3001.5501
若在本项目中遇到技术难题，可在下方评论区留言或私信我，授人以鱼不如授人以渔
如果你觉得博主写的不错的话，不妨给个一键三连，点击下方小拳头即可一键三连。
感谢你的支持！
