@extends('layouts.app')

@section('content')
<div class="content">
    <x-content.header title="{{__('forms.lbl_step_2')}}" subTitle="{{__('forms.lbl_preview_of_your_document')}}">
        <x-slot:headerRight>
            <a href="{{route("{$templateType}.reports.change.template.index", $report)}}" class="btn-secondary-base">
                {{trans('forms.lbl_change_template')}}
            </a>
        </x-slot:headerRight>
    </x-content.header>

    <form id="form" name="modal-form" action="{{route("{$templateType}.reports.template.preview.update", $report->id)}}" method="POST">
        <div class="tw-card">
            <div class="p-6">
                @include('documentcreator::reports.preview.form', ['edit' => true])
            </div>
        </div>

        <div class="mt-2 flex flex-wrap md:flex-nowrap gap-2">

            <button type="submit" class="btn-primary-sm mt-4 btn-save">
                {{trans('forms.lbl_save_and_generate_pdf')}}
            </button>

            <button type="submit" class="btn-secondary-sm mt-4 btn-save btn-concept">
                {{trans('forms.lbl_save_concept_2')}}
            </button>

            @php $pdf = $report->getFirstMedia('pdf');@endphp
            @if($pdf && !is_null($pdf))
                <a href="{{route("{$templateType}.reports.pdf.index", $report->id)}}"  class="btn-tertiary-sm rounded-lg mt-4">
                    <x-svg-icon icon="icon-download" />{{ __('forms.lbl_download_pdf') }}
                </a>
            @endif

            <a href="{{route("{$templateType}.reports.edit", $report->id)}}"  class="btn-tertiary-sm mt-4">{{trans('forms.lbl_back')}}</a>

            <a href="{{route("{$templateType}.reports.index")}}"  class="btn-tertiary-sm mt-4">{{trans('forms.lbl_cancel')}}</a>
        </div>

    </form>

</div>
@include('contracts.as-of-contract-list')
@stop

@section('footer-script')
    @include("documentcreator::scripts.front", [
        'preview' => true
    ])

    <!-- End plugin js for this page -->
    <script type="text/javascript">

        function submitForm( el, event ) {
            let action = $("#form").prop("action"), data = {
                report_name : $('#form').find("input[name='name']").val(),
                final_html  : $('#form').find("textarea[name='final_html']").val(),
                as_of_date : $('#form').find("input[name='as_of_date']").val(),
                apply_at_past : $('#form').find("input[name='apply_at_past']").val(),
            };

            @if($report->isContract())

                if($("#form").find("input[name='apply_changes_to_profile']").is(":checked")) {
                    data.apply_changes_to_profile = 0;
                } else {
                    data.apply_changes_to_profile = 1;
                    action = "{{ route("{$templateType}.reports.template.preview.update.confirm", $report) }}";
                }

                data.apply_changes_based_on_given_date = $("#form").find("input[name='apply_changes_based_on_given_date']:checked").val();
            @endif

            if(el.hasClass('btn-concept')) {
                data.save_as_concept = 1;
                data.apply_changes_to_profile = 0;
                action = $("#form").prop("action");
            }

            PDRequest({
                type    : "PUT",
                url     : action,
                data    : data,
                event   : event
            }).then(response => {
                if(!el.hasClass('btn-concept')) {
                    window.location = "{{route("{$templateType}.reports.index")}}";
                }
            });
        }

        $(".btn-save").on("click", function(event) {

            event.preventDefault();

            if($("#form").valid()) {
                let alert_msg = "{{ trans('forms.lbl_save_and_generate_pdf_confirmation_basic') }}";

                tinymce.triggerSave();

                if($(this).hasClass('btn-concept')) {
                    submitForm( $(this), event );
                } else {

                    @if($report->isContract())
                        if(!$("#form").find("input[name='apply_changes_to_profile']").is(":checked")){
                            alert_msg = "{{trans('forms.lbl_save_and_generate_pdf_confirmation')}}"
                        }
                    @endif

                    PDSimpleConfirm(
                        alert_msg
                    ).then(response => {
                        if(response) {
                            submitForm( $(this), event );
                        }
                    });
                }
            }
        });


        $(".btn-preview-pdf").on('click', function() {
            event.preventDefault();
            tinymce.activeEditor.execCommand('mcePreview');
        })

        $('input[name="apply_changes_based_on_given_date"]').on('click', function() {
            var type = $(this).val();

            $('input[name="apply_changes_based_on_given_date"]').not(this).prop('checked', false);
            $(".as_of_date, .apply_at_past").hide().find('input').val('');

            if ($(this).is(':checked')) {
                if (type === 'future_date') {
                    $('.as_of_date').show();
                } else if (type === 'past_date') {
                    $('.apply_at_past').show();
                }
            }
        });
        
        @if($report->isContract())

            $(document).ready(function() {
                var today = moment();
                var contractDates = @json($report->user->profile->getUserContractStartAndEndDates($report->user->getCurrentActiveContract()->getContractMutatedBySubContract()));
                let { contractStartDate, contractEndDate } = contractDates;
                currentContractStartDate = moment(contractStartDate);
                currentContractEndDate = moment(contractEndDate);
                
                if ($('input[name="as_of_date"]').length) { // It can be for sub contract and full contract both. So limiting to contract start and end wont be fruitfull enough.
                    $('input[name="as_of_date"]').data("DateTimePicker").minDate(today.clone().add(1, 'days'));
                }
                if ($('input[name="apply_at_past"]').length) { // Only for sub contracts. Must be withing contract range.
                    let maxDate = currentContractEndDate.isAfter(today) ? today.clone().subtract(1, 'days') : currentContractEndDate;
                    $('input[name="apply_at_past"]').data("DateTimePicker").minDate(currentContractStartDate);
                    $('input[name="apply_at_past"]').data("DateTimePicker").maxDate(maxDate);
                }
                handleAsOfDateChangeInContract({
                    inputSelector: 'input[name="as_of_date"]',
                    userId: {{ $report->user->id }},
                    hasAsOfContractUrl: "{{ route('hasAsOfContract', $report->user->id) }}",
                    asOfContractsUrl: "{{ route('asOfContractsByUser', $report->user->id) }}"
                });
            });
        @endif
    </script>
@stop