前端底層框架開發(fā)教程，Vue-項(xiàng)目《人力資源管理系統(tǒng)》

一、項(xiàng)目模板
1.拉取基礎(chǔ)模板
2.項(xiàng)目目錄及入口文件介紹
3.App.vue根組件解析
4.setting.js和permission.js
5.Vuex結(jié)構(gòu)介紹
6.模板中的圖標(biāo)使用
7.擴(kuò)展-Icon圖標(biāo)的解析

二、登錄模塊
1. 導(dǎo)入樣式并使用git管理
2. 登錄頁(yè)面結(jié)構(gòu)和表單
3. 登錄表單校驗(yàn)手機(jī)號(hào)和密碼
4. 登錄表單校驗(yàn)勾選和整體校驗(yàn)
4. Vuex中的用戶模塊
5. Vuex中的token持久化
6. Vue-cli代理解決跨域問題
7. axios封裝處理請(qǐng)求攔截器
8. axios處理響應(yīng)攔截器
9. axios區(qū)分不同環(huán)境
10. 登錄聯(lián)調(diào)封裝請(qǐng)求模塊和調(diào)用接口
11. 登錄聯(lián)調(diào)跳轉(zhuǎn)到主頁(yè)

三、主頁(yè)
1. 主頁(yè)權(quán)限驗(yàn)證分析
2.主頁(yè)權(quán)限驗(yàn)證-有token的情況
3. 主頁(yè)權(quán)限驗(yàn)證-沒token的情況
4. 獲取用戶資料調(diào)用action
5. 調(diào)整調(diào)用action的位置
6. 顯示用戶的名稱和頭像
7.處理用戶頭像為空的情況
8.處理token失效
9.調(diào)整下拉菜單-實(shí)現(xiàn)退出登錄
10.修改密碼-彈出層
11.修改密碼-實(shí)現(xiàn)表單結(jié)構(gòu)
12.修改密碼-表單校驗(yàn)
13.修改密碼-表單提交
14. 清理路由配置和組件
15. 創(chuàng)建項(xiàng)目所需要的的路由和頁(yè)面
16. 批量創(chuàng)建路由和組件
17. 擴(kuò)展-解析左側(cè)菜單渲染
18. 顯示項(xiàng)目logo

四、組織架構(gòu)
1.組織架構(gòu)-樹形組件的應(yīng)用
2.組織架構(gòu)-樹形自定義結(jié)構(gòu)
3.組織架構(gòu)-節(jié)點(diǎn)數(shù)據(jù)的展示
4.組織架構(gòu)-獲取數(shù)據(jù)
5.組織架構(gòu)-遞歸轉(zhuǎn)化樹形數(shù)據(jù)
6.組織架構(gòu)-添加子部門-彈層
7.組織架構(gòu)-添加子部門-表單結(jié)構(gòu)
8.組織架構(gòu)-添加子部門-表單基本校驗(yàn)
9.組織架構(gòu)-添加子部門-業(yè)務(wù)校驗(yàn)
10.組織架構(gòu)-添加子部門-負(fù)責(zé)人數(shù)據(jù)
11.組織架構(gòu)-添加子部門-記錄部門
12.組織架構(gòu)-添加子部門-確認(rèn)和取消
13.組織架構(gòu)-編輯部門-彈出層獲取數(shù)據(jù)
14.組織架構(gòu)-編輯部門-編輯表單校驗(yàn)
15.組織架構(gòu)-編輯部門-確認(rèn)取消
16.組織架構(gòu)-刪除部門

五、角色管理
1.角色管理-搭建頁(yè)面結(jié)構(gòu)
2.角色管理-獲取角色數(shù)據(jù)
3角色管理-表格列的自定義結(jié)構(gòu)
4.角色管理-分頁(yè)功能
5.角色管理-添加角色彈出層
6.角色管理-添加角色-表單校驗(yàn)
7.角色管理-添加角色-確定取消
8.角色管理-編輯角色-行內(nèi)編輯解析
9.角色管理-編輯角色-行內(nèi)編輯狀態(tài)
10.角色管理-編輯角色-行內(nèi)編數(shù)據(jù)緩存
11.角色管理-編輯角色-確定和取消
12.角色管理-刪除角色

六、員工模塊
1.員工管理-準(zhǔn)備頁(yè)面結(jié)構(gòu)
2.員工管理-左樹數(shù)據(jù)加載
3.員工管理-記錄樹節(jié)點(diǎn)
4.員工管理-員工列表結(jié)構(gòu)
5.員工管理-員工數(shù)據(jù)的獲取
6.員工管理-頭像和聘用形式
7.員工管理-員工數(shù)據(jù)分頁(yè)
8.員工管理-員工模糊搜索
9.員工管理-員工導(dǎo)出excel
10.員工管理-excel導(dǎo)入組件封裝
11.員工管理-員工導(dǎo)入模版下載
12.員工管理-excel導(dǎo)入-上
13.員工管理-excel導(dǎo)入-下
14.員工管理-刪除員工
15.員工詳情-頁(yè)面結(jié)構(gòu)和路由
16.員工詳情-數(shù)據(jù)和校驗(yàn)
17.員工詳情-級(jí)聯(lián)組件封裝
18.員工詳情-級(jí)聯(lián)組件雙向綁定
19.員工詳情-新增員工實(shí)現(xiàn)
20.員工詳情-編輯數(shù)據(jù)-查看員工
21.員工詳情-編輯員工-保存
22.員工詳情-封裝員工頭像-上
23.員工詳情-封裝員工頭像-下
24.員工詳情-上傳圖片-創(chuàng)建騰訊云存儲(chǔ)桶
25.員工詳情-使用cos-sdk上傳

七、權(quán)限
1.權(quán)限管理-搭建頁(yè)面結(jié)構(gòu)
2.權(quán)限管理-獲取權(quán)限數(shù)據(jù)
3.作業(yè)-權(quán)限管理
4.權(quán)限管理-權(quán)限概念
5.權(quán)限應(yīng)用-用戶分配角色-彈出層
6.權(quán)限應(yīng)用-用戶分配角色-數(shù)據(jù)提交
7.權(quán)限應(yīng)用-角色分配權(quán)限-彈出層
8.權(quán)限應(yīng)用-角色分配權(quán)限-回顯權(quán)限數(shù)據(jù)
9.權(quán)限應(yīng)用-角色分配權(quán)限-確定取消
10.權(quán)限應(yīng)用-拆分靜態(tài)路由和動(dòng)態(tài)路由
11.權(quán)限應(yīng)用-根據(jù)權(quán)限篩選出路由
12.權(quán)限應(yīng)用-動(dòng)態(tài)添加路由
13.權(quán)限應(yīng)用-根據(jù)權(quán)限渲染菜單
14.退出登錄-重置路由
15.權(quán)限應(yīng)用-功能權(quán)限-按鈕權(quán)限標(biāo)識(shí)
16.權(quán)限應(yīng)用-功能權(quán)限-自定義指令
17.其他模塊集成

八、首頁(yè)
1.首頁(yè)結(jié)構(gòu)和數(shù)字滾動(dòng)
2.首頁(yè)-個(gè)人信息的展示
3.首頁(yè)-企業(yè)信息的獲取
4.首頁(yè)-通知信息的獲取
5.首頁(yè)-圖表的應(yīng)用
6.首頁(yè)-圖表的按需導(dǎo)入

九、上線
1.將路由改成history模式
2.打包分析
3.cdn的引入
4.打包-mac下安裝nginx
5.mac-windows啟動(dòng)服務(wù)
6.max-windows配置nginx解決404的問題
7.mac-windows中nginx代理解決生產(chǎn)環(huán)境跨域問題