@extends('layouts.espace_collaboration')
@section('meta-title', "Concept d'idées en cours")
@section('meta-keywords', '')
@section('meta-description', '')
@section('sub-menu')
    @include('front.espace_collaboration.menu')
@endsection
@section('content')
    @php
        $migrated = $projet->migrated && $projet->forfait != 'fantastique';
    @endphp
    <div class="row bg-white">

        <div class="col {{ $migrated ? 'col-lg-push-4 mr-lg-4 col-md-push-0 mr-md-0' : '' }}">
            <section class="pt-40 bg-white">
                <div class="container-start-project text-center">
                    <p class=" font-weight-bold">{!! lang('Félicitations, vous avez lancé votre projet !') !!}</p>
                    <p>{!! lang(
                        "<b>Un remboursement sur votre projet en cours, ça vous dit ?</b> <br> Faites découvrir Pipcke à vos amis et proches et <b>recevez un cashback.</b> <br><br>Offrez-leur <b>20 €</b> de réduction sur le forfait Fantastique ou <b>10 €</b> sur le forfait Incontournable.<br>En retour, recevez un remboursement de <b>30 €</b> à leur achat d'un forfait Fantastique ou de <b>20 €</b> à leur achat d'un forfait Incontournable.<br><br>C’est notre manière de vous remercier de partager l’expérience Pipcke 💛",
                    ) !!}</p>
                </div>
                <section class="pt-20 pb-10 bg-light">
                    <div class="container text-center">

                        <div class="row process-parrainage">
                            <div class="col-md-4">
                                <div class="img">
                                    <span>1</span>
                                    <img src="{{ asset('img/pictos_parrainage/pipcke-refer-friend.svg') }}">
                                </div>
                                <p class="font-size-20">{!! lang('Invitez vos amis et vos <br>proches') !!}</p>
                            </div>
                            <div class="col-md-4">
                                <div class="img">
                                    <span>2</span>
                                    <img src="{{ asset('img/pictos_parrainage/discount.svg') }}">
                                </div>
                                <p class="font-size-20">{!! lang('Ils reçoivent une remise à l’achat d’un forfait') !!}</p>

                            </div>
                            <div class="col-md-4">
                                <div class="img">
                                    <span>3</span>
                                    <img src="{{ asset('img/pictos_parrainage/shopping-bag.svg') }}">
                                </div>
                                <p class="font-size-20">{!! lang('Vous recevez un remboursement  pour chaque achat') !!}</p>

                            </div>
                        </div>
                    </div>
                </section>
                @include('partials.parrainage')
            </section>

            <section class="pt-40 pb-40">
                <div class="container-start-project">

                    <p class="text-center">
                        {!! lang(
                            "N’hésitez pas à enrichir votre Brief en <a class='text-underline' href='__route_etat_des_lieux__'>téléchargeant <br> des photos</a> et <a class='text-underline' href='__route_inspirations__'>des liens d’inspiration</a>.",
                            [
                                '__route_etat_des_lieux__' => route('client.brief', ['project_id' => $projet->id, 'panel' => 'inspirations']),
                                '__route_inspirations__' => route('client.brief', ['project_id' => $projet->id, 'panel' => 'inspirations']),
                            ],
                        ) !!}</p>

                    <div class="text-center mt-20">
                        <a class="btn btn17 btn-xs"
                            href="{{ route('client.brief', $projet->id) }}">{!! lang('Consulter votre brief') !!}</a>
                    </div>
                </div>

            </section>
        </div>
        @if ($migrated)
            <div
                class=" {{ $migrated ? 'col-md-10 col-md-pull-0 col-lg-4 col-lg-pull-8 m-auto' : 'col-md-3 col-md-pull-9' }}">
                <div class="container">
                    <div class="internal-chat-esquisse" style="top:130px;max-width: 30%;">
                        <section class="internal-chat-area">
                            <header>
                                <img src="{{ asset($projet->designers[0]->designer->photo ?? $projet->designers[0]->designer->picture) }}"
                                    alt="">
                                <div class="details" style="display:flex; flex-direction:column">
                                    <span>{{ $projet->designers[0]->designer->username }} </span>
                                    <small
                                        class="time">{{ (new \Carbon\Carbon($projet->designers[0]->designer->updated_at))->diffForHumans() }}</small>
                                </div>
                                <div
                                    class="status-dot {{ (new \Carbon\Carbon())->diffInMinutes(new \Carbon\Carbon($projet->designers[0]->designer->updated_at)) == 0 ? '' : 'offline' }}">
                                    <i class="fa fa-circle"></i>
                                </div>
                            </header>
                            <div class="chat-box scroll-chat_conception_cli" style="height: 50vh;">
                                @foreach ($chatRoom->messages as $message)
                                    @include('front.components.chat_message_update')
                                @endforeach
                            </div>
                            <div class="typing-area-container">
                                @php
                                    $senderId = auth()->id();
                                    $receiverId = $receiver->id ?? '-1';
                                    $projetId = $chatRoom->projet_id;
                                @endphp
                                <form class="typing-area" name="chat-component-update_conception_cli"
                                    id="chat-component-update_conception_cli" method="post"
                                    action="{{ route('chat.send-message', ['sender_id' => $senderId, 'receiver_id' => $receiverId, 'projetId' => $projetId]) }}">
                                    {{ csrf_field() }}
                                    <div class="smileys smileys-chat-update smiley_conception_cli">
                                        <label class="smiley_update_conception_cli smiley-update-1" style="opacity: 1;"
                                            data-value=":rougir:"></label>
                                        <label class="smiley_update_conception_cli smiley-update-2" style="opacity: 1;"
                                            data-value=":pleurer:"></label>
                                        <label class="smiley_update_conception_cli smiley-update-3" style="opacity: 1;"
                                            data-value=":demon:"></label>
                                        <label class="smiley_update_conception_cli smiley-update-4" style="opacity: 1;"
                                            data-value=":ange:"></label>
                                        <label class="smiley_update_conception_cli smiley-update-5" style="opacity: 1;"
                                            data-value=":coeur:"></label>
                                        <label class="smiley_update_conception_cli smiley-update-19" style="opacity: 1;"
                                            data-value=":like:"></label>
                                        <label class="smiley_update_conception_cli smiley-update-6" style="opacity: 1;"
                                            data-value=":sourire:"></label>
                                        <label class="smiley_update_conception_cli smiley-update-7" style="opacity: 1;"
                                            data-value=":triste:"></label>
                                        <label class="smiley_update_conception_cli smiley-update-8" style="opacity: 1;"
                                            data-value=":surpris:"></label>
                                        <label class="smiley_update_conception_cli smiley-update-9" style="opacity: 1;"
                                            data-value=":rire:"></label>
                                        <label class="smiley_update_conception_cli smiley-update-18" style="opacity: 1;"
                                            data-value=":clin-d-oeil:"></label>
                                        <label class="smiley_update_conception_cli smiley-update-11" style="opacity: 1;"
                                            data-value=":choqué:"></label>
                                        <label class="smiley_update_conception_cli smiley-update-12" style="opacity: 1;"
                                            data-value=":sourire-lunettes:"></label>
                                        <label class="smiley_update_conception_cli smiley-update-13" style="opacity: 1;"
                                            data-value=":yeux:"></label>
                                        <label class="smiley_update_conception_cli smiley-update-14" style="opacity: 1;"
                                            data-value=":lunettes:"></label>
                                        <label class="smiley_update_conception_cli smiley-update-15" style="opacity: 1;"
                                            data-value=":langue:"></label>
                                        <label class="smiley_update_conception_cli smiley-update-16" style="opacity: 1;"
                                            data-value=":incertain:"></label>
                                        <label class="smiley_update_conception_cli smiley-update-17" style="opacity: 1;"
                                            data-value=":vexé:"></label>
                                    </div>
                                    <div style="display: flex;justify-content: center;">
                                        <textarea name="message_conception_cli" id="message_content_conception_cli" placeholder="Entrez votre message..."
                                            class="form-control"></textarea>
                                        <div class=""
                                            style="display:inline-block;width: 50px;padding: 5px 0 0 5px;">
                                            <label id="attachedLabel_conception_cli" for="attachedFile_conception_cli"
                                                title="Envoyer un fichier">
                                                <i class="fa fa-upload" aria-hidden="true"></i>
                                            </label>
                                            <button id="submitChat_conception_cli" style="display: none;"><i
                                                    class="fa fa-send" aria-hidden="true"
                                                    title="Envoyer message"></i></button>
                                            <i class="fa fa-smile-o typing_area_label_conception_cli" aria-hidden="true"
                                                title="Insérer un emoji"></i>
                                            <input type="file" name="attachedFile_conception_cli"
                                                id="attachedFile_conception_cli" class="form-control hidden"
                                                accept="image/*, application/pdf, video/mp4,video/x-m4v,video/*" />
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </section>
                    </div>
                </div>
            </div>

        @endif
    </div>

@endsection