源碼 前后端分離實(shí)戰(zhàn))
一、項(xiàng)目簡(jiǎn)介智慧校園能耗管理系統(tǒng)是一套面向?qū)W校后勤管理部門的企業(yè)級(jí)能耗監(jiān)控平臺(tái)采用 Spring Boot 3 Vue 3 前后端分離架構(gòu)。系統(tǒng)圍繞建筑、設(shè)備、能耗數(shù)據(jù)三大核心實(shí)體展開通過(guò)數(shù)據(jù)采集、可視化分析、異常告警、運(yùn)維管理等功能鏈路幫助學(xué)校實(shí)現(xiàn)水、電、燃?xì)狻崃Φ饶茉聪牡臄?shù)字化與精細(xì)化管理。系統(tǒng)內(nèi)置三種角色管理員負(fù)責(zé)基礎(chǔ)數(shù)據(jù)維護(hù)與系統(tǒng)配置能耗專員負(fù)責(zé)設(shè)備監(jiān)控與異常處理普通用戶可查看個(gè)人能耗數(shù)據(jù)與節(jié)能知識(shí)。整體架構(gòu)分為前端單頁(yè)應(yīng)用Vue 3 Element Plus與后端 RESTful API 服務(wù)Spring Boot 3通過(guò) JWT 進(jìn)行身份認(rèn)證與接口鑒權(quán)。二、技術(shù)棧技術(shù)說(shuō)明后端框架Spring Boot 3.xORMMyBatis-Plus 3.5.x權(quán)限認(rèn)證JWT Token 攔截器密碼加密BCryptHutool 工具類前端框架Vue 3Composition API狀態(tài)管理Pinia前端路由Vue Router 4History 模式UI 組件庫(kù)Element Plus圖表庫(kù)ECharts 5構(gòu)建工具Vite數(shù)據(jù)庫(kù)MySQL 8.0三、功能模塊管理員端能耗總覽儀表盤展示總用電、總用水、總?cè)細(xì)?、總熱力四?xiàng)核心指標(biāo)數(shù)值頂部卡片實(shí)時(shí)刷新。能耗占比餅圖按電力/水/燃?xì)?熱力四種類型展示消耗占比數(shù)據(jù)來(lái)自各能耗記錄的匯總計(jì)算。電力月度趨勢(shì)折線圖按月份展示電力消耗變化曲線支持跨年對(duì)比時(shí)間范圍可配置。建筑能耗排名柱狀圖統(tǒng)計(jì)各建筑電力消耗總量并橫向排名支持點(diǎn)擊柱狀圖下鉆查看明細(xì)。設(shè)備狀態(tài)概覽統(tǒng)計(jì)設(shè)備總數(shù)、正常運(yùn)行數(shù)、預(yù)警數(shù)、故障數(shù)狀態(tài)字段由設(shè)備最近一次心跳或維護(hù)記錄更新。異常告警統(tǒng)計(jì)展示待處理、處理中、已解決三個(gè)狀態(tài)的數(shù)量點(diǎn)擊可跳轉(zhuǎn)至告警列表頁(yè)。建筑信息管理新增、編輯、刪除建筑字段包含編號(hào)、名稱、區(qū)域、樓層數(shù)、面積、建造年份、啟用狀態(tài)支持按名稱/區(qū)域模糊搜索。能耗類型管理維護(hù)電力/水/燃?xì)?熱力四種類型可設(shè)置單位kWh、噸、m3、GJ、圖標(biāo)、告警閾值閾值用于觸發(fā)異常判定。設(shè)備信息管理設(shè)備關(guān)聯(lián)建筑和能耗類型記錄額定功率、安裝日期、最近維護(hù)日期、運(yùn)行狀態(tài)正常/預(yù)警/故障支持按關(guān)鍵字和狀態(tài)篩選。設(shè)備運(yùn)維記錄管理為設(shè)備添加維護(hù)記錄包含維護(hù)類型保養(yǎng)/維修/更換、描述、操作人、費(fèi)用、維護(hù)日期支持歷史記錄回溯。宣傳公告管理發(fā)布、編輯、下線公告公告包含分類通知/活動(dòng)/政策、標(biāo)題、正文、封面圖支持點(diǎn)贊和評(píng)論功能。節(jié)能知識(shí)庫(kù)管理發(fā)布節(jié)能技術(shù)文章支持富文本編輯按分類照明/空調(diào)/水系統(tǒng)/新能源篩選文章可設(shè)置是否置頂。系統(tǒng)用戶管理維護(hù)系統(tǒng)登錄賬號(hào)字段包含用戶名、姓名、部門、角色、手機(jī)號(hào)、郵箱支持重置密碼、啟用/禁用賬號(hào)。操作日志分頁(yè)記錄用戶關(guān)鍵操作登錄、增刪改、導(dǎo)出按用戶名和操作內(nèi)容關(guān)鍵字搜索。系統(tǒng)配置維護(hù)全局參數(shù)如告警閾值、數(shù)據(jù)刷新頻率、文件上傳大小限制等。文件上傳接口接收?qǐng)D片或附件存儲(chǔ)到本地磁盤并返回可訪問(wèn)的 URL 路徑用于公告封面、知識(shí)庫(kù)插圖等場(chǎng)景。普通用戶端個(gè)人能耗查詢按建筑、能耗類型、時(shí)間范圍篩選本人關(guān)聯(lián)的能耗記錄列表字段包含用量、費(fèi)用、記錄時(shí)間。能耗分析圖表復(fù)用管理員端圖表組件展示各類型占比餅圖、月度趨勢(shì)折線圖、各建筑能耗排名柱狀圖數(shù)據(jù)范圍限定為用戶可見(jiàn)建筑。公告瀏覽查看已發(fā)布公告列表按分類篩選點(diǎn)擊進(jìn)入詳情頁(yè)自動(dòng)增加閱讀量支持點(diǎn)贊和評(píng)論。節(jié)能知識(shí)瀏覽查看節(jié)能知識(shí)文章列表按分類篩選文章詳情展示富文本內(nèi)容。個(gè)人資料編輯修改姓名、電話、郵箱、部門、宿舍、頭像上傳圖片保存后即時(shí)生效。修改密碼校驗(yàn)原密碼后輸入新密碼使用 BCrypt 加密后更新數(shù)據(jù)庫(kù)。能耗專員端設(shè)備實(shí)時(shí)監(jiān)控查看全部設(shè)備列表按關(guān)鍵字/狀態(tài)正常/預(yù)警/故障篩選設(shè)備詳情展示關(guān)聯(lián)建筑、能耗類型、額定功率、最近維護(hù)日期。能耗數(shù)據(jù)分析訪問(wèn)能耗總覽、各類型占比、月度趨勢(shì)、各建筑排名等統(tǒng)計(jì)圖表圖表數(shù)據(jù)與管理員端同源。異常告警管理新增異常記錄關(guān)聯(lián)設(shè)備、描述、級(jí)別編輯處理狀態(tài)待處理/處理中/已解決記錄處理人和處理結(jié)果支持按狀態(tài)篩選。設(shè)備輔助維護(hù)查看設(shè)備列表和詳情對(duì)設(shè)備基礎(chǔ)信息如位置描述、備注進(jìn)行補(bǔ)充編輯但不開放刪除權(quán)限。統(tǒng)計(jì)報(bào)表查看按月度、季度匯總各能耗類型的用量與費(fèi)用以表格形式展示匯總數(shù)據(jù)支持按建筑維度分組。四、項(xiàng)目總結(jié)本項(xiàng)目技術(shù)棧選型貼近當(dāng)前主流企業(yè)級(jí)開發(fā)實(shí)踐Spring Boot 3 提供穩(wěn)定的后端基礎(chǔ)Vue 3 Element Plus Pinia 構(gòu)成完整的前端工程化方案MyBatis-Plus 顯著降低數(shù)據(jù)訪問(wèn)層開發(fā)量。圖表模塊基于 ECharts 5 封裝了餅圖、折線圖、柱狀圖三種通用組件可直接復(fù)用于其他管理系統(tǒng)的數(shù)據(jù)可視化場(chǎng)景。權(quán)限模型采用 JWT 攔截器實(shí)現(xiàn)三角色接口級(jí)鑒權(quán)代碼結(jié)構(gòu)清晰適合作為畢業(yè)設(shè)計(jì)、課程設(shè)計(jì)或中小型能耗監(jiān)控項(xiàng)目的二次開發(fā)基礎(chǔ)。項(xiàng)目附帶完整數(shù)據(jù)庫(kù)初始化腳本和萬(wàn)字開發(fā)文檔降低了上手門檻。界面展示交付內(nèi)容本項(xiàng)目為完整交付包含完整后端源碼完整前端源碼數(shù)據(jù)庫(kù)初始化腳本SQL萬(wàn)字項(xiàng)目文檔設(shè)計(jì)文檔 / 論文可作課程設(shè)計(jì)、畢業(yè)設(shè)計(jì)參考獲取完整源碼完整前后端源碼 數(shù)據(jù)庫(kù)腳本 萬(wàn)字項(xiàng)目文檔見(jiàn) Gitee 倉(cāng)庫(kù)https://gitee.com/kangxihuang/src-K266