作者 |? enilu

來源 |? https://gitee.com/enilu/web-flash

項目介紹

• web-flash是一個基于Spring Boot和Vue.js的web系統，包含了基于element搭建的后臺管理系統和基于vux搭建的手機端h5站點

• web-flash具備后臺管理類系統的通用的基礎功能，而且提供了基于idea intellij的的代碼生成插件，可以一鍵生成前后端頁面。

• web-flash提供了一個后臺管理系統和前端h5站點系統

• 另提供Material Design風格的單體版：material-admin

目錄說明

• flash-api 后臺api服務

• flash-vue-admin 基于vuejs的后臺管理系統

• flash-vue-h5 移動端內容系統，基于后臺管理CMS內容管理模塊的內容進行展示。

• flash-core 基礎模塊，包括工具類，dao，service，bean等內容

• flash-generator 代碼生成模塊,配合IDEA 代碼生成插件webflash-generator使用效果更好

演示

• 后臺管理(vue版本)?http://flash-admin.enilu.cn

• 手機端?http://flash-mobile.enilu.cn/#/index?打開瀏覽器后使用debug模式的手機視圖模式瀏覽

技術選型

• 核心框架：Spring Boot

• 數據庫層：Spring data jpa

• 數據庫連接池：Druid

• 緩存：Ehcache

• 前端：基于Vue.js的Element(后端)和vux(手機端)

包含的功能

web-flash包含了成熟的后臺管理功能和手機端h5內容站點系統

• 部門管理

• 用戶管理

• 角色管理

• 菜單管理：配置菜單功能

• 權限分配：為指定的角色配置特定的功能菜單

• 參數管理：維護系統參數，并緩存系統參數提供高效的讀取

• 數據字典管理：配置維護數據字典

• 定時任務管理：編寫、配置、執行定時任務

• 業務日志：通過注解的方式記錄用戶操作日志，并提供日志查詢功能

• 登錄日志：查看用戶登錄登出日志

• cms內容管理，配合flash-vue-h5提供了手機端內容展示系統

• 消息管理：配置消息模板，發送短信，郵件消息

• 基于idea插件的代碼生成

使用

• 克隆本項目

• 導入idea或者eclipse

• 創建數據庫：web-flash

  CREATE DATABASE IF NOT EXISTS webflash DEFAULT CHARSET utf8 COLLATE utf8_general_ci; CREATE USER 'webflash'@'%' IDENTIFIED BY 'webflash190602@ABC'; GRANT ALL privileges ON webflash.* TO 'webflash'@'%'; flush privileges; ```

• 在開發環境中配置了系統啟動后自動創建數據庫和初始化數據，所以不需要開發人員手動初始化數據庫

• 確保開發工具下載了lombok插件

• 修改flash-api中數據庫連接配置

• 啟動flash-api，訪問http://localhost:8082/swagger-ui.html?， 保證api服務啟動成功

• 進入flash-vue-admin目錄

  • 運行 npm install --registry=https://registry.npm.taobao.org

  • 運行npm run dev

  • 啟動成功后訪問?http://localhost:9528?,登錄，用戶名密碼:admin/admin

• 后臺管理運行效果圖：

• 進入flash-vue-h5目錄

  • 運行 npm install --registry=https://registry.npm.taobao.org

  • 運行npm run dev

  • 啟動成功后訪問?http://localhost:8088/#/index

• 手機端運行效果圖：?

總結

以上是生活随笔為你收集整理的h5现实手机管理系统_webflash，后台管理系统的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。