@extends('layouts.app')

@section('content')
    <div class="container">
        <div>
            <h2 class="pb-4">Ma structure</h2>
        </div>

    @include('layouts.commons.errors')
    @include('layouts.commons.success')

    <div class="row">
        <div class="col-8">
            <ul class="nav nav-tabs mt-4" id="myTab" role="tablist">
                <li class="nav-item">
                    <a class="nav-link active" id="projets-tab" data-toggle="tab" href="#projets" role="tab"
                       aria-controls="projets" aria-selected="true">Projets</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" id="statuts-tab" data-toggle="tab" href="#statuts" role="tab"
                       aria-controls="statuts" aria-selected="true">Statuts projets</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" id="indicateurs-tab" data-toggle="tab" href="#indicateurs" role="tab"
                       aria-controls="indicateurs" aria-selected="true">Indicateurs</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" id="paats-tab" data-toggle="tab" href="#paats" role="tab"
                       aria-controls="paats" aria-selected="true">PAAT</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" id="utilisateurs-tab" data-toggle="tab" href="#utilisateurs" role="tab"
                       aria-controls="utilisateurs" aria-selected="true">Utilisateurs</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" id="bibliotheque-tab" data-toggle="tab" href="#bibliotheque" role="tab"
                       aria-controls="bibliotheque" aria-selected="true">Bibliothèque</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" id="parametres-tab" data-toggle="tab" href="#parametres" role="tab"
                       aria-controls="parametres" aria-selected="true">Paramètres</a>
                </li>
            </ul>

            <div class="tab-content p-4" id="myTabContent">
                <div class="tab-pane fade show active" id="projets" role="tabpanel" aria-labelledby="projets-tab">
                    @include('parametres.structure.onglets.projets')
                </div>
                <div class="tab-pane fade show" id="statuts" role="tabpanel" aria-labelledby="statuts-tab">
                    @include('parametres.structure.onglets.statuts')
                </div>
                <div class="tab-pane fade show" id="indicateurs" role="tabpanel" aria-labelledby="indicateurs-tab">
                    @include('parametres.structure.onglets.indicateurs')
                </div>
                <div class="tab-pane fade show" id="paats" role="tabpanel" aria-labelledby="paats-tab">
                    @include('parametres.structure.onglets.paats')
                </div>
                <div class="tab-pane fade show" id="utilisateurs" role="tabpanel" aria-labelledby="utilisateurs-tab">
                    @include('parametres.structure.onglets.utilisateurs')
                </div>
                <div class="tab-pane fade show" id="bibliotheque" role="tabpanel" aria-labelledby="bibliotheque-tab">
                    @include('parametres.structure.onglets.bibliotheque')
                </div>
                <div class="tab-pane fade show" id="parametres" role="tabpanel" aria-labelledby="parametres-tab">
                    @include('parametres.structure.onglets.parametres')
                </div>
            </div>
        </div>

        <div class="card col-4">
            <div class="card-body">
                <div class="row">
                    @isset($structure->logo)
                        <img alt="Logo de la structure" class="m-auto logo-structure" src="{{ Storage::url($structure->logo) }}" />
                    @else
                        <img alt="Logo de la structure" class="m-auto float-right logo-structure" src="{{ Storage::url('public/structures/default/logo/logo.png') }}" />
                    @endif
                </div>
                <h4 class="card-title clearfix text-center mt-4">{{ $structure->nom }}</h4>

                <form method="post" action="{{ route('structure.changer-logo', $structure->id) }}" enctype="multipart/form-data">
                    @csrf
                    <div class="input-group">
                        <div class="custom-file">
                            <input type="file" class="custom-file-input" id="logo" value="{{ old('logo') }}" name="logo" accept="image/x-png,image/jpeg" aria-describedby="logo">
                            <label class="custom-file-label" for="logo">Changer le logo</label>
                        </div>
                        <div class="input-group-append">
                            <button class="btn btn-outline-success btn-sm" type="submit" id="logo">Sauvegarder</button>
                        </div>
                    </div>
                </form>

                <hr>
                <h4 class="card-subtitle text-muted">Les utilisateurs</h4>
                <ul>
                    @foreach($users_by_role as $key => $value)
                        <li>{{ $key }} : {{ $value }}</li>
                    @endforeach
                </ul>
            </div>
        </div>
    </div>
@endsection

@section('unique-js')
    <script src="{{ asset('js/commons/forms/input-file.js') }}"></script>
@endsection