V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
moell
V2EX  ›  PHP

Mojito - 基于 Laravel、Vue、ELement 构建的基础后台系统扩展

  •  
  •   moell · 2018-10-09 12:30:20 +08:00 · 2583 次点击
    这是一个创建于 1998 天前的主题,其中的信息可能已经有所发展或是发生改变。

    Mojito

    Mojito 是一个基于 Laravel, Vue, Element 构建的后台管理系统。

    截图

    获取地址

    https://github.com/moell-peng/mojito 欢迎使用和 star

    特征

    • 可快速衍生多个后台系统
    • 内置角色,权限,用户,菜单管理
    • OAuth 2.0,并支持多表鉴权
    • 完善的 PHPUnit 测试
    • API 权限精确至路由,页面权限精取到按钮或链接
    • 前后端分离
    • 多标签页
    • 前端支持多语言配置
    • 简洁的布局

    要求

    • Laravel >= 5.5.0
    • Vue >= 2.5.17
    • Element >= 2.4.6

    安装

    首先安装 laravel,并且确保你配置了正确的数据库连接。

    composer require moell/mojito
    

    然后运行下面的命令来发布资源:

    php artisan mojito:install
    

    命令执行成功会生成配置文件,数据迁移和构建 SPA 的文件。

    config/auth.php中添加相应的 guards 和 providers,如下:

    'guards' => [
            ...
            'admin' => [
                'driver' => 'passport',
                'provider' => 'admin'
            ]
        ],
    
    'providers' => [
            ...
            'admin' => [
                'driver' => 'eloquent',
                'model' => \Moell\Mojito\Models\AdminUser::class,
            ]
        ],
    

    app/Http/Kernel.php 中 $routeMiddleware 属性添加路由中间 oauth.providersmojito.permission,并将auth中间件替换为如下:

    class Kernel extends HttpKernel
    {
        protected $routeMiddleware = [
            // 'auth' => \Illuminate\Auth\Middleware\Authenticate::class,
            'auth' => \SMartins\PassportMultiauth\Http\Middleware\MultiAuthenticate::class,
            'oauth.providers' => \SMartins\PassportMultiauth\Http\Middleware\AddCustomProvider::class,
            'mojito.permission' => \Moell\Mojito\Http\Middleware\Authenticate::class,
        ];
    }
    

    执行数据迁移,数据填充

    php artisan migrate
    
    php artisan db:seed --class="Moell\Mojito\Database\MojitoTableSeeder"
    

    Passport 安装和配置

    php artisan passport:install
    

    执行成功后获取到相应的密码授予客户端的 ID 和 secret 并且配置到相对应的 resources/config/index.js :

    export default {
      admin: {
        authorize: {
          clientId: ID,
          clientSecret: secret
        }
    }
    

    安装 Javscript 依赖

    npm install
    npm install -D vuex@^3.0.1 vue-router@^3.0.1 vue-i18n@^8.1.0 localforage@^1.7.2 element-ui@^2.4.6
    

    Mix 引入 admin.js

    mix.js('resources/assets/js/app.js', 'public/js')
        .sass('resources/assets/sass/app.scss', 'public/css')
        //.js('resources/js/admin.js', 'public/js') laravel5.7+
        .js('resources/assets/js/admin.js', 'public/js')
    

    运行 Mix

    #npm run watch
    npm run production
    

    登录

    url: http://localhost/mojito#/admin/login

    email: [email protected]

    password: secret

    依赖开源软件

    • Laravel
    • Vue
    • Element UI
    • laravel/passport
    • smartins/passport-multiauth
    • spatie/laravel-permission
    • orchestra/testbench

    License

    Apache License Version 2.0 see http://www.apache.org/licenses/LICENSE-2.0.html

    2 条回复    2018-10-10 10:51:37 +08:00
    nosay
        1
    nosay  
       2018-10-10 10:12:09 +08:00
    非常感谢。
    moell
        2
    moell  
    OP
       2018-10-10 10:51:37 +08:00
    @nosay 多谢支持
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   2727 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 25ms · UTC 12:37 · PVG 20:37 · LAX 05:37 · JFK 08:37
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.