Laravel

On va terminer dans cet article la partie frontend de la boutique avec des notifications, des pages d'information et une mémorisation des connexions des clients.

Vous pouvez télécharger un ZIP du projet ici.

Les notifications

On va prévoir deux notifications pour les administrateurs :

• inscription d'un nouvel utilisateur
• nouvelle commande (même si on a déjà mis en place l'envoi d'un email)

On va utiliser le système de notification avec la base de données. On avait anticipé la création de la table.

Nouveau client

On crée la notification pour un nouveau client :

php artisan make:notification NewUser

<?php

namespace App\Notifications;

use Illuminate\Bus\Queueable;
use Illuminate\Contracts\Queue\ShouldQueue;
use Illuminate\Notifications\Notification;

class NewUser extends Notification
{
    use Queueable;

    /**
     * Get the notification's delivery channels.
     *
     * @param  mixed  $notifiable
     * @return array
     */
    public function via($notifiable)
    {
        return ['database'];
    }

    /**
     * Get the array representation of the notification.
     *
     * @param  mixed  $notifiable
     * @return array
     */
    public function toArray($notifiable)
    {
        return [
            'name' => auth()->user()->name,
        ];
    }
}

On récupère le nom du client connecté. Et dans le contrôleur RegisterController on notifie les administrateurs :

use App\Notifications\NewUser;

...

protected function registered(Request $request, $user)
{
    ...

    $admins = User::whereAdmin(true)->get();
    foreach($admins as $admin) {
        $admin->notify(new NewUser());
    }        

    ...
}

Maintenant pour chaque nouveau client on a un enregistrement dans la table des notifications : Il faudra prévoir de gérer ça dans la partie administration de la boutique.

Nouvelle commande

On crée la notification pour une nouvelle commande :

php artisan make:notification NewOrder

<?php

namespace App\Notifications;

use Illuminate\Bus\Queueable;
use Illuminate\Contracts\Queue\ShouldQueue;
use Illuminate\Notifications\Notification;
use App\Models\Order;

class NewOrder extends Notification
{
    use Queueable;

    protected $order;

    /**
     * Create a new notification instance.
     *
     * @return void
     */
    public function __construct(Order $order)
    {
        $this->order = $order;
    }

    /**
     * Get the notification's delivery channels.
     *
     * @param  mixed  $notifiable
     * @return array
     */
    public function via($notifiable)
    {
        return ['database'];
    }

    /**
     * Get the array representation of the notification.
     *
     * @param  mixed  $notifiable
     * @return array
     */
    public function toArray($notifiable)
    {
        return [
            'order' => $this->order->reference,
        ];
    }
}

On mémorise la référence de la commande. Et dans le contrôleur OrderController (méthode store) on notifie les administrateurs :

use App\Notifications\NewOrder as NewOrderNotification;

...

foreach($admins as $admin) {
    Mail::to($admin)->send(new NewOrder($shop, $order, $user));
    $admin->notify(new NewOrderNotification($order));
}

Maintenant pour chaque nouvelle commande on a un enregistrement dans la table des notifications : Il faudra là aussi prévoir de gérer ça dans la partie administration de la boutique.

Les pages

On a un certain nombre de page d'information (mentions légales, livraisons...). Il faut pouvoir les afficher avec un menu dans le footer.

On complète le contrôleur HomeController :

use App\Models\{ Product, Page };

...

public function page(Page $page)
{
    return view('page', compact('page'));
}

On ajoute une route :

Route::get('page/{page:slug}', 'HomeController@page')->name('page');

On accède à une page avec son slug donc on fait un binding en précisant cette colonne. On crée une vue :

@extends('layouts.app')

@section('content')
<div class="container">
  <h3>{{ $page->title }}</h3>
  <div class="row">
     
    <div class="card">
      <div class="card-content">
        {!! $page->text !!}
      </div>
    </div>

</div>
@endsection

Le code en est évidemment très simple. Dans AppServiceProvider on va partager les pages avec toutes les vues :

use App\Models\{ Shop, Page };

...

public function boot()
{
    ...
    View::share('pages', Page::all());

Il ne reste plus qu'à créer le menu dans le layout (layouts/app.blade.php) :

<h5 class="white-text">Informations</h5>
<ul>
  @foreach ($pages as $page)
    <li><a class="grey-text text-lighten-3" href="{{ route('page', $page->slug) }}">{{ $page->title }}</a></li> 
  @endforeach
</ul>

On se retrouve avec les liens pour toutes les pages existantes et quand on clique on affiche la page corresspondante :

Mémorisation des connexions

Il peut être pratique de savoir qui est en ligne et aussi le dernier passage d'un client sur la boutique. je me suis inspiré de cet article pour cette partie.

On crée un middleware :

php artisan make:middleware LastUserActivity

<?php

namespace App\Http\Middleware;

use Closure;
use Carbon\Carbon;
use Cache;
use App\Models\User;

class LastUserActivity
{
    /**
     * Handle an incoming request.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \Closure  $next
     * @return mixed
     */
    public function handle($request, Closure $next)
    {
        if (auth()->check() && !auth()->user()->admin) {
            $id = auth()->user()->id;
            Cache::put('user-is-online-' . $id, true, Carbon::now()->addMinutes(1));
            auth()->user()->update(['last_seen' => now()]);
        }

        return $next($request);
    }
}

On l'ajoute dans le Kernel :

protected $middlewareGroups = [
    'web' => [
        ...
        \App\Http\Middleware\LastUserActivity::class,
    ],

Il ne restera plus qu'à ajouter la visualisation de cette information à l'administration !

Conclusion

On a terminé le codage du frontend ! Il doit bien traîner quelques bugs mais je compte sur votre perspicacité pour les traquer ! La prochaine étape sera de créer la partie administration et on a encore pas mal de travail !