菜鸟的蜕变：教你一步一步创建基于laravel5的简易论坛系统(2)
我们先来创建一下个人主页，尝试 Laravel 的路由和 PHP 的命名空间。
1、路由：
Laravel 中的路由，跟其他 PHP 框架一样，作用是把各种请求分流到各个控制器。
在 `luntan/app/Http/routes.php`中添加以下代码：
<?php Route::get('/','Home\HomeController@index'); ?>
这表示创建了一个路由。
1. 我们在访问网站主页www.bbs.com时，将访问home文件夹下home控制器下的index方法。
2. 如果你用过 Laravel 4，会发现 Laravel 5 的命名空间规划比较怪异，这其实是一个非常大的进步。Laravel 4 其实已经全面引入了命名空间这个强大的特性，但是为了“降低学习成本”，把 路由、控制器、模型 的默认命名空间全部设置成了顶级命名空间，这个举动反而让很多人比较轻易地“上手”了 Laravel，但是在用了一段时间以后，还需要翻越一堵高墙，那就是命名空间， 而且有了前面的“容易上手”的印象作为铺垫，后期的学习会更加困难。Laravel 5 把命名空间全部隔开，控制器在 `\App\Http\Controllers`，模型在 `\App`，让我们在刚上手的时候就体验命名空间分离的感觉，总体上其实是会降低学习成本的。
2. 控制器
我们可以使用 Artisan 非常方便地构建控制器：
php artisan make:controller Home/HomeController
得到 `learnlaravel5/app/Http/Controllers/Home/HomeController.php` 文件。
在 `class HomeController extends Controller {` 上面增加如下内容：
use App\Article;
use App\User;
use App\Category;
use DB;
修改 index() 的代码如下：
public function index($id='') { $Category = Category::all(); $c = DB::table('categories')->select('id')->get(); $arr = array(); foreach ($c as $key => $value) { $arr[] = $value->id; } if(!in_array($id,$arr)){ $index = DB::table('messages as m') ->leftJoin('users as u','m.user_id','=','u.id') ->leftJoin('categories as c','m.category','=','c.id') ->select('m.*','u.face','c.name','c.color','c.id as cid') ->orderBy('m.created_at','desc') ->paginate(30); }else{ //指定了分类 $index = DB::table('messages as m') ->leftJoin('users as u','m.user_id','=','u.id') ->leftJoin('categories as c','m.category','=','c.id') ->select('m.*','u.face','c.name','c.color','c.id as cid') ->where('m.category','=',$id) ->orderBy('m.created_at','desc') ->paginate(30); } $data = [ 'index' => $index, 'category' => $Category ]; return view('home.index',$data); // return view('home.index',['index' => $index,'category' => $Category]); }
控制器中文文档：http://laravel-china.org/docs/5.0/controllers
控制器中涉及到了许多的命名空间知识，可以参考 PHP 命名空间 解惑。
3. 视图
新建 `luntan/resources/views/index.blade.php`：
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="微客">
<title>微客</title>
<link href="{{ asset('/Index/css/pure-0.5.0-min.css') }}" rel="stylesheet">
<!--[if lte IE 8]>
<link rel="stylesheet" href="{{ asset('/Index/css/layouts/side-menu-old-ie.css') }}">
<![endif]-->
<!--[if gt IE 8]><!-->
<link rel="stylesheet" href="{{ asset('/Index/css/layouts/side-menu.css') }}">
<!--<![endif]-->
<link href="{{ asset('/Index/css/main.css') }}" rel="stylesheet">
<link rel="stylesheet" href="{{ asset('/Index/css/animate.css') }}">
<!-- <link rel="stylesheet" href="Pure_files/pure.css">
<link rel="stylesheet" href="Pure_files/main.css"> -->
</head>
<body>
<div id="layout">
<!-- Menu toggle -->
<a href="#menu" id="menuLink" class="menu-link">
<span></span>
</a>
<div id="menu">
<!-- <div id="menu" class="rotateInDownLeft animated"> -->
<div class="pure-menu pure-menu-open">
<a class="pure-menu-heading" href="/">WeiKe</a>
<ul>
<!-- menu-item-divided pure-menu-selected -->
<li>
<a href="{{ url('/user/message') }}">发布消息</a>
</li>
<li>
<a href="{{ url('/user/me') }}">帖子动态</a>
</li>
<li>
<a href="{{ url('/user/settings') }}">个人设置</a>
</li>
<li>
<a href="{{ url('/Profile')}}/{{Auth::id()}}">我的主页</a>
</li>
@if (Auth::guest())
@else
<li>
<a href="{{ url('/auth/logout') }}">退出登录</a>
</li>
@endif
<li class="menu-item-divided ">
<a href="{{ url('/feedback') }}">应用建议</a>
</li>
</ul>
</div>
</div>
</div>
<div id="main">
<!--版式-->
<link rel="stylesheet" href="{{ asset('Index/css/img-list.css') }}">
<div class="header">
<h1 class="fadeInDown animated">weike</h1>
<h2 class="flipInX animated">Nothing is impossible!</h2>
<p>
@if (Auth::guest())
<a href="{{ url('/auth/register') }}" class="pure-button pure-button-primary">注册</a>
<a href="{{ url('/auth/login') }}" class="pure-button">登录</a>
@endif
</p>
</div>
<div class="content">
<div>
<style scoped>
.button-success,
.button-error,
.button-warning,
.button-secondary {
color: white;
border-radius: 4px;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}
.button-success {
background: rgb(28, 184, 65); /* this is a green */
}
.button-error {
background: rgb(202, 60, 60); /* this is a maroon */
}
.button-warning {
background: rgb(223, 117, 20); /* this is an orange */
}
.button-secondary {
background: rgb(66, 184, 221); /* this is a light blue */
}
.button-xsmall {
font-size: 70%;
}
.button-small {
font-size: 85%;
}
.button-large {
font-size: 110%;
}
.button-xlarge {
font-size: 125%;
}
</style>
<a href="{{asset('/')}}" class="button-xsmall button-success pure-button">全部</a>
@foreach ($category as $c)
<a href="{{asset('/')}}{{$c->id}}" class="button-xsmall button-error pure-button" style="background: rgb({{ $c->color }});">{{ $c->name }}</a>
@endforeach
</div>
<style type="text/css">
#tp{
display: block;
float: left;
margin-top: 5px;
margin-right: 4px;
height: 12px;
width: 12px;
opacity: 0.8;
border-radius: 6px;
}
#k{
float: right;
}
</style>
<span><a href=""></a></span>
@foreach ($index as $message)
<div class="posts">
<!-- A single blog post -->
<section class="post">
<header class="post-header">
<h2 class="post-title"><a style="color:#888;font-size:18px;" href="{{URL('message_info')}}/{{$message->id}}" title="全部内容">{{$message->title}}</a><a style="border:1px solid #FFF;" href="{{URL('/Profile/')}}/{{$message->user_id}}"><img width="48" height="48" src="{{'/'}}{{$message->face}}" alt="" class="post-avatar "></a></h2>
<!-- <p class="post-meta">
By <a class="post-author" title="了解他" href="{{URL('/Profile/')}}/id">name</a> under <a href="#" class="post-category post-category-design">CSS</a> <a href="#" class="post-category post-category-pure">Ajax</a>
</p> -->
</header>
<div class="post-description">
<p style="font-size:14px;letter-spacing:2px">
<?php echo preg_replace("/(\s|\ \;|\&| |\xc2\xa0)/", "", strip_tags(str_limit($message->content, $limit = 100, $end = '...'))); ?>
</p>
</div>
</section>
<h1 class="content-subhead">{{date("g:i A",strtotime($message->created_at))}}<div id='k'><span id='tp' style="background: rgb({{ $message->color }});"></span><a href="">{{ $message->name }}</a></div></h1>
</div>
@endforeach
<style type="text/css">
.pagination {
border-radius: 4px;
display: inline-block;
margin: 20px 0;
padding-left: 0;
}
.pagination > li {
display: inline;
}
.pagination > li > a, .pagination > li > span {
border: 1px solid #dddddd;
color: #337ab7;
float: left;
line-height: 1.42857;
margin-left: -1px;
padding: 6px 12px;
position: relative;
text-decoration: none;
}
.pagination > li:first-child > a, .pagination > li:first-child > span {
border-bottom-left-radius: 4px;
border-top-left-radius: 4px;
margin-left: 0;
}
.pagination > li:last-child > a, .pagination > li:last-child > span {
border-bottom-right-radius: 4px;
border-top-right-radius: 4px;
}
.pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus {
background-color: #eeeeee;
border-color: #dddddd;
color: #23527c;
}
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
background-color: #337ab7;
border-color: #337ab7;
color: #ffffff;
cursor: default;
z-index: 2;
}
</style>
<?php echo $index->render(); ?>
</div>
</div>
<script src=" {{ asset('Index/js/ui.js') }}"></script>
</body>
</html>
视图的基本用法在此不再赘述，请阅读中文文档：http://laravel-china.org/docs/5.0/views
访问 http://fuck.io:88/admin 得到如下页面：
浙公网安备 33010602011771号