計(jì)與實(shí)現(xiàn))
溫馨提示本人主頁(yè)置頂文章(點(diǎn)我)開(kāi)頭有 CSDN 平臺(tái)官方提供的學(xué)長(zhǎng)聯(lián)系方式的名片1. 項(xiàng)目背景與意義隨著高校信息化建設(shè)的不斷深入傳統(tǒng)宿舍管理模式在報(bào)修、查寢、通知傳達(dá)、水電查詢等環(huán)節(jié)存在效率低、信息滯后、溝通成本高等問(wèn)題。本項(xiàng)目基于 SpringBoot3 與 Vue3 技術(shù)棧設(shè)計(jì)并實(shí)現(xiàn)一款校園智能宿舍小程序旨在為在校學(xué)生、宿管人員和輔導(dǎo)員提供統(tǒng)一的宿舍管理服務(wù)平臺(tái)提升宿舍管理效率與學(xué)生居住體驗(yàn)。小程序端面向?qū)W生提供宿舍報(bào)修、衛(wèi)生檢查、通知公告、水電查詢、意見(jiàn)反饋等功能管理端面向宿管與輔導(dǎo)員提供樓棟管理、房間分配、報(bào)修處理、查寢記錄、數(shù)據(jù)統(tǒng)計(jì)等能力。前后端分離架構(gòu)結(jié)合小程序輕量入口能夠較好地滿足校園場(chǎng)景下的高頻、移動(dòng)化使用需求。2. 技術(shù)選型與架構(gòu)設(shè)計(jì)2.1 技術(shù)棧概覽層次技術(shù)選型說(shuō)明后端框架SpringBoot 3.x基于 JDK17提供 RESTful API 與統(tǒng)一異常處理持久層MyBatis-Plus簡(jiǎn)化 CRUD 操作內(nèi)置分頁(yè)插件數(shù)據(jù)庫(kù)MySQL 8.x存儲(chǔ)用戶、宿舍、報(bào)修、查寢等業(yè)務(wù)數(shù)據(jù)前端框架Vue3 Vite管理后臺(tái)采用組合式 API 與 Element Plus小程序端uni-app一套代碼編譯到微信小程序兼顧多端復(fù)用接口文檔Knife4j基于 OpenAPI3 自動(dòng)生成在線調(diào)試文檔2.2 系統(tǒng)架構(gòu)分層系統(tǒng)整體采用前后端分離架構(gòu)小程序端與管理后臺(tái)通過(guò) HTTP 請(qǐng)求訪問(wèn)后端統(tǒng)一接口。后端按 Controller、Service、Mapper 三層組織配合統(tǒng)一返回結(jié)果封裝、全局異常攔截與 JWT 身份認(rèn)證保證接口的規(guī)范性與安全性。flowchart TD A[小程序端 uni-app] -- B[Nginx 反向代理] C[管理后臺(tái) Vue3] -- B B -- D[SpringBoot3 后端服務(wù)] D -- E[MySQL 數(shù)據(jù)庫(kù)] D -- F[Redis 緩存] D -- G[文件存儲(chǔ)服務(wù)]3. 數(shù)據(jù)庫(kù)設(shè)計(jì)3.1 核心實(shí)體關(guān)系系統(tǒng)核心實(shí)體包括用戶、宿舍樓、宿舍房間、報(bào)修單、查寢記錄、通知公告與意見(jiàn)反饋。學(xué)生與宿舍房間為多對(duì)一關(guān)系報(bào)修單與宿舍房間為多對(duì)一關(guān)系查寢記錄與宿舍房間為多對(duì)一關(guān)系。3.2 主要數(shù)據(jù)表結(jié)構(gòu)表名字段示例說(shuō)明sys_userid, username, password, role, student_no用戶表區(qū)分學(xué)生、宿管、輔導(dǎo)員角色dorm_buildingid, name, address, manager_id宿舍樓信息表dorm_roomid, building_id, room_no, bed_count, status宿舍房間表repair_orderid, room_id, user_id, type, description, status報(bào)修工單表check_recordid, room_id, checker_id, result, remark, check_time查寢記錄表notice_infoid, title, content, publisher_id, publish_time通知公告表4. 后端核心模塊實(shí)現(xiàn)4.1 統(tǒng)一返回結(jié)果封裝為保證前后端數(shù)據(jù)交互格式一致定義統(tǒng)一返回結(jié)果類包含狀態(tài)碼、提示信息與業(yè)務(wù)數(shù)據(jù)三個(gè)字段。業(yè)務(wù)異常通過(guò)全局異常處理器統(tǒng)一捕獲并轉(zhuǎn)換為標(biāo)準(zhǔn)響應(yīng)格式。Data public class ResultT { private Integer code; private String message; private T data; public static T ResultT success(T data) { ResultT result new Result(); result.setCode(200); result.setMessage(操作成功); result.setData(data); return result; } public static T ResultT error(String message) { ResultT result new Result(); result.setCode(500); result.setMessage(message); return result; } }4.2 報(bào)修工單模塊報(bào)修模塊是系統(tǒng)的核心業(yè)務(wù)之一。學(xué)生提交報(bào)修單后系統(tǒng)根據(jù)宿舍樓自動(dòng)分配對(duì)應(yīng)宿管人員宿管可查看待處理工單并更新處理狀態(tài)。關(guān)鍵接口包括提交報(bào)修、分頁(yè)查詢、狀態(tài)更新與進(jìn)度跟蹤。Service public class RepairOrderServiceImpl implements RepairOrderService { Resource private RepairOrderMapper repairOrderMapper; Override public PageResultRepairOrderVO pageQuery(RepairQueryDTO dto) { PageRepairOrder page new Page(dto.getPageNum(), dto.getPageSize()); LambdaQueryWrapperRepairOrder wrapper new LambdaQueryWrapper(); wrapper.eq(StringUtils.hasText(dto.getStatus()), RepairOrder::getStatus, dto.getStatus()) .eq(dto.getBuildingId() ! null, RepairOrder::getBuildingId, dto.getBuildingId()) .orderByDesc(RepairOrder::getCreateTime); PageRepairOrder result repairOrderMapper.selectPage(page, wrapper); return PageResult.of(result); } }4.3 JWT 身份認(rèn)證系統(tǒng)采用 JWT 實(shí)現(xiàn)無(wú)狀態(tài)身份認(rèn)證。用戶登錄成功后后端簽發(fā)包含用戶 ID 與角色信息的 Token小程序端在后續(xù)請(qǐng)求頭中攜帶 Token后端通過(guò)攔截器統(tǒng)一校驗(yàn)并解析用戶身份。Component public class JwtInterceptor implements HandlerInterceptor { Override public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) { String token request.getHeader(Authorization); if (!StringUtils.hasText(token) || !JwtUtils.validateToken(token)) { throw new BusinessException(401, 登錄狀態(tài)已失效請(qǐng)重新登錄); } Long userId JwtUtils.getUserId(token); UserContext.set(userId); return true; } }5. 小程序端功能設(shè)計(jì)5.1 頁(yè)面結(jié)構(gòu)小程序端采用 uni-app 開(kāi)發(fā)底部導(dǎo)航包含首頁(yè)、報(bào)修、消息、我的四個(gè) Tab。首頁(yè)展示通知公告與快捷入口報(bào)修頁(yè)支持提交工單與進(jìn)度查詢消息頁(yè)展示系統(tǒng)通知與處理結(jié)果我的頁(yè)面包含個(gè)人信息、我的報(bào)修、意見(jiàn)反饋等功能。5.2 報(bào)修提交流程學(xué)生進(jìn)入報(bào)修頁(yè)面后選擇報(bào)修類型、填寫(xiě)問(wèn)題描述并上傳現(xiàn)場(chǎng)圖片提交后生成報(bào)修單。小程序端通過(guò) uni.request 調(diào)用后端接口攜帶 Token 完成身份校驗(yàn)提交成功后跳轉(zhuǎn)到報(bào)修進(jìn)度頁(yè)。async function submitRepair(formData) { const token uni.getStorageSync(token); const res await uni.request({ url: /api/repair/submit, method: POST, header: { Authorization: token }, data: formData }); if (res.data.code 200) { uni.showToast({ title: 提交成功, icon: success }); uni.navigateTo({ url: /pages/repair/progress }); } else { uni.showToast({ title: res.data.message, icon: none }); } }6. 管理后臺(tái)功能設(shè)計(jì)6.1 功能模塊劃分管理后臺(tái)基于 Vue3 Element Plus 構(gòu)建主要模塊包括樓棟管理、房間管理、報(bào)修處理、查寢管理、通知發(fā)布與數(shù)據(jù)統(tǒng)計(jì)。宿管人員可對(duì)報(bào)修工單進(jìn)行派單與完結(jié)操作輔導(dǎo)員可查看所轄樓棟的查寢匯總數(shù)據(jù)。6.2 報(bào)修處理界面報(bào)修處理頁(yè)面以表格形式展示工單列表支持按狀態(tài)、樓棟、時(shí)間篩選。點(diǎn)擊處理按鈕彈出對(duì)話框填寫(xiě)處理意見(jiàn)并更新工單狀態(tài)同時(shí)系統(tǒng)自動(dòng)向?qū)W生推送處理結(jié)果通知。template el-table :datarepairList v-loadingloading el-table-column proproomNo label房間號(hào) width120 / el-table-column proptype label報(bào)修類型 width120 / el-table-column propdescription label問(wèn)題描述 / el-table-column propstatus label狀態(tài) width100 template #default{ row } el-tag :typestatusMap[row.status].type{{ statusMap[row.status].text }}/el-tag /template /el-table-column el-table-column label操作 width140 template #default{ row } el-button typeprimary link clickhandleProcess(row)處理/el-button /template /el-table-column /el-table /template7. 系統(tǒng)測(cè)試與部署7.1 測(cè)試方案系統(tǒng)測(cè)試覆蓋接口層與頁(yè)面功能層。后端使用 JUnit 與 MockMvc 編寫(xiě)核心接口測(cè)試用例前端通過(guò)手工測(cè)試驗(yàn)證關(guān)鍵業(yè)務(wù)流程。重點(diǎn)驗(yàn)證報(bào)修提交、狀態(tài)流轉(zhuǎn)、權(quán)限控制與數(shù)據(jù)統(tǒng)計(jì)等核心場(chǎng)景。7.2 部署方案后端服務(wù)打包為可執(zhí)行 Jar 包部署在 Linux 服務(wù)器上通過(guò) Nginx 反向代理統(tǒng)一入口。小程序端通過(guò)微信開(kāi)發(fā)者工具上傳審核后發(fā)布管理后臺(tái)構(gòu)建為靜態(tài)資源部署至 Nginx前后端通過(guò)配置的 API 地址進(jìn)行通信。8. 總結(jié)與展望本項(xiàng)目基于 SpringBoot3 與 Vue3 完成了校園智能宿舍小程序的設(shè)計(jì)與實(shí)現(xiàn)覆蓋報(bào)修、查寢、通知、水電查詢等核心業(yè)務(wù)場(chǎng)景形成了小程序端、管理后臺(tái)與后端服務(wù)三位一體的完整解決方案。后續(xù)可在智能門(mén)禁對(duì)接、水電表自動(dòng)采集、宿舍評(píng)分算法與消息推送優(yōu)化等方向持續(xù)迭代進(jìn)一步提升宿舍管理的智能化水平。