作者 |? enilu

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

項目介紹

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

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

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

• 另提供Material Design風(fēng)格的單體版：material-admin

目錄說明

• flash-api 后臺api服務(wù)

• flash-vue-admin 基于vuejs的后臺管理系統(tǒng)

• flash-vue-h5 移動端內(nèi)容系統(tǒng)，基于后臺管理CMS內(nèi)容管理模塊的內(nèi)容進(jìn)行展示。

• flash-core 基礎(chǔ)模塊，包括工具類，dao，service，bean等內(nèi)容

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

演示

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

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

技術(shù)選型

• 核心框架：Spring Boot

• 數(shù)據(jù)庫層：Spring data jpa

• 數(shù)據(jù)庫連接池：Druid

• 緩存：Ehcache

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

包含的功能

web-flash包含了成熟的后臺管理功能和手機(jī)端h5內(nèi)容站點系統(tǒng)

• 部門管理

• 用戶管理

• 角色管理

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

• 權(quán)限分配：為指定的角色配置特定的功能菜單

• 參數(shù)管理：維護(hù)系統(tǒng)參數(shù)，并緩存系統(tǒng)參數(shù)提供高效的讀取

• 數(shù)據(jù)字典管理：配置維護(hù)數(shù)據(jù)字典

• 定時任務(wù)管理：編寫、配置、執(zhí)行定時任務(wù)

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

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

• cms內(nèi)容管理，配合flash-vue-h5提供了手機(jī)端內(nèi)容展示系統(tǒng)

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

• 基于idea插件的代碼生成

使用

• 克隆本項目

• 導(dǎo)入idea或者eclipse

• 創(chuàng)建數(shù)據(jù)庫：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; ```

• 在開發(fā)環(huán)境中配置了系統(tǒng)啟動后自動創(chuàng)建數(shù)據(jù)庫和初始化數(shù)據(jù)，所以不需要開發(fā)人員手動初始化數(shù)據(jù)庫

• 確保開發(fā)工具下載了lombok插件

• 修改flash-api中數(shù)據(jù)庫連接配置

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

• 進(jìn)入flash-vue-admin目錄

  • 運(yùn)行 npm install --registry=https://registry.npm.taobao.org

  • 運(yùn)行npm run dev

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

• 后臺管理運(yùn)行效果圖：

• 進(jìn)入flash-vue-h5目錄

  • 運(yùn)行 npm install --registry=https://registry.npm.taobao.org

  • 運(yùn)行npm run dev

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

• 手機(jī)端運(yùn)行效果圖：?

總結(jié)

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

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。