基於vue2.0 +vuex+ element-ui 後臺管理系統

xxx金融後臺管理系統

A magical vue element touzi admin.

• 效果演示地址
• github地址

About

此項目是 vue2.0 + element-ui + node+mongodb 構建的後臺管理系統，全部的數據都是從服務器實時獲取的真實數據，具備真實的註冊、登陸、數據顯示、新增數據、修改數據、刪除數據等功能。

若是對您對此項目有興趣，能夠點 "Star" 支持一下 謝謝！ ^_^
  
  或者您能夠 "follow" 一下，我會不斷開源更多的有趣的項目
  
  開發環境 windows 64 、nodejs 6.11.0
  
  若有問題請直接在 Issues 中提，或者您發現問題並有很是好的解決方案，歡迎 PR

技術棧

前端技術棧： vue2 + vuex + vue-router + webpack2.0 + ES6/7 + less + element-ui

服務端技術棧：nodejs + express + mongodb

前序準備

運行前準備：

一、不須要在本地調試及開發：
請訪問本項目的服務器地址。

二、須要在本地調試及開發：

因爲此項目是基於nodejs和mongodb的先後端結合項目，你須要進行nodejs和mongodb的相關準備工做。項目運行以前，請確保系統已經安裝如下應用：

(1)、node (6.0 及以上版本)。使用細節，請參考：node的下載及安裝。

(2)、mongodb 。使用細節，請參考：mongodb的下載及使用。【下載，db/log配置，開啓服務，use touzi，導入數據】

(3)、robomongod。使用細節，請參考：robomongod的下載及使用。（注意：mongodb可視化視圖工具，本項目不是必須安裝，主要用於方便查看數據庫數據）。

開發：

git clone https://github.com/wdlhao/vue...

cd vue2-element-touzi-admin

npm install

npm run dev (訪問本地後臺系統，需開啓服務端express服務)。運行以後，會默認打開本地訪問路徑：http://localhost:8012

開啓服務端express服務方法以下：雙擊server/start.bat啓動文件，執行命令>node index.js便可，啓動後切記不要關閉cmd窗口。

發佈

npm run bulid (生成打包以後的項目文件,此文件主要用於項目部署)。

功能

• 登陸/退出 -- 完成
• 首頁 -- 完成
• 用戶列表 -- 完成
• 信息列表 -- 完成

• 信息管理

  • 我的信息 -- 完成
  • 修改信息 -- 完成

• 資金管理

  • 資金流水 -- 完成
  • 支付單據 -- 完成

• 投資管理

  • 省份投資 -- 完成
  • 區域投資 -- 完成

• 金融文章

  • 文章發佈 -- 完成
  • 文章編輯 -- 完成
  • 查看文章 -- 完成

• 資金數據

  • 投資分佈 -- 完成
  • 項目分佈 -- 完成
  • 收支統計 -- 完成

目錄結構

├── build                      // 構建相關  
├── config                     // 配置相關
├── exampleImgs                // 項目示例圖片
├── outdb                      // 導入數據庫的初始化數據
├── server                     // node服務端
│   ├── api.js                    // 封裝的接口請求
│   ├── db.js                     // db數據模型定義
│   ├── index.js                  // express服務器
│   ├── mutils.js                 // 服務端工具類
├── src                        // 源代碼
│   ├── assets                 // 圖片等靜態資源
│   ├── components             // 全局公用組件
│   ├── config                 // 接口請求配置
│   ├── fonts                  // fontawesome字體庫文件
│   ├── layout                 // 全局 組件
│   ├── page                   // 項目全部的視圖
│   ├── register               // 第三方庫註冊
│   ├── router                 // 登陸路由
│   ├── store                  // 項目vuex數據存儲器
│   ├── style                  // 全局樣式
│   ├── utils                  // 全局公用方法
│   ├── vendor                 // 公用vendor
│   ├── App.vue                // 入口頁面
│   ├── main.js                // 入口 加載組件 初始化
├── static                     // 第三方不打包資源
│   └── Tinymce                // 富文本
├── .babelrc                   // babel-loader 配置
├── .gitignore                 // git 忽略項
├── eslintrc.js                // eslint 配置項
├── favicon.ico                // favicon圖標
├── index.html                 // html模板
├── package.json               // 包依賴配置
└── README.md                  // 說明文件

查看更多demo

License

MIT