Beehive
前言
Beehive 是一個項目管理系統。參考于Teambetion、PearProject，實作部分功能。
這是一個Vue+Node.js的js全棧項目。基于RBAC模型做權限控制，動态配置菜單，前端實作頁面元素級别的權限控制。通過WebSocket實作站内信功能，任務看闆中，實作更新同步推送。一旦其他項目成員有對我們目前檢視的項目任務做任何的操作，頁面都将立即同步更新，并向此任務的所有參與者（除了操作者）發送消息通知。注冊和找回密碼需要通過郵箱驗證碼驗證，可以通過github授權登陸（不是很穩定）。
Node.js架構選用的是Egg.js，配合sequelize，自己寫了一個小工具。可以通過填寫表字段的配置，執行npm run generator-entity自動生成一整套檔案，包括Swagger、資料校驗validate、Sequelize需要的model、controller、service、router。并自動建立資料庫表，包括每個字段的類型、長度、是否能為空、預設值、注釋、索引、甚至是外鍵都能搞定。因為加了權限控制，是以還要到前端的資源管理中添加一下新增的資源，并在角色中點選配置設定一下，就完成了一張表的CRUD了，包括新增、修改、詳情、批量删除、分頁清單。當然這還是有很多可以優化的空間的，但也基本夠用了。為了優化鑒權消耗，以及滿足WebSocket的可靠性設計需要，系統引入Redis做緩存。
密碼是加鹽存儲的，且在傳輸過程中使用了RSA做了非對稱加密。Jwt認證使用Access Token + Refresh Token，配合黑名單。
效果示範
預釋出環境：超級管理者賬号：test-super ，密碼：test-super123
預釋出環境位址：beehives.imfdj.top預釋出環境：普通使用者賬号：test-user ，密碼：test-user123
生産環境：普通使用者賬号：test-user ，密碼：test-user123
生産環境位址：beehive.imfdj.top技術棧
前端：Vue2全家桶 + Element-ui + Axios + Vue-socket.io + Sass
前端項目github位址後端：Egg.js + Sequelize + Jwt + Mysql + Redis + Socket + Swagger
後端項目github位址說明
如果對您有幫助，您可以點右上角 "Star" 支援一下 謝謝！ ^_^
或者您可以 "follow" 一下，我會不斷開源更多的有趣的項目。如：Vue3 + NestJS + TypeScript ✨
如有問題請直接在 Issues 中提，或者您發現問題并有非常好的解決方案，歡迎 PR 👍
目标功能
- [x] 登入、注冊 -- 完成
- [x] github授權登入 -- 完成
- [x] 找回密碼 -- 完成
- [x] 滑塊驗證 -- 完成
- [x] 郵箱驗證 -- 完成
- [x] 動态首頁 -- 完成
- [x] 個人設定 -- 完成
- [x] 使用者管理 -- 完成
- [x] 角色管理 -- 完成
- [x] 菜單管理 -- 完成
- [x] 資源管理 -- 完成
- [x] 記錄檔 -- 完成
- [x] 動态菜單 -- 完成
- [x] 部門管理 -- 完成
- [x] 項目清單 -- 完成
- [x] 任務看闆 -- 完成
- [x] 任務清單 -- 完成
- [x] 項目檔案 -- 完成
- [x] 項目概覽 -- 完成
- [x] 項目成員 -- 完成
- [x] 項目邀請 -- 完成
- [x] 項目設定 -- 完成
- [x] 項目資源回收筒 -- 完成
- [x] 任務篩選 -- 完成
- [x] 任務詳情 -- 完成
- [x] 任務标簽 -- 完成
- [x] 任務參與者 -- 完成
- [x] 任務動态 -- 完成
- [x] 任務工時 -- 完成
- [x] 任務關聯檔案 -- 完成
- [x] 任務更新即時同步 -- 完成
- [x] 公開項目的業務權限控制（非項目成員不可編輯項目） -- 完成
- [x] 項目模闆 -- 完成
- [x] 消息提醒 -- 完成
- [x] 工作台 -- 完成
- [x] 站内信 -- 完成
- [x] 頁面元素權限控制 -- 完成
- [ ] 項目版本 -- 待開發
- [ ] 項目日程 -- 待開發
部分截圖
後端egg項目部署
運作環境：
Node.js >= v10; Mysql >= 5.7; Redis >= 5.0;
git clone https://github.com/Imfdj/egg-beehive.git
cd egg-beehive
npm install 或 yarn(推薦)
将database目錄下的egg-beehive-dev.sql和egg-beehive-test.sql導入mysql（推薦navicat）。
在config目錄下的config.local.js和config.unittest.js中的exports.sequelize、exports.redis、exports.io.redis下填入Mysql和Redis的配置參數
npm run dev
npm run test-local (單元測試) 如何快速CRUD：
在generator檔案夾中的config.js檔案中定義各個字段的描述，完成後執行npm run generator-entity。
裡面還有很多config-*.js的配置檔案可供參考。也可以在template檔案夾中自定義各個檔案的模闆。
// 這是一個字段的描述模闆
fieldsItemExample: {
name: 'xx_id',
type: 'INTEGER',
length: 11,
min: 1,
max: 1,
required: true,
description: '這裡是描述', // 供swagger使用
primaryKey: false, // 是否為主鍵
unique: false, // 是否唯一
allowNull: false, // 是否允許為空
autoIncrement: false, // 是否自增
defaultValue: '', // 資料庫表中字段的預設值
comment: '外鍵', // 資料庫表中字段的描述
references: {
// 外鍵設定
model: 'xxxs', // 外鍵關聯表
key: 'id', // 外鍵字段名
},
onUpdate: 'NO ACTION', // 外鍵更新限制 CASCADE RESTRICT SET NULL SET DEFAULT NO ACTION
onDelete: 'NO ACTION', // 外鍵删除限制 CASCADE RESTRICT SET NULL SET DEFAULT NO ACTION
} 前端vue項目部署
git clone https://github.com/Imfdj/vue-beehive.git
cd vue-beehive
npm install 或 yarn(推薦)
npm run serve 功能設計
後端設計
資料庫設計
License
MITCopyright (c) 2021 Imfdj