上課筆記

1.1 功能實現
對菜單進行添加,修改查詢等操做image
插入一種思想,多對多的表關係
設計一個菜單與角色的表,操做菜單表的時候,也可能會操做角色表。
imagecss

1.2設計今天頁面爲用戶呈現菜單模塊,就是點擊菜單模塊,顯示菜單列表,菜單的頁面(html/css/js)image如圖。使用個treerid插件。html

1.3
須要實現功能,點擊添加按鈕,變成菜單編輯頁面。1599881005(1).png1599881025(1).png
如圖。
1.3.1API設計
image.pngsql

2.1 動手
1)先在PageController(處理全部業務請求的conlltroller)中添加doMenuUI方法。
image.png
兩種不一樣的形式,目的是爲了優化。都是返回UI頁面。先進行下一步。app

2)實現starter頁面加載完成後,點擊菜單,會觸發執行函數,進行加載。在starter.html下
image.png
在一個完成的函數裏面,放入函數就行,封裝共性。
doLoadUI("load-menu-id","menu/menu_list")。
能夠進行測試,如圖。
image.png
3)回到1)的優化,在PageController類裏,兩個函數能夠不寫,Module模塊別的意思,共性:都是同樣的路徑,返回值都是字符串。
image.png
image.png
rest風格的url,你傳什麼就是什麼,傳menu_list就是menu。可是優先級低。
image.png
4)用map來封裝數據,再也不是用pojo,換種方法。
一行記錄映射成一條map對象,map中的key是表中的字段名,id,name,operation這些,value就是字段表明的value。
image.png
同過list集合來記錄多條map,集合數據會直接傳給業務層,由於沒有分頁。
image.png
最終傳到控制層。封裝到JsonResult。
image.png
兩個難點:表的查詢,數據的呈現。
image.png
3 代碼實現
1)查詢上級菜單以及當前菜單。一個表一個dao,在建立一個。
image.png
在mapper創建對應sql映射文件。
方案一:嵌套查詢
image.png
方案二:多表關聯
左外關聯,共性顯示,特性也要顯示。左邊,知足條件的都要顯示,不知足的左邊表格要顯示。
image.png
2)service接口,建立方法
image.png
3)實現類
image.png
4)控制層 有Controller和ResponseBody能夠寫一個註解RestController
image.png
Treegird樹形表格,這裏應用。能夠去官網查
image.png
在menu_list裏面要有對應。
image.png
image.png函數

相關文章
相關標籤/搜索