1. 立项背景和目标: 随着全球气候变化日益严峻,校园作为人才培养的重要场所,推动绿色低碳校园建设势在必行。本项目旨在开发一套校园节能减排行为激励系统,通过积分奖励机制,鼓励师生养成绿色环保的生活习惯,量化个人减碳贡献,建设节约型绿色校园。
2. 软件功能和核心模块: 系统包含用户端小程序和管理后台两大部分。核心功能模块包括:①行为上报模块:用户上报步行出行、光盘行动、随手关灯等12类节能行为;②积分管理模块:根据行为类型自动计算积分和减碳量;③排行榜模块:个人、宿舍、班级三维度排名激励;④勋章系统:达成条件解锁成就勋章;⑤积分兑换模块:积分可兑换环保袋、充电费等奖励;⑥知识科普模块:推送环保知识文章。
3. 业务流程描述: 用户通过微信扫码进入小程序→选择节能行为类型→上传证明图片(如需要)→提交上报→管理员审核→审核通过后积分自动到账→用户可查看排名、兑换奖品、解锁勋章。管理员通过Web后台审核行为记录、管理商品库存、发布系统公告。
1. 整体架构和技术栈: 采用前后端分离架构。前端使用uni-app框架+Vue.js 3开发跨平台小程序,支持微信/H5多端运行;管理后台采用原生HTML+Vue.js+现代化深色主题CSS;后端使用Node.js+Express.js构建RESTful API,MySQL数据库存储数据,使用JWT实现用户认证。
2. 我的负责模块和成果: 我负责完整的前端小程序开发和后端API设计实现。完成了10个页面组件开发(首页、行为上报、积分记录、排行榜、勋章中心、积分兑换、知识科普、个人中心等);设计并实现了10张数据库表和20+个API接口;开发了管理后台6大功能模块。代码量约5000+行,实现了完整的业务闭环。
3. 遇到的难点和解决方案: ①微信小程序tabBar图标大小限制40KB:生成的PNG图标过大,最终使用System.Drawing API创建32×32极简图标,文件仅0.2KB完美解决;②uni-app编译器不支持/deep/选择器:dart-sass不兼容旧语法,将/deep/替换为::v-deep修复;③动态class绑定函数调用报错:改用数组语法:class="['status-' + record.status]"替代函数调用方式。