最近学习了最适合入门的laravel初级教程,就想着来做一个简易的报名系统，看过教程感觉做起来应该不难，但实际上手做的时候还是遇到了不少问题，所以我把它的大致流程记录下来，便于以后查阅
创建一个表并进行迁移
既然要做一个报名系统，那么表肯定必不可少，所以我们先用Laravel内置命令创建一个表
php artisan make:migration create_information_table
在目录下\database\migrations找到刚刚创建的文件，编辑一下表的内容
public function up()
{
Schema::create('information', function(Blueprint $table)
{
$table->increments('id');
$table->string('number')->comment('学号');
$table->string('name')->comment('姓名');
$table->string('phone_number')->comment('手机号');
$table->timestamps(); //记录创建时间及修改时间
$table->softDeletes(); //记录软删除时间
});
}
执行迁移，这样才能使数据库接收到表的信息
php artisan migrate
准备工作
在写页面之前，我们先创建一个控制器，便于对报名系统的各个方法进行管理
php artisan make:controller InformationController --resource
我们在控制器里先写上create方法和store方法,分别用来跳转报名页和保存报名数据
编写InformationController里的index方法
public function create()
{
$title = '报名页';
$assign = compact('title');
return view('enter.create', $assign);
}
编写InformationController里的store方法
public function store(Request $request)
{
$data = $request->except('_token');
Information::create($data);
return redirect('enter/success');
}
上面store方法中我们使用了Information::create($data)，所以我们要创建Information模型，这样才能使用模型中增查删改等功能
创建Information的模型
php artisan make:model Models/Information
编辑Information模型
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Model;
use Illuminate\Database\Eloquent\SoftDeletes;
class Information extends Model
{
/**
* 不允许赋值的字段
*
* @var array
*/
protected $guarded = [];
//使用软删除
use SoftDeletes;
}
创建报名界面
先创建路由，新建报名页和成功页地址，并与Information中的方法建立关系
Route::prefix('enter')->group(function() {
Route::get('/', 'InformationController@create');
Route::post('store', 'InformationController@store');
Route::get('success', 'InformationController@index');
});
创建一个 resources/views/layouts/home.blade.php 文件专门用于放父级模板，这样后面写界面时能省去写大量重复的开头，直接引用模板就行
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<title>@yield('title')</title>
</head>
<body>
@yield('content')
</body>
</html>
准备工作做完了，现在可以创建并编辑视图文件
resources\views\enter\create.blade.php
@extends('layouts.home')
@section('title', $title)
@section('content')
<h1 style="text-align:center">这是一个非常简陋的报名页</h1> <br><br>
<form class="form-horizontal" role="form" style="margin: 20px 450px 0px 450px" action="{{ url('enter/store') }}" method="post">
{{ csrf_field() }}
<div class="form-group">
<label for="number" class="col-sm-2 control-label" style="font-size:16px">学号</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="number" placeholder="请输入学号">
</div>
</div> <br>
<div class="form-group">
<label for="name" class="col-sm-2 control-label" style="font-size:16px">姓名</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="name" placeholder="请输入姓名">
</div>
</div> <br>
<div class="form-group">
<label for="phone_number" class="col-sm-2 control-label" style="font-size:16px">手机号</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="phone_number" placeholder="请输入手机号">
</div>
</div> <br><br>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default" style="margin-right:50px;margin-left:80px">提交</button>
<a href="{{ url('enter/checking') }}">
<button type="button" class="btn btn-default">进入后台管理</button>
</a>
</div>
</div>
</form>
@endsection
看一眼效果（果然非常简陋
然后我们再创建并编辑views\enter\success.blade.php文件，这样点击提交后转到“报名成功”这个页面
@extends('layouts.home')
@section('title', "报名成功")
@section('content')
<h1 style="text-align:center">报名成功!</h1>
<div class="col-sm-offset-2 col-sm-10">
<a href="{{ url('enter/') }}">
<button type="button" class="btn btn-default" style='float:right;margin-top:50px;margin-right:670px;'>返回</button>
</a>
</div>
@endsection
报名成功页面如下
创建验证界面
我们可以看到报名页上有个大大的进入后台管理按钮，当然我们不可能让任何人都能管理后台信息，所以我们设置一个验证界面，只有输对了密码才能进入到管理界面（。。。实际后来想想只要输入管理页面的网址直接就能进入管理界面，所以验证并没有什么用，主要是目前学到的知识还很少，暂时只能做到这样
创建并编辑views\enter\checking.blade.php文件，并添加路由
@extends('layouts.home')
@section('title', "验证身份")
@section('content')
<h1 style="text-align:center">输入密码以进入后台管理</h1>
<br><br>
<div style="margin: 20px 450px 0px 450px">
<div class="form-group">
<label for="password" class="col-sm-2 control-label" style="font-size:16px">密码</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="password" placeholder="请输入管理员密码" value="">
</div>
</div> <br><br><br>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default" onclick="checking()" style="margin-right:50px;margin-left:80px">提交</button>
<a href="{{ url('enter/') }}">
<button type="submit" class="btn btn-default">返回</button>
</a>
</div>
</div>
</div>
<script>
function checking()
{
var password="123";
var target = document.getElementById('password');
if(target.value!=password)
{
alert("密码错误");
}
else
{
window.location.href="{{ url('enter/manage') }}";
}
}
</script>
@endsection
验证界面如下
密码输入错误会弹出密码错误的提示
创建管理界面
接下来我们来创建一个可视化的数据库管理界面，在这个界面下我们可以对数据来进行增查删改等操作
创建并编辑views\enter\manage.blade.php文件，并添加路由
@extends('layouts.home')
@section('title', "后台管理")
@section('content')
<?php
use App\Models\Information;
$information = Information::withTrashed()
->orderBy('id', 'desc')
->get();
?>
<table class="table" style="margin:0 auto;width:800px;">
<caption style="text-align:center;font-weight: bold;font-size:18px">后台管理</caption> <br>
<thead>
<tr>
<th>学号</th>
<th>姓名</th>
<th>手机号</th>
<th>操作</th>
</tr>
</thead>
<tbody>
@foreach($information as $k => $v)
<tr>
<td>{{ $v->number }}</td>
<td>{{ $v->name }}</td>
<td>{{ $v->phone_number }}</td>
<td>
<a href="{{ url('enter/edit', $v->id) }}">编辑</a> |
@if($v->trashed())
<a href="{{ url('enter/restore', $v->id) }}">恢复</a> |
<a href="{{ url('enter/forceDelete', $v->id) }}">彻底删除</a>
@else
<a href="{{ url('enter/destroy', $v->id) }}">删除</a>
@endif
</td>
</tr>
@endforeach
</tbody>
</table>
<div class="col-sm-offset-2 col-sm-10">
<a href="{{ url('enter/') }}">
<button type="button" class="btn btn-default" style='float:right;margin-top:50px;margin-right:670px;'>返回</button>
</a>
</div>
@endsection
编写InformationController里的edit方法和update方法
public function edit($id)
{
$title = '编辑信息';
$information = Information::find($id);
$assign = compact('information', 'title');
return view('enter.edit', $assign);
}
public function update(Request $request, $id)
{
$data = $request->except('_token');
Information::where('id', $id)->update($data);
return redirect('enter/manage');
}
编写剩下的destroy方法、restore方法和forceDelete方法，并创建路由
public function destroy($id)
{
Information::destroy($id);
return redirect()->back();
}
public function restore($id)
{
Information::where('id', $id)->restore();
return redirect()->back();
}
public function forceDelete($id)
{
Information::where('id', $id)->forceDelete();
return redirect()->back();
}
最终路由总的代码如下
Route::prefix('enter')->group(function() {
Route::get('/', 'InformationController@create');
Route::post('store', 'InformationController@store');
Route::get('success', 'InformationController@index');
Route::get('checking', 'InformationController@checking');
Route::get('manage', 'InformationController@manage');
Route::get('edit/{id}', 'InformationController@edit');
Route::post('update/{id}', 'InformationController@update');
Route::get('destroy/{id}', 'InformationController@destroy');
Route::get('restore/{id}', 'InformationController@restore');
Route::get('forceDelete/{id}', 'InformationController@forceDelete');
});
管理界面如下
扫一扫
1500
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
