Tạo Menu
- Tiếp theo chúng ta làm chức năng tạo bảng menu: Vào teminal chạy lệnhphp artisan make:model Menu -m
- Vào 2021_07_10_023945_create_menus_table.php
<?php
use Illuminate\Support\Facades\Schema;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Database\Migrations\Migration;
class CreateMenusTable extends Migration
{
/**
* Run the migrations.
*
* @return void
*/
public function up()
{
Schema::create('menus', function (Blueprint $table) {
$table->bigIncrements('id');$table->string('name');});
$table->integer('parent_id')->default(0);
$table->timestamps();
}
/**
* Reverse the migrations.
*
* @return void
*/
public function down()
{
Schema::dropIfExists('menus');
}
}
- Vào teminal chạy php artisan migrate để tạo bảng.
- Vào teminal chạy php artisan make:controller MenuController
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class MenuController extends Controller
{
public function index()
{
return view('menus.index');
}
public function create()
{
return view('menus.add');
}
}
- Tạo cấu trúc thư mục như sau :
- Vào file menus => index.blade.php:
<!-- Stored in resources/views/child.blade.php -->
@extends('layouts.admin')
@section('title')
<title>Trang chủ</title>
@endsection
@section('content')
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
<!-- Content Header (Page header) -->
@include('partials.content-header',['name'=>'menus', 'key'=>'List']);
<!-- /.content-header -->
<!-- Main content -->
<div class="content">
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<a href="{{route('menus.create')}}" class="btn btn-success float-right mr-2">add</a>
</div>
<div class="col-md-12">
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Tên Menu</th>
<th scope="col">Action</th>
</tr>
</thead>
<tbody>
{{-- @foreach($categories as $category)--}}
{{-- <tr>--}}
{{-- <th scope="row">{{$category->id}}</th>--}}
{{-- <td>{{ $category->name }}</td>--}}
{{-- <td>--}}
{{-- <a href="{{ route('categories.edit', ['id'=>$category->id]) }}"--}}
{{-- class="btn btn-default">Edit</a>--}}
{{-- <a href="{{ route('categories.delete', ['id'=>$category->id]) }}"--}}
{{-- class="btn btn-danger">Delete</a>--}}
{{-- </td>--}}
{{-- </tr>--}}
{{-- @endforeach--}}
</tbody>
</table>
</div>
<div class="col-md-12">
{{-- {{ $categories->links() }}--}}
</div>
</div>
<!-- /.row -->
</div>
<!-- /.container-fluid -->
</div>
<!-- /.content -->
</div>
<!-- /.content-wrapper -->
@endsection
- Vào file menus => add.blade.php:
<!-- Stored in resources/views/child.blade.php -->
@extends('layouts.admin')
@section('title')
<title>Trang chủ</title>
@endsection
@section('content')
<div class="content-wrapper">
@include('partials.content-header',['name'=>'menus', 'key'=>'Add']);
<div class="content">
<div class="container-fluid">
<div class="row">
<div class="col-md-6">
<form action="{{ route('menus.store')}}" method="post">
@csrf
<div class="form-group">
<label>Tên Menus</label>
<input class="form-control"
name="name"
placeholder="Nhập tên danh mục">
</div>
<div class="form-group">
<label>Chọn menus cha</label>
<select class="form-control"
name="parent_id">
<option value="0">Chọn danh mục cha</option>
</select>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
</div>
</div>
</div>
</div>
@endsection
- Vào web.php :
<?php
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
Route::get('/', function () {
return view('welcome');
});
Route::get('/home', function () {
return view('home');
});
Route::prefix('categories')->group(function () {
Route::get('/',[
'as'=> 'categories.index',
'uses' => 'CategoryController@index'
]);
Route::get('/create',[
'as'=> 'categories.create',
'uses' => 'CategoryController@create'
]);
Route::post('/store',[
'as'=> 'categories.store',
'uses' => 'CategoryController@store'
]);
Route::get('/edit/{id}',[
'as'=> 'categories.edit',
'uses' => 'CategoryController@edit'
]);
Route::post('/update/{id}',[
'as'=> 'categories.update',
'uses' => 'CategoryController@update'
]);
Route::get('/delete/{id}',[
'as'=> 'categories.delete',
'uses' => 'CategoryController@delete'
]);
});
Route::prefix('menus')->group(function () {
Route::get('/',[
'as'=> 'menus.index',
'uses' => 'MenuController@index'
]);
Route::get('/create',[
'as'=> 'menus.create',
'uses' => 'MenuController@create'
]);
Route::post('/store',[
'as'=> 'menus.store',
'uses' => 'MenuController@store'
]);
});
- Vào sider.blade.php thêm mã nguồn sau :
<li class="nav-item">
<a href="{{ route('categories.index') }}" class="nav-link">
<i class="nav-icon fas fa-th"></i>
<p>
Danh mục sản phẩm
<span class="right badge badge-danger">New</span>
</p>
</a>
</li>
<li class="nav-item">
<a href="{{ route('menus.index') }}" class="nav-link">
<i class="nav-icon fas fa-th"></i>
<p>
Menus
</p>
</a>
</li>
kết quả :
Viết đệ quy Select Menu
- Vào Navicat :
- Vào app => Components => Tạo mới file MenuRecusive.php
<?php
namespace App\Components;
use App\Menu;
class MenuRecusive{
private $html;
public function __construct()
{
$this->html = '';
}
public function menuRecusiveAdd($parentId = 0, $subMark = '')
{
$data = Menu::where('parent_id', $parentId)->get();
foreach ($data as $dataItem)
{
$this->html .= '<option value=" '.$dataItem->id .'">' .$subMark .$dataItem->name .'</option>';
$this->MenuRecusiveAdd($dataItem->id, $subMark . '--' );
}
return $this->html;
}
}
- Vào MenuController.php :
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Components\MenuRecusive;
class MenuController extends Controller
{
private $menuRecusive;
public function __construct(MenuRecusive $menuRecusive)
{
$this->menuRecusive = $menuRecusive;
}
public function index()
{
return view('menus.index');
}
public function create()
{
$optionSelect = $this->menuRecusive->menuRecusiveAdd();
return view('menus.add', compact('optionSelect'));
}
}
- Vào Menus\add.blade.php :
<!-- Stored in resources/views/child.blade.php -->
@extends('layouts.admin')
@section('title')
<title>Trang chủ</title>
@endsection
@section('content')
<div class="content-wrapper">
@include('partials.content-header',['name'=>'menus', 'key'=>'Add']);
<div class="content">
<div class="container-fluid">
<div class="row">
<div class="col-md-6">
<form action="{{ route('menus.store')}}" method="post">
@csrf
<div class="form-group">
<label>Tên Menus</label>
<input class="form-control"
name="name"
placeholder="Nhập tên danh mục">
</div>
<div class="form-group">
<label>Chọn menus cha</label>
<select class="form-control"
name="parent_id">
<option value="0">Chọn danh mục cha</option>
{!! $optionSelect !!}
</select>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
</div>
</div>
</div>
</div>
@endsection
- Kết quả :
Thêm Menu
- Vào web.php:
<?php
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
Route::get('/', function () {
return view('welcome');
});
Route::get('/home', function () {
return view('home');
});
Route::prefix('categories')->group(function () {
Route::get('/',[
'as'=> 'categories.index',
'uses' => 'CategoryController@index'
]);
Route::get('/create',[
'as'=> 'categories.create',
'uses' => 'CategoryController@create'
]);
Route::post('/store',[
'as'=> 'categories.store',
'uses' => 'CategoryController@store'
]);
Route::get('/edit/{id}',[
'as'=> 'categories.edit',
'uses' => 'CategoryController@edit'
]);
Route::post('/update/{id}',[
'as'=> 'categories.update',
'uses' => 'CategoryController@update'
]);
Route::get('/delete/{id}',[
'as'=> 'categories.delete',
'uses' => 'CategoryController@delete'
]);
});
Route::prefix('menus')->group(function () {
Route::get('/',[
'as'=> 'menus.index',
'uses' => 'MenuController@index'
]);
Route::get('/create',[
'as'=> 'menus.create',
'uses' => 'MenuController@create'
]);
Route::post('/store',[
'as'=> 'menus.store',
'uses' => 'MenuController@store'
]);
});
- Vào MenuController.php:
<?php
namespace App\Http\Controllers;
use App\Menu;
use Illuminate\Http\Request;
use App\Components\MenuRecusive;
class MenuController extends Controller
{
private $menuRecusive;
private $menu;
public function __construct(MenuRecusive $menuRecusive, Menu $menu)
{
$this->menuRecusive = $menuRecusive;
$this->menu = $menu;
}
public function index()
{
$menus = $this->menu->paginate(5);
return view('menus.index', compact('menus'));
}
public function create()
{
$optionSelect = $this->menuRecusive->menuRecusiveAdd();
return view('menus.add', compact('optionSelect'));
}
public function store(Request $request)
{
$this->menu->create([
'name'=>$request->name,
'parent_id' =>$request->parent_id
]);
return redirect()->route('menus.index');
}
}
- Vào menus => index.blade.php
<!-- Stored in resources/views/child.blade.php -->
@extends('layouts.admin')
@section('title')
<title>Trang chủ</title>
@endsection
@section('content')
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
<!-- Content Header (Page header) -->
@include('partials.content-header',['name'=>'menus', 'key'=>'List']);
<!-- /.content-header -->
<!-- Main content -->
<div class="content">
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<a href="{{route('menus.create')}}" class="btn btn-success float-right mr-2">add</a>
</div>
<div class="col-md-12">
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Tên Menu</th>
<th scope="col">Action</th>
</tr>
</thead>
<tbody>
@foreach($menus as $menu)
<tr>
<th scope="row">{{$menu->id}}</th>
<td>{{ $menu->name }}</td>
<td>
<a href=""
class="btn btn-default">Edit</a>
<a href=""
class="btn btn-danger">Delete</a>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
<div class="col-md-12">
{{ $menus->links() }}
</div>
</div>
<!-- /.row -->
</div>
<!-- /.container-fluid -->
</div>
<!-- /.content -->
</div>
<!-- /.content-wrapper -->
@endsection
- Vào Menu.php:
<?php
namespace App;
use Illuminate\Database\Eloquent\Model;
class Menu extends Model
{
protected $fillable = ['name','parent_id'];
}
- Vào MenuRecusive.php:
<?php
namespace App\Components;
use App\Menu;
class MenuRecusive{
private $html;
public function __construct()
{
$this->html = '';
}
public function menuRecusiveAdd($parentId = 0, $subMark = '')
{
$data = Menu::where('parent_id', $parentId)->get();
foreach ($data as $dataItem)
{
$this->html .= '<option value=" '.$dataItem->id .'">' .$subMark .$dataItem->name .'</option>';
$this->MenuRecusiveAdd($dataItem->id, $subMark . '--' );
}
return $this->html;
}
}
- Vào menus => add.blade.php
<!-- Stored in resources/views/child.blade.php -->
@extends('layouts.admin')
@section('title')
<title>Trang chủ</title>
@endsection
@section('content')
<div class="content-wrapper">
@include('partials.content-header',['name'=>'menus', 'key'=>'Add']);
<div class="content">
<div class="container-fluid">
<div class="row">
<div class="col-md-6">
<form action="{{ route('menus.store')}}" method="post">
@csrf
<div class="form-group">
<label>Tên Menus</label>
<input class="form-control"
name="name"
placeholder="Nhập tên menu">
</div>
<div class="form-group">
<label>Chọn menus cha</label>
<select class="form-control"
name="parent_id">
<option value="0">Chọn menu cha</option>
{!! $optionSelect !!}
</select>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
</div>
</div>
</div>
</div>
@endsection
- Kết quả :
Tạo Slug cho menu
- Vào teminal chạy php artisan make:migration add_column_slug_to_menus_table --table=menus
<?php
use Illuminate\Support\Facades\Schema;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Database\Migrations\Migration;
class AddColumnSlugToMenusTable extends Migration
{
/**
* Run the migrations.
*
* @return void
*/
public function up()
{
Schema::table('menus', function (Blueprint $table) {
$table->string('slug');
});
}
/**
* Reverse the migrations.
*
* @return void
*/
public function down()
{
Schema::table('menus', function (Blueprint $table) {
$table->dropColumn('slug');
});
}
}
- Vào teminal chạy : php artisan migrate
- Vào MenuConTroller.php:
<?php
namespace App\Http\Controllers;
use App\Menu;
use Illuminate\Http\Request;
use App\Components\MenuRecusive;
class MenuController extends Controller
{
private $menuRecusive;
private $menu;
public function __construct(MenuRecusive $menuRecusive, Menu $menu)
{
$this->menuRecusive = $menuRecusive;
$this->menu = $menu;
}
public function index()
{
$menus = $this->menu->paginate(5);
return view('menus.index', compact('menus'));
}
public function create()
{
$optionSelect = $this->menuRecusive->menuRecusiveAdd();
return view('menus.add', compact('optionSelect'));
}
public function store(Request $request)
{
$this->menu->create([
'name'=>$request->name,
'parent_id' =>$request->parent_id,
'slug'=>str_slug($request->name)
]);
return redirect()->route('menus.index');
}
}
- Vào Menu.php:
<?php
namespace App;
use Illuminate\Database\Eloquent\Model;
class Menu extends Model
{
//protected $fillable = ['name','parent_id','slug'];
protected $guarded = [];
}
Tạo phương thức update
Tạo Edit
- Vào web.php:
<?php
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
Route::get('/', function () {
return view('welcome');
});
Route::get('/home', function () {
return view('home');
});
Route::prefix('categories')->group(function () {
Route::get('/',[
'as'=> 'categories.index',
'uses' => 'CategoryController@index'
]);
Route::get('/create',[
'as'=> 'categories.create',
'uses' => 'CategoryController@create'
]);
Route::post('/store',[
'as'=> 'categories.store',
'uses' => 'CategoryController@store'
]);
Route::get('/edit/{id}',[
'as'=> 'categories.edit',
'uses' => 'CategoryController@edit'
]);
Route::post('/update/{id}',[
'as'=> 'categories.update',
'uses' => 'CategoryController@update'
]);
Route::get('/delete/{id}',[
'as'=> 'categories.delete',
'uses' => 'CategoryController@delete'
]);
});
Route::prefix('menus')->group(function () {
Route::get('/',[
'as'=> 'menus.index',
'uses' => 'MenuController@index'
]);
Route::get('/create',[
'as'=> 'menus.create',
'uses' => 'MenuController@create'
]);
Route::post('/store',[
'as'=> 'menus.store',
'uses' => 'MenuController@store'
]);
Route::get('/edit/{id}',[
'as'=> 'menus.edit',
'uses' => 'MenuController@edit'
]);
Route::post('/update/{id}',[
'as'=> 'menus.update',
'uses' => 'MenuController@update'
]);
});
- Vào menus => edit.blade.php:
<!-- Stored in resources/views/child.blade.php -->
@extends('layouts.admin')
@section('title')
<title>Trang chủ</title>
@endsection
@section('content')
<div class="content-wrapper">
@include('partials.content-header',['name'=>'menus', 'key'=>'Edit']);
<div class="content">
<div class="container-fluid">
<div class="row">
<div class="col-md-6">
<form action="{{ route('menus.update', ['id'=>$menuFollowIdEdit->id])}}" method="post">
@csrf
<div class="form-group">
<label>Tên Menus</label>
<input class="form-control"
name="name"
placeholder="Nhập tên menu"
value="{{ $menuFollowIdEdit->name }}"
>
</div>
<div class="form-group">
<label>Chọn menus cha</label>
<select class="form-control"
name="parent_id">
<option value="0">Chọn menu cha</option>
{!! $optionSelect !!}
</select>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
</div>
</div>
</div>
</div>
@endsection
- Vào MenuController.php:
<?php
namespace App\Http\Controllers;
use App\Menu;
use Illuminate\Http\Request;
use App\Components\MenuRecusive;
use Illuminate\Support\Str;
class MenuController extends Controller
{
private $menuRecusive;
private $menu;
public function __construct(MenuRecusive $menuRecusive, Menu $menu)
{
$this->menuRecusive = $menuRecusive;
$this->menu = $menu;
}
public function index()
{
$menus = $this->menu->paginate(5);
return view('menus.index', compact('menus'));
}
public function create()
{
$optionSelect = $this->menuRecusive->menuRecusiveAdd();
return view('menus.add', compact('optionSelect'));
}
public function store(Request $request)
{
$this->menu->create([
'name'=>$request->name,
'parent_id' =>$request->parent_id,
'slug'=>Str::slug($request->name)
]);
return redirect()->route('menus.index');
}
public function edit($id, Request $request)
{
$menuFollowIdEdit = $this->menu->find($id);
$optionSelect = $this->menuRecusive->menuRecusiveEdit($menuFollowIdEdit->parent_id);
return view('menus.edit', compact('optionSelect', 'menuFollowIdEdit'));
}
public function update($id, Request $request)
{
$this->menu->find($id)->update([
'name'=>$request->name,
'parent_id'=>$request->parent_id,
'slug'=>Str::slug($request->name)
]);
return redirect()->route('menus.index');
}
}
Xóa Menu
- Chạy lệnh trong teminal :
php artisan make:migration add_column_soft_delete_to_menus_table --table=menus
- Vào 2021_07_13_023206_add_column_soft_delete_to_menus_table.php
<?php
use Illuminate\Support\Facades\Schema;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Database\Migrations\Migration;
class AddColumnSoftDeleteToMenusTable extends Migration
{
/**
* Run the migrations.
*
* @return void
*/
public function up()
{
Schema::table('menus', function (Blueprint $table) {
$table->softDeletes();
});
}
/**
* Reverse the migrations.
*
* @return void
*/
public function down()
{
Schema::table('menus', function (Blueprint $table) {
//
});
}
}
- Chạy lệnh trong teminal: php artisan migrate
- Vào web.php:
<?php
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
Route::get('/', function () {
return view('welcome');
});
Route::get('/home', function () {
return view('home');
});
Route::prefix('categories')->group(function () {
Route::get('/',[
'as'=> 'categories.index',
'uses' => 'CategoryController@index'
]);
Route::get('/create',[
'as'=> 'categories.create',
'uses' => 'CategoryController@create'
]);
Route::post('/store',[
'as'=> 'categories.store',
'uses' => 'CategoryController@store'
]);
Route::get('/edit/{id}',[
'as'=> 'categories.edit',
'uses' => 'CategoryController@edit'
]);
Route::post('/update/{id}',[
'as'=> 'categories.update',
'uses' => 'CategoryController@update'
]);
Route::get('/delete/{id}',[
'as'=> 'categories.delete',
'uses' => 'CategoryController@delete'
]);
});
Route::prefix('menus')->group(function () {
Route::get('/',[
'as'=> 'menus.index',
'uses' => 'MenuController@index'
]);
Route::get('/create',[
'as'=> 'menus.create',
'uses' => 'MenuController@create'
]);
Route::post('/store',[
'as'=> 'menus.store',
'uses' => 'MenuController@store'
]);
Route::get('/edit/{id}',[
'as'=> 'menus.edit',
'uses' => 'MenuController@edit'
]);
Route::post('/update/{id}',[
'as'=> 'menus.update',
'uses' => 'MenuController@update'
]);
Route::get('/delete/{id}',[
'as'=> 'menus.delete',
'uses' => 'MenuController@delete'
]);
});
- Vào MenuController.php:
<?php
namespace App\Http\Controllers;
use App\Menu;
use Illuminate\Http\Request;
use App\Components\MenuRecusive;
class MenuController extends Controller
{
private $menuRecusive;
private $menu;
public function __construct(MenuRecusive $menuRecusive, Menu $menu)
{
$this->menuRecusive = $menuRecusive;
$this->menu = $menu;
}
public function index()
{
$menus = $this->menu->paginate(5);
return view('menus.index', compact('menus'));
}
public function create()
{
$optionSelect = $this->menuRecusive->menuRecusiveAdd();
return view('menus.add', compact('optionSelect'));
}
public function store(Request $request)
{
$this->menu->create([
'name'=>$request->name,
'parent_id' =>$request->parent_id,
'slug'=>str_slug($request->name)
]);
return redirect()->route('menus.index');
}
public function edit($id, Request $request)
{
$menuFollowIdEdit = $this->menu->find($id);
$optionSelect = $this->menuRecusive->menuRecusiveEdit($menuFollowIdEdit->parent_id);
return view('menus.edit', compact('optionSelect', 'menuFollowIdEdit'));
}
public function update($id, Request $request)
{
$this->menu->find($id)->update([
'name'=>$request->name,
'parent_id'=>$request->parent_id,
'slug'=>str_slug($request->name)
]);
return redirect()->route('menus.index');
}
public function delete($id)
{
$this->menu->find($id)->delete();
return redirect()->route('menus.index');
}
}
- Vào Menu.php:
<?php
namespace App;
use Illuminate\Database\Eloquent\Model;
use Illuminate\Database\Eloquent\softDeletes;
class Menu extends Model
{
//protected $fillable = ['name','parent_id','slug'];
protected $guarded = [];
use softDeletes;
}
- Vào menus => index.blade.php:
<!-- Stored in resources/views/child.blade.php -->
@extends('layouts.admin')
@section('title')
<title>Trang chủ</title>
@endsection
@section('content')
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
<!-- Content Header (Page header) -->
@include('partials.content-header',['name'=>'menus', 'key'=>'List']);
<!-- /.content-header -->
<!-- Main content -->
<div class="content">
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<a href="{{route('menus.create')}}" class="btn btn-success float-right mr-2">add</a>
</div>
<div class="col-md-12">
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Tên Menu</th>
<th scope="col">Action</th>
</tr>
</thead>
<tbody>
@foreach($menus as $menu)
<tr>
<th scope="row">{{$menu->id}}</th>
<td>{{ $menu->name }}</td>
<td>
<a href="{{route('menus.edit', ['id'=>$menu->id] )}}"
class="btn btn-default">Edit</a>
<a href="{{route('menus.delete', ['id'=>$menu->id] )}}"
class="btn btn-danger">Delete</a>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
<div class="col-md-12">
{{ $menus->links() }}
</div>
</div>
<!-- /.row -->
</div>
<!-- /.container-fluid -->
</div>
<!-- /.content -->
</div>
<!-- /.content-wrapper -->
@endsection
.jpg)
.jpg)
0 Nhận xét