%20(2).svg)
项目简介
本项目是用于班费管理的系统，采用前后端分离开发模式，全站异步获取数据。前端运用Ionic 3和Angular 4.x构建用户界面，后端采用Spring Boot、Spring、Spring MVC和MyBatis实现业务逻辑与数据交互，适合作为学习Angular的示例项目。
项目的主要特性和功能
- 账单列表管理：支持上拉加载更多、下拉刷新，可按标题搜索账单，能按时间或金额大小对账单排序显示。
- 账单详情查看：可查看每笔账单的详细信息。
- 权限控制：设置了登入控制，添加操作需权限验证。
- 账单添加：添加账单时，能获取最近使用的操作人信息，并默认使用次数最多的操作人。
安装使用步骤
数据库配置
依据项目中的 sql.sql 文件，在数据库中执行建库建表语句。
后端部署
- 确保已安装Maven。
- 进入后端项目目录，使用Maven构建项目：
mvn clean package。 - 启动Spring Boot应用：
java -jar target/your-backend-project.jar。
前端部署
- 确保已安装Node.js和Ionic CLI。
- 进入前端项目目录，安装依赖：
npm install。 - 运行前端项目：
ionic serve。
服务器部署
将前端静态文件部署到Nginx服务器。修改Nginx配置文件，添加以下内容： ```nginx
bill模块
upstream bill{
server 127.0.0.1:7000;
}
server {
listen 80;
server_name bill.huanxicloud.xyz;
add_header Cache-Control no-cache;
location / {
#静态文件地址
}
}
server {
listen 80;
server_name api.huanxicloud.xyz;
add_header Access-Control-Allow-Origin http://bill.huanxicloud.xyz;
add_header Access-Control-Allow-Credentials true;
location ^~ /bill/ {
proxy_pass http://bill;
proxy_set_header Cookie $http_cookie;
}
error_page 404 /404.html;
}
``
重新加载Nginx配置：nginx -s reload`。
访问项目
在浏览器中输入相应的域名或IP地址，即可访问班费记账系统。
下载地址
点击下载 【提取码: 4003】【解压密码: www.makuang.net】