摘要:最終給前端返回的數(shù)據(jù)格式如下賽冷思內(nèi)容管理其他字段文章管理文章列表文章詳情隨筆管理添加修改隨筆大致思路就是這樣,回頭在實現(xiàn)的過程中發(fā)現(xiàn)不完善的,將會持續(xù)更新。最新更新在我的博客
基本的表結(jié)構(gòu)如下 用戶表。user權(quán)限是一塊設計挺繁瑣的功能,尤其是設計到前端SPA應用,前后端的耦合性太強,先屢屢思路,再實現(xiàn),如果您有好的建議,也可評論留言。
字段 | 說明 |
---|---|
id | 用戶ID |
username | 用戶名 |
id | username |
---|---|
1 | 賽冷思 |
原文在我博客
字段 | 說明 |
---|---|
id | 路由自增ID |
pid | 父級路由ID,默認根路由為0 |
path | 方便操作無線分類的關(guān)鍵字段,后面再說 |
web_pata | 前端路由路徑,注意:為方便各種SPA,前后不帶斜杠,交給前端自己處理即可 |
name | 路由名稱 |
desc | 路由描述 |
sort | 排序,例如同一級路由,可按此字段排序,這個排序結(jié)果將會在前端菜單中提現(xiàn) |
extra | 拓展信息,格式為JSON字符串,例如vue-router中的meta信息 |
添加功能盡量讓前端開發(fā)者填寫,你懂得
修改時,前端一定要知道,你懂得
刪除時,前端一定要知道,你懂得
示例切記,這些東西都是跟前端相關(guān)聯(lián)。。。
id | pid | path | web_path | name | desc | sort | extra |
---|---|---|---|---|---|---|---|
1 | 0 | 0, | manager | 內(nèi)容管理 | 管理內(nèi)容的路由 | 1 | {} |
2 | 1 | 0,1, | article | 文章管理 | 文章管理 | 1 | {} |
3 | 2 | 0,1,2, | list | 文章列表 | 查看文章列表頁面 | 1 | {} |
4 | 2 | 0,1,2, | view | 文章詳情 | 查看文章詳情頁面 | 1 | {} |
5 | 2 | 0,1,2, | edit | 添加/修改文章 | 添加和修改文章公用頁面 | 1 | {"test":"article-edit"} |
6 | 1 | 0,1, | mind | 隨筆管理 | 隨筆管理 | 1 | {} |
7 | 6 | 0,1,6, | list | 隨筆列表 | 查看隨筆列表頁面 | 1 | {} |
8 | 6 | 0,1,6, | view | 隨筆詳情 | 查看隨筆詳情頁面 | 1 | {} |
9 | 6 | 0,1,6, | edit | 添加/修改隨筆 | 添加和修改隨筆公用頁面 | 1 | {"test":"mind-edit"} |
注意:給用戶選擇路由時,如果選擇的是最底層的路由,那么從它自身到最頂層父級,都應該被選擇,例如選擇文章列表,那么文章管理和內(nèi)容管理都應該被選中。同樣,如果選擇的不是最底層的,那么所有的子級應該被選中,不再細說。
解釋一下關(guān)鍵字段
pid 父級ID,根級ID為0,沒啥說
path 默認為"0,",意思就把當前數(shù)據(jù),從最頂層的父級pid到自身的pid,用英文","鏈接起來,最后要加個逗號
例如,文章管理自己的pid為1,它得父級內(nèi)容管理的pid是0,所以文章管理的path就是"0,1,",一次類推就行
extra 前端路由的拓展信息
字段 | 說明 |
---|---|
id | 自身自增ID |
user_id | 用戶ID |
route_id | 路由ID |
extra | 拓展信息,格式為JSON字符串,例如vue-router中的meta信息,此拓展在將會和routes表extra合并,可以通過這個字段細粒度控制路由中的小操作 |
id | user_id | route_id | extra |
---|---|---|---|
1 | 1 | 1 | {} |
2 | 1 | 2 | {} |
3 | 1 | 6 | {} |
4 | 1 | 3 | {} |
5 | 1 | 4 | {} |
6 | 1 | 9 | {"add":true,"update":false} |
最終給前端返回的數(shù)據(jù)格式如下:通過示例可以看出,該用戶擁有的路由其實就三個頁面,分別是:文章列表,文章查看和添加/修改隨筆,注意:添加/修改隨筆extra里面設置了,add為true,update為false,意思是,只能添加,不能修改,前端可以在用戶進入這個頁面的時候,通過這個信息來決定到底能干啥,從而也就實現(xiàn)了細粒度控制每個頁面的具體操作。
{ id:1, username:"賽冷思", routes:[ { id:1, web_path:"manager", name:"內(nèi)容管理", extra:{}, ...其他字段 children:[ { id:2, web_path:"article", name:"文章管理", extra:{}, children:[ { id:3, web_path:"list", name:"文章列表", extra:{}, }, { id:4, web_path:"view", name:"文章詳情", extra:{}, } ] }, { { id:6, web_path:"mind", name:"隨筆管理", extra:{}, children:[ { id:9, web_path:"view", name:"添加/修改隨筆", extra:{ test:"mind-edit", add:true, update:false } } ] } } ] } ] }
大致思路就是這樣,回頭在實現(xiàn)的過程中發(fā)現(xiàn)不完善的,將會持續(xù)更新。
最新更新在我的博客:https://sailengsi.com/article/15
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://specialneedsforspecialkids.com/yun/25991.html
摘要:我們將登錄按鈕上綁上事件,點擊登錄之后向服務端提交賬號和密碼進行驗證。所以前端和后端權(quán)限的劃分是不太一致。側(cè)邊欄最后一個涉及到權(quán)限的地方就是側(cè)邊欄,不過在前 完整項目地址:vue-element-admin 系列文章: 手摸手,帶你用vue擼后臺 系列一(基礎篇) 手摸手,帶你用vue擼后臺 系列二(登錄權(quán)限篇) 手摸手,帶你用vue擼后臺 系列三 (實戰(zhàn)篇) 手摸手,帶你用vu...
摘要:五六月份推薦集合查看最新的請點擊集前端最近很火的框架資源定時更新,歡迎一下。蘇幕遮燎沈香宋周邦彥燎沈香,消溽暑。鳥雀呼晴,侵曉窺檐語。葉上初陽乾宿雨,水面清圓,一一風荷舉。家住吳門,久作長安旅。五月漁郎相憶否。小楫輕舟,夢入芙蓉浦。 五、六月份推薦集合 查看github最新的Vue weekly;請::點擊::集web前端最近很火的vue2框架資源;定時更新,歡迎 Star 一下。 蘇...
閱讀 1385·2019-08-30 12:54
閱讀 1870·2019-08-30 11:16
閱讀 1612·2019-08-30 10:50
閱讀 2447·2019-08-29 16:17
閱讀 1266·2019-08-26 12:17
閱讀 1377·2019-08-26 10:15
閱讀 2387·2019-08-23 18:38
閱讀 785·2019-08-23 17:50