5、后台首页欢迎页面子视图

最新推荐文章于 2023-07-05 21:00:07 发布
最新推荐文章于 2023-07-05 21:00:07 发布
阅读量578 收藏
点赞数
原文链接：http://www.cnblogs.com/guduoer/p/6339483.html
版权

1、首页设置

(1)添加路由

Route::get('/admin/index','Admin\IndexController@index');
Route::get('admin/info','Admin\IndexController@info');

(2)在Admin新增INdexController.php

 1 <?php
 2 
 3 namespace App\Http\Controllers\Admin;
 4 
 5 use Illuminate\Http\Request;
 6 
 7 use App\Http\Requests;
 8 
 9 class IndexController extends CommonController
10 {
11     public function index()
12     {
13         return view('admin.index');
14     }
15 
16     public function info()
17     {
18         return view('admin.info');
19     }
20 }
View Code

继承之前增加的CommonController.php

(3)将 js 、css等文件引入

index.balde.php 、info.blade.php

<link rel="stylesheet" href="{{asset('resources/views/admin/style/css/ch-ui.admin.css')}}">

验证：

 原因：需要将index.blade.php中有关info页面的url修改

<iframe src="{{url('admin/info')}}" frameborder="0" width="100%" height="100%" name="main"></iframe>

刷新

 2、info页面信息更改

自动获取系统基本信息

(1)在LoginController.php 打印dd($_SERVER);

  

 1 <!--面包屑导航 开始-->
 2     <div class="crumb_warp">
 3         <!--<i class="fa fa-bell"></i> 欢迎使用登陆网站后台，建站的首选工具。-->
 4         <i class="fa fa-home"></i> <a href="{{url('admin/info')}}">首页</a> &raquo; 系统配置信息
 5     </div>
 6     <!--面包屑导航 结束-->
 7     
 8     <!--结果集标题与导航组件 开始-->
 9     <div class="result_wrap">
10         <div class="result_title">
11             <h3>快捷操作</h3>
12         </div>
13         <div class="result_content">
14             <div class="short_wrap">
15                 <a href="#"><i class="fa fa-plus"></i>新增文章</a>
16                 <a href="#"><i class="fa fa-recycle"></i>批量删除</a>
17                 <a href="#"><i class="fa fa-refresh"></i>更新排序</a>
18             </div>
19         </div>
20     </div>
21     <!--结果集标题与导航组件 结束-->
22 
23     
24     <div class="result_wrap">
25         <div class="result_title">
26             <h3>系统基本信息</h3>
27         </div>
28         <div class="result_content">
29             <ul>
30                 <li>
31                     <label>操作系统</label><span>{{PHP_OS}}</span>
32                 </li>
33                 <li>
34                     <label>运行环境</label><span>{{$_SERVER['SERVER_SOFTWARE']}}</span>
35                 </li>
36                 <li>
37                     <label>PHP运行方式</label><span>apache2handler</span>
38                 </li>
39                 <li>
40                     <label>版本</label><span>v-0.1</span>
41                 </li>
42                 <li>
43                     <label>上传附件限制</label><span><?php print get_cfg_var("upload_max_filesize") ?></span>
44                 </li>
45                 <li>
46                     <label>北京时间</label><span>{{date('Y年M月d日 H时m分s秒')}}</span>
47                 </li>
48                 <li>
49                     <label>服务器域名/IP</label><span>{{$_SERVER['SERVER_NAME']}}</span>
50                 </li>
51                 <li>
52                     <label>Host</label><span>{{$_SERVER['SERVER_ADDR']}}</span>
53                 </li>
54             </ul>
55         </div>
56     </div>
View Code

get_cfg_var从配置文件php.ini中读取数据

(2)注意时区 ，修改app\config\app.php    timezone="UTC",东八区为PRC

3、子视图引入

(1)创建layouts/admin.balde.php

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="utf-8">
 5     <link rel="stylesheet" href="{{asset('resources/views/admin/style/css/ch-ui.admin.css')}}">
 6     <link rel="stylesheet" href="{{asset('resources/views/admin/style/font/css/font-awesome.min.css')}}">
 7     <script type="text/javascript" src="{{asset('resources/views/admin/style/js/jquery.js')}}"></script>
 8     <script type="text/javascript" src="{{asset('resources/views/admin/style/js/ch-ui.admin.js')}}"></script>
 9 </head>
10 <body>
11 @yield('content')
12 </body>
13 </html>
View Code

(2)继承admin.blade.php,重写content内容

index.blade.php、info.blade.php

参考如下代码：

 1 @extends('layouts.admin')
 2 @section('content')
 3 <!--头部 开始-->
 4     <div class="top_box">
 5         <div class="top_left">
 6             <div class="logo">后台管理模板</div>
 7             <ul>
 8                 <li><a href="#" class="active">首页</a></li>
 9                 <li><a href="#">管理页</a></li>
10             </ul>
11         </div>
12         <div class="top_right">
13             <ul>
14                 <li>管理员：admin</li>
15                 <li><a href="pass.html" target="main">修改密码</a></li>
16                 <li><a href="#">退出</a></li>
17             </ul>
18         </div>
19     </div>
20     <!--头部 结束-->
21 
22     <!--左侧导航 开始-->
23     <div class="menu_box">
24         <ul>
25             <li>
26                 <h3><i class="fa fa-fw fa-clipboard"></i>常用操作</h3>
27                 <ul class="sub_menu">
28                     <li><a href="add.html" target="main"><i class="fa fa-fw fa-plus-square"></i>添加页</a></li>
29                     <li><a href="list.html" target="main"><i class="fa fa-fw fa-list-ul"></i>列表页</a></li>
30                     <li><a href="tab.html" target="main"><i class="fa fa-fw fa-list-alt"></i>tab页</a></li>
31                     <li><a href="img.html" target="main"><i class="fa fa-fw fa-image"></i>图片列表</a></li>
32                 </ul>
33             </li>
34             <li>
35                 <h3><i class="fa fa-fw fa-cog"></i>系统设置</h3>
36                 <ul class="sub_menu">
37                     <li><a href="#" target="main"><i class="fa fa-fw fa-cubes"></i>网站配置</a></li>
38                     <li><a href="#" target="main"><i class="fa fa-fw fa-database"></i>备份还原</a></li>
39                 </ul>
40             </li>
41             <li>
42                 <h3><i class="fa fa-fw fa-thumb-tack"></i>工具导航</h3>
43                 <ul class="sub_menu">
44                     <li><a href="http://www.yeahzan.com/fa/facss.html" target="main"><i class="fa fa-fw fa-font"></i>图标调用</a></li>
45                     <li><a href="http://hemin.cn/jq/cheatsheet.html" target="main"><i class="fa fa-fw fa-chain"></i>Jquery手册</a></li>
46                     <li><a href="http://tool.c7sky.com/webcolor/" target="main"><i class="fa fa-fw fa-tachometer"></i>配色板</a></li>
47                     <li><a href="element.html" target="main"><i class="fa fa-fw fa-tags"></i>其他组件</a></li>
48                 </ul>
49             </li>
50         </ul>
51     </div>
52     <!--左侧导航 结束-->
53 
54     <!--主体部分 开始-->
55     <div class="main_box">
56         <iframe src="{{url('admin/info')}}" frameborder="0" width="100%" height="100%" name="main"></iframe> 
57     </div>
58     <!--主体部分 结束-->
59 
60     <!--底部 开始-->
61     <div class="bottom_box">
62         CopyRight © 2015. Powered By <a href="http://www.houdunwang.com">http://www.houdunwang.com</a>.
63     </div>
64     <!--底部 结束-->
65 @endsection
View Code

4、修改LoginController.php

修改login方法，当密码、验证码正确时候，跳转到index.blade.php

return redirect('admin/index');

 

 

 

 

 

 

转载于:https://www.cnblogs.com/guduoer/p/6339483.html

weixin_30520015
关注
EF-后台登陆+Index页面欢迎+增删改查
YangGao_的博客
10-16 1548
1.设计数据库 CREATE TABLE [dbo].[AdminUser]( [Id] [int] IDENTITY(1,1) NOT NULL, [Name] [varchar](50) NULL, [Password] [varchar](36) NULL, [Email] [varchar](200) NULL ) 2.创建MVC框架 3.创建实体类 先使用NuGet包添...
管理后台html页面
07-31
漂亮使用的二级菜单目录，网页代码简单易懂，欢迎下载。
【动画设计的vue后台管理欢迎页】
weixin_49612237的博客
07-13 2191
关于动画设计
绝对经典后台模板,欢迎下载
05-13
最棒的HTML后台模板，最棒的HTML后台模板最棒的HTML后台模板最棒的HTML后台模板最棒的HTML后台模板最棒的HTML后台模板最棒的HTML后台模板最棒的HTML后台模板
26后台界面很好看的页面
04-27
26后台界面很好看的页面，各种H5页面，非常经典，本人也是网上找的，共享
UIScrollView打造轮播，欢迎页效果
12-12
在iOS开发中，创建轮播效果，通常用于展示欢迎页或者广告页面，这种效果能够吸引用户的注意力并提供良好的用户体验。`UIScrollView`是苹果提供的一个强大的视图类，它允许用户在内容超过视图边界时滚动浏览。在这个...
欢迎页动画
01-09
这个特定的项目名为"LauncherView"，暗示我们正在处理一种自定义的启动器视图，用于实现个性化的欢迎页效果。 在Android系统启动时，用户首先看到的是launcher（启动器），也就是桌面，它允许用户访问应用、设置等...
android studio倒计时三秒欢迎页面
12-19
在这个项目中，开发者可能使用了Android Studio的布局编辑器来设计欢迎页面的UI，包括倒计时按钮和相关的文本视图来显示倒计时。 倒计时功能通常通过两种方式实现：Handler和CountDownTimer。在这个Demo中，可能...
Android每隔一段时间就显示欢迎页
12-15
在一个APP的从启动到和用户交互，一般只会见到一次启动页，当App在后台，且内存不足的情况下，application被销毁，再次切到app的时候会再出现一次启动页。So，如果想过一段时间就显示启动页，该怎么办呢？ 之前想了...
android 欢迎页圆形进度条倒计时功能
03-21
欢迎页通常包含品牌介绍、新特性展示或加载过程，而圆形进度条倒计时功能则是其中一种常见且实用的设计元素。它不仅可以向用户展示应用程序正在准备启动，还可以通过倒计时营造出一种期待感。下面将详细讲解如何实现...
精美好看的后台管理html页面
12-17
精美好看的后台管理html页面
整个欢迎页面出来了
08-10
NULL 博文链接：https://shuizhongyue.iteye.com/blog/2206067
网站后台界面HTML
06-01
10多个漂亮的后台界面，10多个漂亮的后台界面，10多个漂亮的后台界面，10多个漂亮的后台界面，10多个漂亮的后台界面，10多个漂亮的后台界面，10多个漂亮的后台界面，10多个漂亮的后台界面，10多个漂亮的后台界面，10多个漂亮的后台界面，10多个漂亮的后台界面，10多个漂亮的后台界面，10多个漂亮的后台界面，10多个漂亮的后台界面，
公司后台OA系统网站模板
09-29
欢迎下载，公司后台OA系统网站模板，公司后台OA系统网站模板
web-前端之后台管理系统模板首页
热门推荐
h_Snow_1的博客
09-26 1万+
这个是自己参照模板写出来的后台管理系统模板，只是一个前端框架 其中包含很多个界面，后面会陆续发出来，请往下看。。。。。。![这是首页的制作](http://img.blog.csdn.net/20170926155053121?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvaF9Tbm93XzE=/font/5a6L5L2T/fontsize/400/f
欢迎页，引导页和主页
weixin_34221036的博客
01-15 241
配置<application android:name="com.shipping.application.ShippingApplication" android:allowBackup="true" android:icon="@drawable/ic_launcher" android:label="...
使用PHP创建一个简单的后台首页
最新发布
qq_72098733的博客
07-05 651
在这个示例中，我们使用PHP嵌入HTML代码，这允许我们在页面中执行服务器端的逻辑代码。您可以在PHP代码块中添加自己的后台逻辑代码，例如数据库查询、文件操作等。在这个示例中，我们根据需要分别添加了首页菜单、栏目菜单、内容菜单、广告菜单和消息提示模板的相关代码。在 JavaScript 代码中，我们首先获取到消息模板的 DOM 元素（使用。函数设置一个定时器，定时器在指定的时间后执行回调函数，将消息模板的显示样式设置为。在这个示例中，我们显示了一个简单的欢迎信息，并利用。在这个示例中，我们通过添加一个。
HTML实现网站欢迎页过渡
yushun的博客
01-09 1942
HTML实现网站欢迎页过渡
为您的WordPress产品构建欢迎页面：代码第2部分
代码教主
06-12 313
在本系列的上一篇文章中，我开始为WordPress插件构建欢迎页面。 我讨论了插件架构及其功能。 然后，我为其基本文件和初始化程序文件编写了代码，在其中添加了代码块，这些代码块用于基于插件激活和停用来添加和删除瞬态。 在最后一篇文章中，我将讨论其余的插件文件以及该插件的实际实现。 在本文结尾处，您将敏锐地意识到为WordPress插件编写第一个欢迎页面的过程。 欢迎页面重定向的逻辑 w...
用vue生成后台首页欢迎页面
05-02
可以按照以下步骤使用 Vue.js 生成后台首页欢迎页面： 1. 安装 Vue CLI 如果你还没有安装 Vue CLI，可以在命令行中运行以下命令进行安装： ``` npm install -g @vue/cli ``` 2. 创建项目 使用 Vue CLI 创建一个新项目，可以在命令行中运行以下命令： ``` vue create my-project ``` 其中 `my-project` 是项目名称，你可以根据需要自定义。 3. 安装 Element UI Element UI 是一个基于 Vue.js 的 UI 库，可以用于快速构建后台管理页面。可以在命令行中运行以下命令进行安装： ``` npm install element-ui ``` 4. 创建欢迎页面 在 `src/views` 目录下创建一个名为 `Welcome.vue` 的文件，并添加以下代码： ```html <template> <div> <h1>欢迎使用后台管理系统</h1> <p>{{ message }}</p> </div> </template> <script> export default { data() { return { message: '这是一个基于 Vue.js 和 Element UI 的后台管理系统', }; }, }; </script> ``` 该组件将显示一个标题和一条简短的欢迎消息。 5. 创建路由 在 `src/router/index.js` 文件中添加以下代码： ```javascript import Vue from 'vue'; import Router from 'vue-router'; import Welcome from '@/views/Welcome.vue'; Vue.use(Router); export default new Router({ routes: [ { path: '/', name: 'Welcome', component: Welcome, }, ], }); ``` 该代码将创建一个名为 `Welcome` 的路由，指向刚才创建的 `Welcome` 组件。 6. 添加导航菜单 在 `src/App.vue` 文件中添加以下代码： ```html <template> <div> <el-menu mode="horizontal"> <el-menu-item index="/">欢迎页面</el-menu-item> <!-- 其他菜单项 --> </el-menu> <router-view></router-view> </div> </template> <script> export default { name: 'App', }; </script> ``` 该代码将创建一个水平导航菜单，并将 `router-view` 放在菜单下方。菜单项将使用路由链接到相应的页面。 7. 运行应用程序 现在可以运行应用程序以查看欢迎页面。可以在命令行中运行以下命令： ``` npm run serve ``` 该命令将启动开发服务器，并在浏览器中打开应用程序。现在应该可以看到一个简单的欢迎页面，其中包含一个标题和一条消息。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值