作業收繳系統使用手冊和開發手冊(自寫開源小系統)

• 2019 年 10 月 6 日
• 筆記

項目github地址

作業收繳系統設計手冊csdn地址

目錄

• 系統介紹：
• 基本功能
• 管理端
  • 資訊管理
    • 1. 修改密碼
    • 2. 學生添加（支援excel格式的批量導入）
    • 3.學生管理：
    • 4. 教師的管理（增刪）
  • 課程管理
    • 1. 我的課程
    • 2. 課程添加
    • 3. 添加學生（課程）
  • 作業管理
    • 1. 作業管理（增刪改）
    • 2. 作業發布
    • 3. 作業查看（列印，下載壓縮文件等）
• 學生端

系統介紹：

系統概述：寫了個作業收繳系統。系統旨在優化作業上交流程，解決收繳作業的繁瑣過程，傳統收繳作業基於qq文件，或者郵箱收發。需要大量的人工操作和精力取維護。而本系統將作業系統部署到伺服器，大大方便了教師/收作業者對作業的管理。系統簡單易用。能夠滿足大部分需求。項目已開源，可以自己使用或者二次開發等等。歡迎star！！

基本功能

教師端登錄地址：http://localhost:8080/loginteacher.html (資料庫teacher表) 學生端登錄地址：http://localhost:8080/login.html （資料庫student表） 資料庫監控地址：http://localhost:8080/druid/login.html （資料庫帳號密碼） 教師端和druid一覽

管理端

資訊管理

這塊主要

1. 修改密碼

可以直接輸入舊密碼和新密碼進行修改

2. 學生添加（支援excel格式的批量導入）

該項功能是往系統平台中添加學生。你可根據表單手打學生資訊進行導入。有了學生資訊後學生才能加入課程班號。

若使用excel的xls或xlsx格式進行導入，要遵從文件的相應格式，從第二行起，表格的前四列應遵從如下格式：

當既有excel文件又有表單數據時候，優先考慮excel數據。忽略表單添加。

3.學生管理：

此頁面下可以對學生進行模糊搜索，搜索指定學生，指定學號範圍、姓名的學生，針對表格的學生數據，可以直接進行點擊編輯。學生除了學號外其他資訊均可修改。

此外，頁面還提供導出學生excel表的功能。將選定的可以導出成xls或者cvs文件。

4. 教師的管理（增刪）

這個模組只提供教師的增刪功能。不提供修改功能。但是只有超級用戶才能對教師帳號的增刪（程式擁有者資料庫的level為0）；

課程管理

1. 我的課程

本頁面提供查看、編輯和刪除自己所有課程的功能，可以根據需求修改自己發布課程的相關資訊。也可以看到加入課程的學生。

2. 課程添加

本頁面也添加課程的介面。注意課時學分一欄的數據為數字類型。通過此頁面即可將新課程發布到系統你的課程列表中。注意填寫學期的格式，這個後台會根據此欄位匹配是否為當前學期，否的話將在一些介面不展示。如果寫錯可到我的課程中進行修改！

3. 添加學生（課程）

本介面是課程添加學生操作的介面。因為學生和課程是兩個獨立題。本系統通過老師添加學生使得學生參加課程而不是學生自己選課。添加學生分為單個添加和批量添加。因為一個班級學生往往學號是有規律的遞增，所有我們提供通過學號首尾，添加資料庫中有該欄位學號的學生進入課程。添加後將返回成功失敗的條數。添加之後，對應學生會在提交作業的可選列表多出改作業。

作業管理

1. 作業管理（增刪改）

每一個課程下有若干實驗或作業。學生提交的要有課程和作業兩個選項。本頁面提供編輯自己課程的作業（添加、修改，刪除等功能）。注意的是你可編輯在當前學期的課程作業（防止使用太久課程太多障礙選項太多影響使用故屏蔽掉非本學期的課程）。

2. 作業發布

此介面提供發布作業的功能，注意一些數字類型的欄目。

3. 作業查看（列印，下載壓縮文件等）

本頁面為核心功能。教師等收作業可通過本介面下資學生已經上傳的實驗的報告打包城的zip文件。還可以在線根據用戶的實驗進行在線評分和備註。最終可以保存成Excel文件到本地。

學生端

因為學生不是主要服務對象，所有就給了幾個需要的介面，學生可以根據已經添加的課程進行上傳作業。主介面如下：

項目github地址，歡迎star！?

作業收繳系統使用手冊csdn地址

目錄

• 項目介紹
• 資料庫設計
  • teacher
  • student
  • teachclass
  • job
  • studentclass
  • score
• 項目目錄
  • 前端
  • 後端
  • 模板引擎和ajax
• 功能設計
  • 學生端
  • 教師端
• 許可權設計
  • 登錄驗證
  • 授權管理
• 項目安裝

項目介紹

開發工具：IDEA+postman+nivicat 主要框架：Springboot+Mybatis+Shiro+Druid 其他框架/工具：devtools,Easyexcel(poi)，Mybatis-generator， 運行環境：Tomcat8.5以上，Mysql5或8

資料庫設計

這個資料庫是老師給我讓我完成的，7張表只用了6張，老師給了一些關鍵性的外鍵，其實還有一些外鍵參考，但鑒於系統並不是完全完善並且對邏輯影響不是很大，所以我就沒加上那些外鍵。如果有需要可自行添加。

對於資料庫解讀是最重要的一步。對於項目並沒有太多複雜的邏輯需求。所以直接從資料庫開始。

teacher

• 此表包含教師資訊的基本欄位，包過工號，姓名，密碼，level是許可權用的，管理員教師可以操作其他教師，level為0許可權為管理員，其他為普通教師。

student

• 此表包含學生的基本資訊

teachclass

• 此表為課程表，一個老師不同學期可能帶幾個班級，這個課程就要有學期，名稱，學分，課程類型，對應教師等資訊。

job

• 這個可以理解為具體實驗表(作業)，沒門課程老師可能發布不同的作業，就要有對應的介紹。

studentclass

• 這是學生和課程聯繫的中介。一個學生可以在不同課程中上課，課程id（teachclass表的ID和學號為唯一索引）

score

• 這就是提供教師打分記錄表，學生提交後教師可對學生打分存入資料庫。

項目目錄

前端

前端文件一覽：

前端採用後台管理layui，並沒有用別人寫好的layui模板進行嵌套修改，而是從0開始從layui官方開始參考文檔一點點用組件。

前端為主介面+iframe小介面，中間的內容框為ifame介面顯示內容。

淺談layui：

• 以前就接觸過layui，以前和隊友配合隊友寫前端自己隊友用的就是前端。還有以前幫姐姐寫的小東西也是用的layui，不過那次用的layui不是真的layui。。那只是用到layui漂亮的外表。清晰記得。套過來layui的殼子，然後能用thymleaf交互的地方就不用ajax。。遇到ajax的地方（比如表格）等等就瘋狂Jquery拼湊html，雖然外觀還行，但是可維護性很差，自己都不清楚自己寫那去了。
• 造成上述的原因主要是因為自己太過墨守成規，以為ui框架只是提供ui，而事實上一個優秀的框架往往比你想像的還要優秀的多。不僅是美麗的外觀，還有強大的功能和便捷的使用。這就要耐心的閱讀文檔，不要被文檔嚇到。
• 在本系統中用到layui多個組件。如表單，表格，時間日期，文件上傳，表格等等，layui雖然不是雙向綁定模式，但是layui對於控制項fitter的綁定和監聽做的特別好,雖然大部分方便了使用但是會使得部分傳統方法出現失效的問題需要自己解決。layui大部分都是基於ajax的非同步傳輸。在系統初用的是thymleaf,後來發現在layui的領域thymleaf並不能展現過大的便捷性，後面的就都用html了。其次就是layui的一些東西可能對後端新手（比如我）有一些新穎。layui表單等等封裝了很便捷的非同步提交方式。你大部分的傳輸方式要按照他的規則來，但是也有一些時候他可能滿足不了你的需求你需要解決。對於layui更多功能，詳細參考layui官當demo

後端

後端就是mvc的設計架構：

• config: shiro的配置和自定義releam配置在文件中，還有就是druid監控的一些內容也放在裡面。
• controller： controller層分了幾個controller，比如文件處理一個，登錄授權一個，thymleaf控制一個，還有studentcontroller處理一些學生端的事務，因為教師端的內容比較多，根據處理不同的資訊分了處理學生，處理課程，處理實驗等controller。
• service： 當時為了方便只寫了兩個service,學生和教師，所以service內容比較多，你可以從controller的內容找入service
• dao： 為mybatis逆向工程生成基本文件和自己添加一些介面
• pojo 資料庫映射對象，其中student繼承滿足poi導入excel的類。
• log logback日誌配置，放到伺服器要修改日誌文件地址(用絕對路徑否則日誌文件將不存在)

模板引擎和ajax

項目採用thymleaf+html的樣式，因為個人開發對於一些參數用thymleaf還是會方便很多。但是thymleaf對於數據綁定對動態數據不太好處理，所以不涉及靜態數據綁定的介面一般都是html。

功能設計

學生端

• 文件上傳 客戶端文件上傳 服務端文件接受：
  • 服務端以前的文件接收用的是servlet3.0，但是Springmvc的MultipartFile接受文件更加便捷，所以採用對於上傳的路徑。為tomcat項目相對路徑fileget/"+lessonid+"/"+jobid+"/"+文件名;這裡文件名設置為學號+姓名+實驗名+實驗幾。具體可參考fileController.java程式碼內容。
  • 還有就是本來是寫了作業補交的功能的，但是出於需求考慮補交部分被注釋掉。所以截至日期暫時沒有明顯作用。只是上傳作業的時候會提示。
  • layui的form表單默認是同步上傳，而同步上傳需要跳轉介面並不是我想要的結果，所以本系統用非同步上傳文件來完成。所用的是ajax的formdate進行文件上傳。具體程式碼可參考templates/student/upload.html這個thymleaf文件。

  

教師端

• 文件打包成zip： 要將伺服器所有已經上傳的文件打包成zip文件，要注意打包成zip文件的時候不能在伺服器保存—不要佔用額外的空間，所有就要用io臨時生成zip文件傳輸到客戶端，這就要很好的處理下io流的內容，還要考慮文件下載的內容。謹防異常和文件名亂碼等。具體可參考fileController下程式碼。
• 接受excel並解析： java解析excel的工具並不多，當前較為流行的apache下的poi。我用的是阿里的easyexcel—基於poi封裝改進的框架。但是基於poi如果解析excel生成實體類需要對pojo對象繼承BaseRowModel類並在欄位上給出對應註解：

• layui表格 layui表格按照固定格式ajax渲染而來的，項目中多次用到layui表格。提供強大的在線編輯，排序，導出excel/cvs等功能。你只需耐心閱讀layui表格相關部分文檔就可以了解其中流程。

• 其他 項目中其他部分無非就是表單提交。後台增刪改查。模糊查詢。前端jq處理邏輯等等。

許可權設計

許可權設計基於Shiro進行，

登錄驗證

• 其實這裡我當時糾結的挺久就是shiro的releam一般是針對一個user表中的數據進行驗證，但是項目中的用戶來源自學生表和教師表。因為shiro的session和request的session其實是一個session，所以你可以很靈活的完成一些內容。學生端，教師端並不是一個統一的登錄入口，所以在兩個登錄的埠分別用一個session防一個role身份。在releam中用shiro的session判斷角色，if else判斷角色寫方法解決。

授權管理

• 登錄驗證可以解決非系統用戶訪問系統的問題，但是不進行許可權處理會造成用戶抓到介面可能會進行越權操作。對系統穩定和安全造成威脅。一定需要授權。因為我的介面（教師端）都加了前綴teacher/xxx,更適合url統一管理，對於url統一管理，我採用的是針對身份的管理而不是資源的細化管理。因為主要還是教師和學生兩類用戶。用role可以滿足需求。

項目安裝

項目環境為tomcat8.5以上，mysql5或8.

1. 首先複製db目錄receve的內容放到nivicat等資料庫建庫建表（數據已經進行閹割）
2. 如有需要，修改application.properties文件的資料庫帳號密碼

1. 修改logback.xml的日誌路徑（如果需要）

4.如果本地可直接運行，如果打包部署，需要先clean，然後修改maven配置 將兩個被注釋的還原

然後再target目錄下找到war包，修改成你要的項目名，用ssh、scp等工具指令放到tomcat指定目錄下。就可以訪問了。 教師端登錄地址：http://localhost:8080/loginteacher.html (資料庫teacher表) 學生端登錄地址：http://localhost:8080/login.html （資料庫student表） 資料庫監控地址：http://localhost:8080/druid/login.html （資料庫帳號密碼）