Aelius Censorius1. 项目概述：社区老人健康信息管理系统
这个基于SpringBoot+Vue+MySQL的社区老人健康信息管理系统，是我去年为本地养老机构开发的一个实战项目。系统采用前后端分离架构，后端使用SpringBoot提供RESTful API，前端采用Vue.js构建响应式界面，数据库选用MySQL 8.0。整套系统从需求分析到上线部署共耗时3个月，目前已在5个社区养老中心稳定运行。
提示：系统源码已做完整封装，包含Docker部署脚本，真正实现"开箱即用"。我在开发过程中特别注重老年人使用体验，所有界面都做了大字体、高对比度适配。
需要模型API调用？ 免费领10W Token，多模型网关一键接入 Claude、DeepSeek 等主流模型。
2. 系统架构设计解析
2.1 技术栈选型考量
选择SpringBoot作为后端框架主要基于以下考虑：
- 快速开发：自动配置特性大幅减少XML配置
- 内嵌Tomcat：简化部署流程
- 丰富的Starter：轻松整合MyBatis、Redis等组件
- 健康检查：自带/actuator端点监控系统状态
前端选用Vue.js 3.x的原因：
- 响应式设计：自动适配不同设备屏幕
- 组件化开发：便于维护健康档案、用药提醒等模块
- TypeScript支持：提升代码健壮性
- Vue Router：实现无刷新页面跳转
2.2 数据库设计要点
MySQL表结构设计遵循以下原则：
- 老人基础信息表(user_info)与健康档案(health_record)1:N关系
- 用药记录(medication)使用日期时间分区提升查询性能
- 紧急联系人(emergency_contact)设置级联删除
- 所有表字段添加注释便于维护
sql复制CREATE TABLE `user_info` (
`id` bigint NOT NULL AUTO_INCREMENT COMMENT '老人ID',
`name` varchar(20) NOT NULL COMMENT '姓名',
`gender` tinyint DEFAULT '0' COMMENT '性别(0女1男)',
`birth_date` date NOT NULL COMMENT '出生日期',
`id_card` varchar(18) NOT NULL COMMENT '身份证号',
`address` varchar(100) NOT NULL COMMENT '居住地址',
`phone` varchar(11) NOT NULL COMMENT '联系电话',
PRIMARY KEY (`id`),
UNIQUE KEY `idx_idcard` (`id_card`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='老人基本信息表';
3. 核心功能实现细节
3.1 健康数据可视化看板
前端使用ECharts实现动态图表：
- 折线图展示血压/血糖历史趋势
- 饼图显示慢病分布比例
- 地图组件标注老人区域分布
关键技术点：
javascript复制// Vue组件中初始化图表
initChart() {
const chartDom = this.$refs.healthChart;
const myChart = echarts.init(chartDom);
myChart.setOption({
tooltip: { trigger: 'axis' },
xAxis: { type: 'category', data: this.dateList },
yAxis: { type: 'value' },
series: [{
data: this.bloodPressureData,
type: 'line',
smooth: true
}]
});
}
3.2 用药提醒功能实现
后端定时任务设计：
java复制@Scheduled(cron = "0 0 8,12,18 * * ?")
public void sendMedicationReminder() {
List<Medication> meds = medicationMapper.selectNeedRemind(LocalDateTime.now());
meds.forEach(med -> {
String msg = String.format("%s老人该服用%s了",
med.getUserName(), med.getDrugName());
smsService.send(med.getPhone(), msg);
});
}
前端配合实现：
- WebSocket实时推送提醒
- 语音播报功能（兼容IE9+）
- 用药确认反馈机制
4. 系统部署与运维
4.1 本地开发环境搭建
- 后端配置：
yaml复制# application-dev.yml
spring:
datasource:
url: jdbc:mysql://localhost:3306/elder_health?useSSL=false
username: root
password: 123456
redis:
host: localhost
port: 6379
- 前端配置：
bash复制# 安装依赖
npm install
# 启动开发服务器
npm run serve
4.2 生产环境Docker部署
docker-compose.yml关键配置：
yaml复制version: '3'
services:
mysql:
image: mysql:8.0
environment:
MYSQL_ROOT_PASSWORD: ${DB_PASSWORD}
volumes:
- ./mysql/data:/var/lib/mysql
ports:
- "3306:3306"
backend:
build: ./backend
ports:
- "8080:8080"
depends_on:
- mysql
frontend:
build: ./frontend
ports:
- "80:80"
5. 开发经验与避坑指南
5.1 跨域问题解决方案
后端配置类示例：
java复制@Configuration
public class CorsConfig implements WebMvcConfigurer {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**")
.allowedOrigins("*")
.allowedMethods("GET", "POST")
.maxAge(3600);
}
}
5.2 高频问题排查
- 日期格式问题：
- 前端传参使用ISO8601格式：2023-07-15T00:00:00Z
- 后端添加全局格式化：
java复制@Bean
public Jackson2ObjectMapperBuilderCustomizer jsonCustomizer() {
return builder -> builder.simpleDateFormat("yyyy-MM-dd HH:mm:ss");
}
- 大文件上传优化：
- 前端分片上传
- 后端配置最大文件大小：
properties复制spring.servlet.multipart.max-file-size=50MB
spring.servlet.multipart.max-request-size=50MB
- 性能监控技巧：
java复制// 添加慢SQL日志
@Bean
public PerformanceInterceptor performanceInterceptor() {
PerformanceInterceptor interceptor = new PerformanceInterceptor();
interceptor.setMaxTime(1000); // 超过1秒记录
return interceptor;
}
6. 系统扩展方向
- 健康预警功能：
java复制// 血压异常检测算法
public boolean checkBloodPressureWarning(int systolic, int diastolic) {
return systolic > 140 || diastolic > 90
|| systolic < 90 || diastolic < 60;
}
- 家属小程序对接：
- 微信小程序开发
- 健康数据共享授权机制
- 异常情况推送通知
- 物联网设备接入：
- 智能手环数据采集
- 室内定位轨迹分析
- 跌倒检测报警
这套系统在实际运行中，最让我意外的是老人们对语音提醒功能的依赖程度。很多视力不好的老人完全依靠语音导航完成日常操作，这提醒我在后续开发中要更加重视无障碍设计。比如增加键盘快捷键支持、提高颜色对比度等细节，这些改进虽然小，但对用户体验提升非常明显。