@extends('front.app')
@section('content')
{{--    @if (@$user->email_verified_at == null)--}}
{{--        <section class="wrapper bg-soft-primary">--}}
{{--            <div class="container  pt-10 pb-15 pt-md-14">--}}
{{--                <div class="row gx-lg-8 gx-xl-12 gy-10 mb-5 align-items-center">--}}
{{--                    <div class="col-md-12 text-center text-lg-start order-2 order-lg-0" data-cues="slideInDown"--}}
{{--                        data-group="page-title" data-delay="600">--}}
{{--                        <h1 class="display-1 mb-5 mx-md-n5 mx-lg-0">{{ $document->title }}</h1>--}}
{{--                        <h2 class="fs-40 text-danger  mb-0"> <img src="{{ asset('front/img/icons/lineal/email.svg') }}"--}}
{{--                                class="svg-inject icon-svg icon-svg-sm text-danger" alt="" /> Email-ul nu este--}}
{{--                            confirmat.--}}
{{--                        </h2>--}}
{{--                        <p class="fs-20">Pentru a putea completa formularul trebuie sa aveti email-ul confirmat.</p>--}}
{{--                    </div>--}}
{{--                </div>--}}
{{--            </div>--}}
{{--            <!-- /.container -->--}}
{{--        </section>--}}
{{--    @else--}}

    <section class="wrapper bg-soft-primary">
        <div class="container  pt-10 pb-15 pt-md-14">
            <div class="row gx-lg-8 gx-xl-12 gy-10 mb-5 align-items-center">
                <div class="col-md-10 offset-md-1 offset-lg-0 col-lg-5 text-center text-lg-start order-2 order-lg-0"
                     data-cues="slideInDown" data-group="page-title" data-delay="600">
                    <h1 class="display-1 mb-5 mx-md-n5 mx-lg-0">{{ $document->title }}</h1>
                    <div class="d-flex justify-content-center justify-content-lg-start process-wrapper line"
                         data-cues="slideInDown" data-group="page-title-buttons" data-delay="900">
                        <div class="col-md-4 col-lg-4 col-sm-4"> <span
                                    class="icon btn btn-circle btn-lg btn-soft-primary pe-none mb-4"><span
                                        class="number">01</span></span>
                            <h6 class="mb-1">Alege formular</h6>
                        </div>
                        <!--/column -->
                        <div class="col-md-4 col-lg-4 col-sm-4"> <span
                                    class="icon btn btn-circle btn-lg @if (Session::has('form-success')) btn-soft-primary @else  btn-primary @endif pe-none mb-4"><span
                                        class="number">02</span></span>
                            <h6 class="mb-1">Completeaza formularul</h6>
                        </div>
                        <!--/column -->
                        <div class="col-md-4 col-lg-4 col-sm-4"> <span
                                    class="icon btn btn-circle btn-lg @if (Session::has('form-success')) btn-primary @else  btn-soft-primary @endif pe-none mb-4"><span
                                        class="number">03</span></span>
                            <h6 class="mb-1">Trimite formularul</h4>
                        </div>
                    </div>
                </div>
                <div class="col-md-2 offset-md-1 offset-lg-0 col-lg-7 text-center text-lg-start order-2 order-lg-0" data-group="page-title">
                    <h1 class="display-0 mb-5 mx-md-n5 mx-lg-0">Descarca formularul sau completeaza mai jos</h1>
                    @if ($document->upload_id)
                        <a class="btn btn-sm mb-5 btn-primary" href="{{ route('front.forms.download', ['id' => $document->upload_id]) }}"><i class="fa fa-download mr-2"></i>Descarca formular</a>
                        @if(auth()->check())
                            <add-form-request-upload :payload='{{$document}}'></add-form-request-upload>
                        @else
                            <p>
                                Trebuie sǎ fii logat ca sǎ încarci formularul completat, te rugǎm <a href="{{route('login')}}">logheazǎ-te</a>.
                            </p>

                        @endif
                    @else
                        <a class="btn btn-sm mr-5 btn-primary disabled" href="#"><i class="fa fa-download mr-2"></i>Formularul PDF nu este incarcat</a>
                    @endif
                </div>
            </div>
        </div>
        <!-- /.container -->
    </section>

    <section class="wrapper bg-light">
        <div class="container mt-10">
            <div class="row">
                <div class="col-xl-10 mx-auto">
                    <h3><i class="uil uil-envelope-send"></i> {{ $document->title }}</h3>
                </div>
            </div>
        </div>
    </section>

    <section class="wrapper bg-light">
        <div class="container py-12">
            <div class="row ">
                <div class="col-xl-10 mx-auto">
                    <div class="row gy-8 gx-lg-8 gx-xl-12 card">
                        @if(auth()->check())

                            @if (Session::has('form-success'))
                                <section class="pb-11 pb-lg-15 pt-18">
                                    <div class="container">
                                        <p class="text-center fs-sm-40  text-center text-danger mb-1"><i
                                                    class="uil uil-check-circle fs-60"></i> </p>
                                        <h2 class="fs-sm-40 text-center text-danger">Cererea ta a fost trimisa!
                                        </h2>
                                        <p class="text-center text-center">Pentru a verifica statusul cererii, întră în
                                            contul tău secțiunea
                                            cereri trimise</p>
                                    </div>
                                </section>
                            @else
                                @if ($forms)
                                    <div class="col-md-6 text-right">
                                        <!-- This form holds the values the user has entered, as a JSON document. -->
                                        <form method="post" action="{{ route('document.store', [$document->slug]) }}"
                                              id="submissionForm">
                                            @csrf
                                            <input type="hidden" name="form_id" value="{{ $document->id }}">
                                            <input type="hidden" name="slug" value="{{ $document->slug }}">
                                            <!-- State can be used to capture a Submit vs. Save Draft button -->
                                            <input type="hidden" name="state">

                                            <!-- The JSON with all the values -->
                                            <input type="hidden" name="submissionValues" id="submissionValues"
                                                   value="">
                                        </form>
                                    </div>
                                    @if ($errors->any())
                                        <div class="alert alert-danger">
                                            <p style="font-size: 16pt"><strong>Oops</strong>, there was an issue with that.
                                            </p>
                                            <ul class="ml-5">
                                                @foreach ($errors->all() as $error)
                                                    <li>{{ $error }}</li>
                                                @endforeach
                                            </ul>
                                        </div>
                                    @endif

                                    <!-- This becomes the builder. -->
                                    <div id="formio"></div>
                                @else
                                    <p>Formularul inca nu e setat</p>
                                @endif
                            @endif
                        @else
                            <p>
                                Trebuie sǎ fii logat ca sǎ depui cererea online, te rugǎm <a href="{{route('login')}}">logheazǎ-te</a>.
                            </p>
                        @endif
                    </div>
                </div>
            </div>
        </div>
    </section>
@endsection

@push('scripts')
    <script lang="text/javascript">
        $(document).ready(function() {
            Formio.createForm(document.getElementById('formio'), {!! $definition !!}).then(function(form) {
                form.submission = {
                    data: {!! $data !!},
                };

                form.on('submit', function(submission) {
                    var submitForm = document.getElementById('submissionForm');
                    submitForm.querySelector('input[name=state]').value = submission.state;
                    submitForm.querySelector('input[name=submissionValues]').value = JSON.stringify(
                        submission.data);

                    submitForm.submit();
                });
            });
        });
    </script>
@endpush