laravel8.5与layuiadmin整合(3)

12. 设置上面的对应路由及方法
/routes/web.php 添加
// 后台布局

Route::group(['prefix' => 'admin'], function() {

    ....

    // layuiadmin原模板模块 - 控制台
    Route::get('/index',[App\Http\Controllers\Admin\IndexController::class, 'index'])->name('admin.index');

    // layuiadmin原模板模块 - 主页一
    Route::get('/index1',[App\Http\Controllers\Admin\IndexController::class, 'index1'])->name('admin.index1');

    // layuiadmin原模板模块 - 主页二
    Route::get('/index2',[App\Http\Controllers\Admin\IndexController::class, 'index2'])->name('admin.index2');

});

/app/Http/Controllers/Admin/IndexController.php 添加

   .....
    public function index() {
        return view('admin.index.index');
    }

    public function index1() {
        return view('admin.index.index1');
    }

    public function index2() {
        return view('admin.index.index2');
    }

13. 建立上面对应的三个模板在目录resources/views/admin分别建立
index.blade.php , index1.blade.php ,index2.blade.php
对应layuiadmin中的文件分别是目录 /layuiAdmin/admin/std/dist/views/home
里的三个文件 console.html,homepage1.html,homepage2.html
这里使用 index.blade.php

@extends('admin.base')

@section('content')
<div class="layui-row layui-col-space15">

    <div class="layui-col-md8">

        <div class="layui-row layui-col-space15">

            <div class="layui-col-md6">

                <div class="layui-card">

                    <div class="layui-card-header">快捷方式</div>

                    <div class="layui-card-body">



                        <div class="layui-carousel layadmin-carousel layadmin-shortcut">

                            <div carousel-item>

                                <ul class="layui-row layui-col-space10">

                                    <li class="layui-col-xs3">

                                        <a lay-href="home/homepage1.html">

                                            <i class="layui-icon layui-icon-console"></i>

                                            <cite>主页一</cite>

                                        </a>

                                    </li>

                                    <li class="layui-col-xs3">

                                        <a lay-href="home/homepage2.html">

                                            <i class="layui-icon layui-icon-chart"></i>

                                            <cite>主页二</cite>

                                        </a>

                                    </li>

                                    <li class="layui-col-xs3">

                                        <a lay-href="component/layer/list.html">

                                            <i class="layui-icon layui-icon-template-1"></i>

                                            <cite>弹层</cite>

                                        </a>

                                    </li>

                                    <li class="layui-col-xs3">

                                        <a layadmin-event="im">

                                            <i class="layui-icon layui-icon-chat"></i>

                                            <cite>聊天</cite>

                                        </a>

                                    </li>

                                    <li class="layui-col-xs3">

                                        <a lay-href="component/progress/index.html">

                                            <i class="layui-icon layui-icon-find-fill"></i>

                                            <cite>进度条</cite>

                                        </a>

                                    </li>

                                    <li class="layui-col-xs3">

                                        <a lay-href="app/workorder/list.html">

                                            <i class="layui-icon layui-icon-survey"></i>

                                            <cite>工单</cite>

                                        </a>

                                    </li>

                                    <li class="layui-col-xs3">

                                        <a lay-href="user/user/list.html">

                                            <i class="layui-icon layui-icon-user"></i>

                                            <cite>用户</cite>

                                        </a>

                                    </li>

                                    <li class="layui-col-xs3">

                                        <a lay-href="set/system/website.html">

                                            <i class="layui-icon layui-icon-set"></i>

                                            <cite>设置</cite>

                                        </a>

                                    </li>

                                </ul>

                                <ul class="layui-row layui-col-space10">

                                    <li class="layui-col-xs3">

                                        <a lay-href="set/user/info.html">

                                            <i class="layui-icon layui-icon-set"></i>

                                            <cite>我的资料</cite>

                                        </a>

                                    </li>

                                    <li class="layui-col-xs3">

                                        <a lay-href="set/user/info.html">

                                            <i class="layui-icon layui-icon-set"></i>

                                            <cite>我的资料</cite>

                                        </a>

                                    </li>

                                    <li class="layui-col-xs3">

                                        <a lay-href="set/user/info.html">

                                            <i class="layui-icon layui-icon-set"></i>

                                            <cite>我的资料</cite>

                                        </a>

                                    </li>

                                    <li class="layui-col-xs3">

                                        <a lay-href="set/user/info.html">

                                            <i class="layui-icon layui-icon-set"></i>

                                            <cite>我的资料</cite>

                                        </a>

                                    </li>

                                    <li class="layui-col-xs3">

                                        <a lay-href="set/user/info.html">

                                            <i class="layui-icon layui-icon-set"></i>

                                            <cite>我的资料</cite>

                                        </a>

                                    </li>

                                    <li class="layui-col-xs3">

                                        <a lay-href="set/user/info.html">

                                            <i class="layui-icon layui-icon-set"></i>

                                            <cite>我的资料</cite>

                                        </a>

                                    </li>

                                    <li class="layui-col-xs3">

                                        <a lay-href="set/user/info.html">

                                            <i class="layui-icon layui-icon-set"></i>

                                            <cite>我的资料</cite>

                                        </a>

                                    </li>

                                    <li class="layui-col-xs3">

                                        <a lay-href="set/user/info.html">

                                            <i class="layui-icon layui-icon-set"></i>

                                            <cite>我的资料</cite>

                                        </a>

                                    </li>

                                </ul>



                            </div>

                        </div>



                    </div>

                </div>

            </div>

            <div class="layui-col-md6">

                <div class="layui-card">

                    <div class="layui-card-header">待办事项</div>

                    <div class="layui-card-body">



                        <div class="layui-carousel layadmin-carousel layadmin-backlog">

                            <div carousel-item>

                                <ul class="layui-row layui-col-space10">

                                    <li class="layui-col-xs6">

                                        <a lay-href="app/content/comment.html" class="layadmin-backlog-body">

                                            <h3>待审评论</h3>

                                            <p><cite>66</cite></p>

                                        </a>

                                    </li>

                                    <li class="layui-col-xs6">

                                        <a lay-href="app/forum/list.html" class="layadmin-backlog-body">

                                            <h3>待审帖子</h3>

                                            <p><cite>12</cite></p>

                                        </a>

                                    </li>

                                    <li class="layui-col-xs6">

                                        <a lay-href="template/goodslist.html" class="layadmin-backlog-body">

                                            <h3>待审商品</h3>

                                            <p><cite>99</cite></p>

                                        </a>

                                    </li>

                                    <li class="layui-col-xs6">

                                        <a href="javascript:;" onclick="layer.tips('不跳转', this, {tips: 3});" class="layadmin-backlog-body">

                                            <h3>待发货</h3>

                                            <p><cite>20</cite></p>

                                        </a>

                                    </li>

                                </ul>

                                <ul class="layui-row layui-col-space10">

                                    <li class="layui-col-xs6">

                                        <a href="javascript:;" class="layadmin-backlog-body">

                                            <h3>待审友情链接</h3>

                                            <p><cite style="color: #FF5722;">5</cite></p>

                                        </a>

                                    </li>

                                </ul>

                            </div>

                        </div>

                    </div>

                </div>

            </div>

            <div class="layui-col-md12">

                <div class="layui-card">

                    <div class="layui-card-header">数据概览</div>

                    <div class="layui-card-body">



                        <div class="layui-carousel layadmin-carousel layadmin-dataview" data-anim="fade" lay-filter="LAY-index-dataview">

                            <div carousel-item id="LAY-index-dataview">

                                <div><i class="layui-icon layui-icon-loading1 layadmin-loading"></i></div>

                                <div></div>

                                <div></div>

                            </div>

                        </div>



                    </div>

                </div>

                <div class="layui-card">

                    <div class="layui-tab layui-tab-brief layadmin-latestData">

                        <ul class="layui-tab-title">

                            <li class="layui-this">今日热搜</li>

                            <li>今日热帖</li>

                        </ul>

                        <div class="layui-tab-content">

                            <div class="layui-tab-item layui-show">

                                <table id="LAY-index-topSearch"></table>

                            </div>

                            <div class="layui-tab-item">

                                <table id="LAY-index-topCard"></table>

                            </div>

                        </div>

                    </div>

                </div>

            </div>

        </div>

    </div>



    <div class="layui-col-md4">

        <div class="layui-card">

            <div class="layui-card-header">版本信息</div>

            <div class="layui-card-body layui-text">

                <table class="layui-table">

                    <colgroup>

                        <col width="100">

                        <col>

                    </colgroup>

                    <tbody>

                    <tr>

                        <td>当前版本</td>

                        <td>

                            <script type="text/html" template>

                                v1.0.0

                                <a href="http://fly.layui.com/docs/3/" target="_blank" style="padding-left: 15px;">更新日志</a>

                            </script>

                        </td>

                    </tr>

                    <tr>

                        <td>基于框架</td>

                        <td>

                            <script type="text/html" template>

                                layui-v2.3.0

                            </script>

                        </td>

                    </tr>

                    <tr>

                        <td>主要特色</td>

                        <td>零门槛 / 响应式 / 清爽 / 极简</td>

                    </tr>

                    <tr>

                        <td>获取渠道</td>

                        <td style="padding-bottom: 0;">

                            <div class="layui-btn-container">

                                <a href="http://www.layui.com/admin/" target="_blank" class="layui-btn layui-btn-danger">获取授权</a>

                                <a href="http://fly.layui.com/download/layuiAdmin/" target="_blank" class="layui-btn">立即下载</a>

                            </div>

                        </td>

                    </tr>

                    </tbody>

                </table>

            </div>

        </div>



        <div class="layui-card">

            <div class="layui-card-header">效果报告</div>

            <div class="layui-card-body layadmin-takerates">

                <div class="layui-progress" lay-showPercent="yes">

                    <h3>转化率(日同比 28% <span class="layui-edge layui-edge-top" lay-tips="增长" lay-offset="-15"></span>)</h3>

                    <div class="layui-progress-bar" lay-percent="65%"></div>

                </div>

                <div class="layui-progress" lay-showPercent="yes">

                    <h3>签到率(日同比 11% <span class="layui-edge layui-edge-bottom" lay-tips="下降" lay-offset="-15"></span>)</h3>

                    <div class="layui-progress-bar" lay-percent="32%"></div>

                </div>

            </div>

        </div>



        <div class="layui-card">

            <div class="layui-card-header">实时监控</div>

            <div class="layui-card-body layadmin-takerates">

                <div class="layui-progress" lay-showPercent="yes">

                    <h3>CPU使用率</h3>

                    <div class="layui-progress-bar" lay-percent="58%"></div>

                </div>

                <div class="layui-progress" lay-showPercent="yes">

                    <h3>内存占用率</h3>

                    <div class="layui-progress-bar layui-bg-red" lay-percent="90%"></div>

                </div>

            </div>

        </div>



        <div class="layui-card">

            <div class="layui-card-header">产品动态</div>

            <div class="layui-card-body">

                <div class="layui-carousel layadmin-carousel layadmin-news" data-autoplay="true" data-anim="fade" lay-filter="news">

                    <div carousel-item>

                        <div><a href="http://fly.layui.com/docs/2/" target="_blank" class="layui-bg-red">layuiAdmin 快速上手文档</a></div>

                        <div><a href="http://fly.layui.com/vipclub/list/layuiadmin/" target="_blank" class="layui-bg-green">layuiAdmin 会员讨论专区</a></div>

                        <div><a href="http://www.layui.com/admin/#get" target="_blank" class="layui-bg-blue">获得 layui 官方后台模板系统</a></div>

                    </div>

                </div>

            </div>

        </div>



        <div class="layui-card">

            <div class="layui-card-header">

                作者心语

                <i class="layui-icon layui-icon-tips" lay-tips="要支持的噢" lay-offset="5"></i>

            </div>

            <div class="layui-card-body layui-text layadmin-text">

                <p>一直以来,layui 秉承无偿开源的初心,虔诚致力于服务各层次前后端 Web 开发者,在商业横飞的当今时代,这一信念从未动摇。即便身单力薄,仍然重拾决心,埋头造轮,以尽可能地填补产品本身的缺口。</p>

                <p>在过去的一段的时间,我一直在寻求持久之道,已维持你眼前所见的一切。而 layuiAdmin 是我们尝试解决的手段之一。我相信真正有爱于 layui 生态的你,定然不会错过这一拥抱吧。</p>

                <p>子曰:君子不用防,小人防不住。请务必通过官网正规渠道,获得 <a href="http://www.layui.com/admin/" target="_blank">layuiAdmin</a>!</p>

                <p>—— 贤心(<a href="http://www.layui.com/" target="_blank">layui.com</a>)</p>

            </div>

        </div>

    </div>

</div>
@endsection

@section('script')
<script>
    layui.use(['index', 'console']);
</script>
@endsection

14. 建立以上需要的模板文件 resources/views/admin/base.blade.php

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <link rel="stylesheet" href="/static/admin/layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/static/admin/layuiadmin/style/admin.css" media="all">
</head>
<body>
<div class="layui-fluid">
    @yield('content')
</div>

<script src="/js/jquery.min.js"></script>
<script src="/static/admin/layuiadmin/layui/layui.js"></script>
<script>
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });
    layui.config({
        base: '/static/admin/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['element','form','layer','table','upload','laydate'],function () {
        var element = layui.element;
        var layer = layui.layer;
        var form = layui.form;
        var table = layui.table;
        var upload = layui.upload;
        var laydate = layui.laydate;

        //错误提示
    @if(count($errors)>0)
    @foreach($errors->all() as $error)
        layer.msg("{{$error}}",{icon:5});
    @break
    @endforeach
    @endif

    //信息提示
    @if(session('status'))
        layer.msg("{{session('status')}}",{icon:6});
    @endif

    });


</script>
@yield('script')
</body>
</html>

此时浏览 /admin 即可以操作左侧主页下的 控制台, 主页一, 主页二查看实时效果了

原文地址:https://www.cnblogs.com/lin3615/p/15802912.html