Bài 12: Cập Nhật Slider, Xóa Slider

 

 Cập Nhật Slider

-    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('/admin', 'AdminController@loginAdmin');
Route::post('/admin', 'AdminController@postloginAdmin');

Route::get('/home', function () {
    return view('home');
});

Route::prefix('admin')->group(function () {
    //category
    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'
        ]);
    });
    //menu
    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'
        ]);
    });

    //Product
    Route::prefix('product')->group(function () {
        Route::get('/',[
            'as'=> 'product.index',
            'uses' => 'AdminProductController@index'
        ]);
        Route::get('/create',[
            'as'=> 'product.create',
            'uses' => 'AdminProductController@create'
        ]);
        Route::post('/store',[
            'as'=> 'product.store',
            'uses' => 'AdminProductController@store'
        ]);
        Route::get('/edit/{id}',[
            'as'=> 'product.edit',
            'uses' => 'AdminProductController@edit'
        ]);
        Route::post('/update/{id}',[
            'as'=> 'product.update',
            'uses' => 'AdminProductController@update'
        ]);
        Route::get('/delete/{id}',[
            'as'=> 'product.delete',
            'uses' => 'AdminProductController@delete'
        ]);
    });

    //Slider
    Route::prefix('slider')->group(function () {
        Route::get('/',[
            'as'=> 'slider.index',
            'uses' => 'SliderAdminController@index'
        ]);
        Route::get('/create',[
            'as'=> 'slider.create',
            'uses' => 'SliderAdminController@create'
        ]);
        Route::post('/store',[
            'as'=> 'slider.store',
            'uses' => 'SliderAdminController@store'
        ]);
        Route::get('/edit/{id}',[
            'as'=> 'slider.edit',
            'uses' => 'SliderAdminController@edit'
        ]);
        Route::post('/update/{id}',[
            'as'=> 'slider.update',
            'uses' => 'SliderAdminController@update'
        ]);

    });
});

-    Vào SliderAdminController.php

<?php

namespace App\Http\Controllers;

use App\Http\Requests\SliderAddRequest;
use App\Slider;
use App\Traits\StorageImageTrait;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Log;

class SliderAdminController extends Controller
{
    use StorageImageTrait;
    private $slider;
    public function __construct(Slider $slider)
    {
        $this->slider = $slider;
    }

    public function index(){
        $sliders = $this->slider->latest()->paginate(5);
        return view('admin.slider.index',compact('sliders'));
    }
    public function create(){
        return view('admin.slider.add');
    }

    public function store(SliderAddRequest $request)
    {
        try {
            $dataInsert = [
                'name'=>$request->name,
                'description'=>$request->discription
            ];
            $dataImageSlider = $this->storageTraitUpload($request,'image_path','slider');
            if (!empty($dataImageSlider)){
                $dataInsert['image_name'] = $dataImageSlider['file_name'];
                $dataInsert['image_path'] = $dataImageSlider['file_path'];
            }
            $this->slider->create($dataInsert);
            return redirect()->route('slider.index');
        } catch (\Exception $exception){
            log::error('Message: ' .$exception->getMessage().' --- Line : '.$exception->getLine());
        }
    }
    public function edit($id)
    {
        $slider = $this->slider->find($id);
        return view('admin.slider.edit',compact('slider'));
    }
    public function update(Request $request, $id)
    {
        try {
            $dataUpdate = [
                'name'=>$request->name,
                'description'=>$request->discription
            ];
            $dataImageSlider = $this->storageTraitUpload($request,'image_path','slider');
            if (!empty($dataImageSlider)){
                $dataUpdate['image_name'] = $dataImageSlider['file_name'];
                $dataUpdate['image_path'] = $dataImageSlider['file_path'];
            }
            $this->slider->find($id)->update($dataUpdate);
            return redirect()->route('slider.index');
        } catch (\Exception $exception){
            log::error('Message: ' .$exception->getMessage().' --- Line : '.$exception->getLine());
        }
    }
}

-    Vào resource => admin => slider => tạo file edit.blade.php

<!-- Stored in resources/views/child.blade.php -->

@extends('layouts.admin')

@section('title')
    <title>Trang chủ</title>
@endsection
@section('css')
    <link rel="stylesheet" href="{{asset('admins/slider/add/add.css')}}">
@endsection

@section('content')
    <div class="content-wrapper">
        @include('partials.content-header',['name'=>'Slider', 'key'=>'Edit'])
        <div class="content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-md-6">
                        <form action="{{ route('slider.update', ['id'=>$slider->id]) }}" method="post" enctype="multipart/form-data">
                            @csrf
                            <div class="form-group">
                                <label>Tên Slider</label>
                                <input class="form-control @error('name') is-invalid @enderror"
                                       name="name"
                                       placeholder="Nhập tên"
                                       value="{{$slider->name}}"
                                >
                                @error('name')
                                <div class="alert alert-danger">{{ $message }}</div>
                                @enderror
                            </div>
                            <div class="form-group">
                                <label>Mô tả Slider</label>
                                <textarea name="discription"
                                          rows="4"
                                          class="form-control @error('description') is-invalid @enderror"
                                > {{$slider->description}}</textarea>
                                @error('description')
                                <div class="alert alert-danger">{{ $message }}</div>
                                @enderror
                            </div>
                            <div class="form-group">
                                <label>Hình ảnh</label>
                                <input type="file"
                                       class="form-control form-control-file @error('image_path') is-invalid @enderror"
                                       name="image_path"
                                >
                                <div class="col-md-4">
                                    <div class="row">
                                        <img class="image_slider" src="{{$slider->image_path}}" alt="">
                                    </div>
                                </div>
                                @error('image_path')
                                <div class="alert alert-danger">{{ $message }}</div>
                                @enderror
                            </div>
                            <button type="submit" class="btn btn-primary">Submit</button>
                        </form>
                    </div>

                </div>
            </div>
        </div>
    </div>
@endsection

-    Vào public=> admins => slider => add => add.css

.alert-danger{
    margin-top: 10px;
    padding: 3px 5px;
}
.image_slider{
    width: 100%;
    height: 130px;
    margin-top: 10px;
    object-fit: cover;
}

-    Vào resource => admin => slider =>  index.blade.php

<!-- Stored in resources/views/child.blade.php -->

@extends('layouts.admin')

@section('title')
    <title>Trang chủ</title>
@endsection

@section('css')
    <link rel="stylesheet" href="{{ asset('admins/slider/index/index.css') }}">
@endsection

@section('content')
    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        @include('partials.content-header',['name'=>'Slider', 'key'=>'Add'])
        <!-- /.content-header -->

        <!-- Main content -->
        <div class="content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-md-12">
                        <a href="{{ route('slider.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 Slider</th>
                                <th scope="col">Description</th>
                                <th scope="col">Hình ảnh</th>
                                <th scope="col">Action</th>
                            </tr>
                            </thead>
                            <tbody>

                            @foreach($sliders as $slider)
                                <tr>
                                    <th scope="row">{{ $slider->id }}</th>
                                    <td>{{ $slider->name }}</td>
                                    <td>{{ $slider->description }}</td>
                                    <td>
                                        <img class="image_slider_150_100" src="{{ $slider->image_path }}" alt="">
                                    </td>
                                    <td>
                                        <a href="{{ route('slider.edit',['id'=>$slider->id]) }}"
                                           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">
                        {{ $sliders->links() }}
                    </div>

                </div>
                <!-- /.row -->
            </div>
            <!-- /.container-fluid -->
        </div>
        <!-- /.content -->
    </div>
    <!-- /.content-wrapper -->
@endsection

Xóa Slider

-    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('/admin', 'AdminController@loginAdmin');
Route::post('/admin', 'AdminController@postloginAdmin');

Route::get('/home', function () {
    return view('home');
});

Route::prefix('admin')->group(function () {
    //category
    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'
        ]);
    });
    //menu
    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'
        ]);
    });

    //Product
    Route::prefix('product')->group(function () {
        Route::get('/',[
            'as'=> 'product.index',
            'uses' => 'AdminProductController@index'
        ]);
        Route::get('/create',[
            'as'=> 'product.create',
            'uses' => 'AdminProductController@create'
        ]);
        Route::post('/store',[
            'as'=> 'product.store',
            'uses' => 'AdminProductController@store'
        ]);
        Route::get('/edit/{id}',[
            'as'=> 'product.edit',
            'uses' => 'AdminProductController@edit'
        ]);
        Route::post('/update/{id}',[
            'as'=> 'product.update',
            'uses' => 'AdminProductController@update'
        ]);
        Route::get('/delete/{id}',[
            'as'=> 'product.delete',
            'uses' => 'AdminProductController@delete'
        ]);
    });

    //Slider
    Route::prefix('slider')->group(function () {
        Route::get('/',[
            'as'=> 'slider.index',
            'uses' => 'SliderAdminController@index'
        ]);
        Route::get('/create',[
            'as'=> 'slider.create',
            'uses' => 'SliderAdminController@create'
        ]);
        Route::post('/store',[
            'as'=> 'slider.store',
            'uses' => 'SliderAdminController@store'
        ]);
        Route::get('/edit/{id}',[
            'as'=> 'slider.edit',
            'uses' => 'SliderAdminController@edit'
        ]);
        Route::post('/update/{id}',[
            'as'=> 'slider.update',
            'uses' => 'SliderAdminController@update'
        ]);
        Route::get('/delete/{id}',[
            'as'=> 'slider.delete',
            'uses' => 'SliderAdminController@delete'
        ]);
    });
});

-    Vào SliderAdminController.php

<?php

namespace App\Http\Controllers;

use App\Http\Requests\SliderAddRequest;
use App\Slider;
use App\Traits\StorageImageTrait;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Log;

class SliderAdminController extends Controller
{
    use StorageImageTrait;
    private $slider;
    public function __construct(Slider $slider)
    {
        $this->slider = $slider;
    }

    public function index(){
        $sliders = $this->slider->latest()->paginate(5);
        return view('admin.slider.index',compact('sliders'));
    }
    public function create(){
        return view('admin.slider.add');
    }

    public function store(SliderAddRequest $request)
    {
        try {
            $dataInsert = [
                'name'=>$request->name,
                'description'=>$request->discription
            ];
            $dataImageSlider = $this->storageTraitUpload($request,'image_path','slider');
            if (!empty($dataImageSlider)){
                $dataInsert['image_name'] = $dataImageSlider['file_name'];
                $dataInsert['image_path'] = $dataImageSlider['file_path'];
            }
            $this->slider->create($dataInsert);
            return redirect()->route('slider.index');
        } catch (\Exception $exception){
            log::error('Message: ' .$exception->getMessage().' --- Line : '.$exception->getLine());
        }
    }
    public function edit($id)
    {
        $slider = $this->slider->find($id);
        return view('admin.slider.edit',compact('slider'));
    }
    public function update(Request $request, $id)
    {
        try {
            $dataUpdate = [
                'name'=>$request->name,
                'description'=>$request->discription
            ];
            $dataImageSlider = $this->storageTraitUpload($request,'image_path','slider');
            if (!empty($dataImageSlider)){
                $dataUpdate['image_name'] = $dataImageSlider['file_name'];
                $dataUpdate['image_path'] = $dataImageSlider['file_path'];
            }
            $this->slider->find($id)->update($dataUpdate);
            return redirect()->route('slider.index');
        } catch (\Exception $exception){
            log::error('Message: ' .$exception->getMessage().' --- Line : '.$exception->getLine());
        }
    }
    public function delete($id)
    {
        try {
            $this->slider->find($id)->delete();
            return response()->json([
                'code'=>200,
                'message'=>'delete success'
            ], 200);
        }catch (\Exception $exception){
            Log::error('Message: ' .$exception->getMessage().' --- Line : '.$exception->getLine());
            return response()->json([
                'code'=>500,
                'message'=>'delete fail'
            ], 500);
        }
    }
}

-    Vào Slider.php

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;
use Illuminate\Database\Eloquent\SoftDeletes;

class Slider extends Model
{
    use SoftDeletes;
    protected $guarded = [];
}

-    Vào public=> admins => slider =>index => tạo file index.js

function actionDelete(event){
    event.preventDefault();
    let urlRequest = $(this).data('url');
    let that = $(this);

    Swal.fire({
        title: 'Are you sure?',
        text: "You won't be able to revert this!",
        icon: 'warning',
        showCancelButton: true,
        confirmButtonColor: '#3085d6',
        cancelButtonColor: '#d33',
        confirmButtonText: 'Yes, delete it!'
    }).then((result) => {
        if (result.value) {
            $.ajax({
                type:'GET',
                url: urlRequest,
                success:function (data) {
                    if (data.code == 200){
                        that.parent().parent().remove();
                        Swal.fire(
                            'Deleted!',
                            'Your file has been deleted.',
                            'success'
                        )
                    }
                },
                error:function () {

                }
            })

        }
    })
}

$(function () {
    $(document).on('click','.action_delete',actionDelete);

})

-    Vào terminal chạy lệnh: 

php artisan make:migration add_column_deleted_at_to_sliders --table=sliders

-    Vào 2021_07_22_070005_add_column_deleted_at_to_sliders.php

<?php

use Illuminate\Support\Facades\Schema;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Database\Migrations\Migration;

class AddColumnDeletedAtToSliders extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::table('sliders', function (Blueprint $table) {
            $table->softDeletes();
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::table('sliders', function (Blueprint $table) {
            //
        });
    }
}

-    Vào terminal chạy lệnh:  php artisan migrate

-    Vào resource => admin => slider =>  index.blade.php

<!-- Stored in resources/views/child.blade.php -->

@extends('layouts.admin')

@section('title')
    <title>Trang chủ</title>
@endsection

@section('css')
    <link rel="stylesheet" href="{{ asset('admins/slider/index/index.css') }}">
@endsection

@section('js')
    <script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script src="{{ asset('admins/slider/index/index.js') }}"></script>
@endsection



@section('content')
    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        @include('partials.content-header',['name'=>'Slider', 'key'=>'Add'])
        <!-- /.content-header -->

        <!-- Main content -->
        <div class="content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-md-12">
                        <a href="{{ route('slider.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 Slider</th>
                                <th scope="col">Description</th>
                                <th scope="col">Hình ảnh</th>
                                <th scope="col">Action</th>
                            </tr>
                            </thead>
                            <tbody>

                            @foreach($sliders as $slider)
                                <tr>
                                    <th scope="row">{{ $slider->id }}</th>
                                    <td>{{ $slider->name }}</td>
                                    <td>{{ $slider->description }}</td>
                                    <td>
                                        <img class="image_slider_150_100" src="{{ $slider->image_path }}" alt="">
                                    </td>
                                    <td>
                                        <a href="{{ route('slider.edit',['id'=>$slider->id]) }}"
                                           class="btn btn-default">Edit</a>
                                        <a href=""
                                           class="btn btn-danger action_delete"
                                           data-url={{ route('slider.delete',['id'=>$slider->id]) }}>Delete</a>
                                    </td>
                                </tr>
                            @endforeach
                            </tbody>
                        </table>
                    </div>
                    <div class="col-md-12">
                        {{ $sliders->links() }}
                    </div>

                </div>
                <!-- /.row -->
            </div>
            <!-- /.container-fluid -->
        </div>
        <!-- /.content -->
    </div>
    <!-- /.content-wrapper -->
@endsection