Laravel-admin 使用Layer相冊功能

使用Laravel-admin後臺，Laravel-admin已經集成了不少前端組件,可是在手冊中也沒有發現可以展現相冊的插件，而本人比較喜歡Layer彈窗的插件因此想使用Layer來進行效果展現

 

通讀手冊找到了Laravel-admin是能夠本身定義組件的。可是本人功力不夠。看不懂。。。。

還好除了自定義組件以外還能夠進行前端資源引入

關於前端資源問題
若是須要使用本身的前端文件，能夠在app/Admin/bootstrap.php中引入：

Admin::css('path/to/your/css');
Admin::js('path/to/your/js');

上面引入自Laravel-admin手冊中常見問題 點擊查看連接 http://laravel-admin.org/docs/#/zh/qa

因此就將Layer資源下載到本地，而後放入Laravel中的public目錄下 本人版本下載3.1

而後在app/Admin/bootstrap.php中引入

use Encore\Admin\Facades\Admin;
Admin::js('/layer-v3.1.1/layer-v3.1.1/layer/layer.js');

本人下載layer-v3.1.1版本，因此此處目錄請根據本身響應修改

而後以後就能夠在控制器中直接使用layer的功能了

下面以本人所作layer相冊功能爲例

 

首先添加彈出相冊功能按鈕

$grid->actions(function ($action) {
       $action->append('<a href="' . LayerPhoto(url('admin/scenic/get/photo'),1) . '"><i class="fa fa-eye"></i>查看相冊</a>');
  });

上面代碼中LayerPhoto爲自定義的函數

/*
     * LayerPhoto layer相冊使用
     * $url 獲取數據的地址
     * url地址返回格式 ：
     * [
     *      'title' => '',
     *      'id' => 1,
     *      'start' => 0
            [
                'alt' => '圖片標題1',
                'src' => '圖片地址'
            ],
            [
                'alt' => '圖片標題2',
                'src' => '圖片地址'
            ],
            [
                'alt' => '圖片標題3',
                'src' => '圖片地址'
            ],
        ]
     *
     * $type 相冊的彈出樣式
     */
function LayerPhoto($url,$type = 1)
{
    $script = "javascript:$.getJSON('{$url}',function(json){layer.photos({photos: json,anim :{$type}});});"; //此處不能分行顯示 必須不能存在空格
    return $script;
}

至於自定義函數功能解釋

首先創建函數PHP文件   app/自定義目錄/自定義文件名.php

在此文件中寫入自定義函數

而後在 composer.json中的autoload裏面添加或者修改files
"autoload": {
          ···
        "psr-4": {
            "App\\": "app/"
        },
        "files":[
            "app/自定義目錄/自定義文件名.php"
        ]
    },
而後執行 
    composer dump-autoload便可

 

以後即可以顯示出layer相冊功能了

其餘Layer彈窗功能同樣處理便可

 

以上是我本身的想法，也能夠實現layer的彈窗功能，不知道是否有更加便捷的方式能夠實現，若是有但願能留言告知一下，萬分感謝