@extends('layouts.main-layout')

@section('title')
    {{ config('app.name') }} - Home
@endsection

@section('content')
<div class="container">
    <div class="row justify-content-center">
        <div class="col-lg-12 my-3 text-center">
                <h2>Sve Apoteke</h2>
                
                <table class="table table-hover table-bordered data-table data-table-default">
                    <thead>
                        <tr>
                            <th>#</th>
                            <th>Naziv apoteke</th>
                            <th>Akcije</th>
                        </tr>
                    </thead>
                    <tbody>
                        @if(!empty($pharmacies) && count($pharmacies) > 0)
                            @foreach($pharmacies as $pharmacy)
                                <tr>
                                    <td>{{ $pharmacy->pharmacy_id }}</td>
                                    <td>{{ $pharmacy->pharmacy_name }}</td>
                                    <td>
                                        <a href="{{ url('pharmacy/show', $pharmacy->pharmacy_id) }}" class="btn btn-primary">Prikaži Detalje</a>
                                        <a href="#" data-pharmacy-id="{{ $pharmacy->pharmacy_id }}" class="btn btn-danger delete-btn">Obriši</a>
                                    </td>
                                </tr>
                            @endforeach
                        @endif
                    </tbody>
                </table>
        </div>
        <div class="col-lg-6 text-center my-5">
            <h2>Registruj novu apoteku</h2>
            <form action="{{ url('pharmacy/store') }}" method="POST">
                @csrf
                <div class="form-group my-3">
                    <label for="Pharmacy name">Naziv apoteke</label>
                    <input type="text" name="pharmacy_name" class="form-control shadow-lg" placeholder="Ime..." required minlength="3" maxlength="255">
                </div>
                <div class="form-group my-3">
                    <input type="submit" value="Zapiši apoteku" class="btn btn-primary">
                </div>
            </form>
        </div>
    </div>
</div>

<script>
    $(document).ready(function(){
        $(".data-table-default").DataTable({
            responsive: true,
            language: {
                paginate: {
                    previous: '<i class="fa fa-angle-left"></i>',
                    next: '<i class="fa fa-angle-right"></i>',
                },
            },
        });
    });

    $(".delete-btn").click(function(event){
            event.preventDefault();
            let pharmacy_id = $(this).data('pharmacy-id');
            $.ajax({
                url: "{{ url('pharmacy/delete') }}",
                type: "DELETE",
                data: {
                    _token: "{{ csrf_token() }}",
                    id: pharmacy_id
                },
                success: function(response){
                    console.log("Response: ", response);
                    if(response.status == 'success'){
                        window.location.reload();
                    }
                },
                error: function(response){
                    console.log("Error: ", response);
                    let res = JSON.parse(response.responseText);

                    if(res.status == 'errors'){
                        swal({
                            icon: 'error',
                            title: 'Oops...',
                            text: res.message,
                        });
                        return;
                    }
                    swal({
                        icon: 'error',
                        title: 'Oops...',
                        text: 'Nešto je pošlo po zlu, molimo pokušajte ponovo kasnije!',
                    });
                }
            });
        });
</script>
@endsection