lucms - vue 與 Laravel 開發的後臺管理系統

Ucer發表於2018-06-29
VueLaravel

lucms

專案概述

  • 產品名稱：lucms
  • demo: 沒錢續費伺服器，暫不提供演示
  • 最新穩定版本 v2.0.5

lucms 是一個基於 laravel5.5* 與 iviewjs 開發的一套後臺管理系統。

file
file
file

功能如下

  • 使用者認證 —— 登入、退出
  • 使用者認證 —— 多表登入
  • 使用者管理 —— 頭像上傳、資料修改
  • 許可權系統 —— 多角色、多許可權管理
  • 附件管理 —— 伺服器檔案管理
  • 新聞系統 —— 基礎新聞管理
  • 系統安全 —— 日誌記錄、ip 過濾
  • Excel 匯入匯出
  • Markdown 編輯器支援
  • Wangeditor 編輯器支援
  • 各種元件封裝

開發環境部署/安裝

本專案程式碼使用 PHP 框架 Laravel 5.5 開發，本地開發環境使用 Laravel Homestead。

下文將在假定讀者已經安裝好了 Homestead 的情況下進行說明。如果您還未安裝 Homestead，可以參照 Homestead 安裝與設定 進行安裝配置。

基礎安裝

  • 克隆原始碼

克隆 lucms 原始碼到本地：

git@gitee.com:zhjaa/lucms.git

  • php 配置修改

1). 配置本地環境，根目錄指向 public

2). 安裝 composer

composer install

2). 生成配置檔案

cp .env.example .env
你可以根據情況修改 .env 檔案裡的內容，如資料庫連線、快取、郵件設定等：

2). 目錄訪問許可權配置

  $ chmod -R 777 storage

3). 配置 .env ，修改資料庫資訊 . ....

APP_NAME=Laravel
APP_ENV=local
APP_KEY=base64:IKlBaIonliiolP7yK0QWP8Ixwgc1Z5R2ylxEA6CD3nA=
APP_DEBUG=true
APP_LOG_LEVEL=debug
APP_URL=http://lucms.test

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=lucms
DB_USERNAME=root
DB_PASSWORD=route
.

.

.
QUEUE_DRIVER=sync 「同步模式，不使用任何佇列」 => redis

.

.

.

4). 生成資料表及生成測試資料

$ art migrate
$ art db:seed

5). 安裝 passport 客戶端, vue api 請求 token 認證要用到

 $ art passport:install

 # 以下內容複製到 .env 中
 Client ID: 2
 Client Secret: qtbbnoYSKM1QkAfbcs614iCiWmMvBWNdRloJNbDi

6). 配置 .env ，修改資料庫資訊 . ....

.

.

.
OAUTH_GRANT_TYPE=password
OAUTH_CLIENT_ID=2
OAUTH_CLIENT_SECRET=p7XaeU3D9RASxQ18eiF5CT1uL9xUJRYjT6O8BJFt
OAUTH_SCOPE=*

.

.

.

7). 生成金鑰

art key:generate

8). 設定圖片上傳軟連結 storage/app/public/* 到 public/storage/images

$ cd public
$ mkdir storage
$ ln -s /srv/wwwroot/homestead-code/lucms/storage/app/public/* ./storage/
  • 修改 js 配置

1). 全域性修改基本域名 http://lucms.test => https://xxxxx

cp  lu/example.vue.config.js lu/vue.config.js
cp  lu/config/example.env.js lu/config/env.js
cp  lu/config/example.url.js lu/config/url.js

lucms/lu/vue.config.js

const BASE_URL = env === 'development'
  ? '/iview-admin/'
  : 'https://lucms.com/lu/dist/'

lucms/lu/config/url.js

const DEV_URL = 'http://lucms.test/'
const PRO_URL = 'https://lucms.com/'

vuejs 安裝與執行

1). 開發環境

$ cd lu
$ cnpm install
$ npm run dev

2). 生產環境

$ cd lu 
$ npm run build

擴充套件包使用情況

擴充套件包 一句話描述 本專案應用場景
laravel/passport jwt 使用者認證包 api 登入認證
Intervention/image 圖片處理包 圖片上傳裁剪
laravel-permission:~2.7 許可權管理包 許可權管理
mews/purifier xss過濾 富文字編輯器
overtrue/pinyin 基於 CC-CEDICT 詞典的中文轉拼音工具 文章 seo 友好的 url
nrk/predis redis 佇列驅動器 佇列管理
laravel/horizon 佇列監控 佇列監控
rap2hpoutre/laravel-log-viewer laravel 日誌檢視 檢視日誌
aliyuncs/oss-sdk-php 啊裡雲 oss 物件儲存
overtrue/easy-sms 簡訊傳送 找回密碼
barryvdh/laravel-cors 跨越解決 開發環境方便測試
league/html-to-markdown markdown 轉 html 富文字編輯器 markdown 支援
Maatwebsite/Laravel-Excel excel 處理 匯入匯出 excel

佇列

Jobs 一句話描述
TranslateSlug 翻譯文章 title

do it now

相關文章