做業收繳系統設計手冊(自寫開源小系統)

項目github地址,歡迎star!💗html

做業收繳系統使用手冊地址前端

項目介紹

系統旨在優化做業上交流程,解決收繳做業的繁瑣過程,傳統收繳做業基於qq文件,或者郵箱收發。須要大量的人工操做和精力取維護。而本系統將做業系統部署到服務器,大大方便了教師/收做業者對做業的管理。系統精美簡單易用。可以知足大部分需求。項目已開源,能夠本身使用或者二次開發等等。歡迎star😭!! 開發工具:IDEA+postman+nivicat 主要框架:Springboot+Mybatis+Shiro+Druid 其餘框架/工具:devtools,Easyexcel(poi),Mybatis-generator, 運行環境:Tomcat8.5以上,Mysql5或8java

數據庫設計

這個數據庫是老師給我讓我完成的,7張表只用了6張,老師給了一些關鍵性的外鍵,其實還有一些外鍵參考,但鑑於系統並非徹底完善而且對邏輯影響不是很大,因此我就沒加上那些外鍵。若是有須要可自行添加。 mysql

在這裏插入圖片描述
對於數據庫解讀是最重要的一步。對於項目並無太多複雜的邏輯需求。因此直接從數據庫開始。

teacher

  • 此表包含教師信息的基本字段,包過工號,姓名,密碼,level是權限用的,管理員教師能夠操做其餘教師,level爲0權限爲管理員,其餘爲普通教師。

student

  • 此表包含學生的基本信息

teachclass

  • 此表爲課程表,一個老師不一樣學期可能帶幾個班級,這個課程就要有學期,名稱,學分,課程類型,對應教師等信息。

job

  • 這個能夠理解爲具體實驗表(做業),沒門課程老師可能發佈不一樣的做業,就要有對應的介紹。

studentclass

  • 這是學生和課程聯繫的中介。一個學生能夠在不一樣課程中上課,課程id(teachclass表的ID和學號爲惟一索引)

score

  • 這就是提供教師打分記錄表,學生提交後教師可對學生打分存入數據庫。

項目目錄

前端

在這裏插入圖片描述
前端文件一覽:
在這裏插入圖片描述
前端採用後臺管理 layui,並無用別人寫好的layui模板進行嵌套修改,而是從0開始從layui官方開始參考文檔一點點用組件。

前端爲主界面+iframe小界面,中間的內容框爲ifame界面顯示內容。git

淺談layui:github

  • 之前就接觸過layui,之前和隊友配合隊友寫前端本身隊友用的就是前端。還有之前幫姐姐寫的小東西也是用的layui,不過那次用的layui不是真的layui。。那只是用到layui漂亮的外表。清晰記得。套過來layui的殼子,而後能用thymleaf交互的地方就不用ajax。。遇到ajax的地方(好比表格)等等就瘋狂Jquery拼湊html,雖然外觀還行,可是可維護性不好,本身都不清楚本身寫那去了。ajax

  • 形成上述的緣由主要是由於本身太過墨守成規,覺得ui框架只是提供ui,而事實上一個優秀的框架每每比你想象的還要優秀的多。不只是美麗的外觀,還有強大的功能和便捷的使用。這就要耐心的閱讀文檔,不要被文檔嚇到。sql

  • 在本系統中用到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。apache

功能設計

學生端

  • 文件上傳 客戶端文件上傳

    • layui的form表單默認是同步上傳,而同步上傳須要跳轉界面並非我想要的結果,因此本系統用異步上傳文件來完成。所用的是ajax的formdate進行文件上傳。具體代碼可參考templates/student/upload.html這個thymleaf文件。
      在這裏插入圖片描述

    服務端文件接受:

    • 服務端之前的文件接收用的是servlet3.0,可是Springmvc的MultipartFile接受文件更加便捷,因此採用對於上傳的路徑。爲tomcat項目相對路徑fileget/"+lessonid+"/"+jobid+"/"+文件名;這裏文件名設置爲學號+姓名+實驗名+實驗幾。具體可參考fileController.java代碼內容。
    • 還有就是原本是寫了做業補交的功能的,可是出於需求考慮補交部分被註釋掉。因此截至日期暫時沒有明顯做用。只是上傳做業的時候會提示。

教師端

  • 文件打包成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文件的數據庫帳號密碼
    在這裏插入圖片描述
  3. 修改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 (數據庫帳號密碼)
相關文章
相關標籤/搜索