使用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的弹窗功能,不知道是否有更加便捷的方式可以实现,如果有希望能留言告知一下,万分感谢

Laravel-admin 使用Layer相册功能的更多相关文章

  1. php相册功能实现(包含php图片上传,后台管理,浏览和删除)教程例子

    相册功能实现(包含php图片上传,后台管理,浏览和删除)教程例子包括五个部分: 一.相册首页 <html> <head> <meta charset="utf- ...

  2. 关于QQ空间相册功能的构想与简单实现

    QQ空间上传照片对其可以分类,形成不同的相册,这对于用户体验来说是很不错的,如果用户只能上传不加以分类,那么用户体验会很差. 下面是自己关于相册功能实现的一些简单看法: 首先,是创建相册,可以用pan ...

  3. HTML5调用手机摄像机、相册功能 <input>方法

    最近用MUI框架做webapp项目,在有PLUS环境的基础上能直接调用手机底层的API来使用拍照或从相册选择上传功能! 在查资料的时候,想起了另一种用input调用摄像和相册功能的方法,之前没有深入了 ...

  4. dgango中admin下添加搜索功能

    admin下添加搜索功能: 在表单中加入search_fields = ['ip','hostname']   可模糊匹配 当有人在管理搜索框中进行搜索时,Django将搜索查询分解成单词,并返回包含 ...

  5. 转:HTML5页面如何在手机端浏览器调用相机、相册功能

    HTML5页面如何在手机端浏览器调用相机.相册功能 开发微信端浏览器访问的HTML5的页面,页面中有一个<input id="input" type="file&q ...

  6. hexo主题中添加相册功能

    博客已迁移至http://lwzhang.github.io. 基本上所有的hexo主题默认都没有实现相册功能,一方面相册功能的需求较少,毕竟hexo主要是写博客用的:另一方面实现相册功能比较麻烦,比 ...

  7. JS中调用android和ios系统手机打开相机并可选择相册功能

    编写不易,如有转载,请声明出处: 梦回河口:http://blog.csdn.net/zxc514257857/article/details/57626154 实现android手机打开相机选择相册 ...

  8. laravel框架中超实用的功能介绍

    本篇文章给大家带来的内容是关于laravel框架中超实用的功能介绍,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 让lumen的dd() dump()像laravel一样优雅 1 c ...

  9. HTML5页面如何在手机端浏览器调用相机、相册功能

    最近在做一个公司的保险信息处理系统项目,开发微信端浏览器访问的HTML5的页面,页面中有一个<input id="input" type="file"/& ...

随机推荐

  1. 实现GridControl的行单元格非顺序跳转

    用GridControl控件添加数据的时候发现,有一些字段过多但是并不是每个字段都需要用户输入,每个单元格都回车跳转的时候不仅浪费时间,而且用户体验也不好,就需要单元格跳转的时候,不需要的字段可以隔过 ...

  2. PyQt5--基础篇:用eric6工具实现三级联动效果

    今天给大家介绍下python gui界面的三级联动效果,我们用工具eric6来实现,先看下效果图. 首先我们先创建项目linkage,再新建窗体进入到Qt设计师工具开始设计界面,完成后保存并退出. 在 ...

  3. 南京邮电大学java程序设计作业在线编程第三次作业

    王利国的"Java语言程序设计第3次作业(2018)"详细 作业结果详细 总分:100 选择题得分:60  1. 设有如下定义语句: String s1="My cat& ...

  4. 编码注释coding: utf-8

    # -*- coding: utf-8 -*- PY文件当中是不支持中文的,即使你输入的注释是中文也不行,为了解决这个问题,就需要把文件编码类型改为UTF-8的类型,输入这个代码就可以让PY源文件里面 ...

  5. Text-文本检查

    #检查文本 from tkinter import * import hashlib master=Tk() text = Text(master,width=30,height=5) text.pa ...

  6. Java - Spring MVC 实现跨域资源 CORS 请求

    拦截器设置响应头 这种方式原理就是利用拦截器在方法执行前,我们增加请求的响应头,用来支持跨域请求.这种方案是可行的,大部分都是采用这种方案.我当时也是打算采用这种方案,直到我发现原来 Spring 框 ...

  7. 初学servlet之使用web.xml配置

    先写两个servlet,之后展示web.xml配置 package app01c;import java.io.IOException;import java.io.PrintWriter;impor ...

  8. 小明搬家_NOI导刊2010提高(05)

    题目描述 小明要搬家了,大家都来帮忙. 小明现在住在第N楼,总共K个人要把X个大箱子搬上N楼. 最开始X个箱子都在1楼,但是经过一段混乱的搬运已经乱掉了.最后大家发现这样混乱地搬运过程效率太低了,于是 ...

  9. remove、erase

    remove: remove不是真正的删除,删除后数量并没有变化. 它接收一对迭代器,而不是一个容器,所以不知道它作用于哪个容器. 而且没有办法从一个迭代器获取对应于它的容器 实现 remove会用需 ...

  10. 【CODEVS 6384 大米兔学全排列】

    ·大米兔学习全排列,还有一些逆序对,还有一棵二叉索引树.· ·分析:       首先肯定不是像题目上说的那样,使用next_permutation去完成这道题,因为就算是线性的它也不能承受庞大的排列 ...