@extends('layouts.designer')
@php $page_title = 'Mon profile'; @endphp
@section('meta-title', 'Espace designers')
@section('meta-keywords', '')
@section('meta-description', '')
@section('content')
    <div class="row">
        <div class="col-md-12">
            <div class="panel">
                <div class="row">
                    <div class="col-auto">
                        <div class="mt-3 mr-3">
                            Statut :

                            @if ($profile->status == 'Publié')
                                <b class="text-success">Publié</b>
                            @elseif($profile->status == 'Retiré')
                                <b class="text-warning">Non publié</b>
                            @elseif($profile->status == 'Draft')
                                <b class="text-warning">Draft</b>
                            @else
                                <b class="text-danger">En attente de validation</b>
                            @endif

                        </div>

                    </div>
                    <div class="col-auto">
                        <a class="btn btn1 no-borders hover-black bg-marron btn-xsm mt-2"
                            href="{{ route('designers.profile.draft', ['slug' => auth()->user()->slug]) }}"
                            target="_blank">Aperçu du profil</a>
                    </div>
                    <div class="col text-right">
                        <div class="mt-3 mr-3">
                            Vous devez valider votre profil pour publier les modifications
                        </div>

                    </div>
                    <div class="col-auto">
                        <a href="{{ route('designer.monprofile.demande_validation') }}"
                            class="btn btn-xsm btn8 mt-2">{!! lang('Valider mon profil') !!}</a>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-md-12">
            @include('front.designer.components.check_profile', ['profile' => 1])
        </div>

        <div class="col-md-6">
            <div class="panel">
                <div class="form">
                    <b>Photo de profil</b> * (mode portrait) <br><br>
                    <form method="post" action="{{ route('designer.monprofile.update') }}" enctype="multipart/form-data">
                        {{ csrf_field() }}
                        <div class="form-group row">
                            <div class="col-md-3">
                                <label>{!! lang('Photo') !!}</label>
                            </div>
                            <div class="col-md-9">
                                <input type="file" id="choose_file_photo_profile" accept="image/*" required=""
                                    class="inputfile" name="photo">
                                <label for="choose_file_photo_profile" {{ $designer->photo ? 'class=file-apercu' : '' }}>
                                    <i class="fa fa-upload"></i>
                                    @if ($designer->photo)
                                        <span>{{ $designer->photo }}</span>
                                        <a class="action bg-secondary text-white" href="{{ asset($designer->photo) }}"
                                            target="_blank">
                                            <i class="fa fa-eye"></i>
                                        </a>
                                    @else
                                        <span>{!! lang('Choisir un fichier') !!}&hellip;</span>
                                    @endif

                                </label>
                            </div>
                        </div>

                        <div class="text-right mt-20">
                            <button class="btn btn-sm btn2 btn-formulaire">{!! lang('Enregistrer') !!}</button>
                        </div>
                    </form>
                </div>
            </div>

            <div class="panel">
                <div class="form">
                    <b>Vidéo de présentation</b> (optionnel) <br><br>
                    <form method="post" action="{{ route('designer.monprofile.update') }}" enctype="multipart/form-data">
                        {{ csrf_field() }}
                        <div class="form-group row">
                            <div class="col-md-3">
                                <label>{!! lang('Vidéo') !!}</label>
                            </div>
                            <div class="col-md-9">

                                <input type="text" required="" class="form-control" name="video"
                                    value="{{ $profile->video }}">
                                @if ($profile->video)
                                    <iframe class="mt-3" src="{{ $profile->url_embed }}" allowfullscreen width="100%"
                                        height="400" frameborder="0"></iframe>
                                @endif
                            </div>
                        </div>

                        <div class="text-right mt-20">
                            <button class="btn btn-sm btn2 btn-formulaire hide-disabled">{!! lang('Enregistrer') !!}</button>
                        </div>
                    </form>
                </div>
            </div>

            <div class="panel">
                <form class="disabled" method="post" action="{{ route('designer.monprofile.update') }}">
                    {{ csrf_field() }}
                    <b>{!! lang('Types de projets') !!}</b> * <br>

                    <div class="row mt-3">

                        <div class="form-group form-inline col-4">
                            <label>
                                <input type="checkbox" value="residentiel" name="types[]"
                                    {{ in_array('residentiel', $profile->types->pluck('libelle')->toArray()) ? 'checked' : '' }}>
                                <span class="ml-2">Résidentiel</span>
                            </label>
                        </div>

                        <div class="form-group form-inline col-4">
                            <label>
                                <input type="checkbox" value="commercial" name="types[]"
                                    {{ in_array('commercial', $profile->types->pluck('libelle')->toArray()) ? 'checked' : '' }}>
                                <span class="ml-2">Commercial</span>
                            </label>
                        </div>

                    </div>
                    <div class="text-right">
                        <div class="btn btn-sm btn2 btn-formulaire show-disabled">{!! lang('Modifier') !!}</div>
                        <button class="btn btn-sm btn2 btn-formulaire hide-disabled">{!! lang('Enregistrer') !!}</button>
                    </div>
                </form>
            </div>

            <div class="panel">
                <form class="disabled" method="post" action="{{ route('designer.monprofile.update') }}">
                    {{ csrf_field() }}
                    <b>{!! lang('Styles Favoris') !!}</b> * {!! lang('(Vous pouvez choisir entre 1 et 3 styles )') !!} <br>

                    <div class="row mt-3 styles_checkbox">

                        @foreach (\App\Models\StyleDeco::get() as $style)
                            <div class="form-group form-inline col-4">
                                <label>
                                    <input type="checkbox" value="{{ $style->id }}" name="styles[]"
                                        {{ in_array($style->name, $profile->_styles->pluck('libelle')->toArray()) ? 'checked' : '' }}>
                                    <span class="ml-2">{{ $style->name }}</span>
                                </label>
                            </div>
                        @endforeach

                    </div>
                    <div class="text-right">
                        <div class="btn btn-sm btn2 btn-formulaire show-disabled">{!! lang('Modifier') !!}</div>
                        <button class="btn btn-sm btn2 btn-formulaire hide-disabled">{!! lang('Enregistrer') !!}</button>
                    </div>
                </form>
            </div>

            <div class="panel">
                <b>Portfolio</b> * ( Vous devez choisir 6 visuels, photos, plans, ... ) <br>

                <div class="font-size-13 mt-2 text-danger">Format recommandé : paysage A4 largeur / hauteur = 1.8 (Exemple :
                    1920px x 1080px ou 780px x 440px)</div>
                <br>

                @foreach ($profile->photos as $photo)
                    <div class="mb-20 photo-item formation-item">
                        <div class="btn-icons">
                            @if (!$photo->cover)
                                <a href="{{ route('designer.monprofile.photos.cover', $photo->id) }}" class=" btn-check">
                                    Définir comme photo de couverture
                                </a>
                            @else
                                <a class="btn-check bg-black text-white">
                                    Photo de couverture
                                </a>
                            @endif
                            <a href="{{ route('designer.monprofile.photos.delete', $photo->id) }}" class="btn-icon"><i
                                    class="fa fa-trash"></i></a>
                        </div>

                        <div style="width: 676px; height: 381px; border: 1px solid red; background: red">

                            <img src="{{ asset($photo->url) }}"
                                style="width: 674px; height: 379px; max-width: unset; object-fit: cover" alt="">
                        </div>

                    </div>
                @endforeach

                @if ($profile->photos->count() < 6)
                    <form class="formation-item" action="{{ route('designer.monprofile.photos.post') }}"
                        style="display: none;" method="post" enctype="multipart/form-data">
                        {{ csrf_field() }}
                        <div class="form-group row">
                            <div class="col-md-3">
                                <label>{!! lang('Photo') !!}</label>
                            </div>
                            <div class="col-md-9">
                                <input type="file" id="choose_file" accept="image/*" required=""
                                    class="inputfile" name="photo">
                                <label for="choose_file">
                                    <i class="fa fa-upload"></i>
                                    <span>{!! lang('Choisir un fichier') !!}&hellip;</span>
                                </label>
                            </div>
                        </div>
                        <div class="text-right">
                            <button class="btn btn-xsm btn2">{!! lang('Ajouter') !!}</button>
                        </div>
                    </form>
                    <div class="content-add">
                        <div> <i class="fa fa-plus"></i></div> {!! lang('Ajouter une photo') !!}
                    </div>
                @endif
            </div>
        </div>
        <div class="col-md-6">

            <form
                class="{{ !$profile->resume && !$profile->conception && !$profile->style && !$profile->sources_inspiration ? '' : 'disabled' }}"
                method="post" action="{{ route('designer.monprofile.update') }}">
                {{ csrf_field() }}
                <div class="panel">
                    <div class="text-right pull-right">
                        <div class="btn btn-sm btn2 btn-formulaire show-disabled">{!! lang('Modifier') !!}</div>
                        <button class="btn btn-sm btn2 btn-formulaire hide-disabled">{!! lang('Enregistrer') !!}</button>
                    </div>

                    <b>{!! lang('Moi en quelques mots') !!}</b> * {{ lang('(150 mots au maximum)', 0) }} <br><br>
                    <div class="paper">
                        <div class="paper-content">
                            <textarea name="resume" class="form-control summernote">{{ $profile->resume }}</textarea>
                        </div>
                    </div>
                    <hr>
                    <b>{!! lang("Ma conception de l'architecture d'intérieur") !!}</b> * {{ lang('(100 mots au maximum)', 0) }} <br><br>
                    <textarea name="conception" class="form-control summernote">{{ $profile->conception }}</textarea>

                    <hr>
                    <b>{!! lang('Mon style') !!}</b> * {{ lang('(100 mots au maximum)', 0) }} <br><br>
                    <textarea name="style" class="form-control summernote">{{ $profile->style }}</textarea>

                    <hr>
                    <b>{!! lang("Mes sources d'inspiration") !!}</b> * {{ lang('(100 mots au maximum)', 0) }} <br><br>
                    <textarea name="sources_inspiration" class="form-control summernote">{{ $profile->sources_inspiration }}</textarea>
                </div>
            </form>

            <div class="panel">
                <b>{!! lang('Langues') !!}</b> * <br>
                @foreach ($profile->langues as $langue)
                    <div class="formation-item">
                        <b>{{ $langue->libelle }}</b>
                        <span class="ecole">{{ $langue->niveau }}</span>
                        <div class="btn-icons">
                            <a href="{{ route('designer.monprofile.langues.delete', $langue->id) }}" class="btn-icon"><i
                                    class="fa fa-trash"></i></a>
                        </div>
                    </div>
                @endforeach
                <form class="formation-item" action="{{ route('designer.monprofile.langues.post') }}"
                    style="display: none;" method="post">
                    {{ csrf_field() }}
                    <div class="form-group row">
                        <div class="col-md-3">
                            <label>{!! lang('Langue') !!}</label>
                        </div>
                        <div class="col-md-9">
                            <input type="text" required="" class="form-control" name="libelle"
                                placeholder="Langue">
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-md-3">
                            <label>{!! lang('Niveau') !!}</label>
                        </div>
                        <div class="col-md-9">
                            <select name="niveau" class="form-control">
                                <option>Bilingue ou Natif</option>
                                <option>Capacité professionnelle complète</option>
                                <option>Capacité professionnelle limitée</option>
                            </select>
                        </div>
                    </div>

                    <div class="text-right">
                        <button class="btn btn-xsm btn2">{!! lang('Ajouter') !!}</button>
                    </div>
                </form>
                <div class="content-add">
                    <div> <i class="fa fa-plus"></i></div>{!! lang('Ajouter une langue') !!}
                </div>
            </div>

            <div class="panel">
                <b>{!! lang('Mes formations et certifications') !!}</b> * <br>
                @foreach ($profile->formations as $formation)
                    <div class="formation-item">
                        <span class="date">{{ $formation->annee }}</span>
                        <b>{{ $formation->libelle }}</b>
                        <span class="ecole">{{ $formation->ecole }}</span>
                        <div class="btn-icons">
                            <a href="{{ route('designer.monprofile.formations.delete', $formation->id) }}"
                                class="btn-icon"><i class="fa fa-trash"></i></a>
                        </div>
                    </div>
                @endforeach
                <form class="formation-item" action="{{ route('designer.monprofile.formations.post') }}"
                    style="display: none;" method="post">
                    {{ csrf_field() }}
                    <div class="form-group row">
                        <div class="col-md-4">
                            <label>{!! lang('Titre') !!}</label>
                        </div>
                        <div class="col-md-8">
                            <input type="text" name="libelle" required="" class="form-control"
                                placeholder="Titre">
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-md-4">
                            <label>{!! lang('Établissement') !!}</label>
                        </div>
                        <div class="col-md-8">
                            <input type="text" name="ecole" required="" class="form-control"
                                placeholder="Établissement">
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-md-4">
                            <label>{!! lang("Année d'obtention") !!}</label>
                        </div>
                        <div class="col-md-8">
                            <input type="text" name="annee" required="" class="form-control"
                                placeholder="Année d'obtention">
                        </div>
                    </div>
                    <div class="text-right">
                        <button class="btn btn-xsm btn2">{!! lang('Ajouter') !!}</button>
                    </div>
                </form>

                <div class="content-add">
                    <div> <i class="fa fa-plus"></i></div> {!! lang('Ajouter une formation ou certification') !!}
                </div>
            </div>

            <div class="panel">
                <b>{!! lang('Réseaux sociaux') !!}</b> (optionnel) <br><br>

                <form class="disabled" class="formation-item"
                    action="{{ route('designer.monprofile.socials_medias.post') }}" method="post">
                    {{ csrf_field() }}

                    <div class="form-group row">
                        <div class="col-md-3">
                            <label>{!! lang('Site personnel') !!}</label>
                        </div>
                        <div class="col-md-9">
                            <input type="text" class="form-control" name="socialmedia[site_personnel]"
                                value="{{ $profile->social_medias->where('libelle', 'site_personnel')->first()->url ?? '' }}"
                                placeholder="Site personnel">
                        </div>
                    </div>

                    <div class="form-group row">
                        <div class="col-md-3">
                            <label>{!! lang('Facebook') !!}</label>
                        </div>
                        <div class="col-md-9">
                            <input type="text" class="form-control" name="socialmedia[facebook]"
                                value="{{ $profile->social_medias->where('libelle', 'facebook')->first()->url ?? '' }}"
                                placeholder="Facebook">
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-md-3">
                            <label>{!! lang('Twitter') !!}</label>
                        </div>
                        <div class="col-md-9">
                            <input type="text" class="form-control" name="socialmedia[twitter]"
                                value="{{ $profile->social_medias->where('libelle', 'twitter')->first()->url ?? '' }}"
                                placeholder="Twitter">
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-md-3">
                            <label>{!! lang('LinkedIn') !!}</label>
                        </div>
                        <div class="col-md-9">
                            <input type="text" class="form-control" name="socialmedia[linkedin]"
                                value="{{ $profile->social_medias->where('libelle', 'linkedin')->first()->url ?? '' }}"
                                placeholder="LinkedIn">
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-md-3">
                            <label>{!! lang('Instagram') !!}</label>
                        </div>
                        <div class="col-md-9">
                            <input type="text" class="form-control" name="socialmedia[instagram]"
                                value="{{ $profile->social_medias->where('libelle', 'instagram')->first()->url ?? '' }}"
                                placeholder="Instagram">
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-md-3">
                            <label>{!! lang('Pinterest') !!}</label>
                        </div>
                        <div class="col-md-9">
                            <input type="text" class="form-control" name="socialmedia[pinterest]"
                                value="{{ $profile->social_medias->where('libelle', 'pinterest')->first()->url ?? '' }}"
                                placeholder="Pinterest">
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-md-3">
                            <label>{!! lang('Behance') !!}</label>
                        </div>
                        <div class="col-md-9">
                            <input type="text" class="form-control" name="socialmedia[behance]"
                                value="{{ $profile->social_medias->where('libelle', 'behance')->first()->url ?? '' }}"
                                placeholder="Behance">
                        </div>
                    </div>

                    <div class="text-right">
                        <div class="btn btn-sm btn2 btn-formulaire show-disabled">{!! lang('Modifier') !!}</div>
                        <button class="btn btn-sm btn2 btn-formulaire hide-disabled">{!! lang('Enregistrer') !!}</button>
                    </div>
                    <br>
                </form>

            </div>

        </div>
    </div>
@endsection

@section('style')
    <link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-lite.css" rel="stylesheet">
    @endsection @section('script')

    <script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-lite.js"></script>

    <script>
        $('.summernote').summernote({
            toolbar: false,
        });

        $('div.disabled, form.disabled').each(function(index, el) {
            $(this).find('.summernote').each(function(index, el) {
                $(this).summernote('disable');
            });
            $(this).find('.btn').click(function(event) {
                $(this).parents('.disabled').find('.summernote').each(function(index, el) {
                    $(this).summernote('enable');
                });
                $(this).parents('.disabled').removeClass('disabled');
            });
        });
    </script>
@endsection