{{-- @php
    dump($option)
@endphp --}}
@use('App\Enums\OptionStatus')
@extends('front.layouts.base')
@section('content')

    <div class="pb-0 section bg-dark">
        <div class="container">

            <div class="row">

     
                <div class="pt-5 mb-5 col-lg-8 col-12 order-lg-1 order-2">
                    <h1 class="text-bebas">Mon projet</h1>
                    <span class="mb-5 text-grey d-block">Suivez l'avancée en temps réel de votre investissement et retrouvez toutes les étapes de vente</span>
                    <x-user.workflow.inc.step-description :$option />
                    @if($program)
                        <x-user.nav-tab :$option :$program />
                    @endif
                </div>
                <div class="pt-5 mb-5 col-lg-4 col-12 order-lg-2 order-1">
                    <div class="sticky-top sticky-top-distance">
                        <div class="mb-5 position-relative">
                            <div class="overflow-hidden bg-secondary border-radius-default w-100">
                                <span class="pb-3 d-inline-block ps-4">
                                    <span class="pt-3 text-bebas d-block">Mes projets en cours</span>
                                    <small class="d-inline-block">
                                        N°
                                    </small>
                                    <small class="d-inline-block">
                                        {{ $option->lot->number }}
                                    </small>
                                    <small class="d-inline-block ps-1 pe-1 text-grey">|</small>
                                    <small class="d-inline-block">
                                        {{ $option->lot->type }}
                                    </small>
                                    <small class="d-inline-block ps-1 pe-1 text-grey">|</small>
                                    <small>{{ $option->lot->surface }}</small> <small class="text-roboto">m²</small>
                                    <small class="d-inline-block ps-1 pe-1 text-grey">|</small>
                                    <small>{{ $option->lot->floor }}</small>
                                </span>
                                <span class="pt-5 cursor-pointer bg-blue text-primary pe-3 ps-3 float-end" style="min-height: 80px" onclick="if($('#selection-project').css('display') == 'none'){$('#selection-project').show();$('#selection-icon').css('transform', 'rotate(180deg)')}else{$('#selection-project').hide();$('#selection-icon').css('transform', 'rotate(0deg)')}" id="selection-project-btn"><i class="far fa-chevron-down" id="selection-icon"></i></span>
                            </div>
                            <div class="pt-4 pb-4 border cursor-pointer bg-secondary border-dark border-radius-default selection-project w-100" id="selection-project" style="display: none">
                                @foreach ($options->whereIn('status',[OptionStatus::EN_COURS, OptionStatus::ENVOYEE, OptionStatus::ACCEPTEE, OptionStatus::CONFIRMEE]) as $key => $opt)
                                    {{-- ATTENTION NE PAS METTRE DE SEEDERS EN PROD !!! --}}
                                    @if($opt->lot !== null)
                                        <a href="{{ route('projects.show', [$opt]) }}" class="ps-4 d-block">
                                            <small class="d-inline-block">
                                                N° {{ $opt->lot->number }}
                                            </small>
                                            <small class="d-inline-block ps-1 pe-1 text-grey">|</small>
                                            <small class="d-inline-block">
                                                {{ $opt->lot->type }}
                                            </small>
                                            <small class="d-inline-block ps-1 pe-1 text-grey">|</small>
                                            <small>{{ $opt->lot->surface }}</small> <small class="text-roboto">m²</small>
                                            <small class="d-inline-block ps-1 pe-1 text-grey">|</small>
                                            <small>{{ $opt->lot->floor }}</small>
                                        </a> 
                                        @if($key + 1 !== $options->count())
                                            <hr>
                                        @endif
                                    @endif
                                @endforeach    
                            </div>
                        </div>
                        @if($option->lot !== null && $option->lot->documents->count() > 0)
                            <div class="pt-5 pb-5 mb-5 overflow-hidden bg-secondary border-radius-default w-100 ps-4 pe-4 d-lg-block d-none">
                                <span class="d-block text-bebas">Documents du lot</span>
                                <hr>
                                @foreach ($option->lot->documents as $key => $document)
                                    <div class="documents-list">
                                        <span class="float-start">{{ $document->name }}</span> 
                                        <a class="d-inline-block text-primary text-bebas float-end" href="{{ $document->url }}" target="_blank">Télécharger</a> 
                                    </div>
    
                                    @if($key + 1 !== $option->lot->program->documents->count())
                                        <hr>
                                    @endif
                                @endforeach
                            </div>
                        @endif
                        @if($option->lot->program !== null && $option->lot->program->documents->count() > 0)
                            <div class="pt-5 pb-5 mb-5 overflow-hidden bg-secondary border-radius-default w-100 ps-4 pe-4 d-lg-block d-none">
                                <span class="d-block text-bebas">Documents du programme</span>
                                <hr>
                                @foreach ($option->lot->program->documents as $key => $document)
                                    <div class="documents-list">
                                        <span class="float-start">{{ $document->name }}</span> 
                                        <a class="d-inline-block text-primary text-bebas float-end" href="{{ $document->url }}" target="_blank">Télécharger</a> 
                                    </div>
    
                                    @if($key + 1 !== $option->lot->program->documents->count())
                                        <hr>
                                    @endif
                                @endforeach
                            </div>
                        @endif
                        <div class="d-lg-block d-none">
                            <x-user.ask-bis />
                        </div>
                    </div>
                </div>
            </div>
            @if($option->lot !== null && $option->lot->documents->count() > 0)
            <div class="pt-5 pb-5 mb-5 overflow-hidden bg-secondary border-radius-default w-100 ps-4 pe-4 d-lg-none d-block">
                <span class="d-block text-bebas">Documents du lot</span>
                <hr>
                @foreach ($option->lot->documents as $key => $document)
                    <div class="documents-list">
                        <span class="float-start">{{ $document->name }}</span> 
                        <a class="d-inline-block text-primary text-bebas float-end" href="{{ $document->url }}" target="_blank">Télécharger</a> 
                    </div>

                    @if($key + 1 !== $option->lot->program->documents->count())
                        <hr>
                    @endif
                @endforeach
            </div>
        @endif
        @if($option->lot->program !== null && $option->lot->program->documents->count() > 0)
            <div class="pt-5 pb-5 mb-5 overflow-hidden bg-secondary border-radius-default w-100 ps-4 pe-4 d-lg-none d-block">
                <span class="d-block text-bebas">Documents du programme</span>
                <hr>
                @foreach ($option->lot->program->documents as $key => $document)
                    <div class="documents-list">
                        <span class="float-start">{{ $document->name }}</span> 
                        <a class="d-inline-block text-primary text-bebas float-end" href="{{ $document->url }}" target="_blank">Télécharger</a> 
                    </div>

                    @if($key + 1 !== $option->lot->program->documents->count())
                        <hr>
                    @endif
                @endforeach
            </div>
        @endif
            <div class="d-lg-none d-block pt-5">
                <x-user.ask-bis />
            </div>
        </div>
    </div>
@endsection

@section('jquery-ui.lib.js')
    <script src="https://code.jquery.com/ui/1.14.0/jquery-ui.js" defer></script>
@endsection
@section('jquery-ui.tabs.js')
    <script src="{{ asset('libs/jquery-ui/js/tabs.js') }}?t={{ config('app.js_version') }}" defer></script>
@endsection
@section('jquery-ui.lib.css')
    <link rel="stylesheet" href="https://code.jquery.com/ui/1.14.0/themes/base/jquery-ui.css" async>
    <link rel="stylesheet" href="{{ asset('libs/jquery-ui/css/tabs.css') }}?t={{ config('app.js_version') }}" async>
@endsection

@section('user.show.tache.js')
    <script src="{{ asset('assets/js/user/script.js') }}?t={{ config('app.js_version') }}" defer></script>
@endsection