使用thinkjs+vue+vuex全棧開發--週報企業管理系統weekly

saucxs發表於2018-11-30
JSVue全棧

weekly週報系統

週報系統主要是node+vue+redis+mysql+es6，一個企業管理系統，企業員工彙報每週工作情況，以及完成情況，各級負責人可以檢視和提醒相應未寫週報人員。
，後端完全使用nodeJS，資料庫使用mysql，基於nodejs的thinkjs框架搭建的，如果喜歡nodeJS寫的後端，支援大前端，支援全棧開發，請請star並fork專案。

同步到sau交流學習社群：www.mwcxs.top/page/461

系統演示地址為：週報線上地址。
（公司負責人）賬號：testadmin，密碼：123456
（部門經理）賬號：test，密碼：123456
（成員）賬號：teststaff，密碼：123456

    如有使用問題請留言。

    公告：

    1.不要刪除預設的賬號，以及相關東西
    2.自己可以新建賬號來測試，玩耍
    3.每一個公司（組織機構）都是獨立，每一個部門是獨立，互不干擾
    4.如果有商務要求，可以對接我，郵箱:saucxs@163.com，新建自己公司（組織機構）統一管理。

      功能點：

      1、所有人週報提交修改；
      2、所有人週報自身週報歷史檢視；
      3、部門經理檢視部門週報填寫情況，增改部門人員；
      4、總監（或公司擁有者）檢視和修改所有人的週報填寫情況，增刪改公司人員，增改公司部門；
      5、管理員許可權，增刪改公司總監，增刪改部門人員，增刪改公司部門，檢視和編輯所有所有的週報，以及所有所有周報填寫情況；

        一、技術棧

        ThinkJS（ Node端框架） 官方網站
        Vue.js（客戶端雙向資料繫結框架） 官方網站

          二、版本功能

          [x] Element UI

          [x] 登入/登出

          [x] 個人中心

          [x] 修改使用者資訊

          [x] 修改密碼

          [x] mysql

          [x] 寫週報

          [x] 個人歷史週報

          [x] 部門人員管理

          [x] 部門週報情況

          [x] 公司的部門新建，修改，刪除

              2018.09.18

              完成基本版本的功能

                2018.09.20部門經理許可權優化

                左側增加首頁

                部門人員管理增加查詢，可根據使用者名稱，工號，公司名，部門名稱，查詢部門成員

                  2018.10.12

                  優化許可權管理


                    三、系統截圖

                    3.1 登入頁

                    image

                    3.2 成員頁面

                    image

                    3.3 部門經理頁面

                    image

                    3.4 總監頁面

                    image

                    3.5 管理員頁面

                    image

                    四、本地執行程式

                    1、首先你的環境是nodejs，不會安裝配置參考：nodejs安裝和環境配置（Windows）

                    2、clone下來專案

                    git clone https://github.com/saucxs/weekly.git
複製程式碼

                    3、分別針對前端vue的weekly-web的資料夾和node後端weekly-node，安裝相應依賴

                    npm install
複製程式碼

                    4、安裝redis（可以考慮安裝RedisDesktopManager）

                    參考：安裝window下的redis，redis視覺化管理工具（Redis Desktop Manager）安裝，基礎使用，例項化專案

                    5、安裝mysql，這個就不贅述

                    6、修改nodejs的後端的配置檔案adapter.js，config.js這兩個檔案中

                    adapter.js

exports.cache = {
    type: 'redis',
    common: {
        timeout: 24 * 60 * 60 * 1000 // millisecond
    },
    redis: {
        handle: redisCache,
        host: '127.0.0.1',
        port: 6379,
        password: 'a123456'  //redis安裝時候設定的祕密
    }
};
//
//
exports.model = {
  type: 'mysql',
  common: {
    logConnect: true,
    logSql: true,
    logger: msg => think.logger.info(msg)
  },
  mysql: {
    handle: mysql,
    database: 'weekly',
    prefix: 'week_',
    encoding: 'utf8',
    host: '127.0.0.1',   //本地資料庫
    port: '3306',　　　　　//資料庫埠
    user: 'root',    //資料庫的使用者名稱
    password: '123456',    //資料庫該使用者名稱的密碼
    dateStrings: true
  }
};
複製程式碼

                    7、分別對前後端分離的專案啟動

                    (1)前端vue的weekly-web的啟動

                    npm run dev
複製程式碼

                    (2)和node後端weekly-node的啟動

                    npm start
複製程式碼


                    相關文章