@extends('layouts.app')

@section('content')
<section>
    <form method="POST" action="/adauga-categorii-spete">
        @csrf
        <label class="d-flex w-100 flex-column">
            Denumire categorie
            <input type="text" class="form-control" name="name" placeholder="Denumire categorie">
        </label>
        <button class="btn btn-success mt-2" type="submit">Adauga</button>
    </form>
    <div class="table-responsive">
        <table class="table">
            <thead>
                <tr>
                    <th scope="col">Nume</th>
                    <th scope="col">Adaugat de</th>
                    <th scope="col">Editat de</th>
                    <th scope="col">La data de</th>
                    <th scope="col">Actiuni</th>
                </tr>
            </thead>
            <tbody>
                @foreach ($categories as $category)
                @php
                $addedBy = App\Models\User::where('id',$category->created_by)->first();
                $editedBy = App\Models\User::where('id',$category->edited_by)->first();
                @endphp
                <tr>
                    <th scope="row">{{ $category->name }}</th>
                    <td>@if($addedBy) {{ $addedBy->username }} @else - @endif</td>
                    <td>@if($editedBy) {{ $editedBy->username }} @else - @endif</td>
                    <td> {{ $category->created_at }} </td>
                    <td><button class="btn btn-success" data-bs-toggle="modal"
                            data-bs-target="#editIssuesCategories{{ $category->id }}">Editeaza</button></td>
                </tr>

                <!-- Modal -->
                <div class="modal fade" id="editIssuesCategories{{ $category->id }}" tabindex="-1"
                    aria-labelledby="editIssuesCategories{{ $category->id }}Label" aria-hidden="true">
                    <div class="modal-dialog">
                        <div class="modal-content">
                            <div class="modal-header">
                                <h5 class="modal-title" id="editIssuesCategories{{ $category->id }}Label">Editeaza
                                    categoria {{ $category->name }} </h5>
                                <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                </button>
                            </div>
                            <form action="/editeaza-categorii-spete" method="POST">
                                @csrf
                                <div class="modal-body">
                                    <input type="hidden" value="{{ $category->id }}" name="id">
                                    <label class="d-flex w-100 flex-column">
                                        Editare categorie
                                        <input type="text" class="form-control" name="name"
                                            placeholder="Editare categorie" value="{{ $category->name }}">
                                    </label>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-secondary"
                                        data-bs-dismiss="modal">Inchide</button>
                                    <button type="submit" class="btn btn-primary">Editeaza</button>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>

                @endforeach
            </tbody>
        </table>
    </div>
</section>
@endsection

@push('js')


<script>

</script>

@endpush