php待办事项设计,Laravel 5.4 创建待办事项

Laravel 5.4 创建待办事项

准备事项

本环境使用 Laragon 集成 php-7.1.1、nginx-1.10.1、mariadb-10.2.3、composer、nodejs。

需要创建一个todo 的数据库，创建一个 todo 的表

最终效果

1. 创建 laravel 5.4 项目

通过 Laravel 安装工具创建 laravel 5.4 项目

1.1 通过 composer 安装 Laravel 工具

composer global require "laravel/installer"

1.2 安装 laravel 5.4 项目

laravel new laratodo

2. 创建数据库相关

2.1 创建数据库

create database todo default charset utf8

2.2 数据库迁移文件

2.2.1 修改user表的迁移文件

public function up()

{

Schema::create('users', function (Blueprint $table) {

$table->increments('id');

$table->string('name');

$table->string('email')->unique();

$table->string('password');

$table->string('userimage'); //此行为新增

$table->string('api_key')->nullable()->unique(); //此行为新增

$table->rememberToken();

$table->timestamps();

});

}

2.2.1 修改todo表的迁移文件

php artisan make:migration create_todo_table //创建todo的数据库迁移文件

public function up()

{

Schema::create('todo', function (Blueprint $table) {

$table->increments('id');

$table->string('todo');

$table->string('description');

$table->string('category');

$table->integer('user_id')->unsigned();

$table->timestamps();

$table->foreign('user_id')->references('id')->on('users')->onDelete('cascade');

});

}

2.3 配置数据库链接 .env 文件

DB_CONNECTION=mysql

DB_HOST=127.0.0.1

DB_PORT=3306

DB_DATABASE=todo

DB_USERNAME=root

DB_PASSWORD=

2.4 执行数据库迁移

php artisan migrate

3. 创建模型相关

3.1 User 模型

namespace App;

use Illuminate\Notifications\Notifiable;

use Illuminate\Foundation\Auth\User as Authenticatable;

class User extends Authenticatable

{

use Notifiable;

/**

* The attributes that are mass assignable.

*

* @var array

*/

protected $fillable = [

'name', 'email', 'password','userimage'

];

/**

* The attributes that should be hidden for arrays.

*

* @var array

*/

protected $hidden = [

'password', 'remember_token',

];

/*

* Get Todo of User

*

*/

public function todo()

{

return $this->hasMany('App\Todo');

}

}

3.2 Todo 模型

3.2.1 创建 Todo 模型

//此方法可以创建控制器和模型

php artisan make:controller TodoController --resource --model=Todo

3.2.1 编辑 Todo 模型

namespace App;

use Illuminate\Database\Eloquent\Model;

class Todo extends Model

{

protected $table = 'todo';

protected $fillable = ['todo','category','user_id','description'];

}

4. 创建控制器

4.1 编辑 TodoController

namespace App\Http\Controllers;

use App\Todo;

use Illuminate\Http\Request;

use Illuminate\Support\Facades\Validator;

use Illuminate\Support\Facades\Auth;

class TodoController extends Controller

{

public function __construct()

{

$this->middleware('auth');

}

/**

* Display a listing of the resource.

*

* @return \Illuminate\Http\Response

*/

public function index()

{

$result = Auth::user()->todo()->get();

if(!$result->isEmpty()){

return view('todo.dashboard',['todos'=>$result,'image'=>Auth::user()->userimage]);

}else{

return view('todo.dashboard',['todos'=>false,'image'=>Auth::user()->userimage]);

}

}

/**

* Show the form for creating a new resource.

*

* @return \Illuminate\Http\Response

*/

public function create()

{

return view('todo.addtodo');

}

/**

* Store a newly created resource in storage.

*

* @param \Illuminate\Http\Request $request

* @return \Illuminate\Http\Response

*/

public function store(Request $request)

{

$this->validator($request->all())->validate();

if(Auth::user()->todo()->Create($request->all())){

return $this->index();

}

}

/**

* Display the specified resource.

*

* @param \App\Todo $todo

* @return \Illuminate\Http\Response

*/

public function show(Todo $todo)

{

return view('todo.todo',['todo' => $todo]);

}

/**

* Show the form for editing the specified resource.

*

* @param \App\Todo $todo

* @return \Illuminate\Http\Response

*/

public function edit(Todo $todo)

{

return view('todo.edittodo',['todo' => $todo]);

}

/**

* Update the specified resource in storage.

*

* @param \Illuminate\Http\Request $request

* @param \App\Todo $todo

* @return \Illuminate\Http\Response

*/

public function update(Request $request, Todo $todo)

{

$this->validator($request->all())->validate();

if($todo->fill($request->all())->save()){

return $this->show($todo);

}

}

/**

* Remove the specified resource from storage.

*

* @param \App\Todo $todo

* @return \Illuminate\Http\Response

*/

public function destroy(Todo $todo)

{

if($todo->delete()){

return back();

}

}

protected function validator(array $request)

{

return Validator::make($request, [

'todo' => 'required',

'description' => 'required',

'category' => 'required'

]);

}

}

4.2 编辑 LoginController 和 RegisterController 控制器

protected $redirectTo = '/home'; => protected $redirectTo = '/todo';

5. 创建视图

在 views 创建 todo 文件夹

5.1 创建 dashboard.blade.php

@extends('layouts.app')

@section('title', 'Home ')

@section('content')

@if($todos != false)

[@foreach](https://learnku.com/users/5651) ($todos as $todo)

{{$todo->todo}}

@endforeach

@else

No Todo added yet click here to add new todo.

@endif

@endsection

5.2 创建 edittodo.blade.php

@extends('layouts.app')

@section('title', 'Edit')

@section('content')

{{ csrf_field() }}

{{ method_field('PUT') }}

Todo

@if ($errors->has('todo'))

{{ $errors->first('todo') }}

@endif

Category

@if ($errors->has('category'))

{{ $errors->first('category') }}

@endif

Description

{{$todo->description}}

@if ($errors->has('description'))

{{ $errors->first('description') }}

@endif

Update

@endsection

5.3 创建 addtodo.blade.php

@extends('layouts.app')

@section('title', 'Add New Todo')

@section('content')

{{ csrf_field() }}

Todo

@if ($errors->has('todo'))

{{ $errors->first('todo') }}

@endif

Category

@if ($errors->has('category'))

{{ $errors->first('category') }}

@endif

Description

@if ($errors->has('description'))

{{ $errors->first('description') }}

@endif

Add

@endsection

5.4 创建 todo.blade.php

@extends('layouts.app')

@section('title', title_case($todo->todo))

@section('content')

{{title_case($todo->todo)}} window.Laravel = {!! json_encode([

'csrfToken' => csrf_token(),

]) !!};

Toggle Navigation

Home

@if (Auth::guest())

Login Register

@else

{{ Auth::user()->name }}

• οnclick="event.preventDefault();

  document.getElementById('logout-form').submit();">

  Logout

  {{ csrf_field() }}

• Add Todo

@endif

@yield('content')

5.6 编辑 register.blade.php

//在form 加上

//在注册表单上加上

Image

@if ($errors->has('userimage'))

{{ $errors->first('userimage') }}

@endif

5. 创建路由

Route::get('/', function () {

return redirect('/login');

});

Auth::routes();

Route::resource('todo','TodoController');

6. 添加 Storage

php artisan storage:link

修改config/filesystems.php

//修改图片访问路径

'default' => 'local', => 'default' => 'public',

参考

https://www.cloudways.com/blog/create-todo-app-laravel-5-4/

https://www.cloudways.com/blog/laravel-5-4-todo-app-setting-authentication-functionality/

//github

https://github.com/ahmedkhan847/todoapplaravel

大功告成

本作品采用《CC 协议》，转载必须注明作者和本文链接

持续做一件事，必定有所成就