@extends('layouts/app')

@section('content')
    <div class="row mb-2">
        <div class="col-xl-12 col-12">
            <button class="btn btn-primary" href="#" data-toggle="modal" data-target="#createSociety">Ajouter
            </button>
        </div>
    </div>
    <table class="table table-striped">
        <thead class="">
        <tr>
            <th scope="col">#</th>
            <th scope="col">Nom</th>
            <th scope="col">Cle</th>
        </tr>
        </thead>
        <tbody>
        @if($societies)
            @foreach($societies as $society)
                <tr>
                    <th scope="row">{{$society->id}}</th>
                    <td>{{$society->nom}}</td>
                    <td>{{$society->cle}}</td>
                    <td>
                        <div class="dropdown d-inline-block">
                            <button type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true"
                                    aria-expanded="false" data-display="static">
                                <i class="mdi mdi-dots-vertical text-secondary" style="font-size: 20px;"></i>
                            </button>
                            <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                                <a class="dropdown-item" href="{{route("society.edit", ['id' => $society->id])}}">Editer</a>

                                <a class="dropdown-item" href="{{ route('society.destroy',$society->id) }}"
                                   onclick="event.preventDefault();
                                       document.getElementById('delete-society-form-{{$society->id}}').submit();">
                                    {{ __('Supprimer') }}
                                </a>
                                <form id="delete-society-form-{{$society->id}}" action="{{ route('society.destroy',$society->id) }}" method="POST" >
                                    @csrf
                                    @method('DELETE')
                                </form>
                            </div>
                        </div>
                    </td>
                </tr>
            @endforeach
        @endif
        </tbody>
    </table>

    <div class="modal fade" id="createSociety" tabindex="-1" role="dialog"
         aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered " role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalCenterTitle">Ajouter une société</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    @if ($errors->any())
                        <div class="alert alert-danger">
                            <ul>
                                @foreach ($errors->all() as $error)
                                    <li>{{ $error }}</li>
                                @endforeach
                            </ul>
                        </div>
                    @endif
                    <form action="{{route('society.store')}}" method="POST">
                        @csrf
                        <div class="form-row mb-2">
                            <div class="col-lg-6 col-12">
                                <div class="input-group">
                                    <div class="input-group-prepend">
														<span class="input-group-text">
															<i class="mdi mdi-account-card-details"></i>
														</span>
                                    </div>
                                    <input type="text" name="nom" class="form-control" placeholder="Nom de la société"
                                           aria-label="Nom" required>
                                </div>

                            </div>
                            <div class="col-lg-6 col-12">
                                <div class="input-group">
                                    <div class="input-group-prepend">
														<span class="input-group-text">
															<i class="mdi mdi-shield-key-outline"></i>
														</span>
                                    </div>
                                    <input type="text" name="cle" class="form-control" placeholder="Clé"
                                           aria-label="clé" required>
                                </div>
                            </div>
                        </div>
                        <button type="submit" class="btn btn-primary float-right">Créer</button>
                    </form>
                </div>
            </div>
        </div>
    </div>

@endsection