07 Home strana

Neću se baviti vizuelnim modifikacijama stranice, već ću se samo fokusirati na funkcionalnosti.

U zadatku se traži da home strana ima jednu formu za unos novog događaja i jednu tabelu za prikaz svih događaja.

Kreiranje forme

Modifikovaćemo home.blade.php fajl:

@extends('layouts.app')

@section('content')
<div class="container">
    <div class="row">
        <div class="col-md-8 col-md-offset-2">
            <div class="panel panel-default">
                <div class="panel-heading">New event</div>

                <div class="panel-body">
                    <form method="post" action="/home">
                        {{ csrf_field() }}
                        <div class="form-group">
                            <label for="title">Title</label>
                            <input type="text" name="title" class="form-control" id="title" placeholder="Izrada testnog projekta">
                        </div>
                        <div class="form-group">
                            <label for="description">Description</label>
                            <textarea class="form-control" name="description" id="description" placeholder="Danas sam radio to i to..."></textarea>
                        </div>
                        <button type="submit" class="btn btn-default">Submit</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

Vidite da forma postuje na /home url, potrebno je da dodamo tu rutu u web.php.

Route::post('/home', 'HomeController@postHome');

Sada nam nedostaje metoda postHome u HomeController pa radimo na njoj:

    public function postHome(Request $request)
    {
        $validator = Validator::make($request->all(), [
            'title' => 'required',
            'description' => 'required'
        ]);

        if ($validator->fails()) {
            return redirect()->back()
                ->withErrors($validator);
        }

        $event = new Event();
        $event->title = $request->get('title');
        $event->description = $request->get('description');
        $event->user_id = auth()->user()->id;
        $event->save();

        return redirect()->back()
            ->with('status', 'success')
            ->with('message', 'Uspješno ste dodali događaj.');
    }

Na početku radimo validaciju, ako nešto nije OK vraćamo grešku. Nakon toga kreiramo novi Event objekat, dodajemo podatke i čuvamo ga. Na kraju vraćamo success poruku.

Potrebno je da dodamo html kod za prikaz greške i success poruke. Dobra ideja je da taj kod izdvojimo u pojedinačne fajlove, radi ponovnog korišćenja.

U direktorijumu resources/views kreiramo novi direktorijum pod nazivom partials i u njemu dodajemo fajlove status.blade.php i errors.blade.php.

@if(session()->has('message'))
    <div class="alert alert-{{ session()->get('status') }} status-box">
        <button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
        {{ session()->get('message') }}
    </div>
@endif

@if(session()->has('errors'))
    <div class="alert alert-danger fade in">
        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
        <h4>Following errors occurred</h4>
        <ul>
            @foreach($errors->all() as $error)
                <li>{{ $error }}</li>
            @endforeach
        </ul>
    </div>
@endif

Sada se vraćamo u home.blade.php i uključujemo ova dva fajla:

            @include('partials.errors')
            @include('partials.status')

            <div class="panel panel-default">
                <div class="panel-heading">New event</div>

Sad možemo da testiramo submitovanje.

Ukoliko probate sa nekim praznim poljem da submitujete, dobćete grešku. Ako je sve OK dobićete success poruku i novi zadatak je upisan u bazu.

Kreiranje tabele

Ispod forme dodaću novu sekciju za tabelu:

  <div class="row">
        <div class="col-md-8 col-md-offset-2">
            <div class="panel panel-default">
                <div class="panel-heading">My events</div>
                <div class="panel-body">
                    <table class="table table-hover">
                        <thead>
                            <tr>
                                <th>Kreirano</th>
                                <th>Naslov</th>
                                <th>Opis</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($events as $event)
                                <tr>
                                    <td>{{ $event->created_at }}</td>
                                    <td>{{ $event->title }}</td>
                                    <td>{{ $event->description }}</td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

Iz tabele vidite da koristim varijablu events koja trenutno ne postoji, moramo da je dodamo u metodu index:

    public function index()
    {
        $events = Event::where('user_id', auth()->user()->id)->orderBy('created_at', 'desc')->get();

        return view('home', compact('events'));
    }

Prva linija index metode iz tabele events uzima linije koje pripadaju ulogovanom korisniku, sortira ih opadajuće po datumu i na kraju ubacuje ih u view fajl.

Sa ovim smo završili sve što je trebalo za korisnike tipa zaposleni.