任务24：简单的模板继承

1，模板继承，在 \resources\Layout 下新建 main.blade.php   并复制 \resources\Index\index.blade.php 上的内容到 main.blade.php 再编辑成

  1 <!DOCTYPE html>
  2 <html><head>
  3     <meta charset="utf-8">
  4     <title>laravel.pensvie.top</title>
  5 
  6     <meta name="description" content="Dashboard">
  7     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  9     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 10     <!--Basic Styles-->
 11     <link href="{{asset('static')}}/admin/style/bootstrap.css" rel="stylesheet">
 12     <link href="{{asset('static')}}/admin/style/font-awesome.css" rel="stylesheet">
 13     <link href="{{asset('static')}}/admin/style/weather-icons.css" rel="stylesheet">
 14 
 15     <!--Beyond styles-->
 16     <link id="beyond-link" href="{{asset('static')}}/admin/style/beyond.css" rel="stylesheet" type="text/css">
 17     <link href="{{asset('static')}}/admin/style/demo.css" rel="stylesheet">
 18     <link href="{{asset('static')}}/admin/style/typicons.css" rel="stylesheet">
 19     <link href="{{asset('static')}}/admin/style/animate.css" rel="stylesheet">
 20     @yield('css')
 21 
 22 </head>
 23 <body>
 24 <!-- 头部 -->
 25 <div class="navbar">
 26     <div class="navbar-inner">
 27         <div class="navbar-container">
 28             <!-- Navbar Barnd -->
 29             <div class="navbar-header pull-left">
 30                 <a href="#" class="navbar-brand">Laravel6实战博客</a>
 31             </div>
 32             <!-- /Navbar Barnd -->
 33             <!-- Sidebar Collapse -->
 34             <div class="sidebar-collapse" id="sidebar-collapse">
 35                 <i class="collapse-icon fa fa-bars"></i>
 36             </div>
 37             <!-- /Sidebar Collapse -->
 38             <!-- Account Area and Settings -->
 39             <div class="navbar-header pull-right">
 40                 <div class="navbar-account">
 41                     <ul class="account-area">
 42                         <li>
 43                             <a class="login-area dropdown-toggle" data-toggle="dropdown">
 44                                 <div class="avatar" title="View your public profile">
 45                                     <img src="{{asset('static')}}/admin/images/adam-jansen.jpg">
 46                                 </div>
 47                                 <section>
 48                                     <h2><span class="profile"><span>admin</span></span></h2>
 49                                 </section>
 50                             </a>
 51                             <!--Login Area Dropdown-->
 52                             <ul class="pull-right dropdown-menu dropdown-arrow dropdown-login-area">
 53                                 <li class="username"><a>David Stevenson</a></li>
 54                                 <li class="dropdown-footer">
 55                                     <a href="{{route('admin.index.logout')}}">
 56                                         退出登录
 57                                     </a>
 58                                 </li>
 59                                 <li class="dropdown-footer">
 60                                     <a href="/admin/user/changePwd.html">
 61                                         修改密码
 62                                     </a>
 63                                 </li>
 64                             </ul>
 65                             <!--/Login Area Dropdown-->
 66                         </li>
 67                         <!-- /Account Area -->
 68                         <!--Note: notice that setting div must start right after account area list.
 69                             no space must be between these elements-->
 70                         <!-- Settings -->
 71                     </ul>
 72                 </div>
 73             </div>
 74             <!-- /Account Area and Settings -->
 75         </div>
 76     </div>
 77 </div>
 78 
 79 <!-- /头部 -->
 80 
 81 <div class="main-container container-fluid">
 82     <div class="page-container">
 83         <!-- Page Sidebar -->
 84         <div class="page-sidebar" id="sidebar">
 85             <!-- Page Sidebar Header-->
 86             <div class="sidebar-header-wrapper">
 87                 <input class="searchinput" type="text">
 88                 <i class="searchicon fa fa-search"></i>
 89                 <div class="searchhelper">Search Reports, Charts, Emails or Notifications</div>
 90             </div>
 91             <!-- /Page Sidebar Header -->
 92             <!-- Sidebar Menu -->
 93             <ul class="nav sidebar-menu">
 94                 <!--Dashboard-->
 95 
 96 
 97 
 98                 <li>
 99                     <a href="#" class="menu-dropdown">
100                         <i class="menu-icon fa fa-gear"></i>
101 
102                         <span class="menu-text">管理员管理</span>
103 
104                         <i class="menu-expand"></i>
105                     </a>
106                     <ul class="submenu">
107                         <li>
108                             <a href="/admin/user/index.html">
109                                     <span class="menu-text">
110                                         用户管理                                    </span>
111                                 <i class="menu-expand"></i>
112                             </a>
113                         </li>
114                         <li>
115                             <a href="/admin/auth_group/index.html">
116                                     <span class="menu-text">
117                                         角色管理                                    </span>
118                                 <i class="menu-expand"></i>
119                             </a>
120                         </li>
121                         <li>
122                             <a href="/admin/auth_rule/index.html">
123                                     <span class="menu-text">
124                                         权限列表                                    </span>
125                                 <i class="menu-expand"></i>
126                             </a>
127                         </li>
128 
129                     </ul>
130                 </li>
131 
132             </ul>
133             <!-- /Sidebar Menu -->
134         </div>
135         <!-- /Page Sidebar -->
136         <!-- Page Content -->
137         <div class="page-content">
138             <!-- Page Breadcrumb -->
139             <div class="page-breadcrumbs">
140                 <ul class="breadcrumb">
141                     <li class="active">控制面板</li>
142                 </ul>
143             </div>
144             <!-- /Page Breadcrumb -->
145 
146             <!-- Page Body -->
147             <div class="page-body">
148                 @yield('content')
149             </div>
150             <!-- /Page Body -->
151         </div>
152         <!-- /Page Content -->
153     </div>
154 </div>
155 
156 <!--Basic Scripts-->
157 <script src="{{asset('static')}}/admin/style/jquery_002.js"></script>
158 <script src="{{asset('static')}}/admin/style/bootstrap.js"></script>
159 <script src="{{asset('static')}}/admin/style/jquery.js"></script>
160 <!--Beyond Scripts-->
161 <script src="{{asset('static')}}/admin/style/beyond.js"></script>
162 @yield('js')
163 </body>
164 </html>
View Code

注：复制过来后 main.blade.php 主要是编辑了以下四个地方

第4个地方是 ，删除了暂时用不到的一些栏目，只留下最后那个【系统】 改成【管理员管理】

 

2，做好第1个步骤后，编辑 \resources\Index\index.blade.php 整个 php 只有如下代码

@extends('Admin.Layout.main')
@section('content')
    @include("Admin.Layout.msg")
    <div style="text-align:center; line-height:1000%; font-size:24px;">
        <a href="https://www.cnblogs.com/pensive/" target="_blank">Laravel6实战开发个人博客</a>
        <br />
        <p style="color:#f00;">laravel.pensive.top</p>
    </div>
@endsection

END

posted @ 2020-05-16 09:34  pensive2019  阅读(212)  评论(0)    收藏  举报