كيفاش نصاوب ألبوم صور بإستعمال Laravel الجزء الثاني
فهاد الجزء الثاني غادي نشوفو كيفاش نزيدو الصور فقاعدة البيانات نعرضوها فالصفحة الرئيسية و نعطيو للمستخدم المكانية ديال أنه يمسح الصورة لي ختارها من قاعدة البيانات.
نظرة سريعة بالفيديو
- صفحة إضافة الصور لقاعدة البيانات
باش نصاوبو هاد الصفحة غادي نزيد مجلد ف resources/views نسميه photos منبعد داخل هاد المجلد غادي نزيد ملف نسميه create.blade.php الكود النهائي ديال الملف هو :
@extends('layouts.index-master')
@section('title')
Ajouter une photo
@endsection
@section('styles')
@endsection
@section('header')
@include('includes.header')
@endsection
@section('content')
<div class="row">
<div class="col-md-6 col-md-offset-3">
@include('includes.alert')
<div class="panel panel-default">
<div class="panel panel-body">
<h3 class="text-primary">Ajouter une photo</h3>
<hr>
<form method="POST" action="{{route('photos.store')}}" enctype="multipart/form-data">
<label for="photo">Photo</label>
<div class="form-group">
<input type="file" name="photo" id="photo">
<input type="hidden" name="_token" value="{{Session::token()}}">
</div>
<div class="form-group">
<button type="submit" class="btn btn-success">Enregister</button>
</div>
</form>
</div>
</div>
</div>
</div>
@endsection
@section('scripts')
@endsection
- إنشاء PhotosController.php
باش نتمكن من إضافة الصور خاص نزيد controller لي غادي نسميه PhotosController.php غادي نمشي ل cmd من بعد نكتب الأمر cd c:wamp/www/PhotosGallery ثم غادي نكتب الأمر php artisan make:controller PhotosController --resource غادي نمشي ل app/http/controllers تما غادي لقى ل controller تزاد غادي نزيد فيه ل الكود لي غادي يمكن من إضافة ومسح الصور من قاعدة البيانات.
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Photo;
use App\Http\Requests;
class PhotosController extends Controller
{
/**
* Display a listing of the resource.
*
* @return \Illuminate\Http\Response
*/
public function index()
{
//
$photos = Photo::all();
return view('index',compact('photos'));
}
/**
* Show the form for creating a new resource.
*
* @return \Illuminate\Http\Response
*/
public function create()
{
//
return view('photos.create');
}
/**
* Store a newly created resource in storage.
*
* @param \Illuminate\Http\Request $request
* @return \Illuminate\Http\Response
*/
public function store(Request $request)
{
//
$this->validate($request, [
'photo' => 'required|image|mimes:jpeg,png,jpg,gif,svg|max:2048',
]);
if($request->hasFile('photo')){
$file = $request->file('photo');
$name = time().'_'.$file->getClientOriginalName();
$file->move('images',$name);
$photo = new Photo();
$photo->name = $name;
$photo->save();
return redirect()->route('photos.index')->with(['success'=>'Photo ajoutée avec succés']);
}
return redirect()->route('photos.index')->with(['fail'=>'Erreur lors de l\'enregistrement de votre photo']);
}
/**
* Display the specified resource.
*
* @param int $id
* @return \Illuminate\Http\Response
*/
public function show($id)
{
//
}
/**
* Show the form for editing the specified resource.
*
* @param int $id
* @return \Illuminate\Http\Response
*/
public function edit($id)
{
//
}
/**
* Update the specified resource in storage.
*
* @param \Illuminate\Http\Request $request
* @param int $id
* @return \Illuminate\Http\Response
*/
public function update(Request $request, $id)
{
//
}
/**
* Remove the specified resource from storage.
*
* @param int $id
* @return \Illuminate\Http\Response
*/
public function destroy($id)
{
//
$photo = Photo::findOrFail($id);
unlink(public_path().'/images/'.$photo->name);
$photo->delete();
return redirect()->route('photos.index')->with(['success'=>'Photo supprimée avec succés']);
}
}
-الملف index.blade.php
غادي نزيد الصفحة الرئيسية فresources/views نسميها index.blade.php لي غادي يكون فيها العرض ديال كل الصور لي عندنا فقاعدة البيانات و أزرار لي غادي تمكنا من مشاهدة الصورة أو حذفها.
@extends('layouts.index-master')
@section('title')
Photo Gallery
@endsection
@section('styles')
<link rel="stylesheet" href="{{URL::to('/css/main.css')}}">
@endsection
@section('header')
@include('includes.header')
@endsection
@section('content')
<div class="row">
<div class="col-md-12">
@include('includes.alert')
<div class="row">
@foreach($photos as $photo)
<div class="col-md-3">
<div class="panel panel-default">
<div class="panel-body">
<img src="{{URL::to('/images/'.$photo->name)}}" alt="" class="thumbnail image" height="200" width="230">
</div>
<div class="panel-footer">
<a href="#showImage{{$photo->id}}" class="label label-primary" data-toggle="modal"><i class="fa fa-eye"></i> Voir</a>
<a href="#deleteImage{{$photo->id}}" class="label label-danger" data-toggle="modal"><i class="fa fa-trash"></i> Supprimer</a>
</div>
</div>
</div>
<!--affiche image modal-->
<div class="modal fade" id="showImage{{$photo->id}}" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel"></h4>
</div>
<div class="modal-body">
<img src="{{URL::to('/images/'.$photo->name)}}" alt="" class="thumbnail" height="300" width="550">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Fermer</button>
</div>
</div>
</div>
</div>
<!--supprimer image modal-->
<div class="modal fade" id="deleteImage{{$photo->id}}" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Voulez vous vraiment supprimer cette image ?</h4>
</div>
<div class="modal-body">
<img src="{{URL::to('/images/'.$photo->name)}}" alt="" class="thumbnail" height="300" width="550">
</div>
<div class="modal-footer">
<form method="POST" action="{{route('destroy',$photo->id)}}">
<input type="hidden" name="_token" value="{{csrf_token()}}">
<button type="submit" class="btn btn-danger">Oui</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Non</button>
</form>
</div>
</div>
</div>
</div>
@endforeach
</div>
</div>
</div>
@endsection
@section('scripts')
@endsection
-الملف routes.php
فالأخير غادي نزيد الكود لي غادي يمكنا باش نتصفحوا جميع الصفحات فالملف routes.php لي كاين فapp/http الكود النهائي ديالو :
<?php
/*
|--------------------------------------------------------------------------
| Application Routes
|--------------------------------------------------------------------------
|
| Here is where you can register all of the routes for an application.
| It's a breeze. Simply tell Laravel the URIs it should respond to
| and give it the controller to call when that URI is requested.
|
*/
Route::get('/', function () {
return view('index');
});
Route::resource('/photos','PhotosController');
Route::post('/photo/delete/{id}',[
'uses' => 'PhotosController@destroy',
'as' => 'destroy'
]);
