@extends('layout/ace')

@section('breadcrumbs')
    {{ Breadcrumbs::render('cms.purchased_courses.show', $entitlement) }}
@endsection

@section('title', "Trajno kupljeni kurs | {$entitlement->user->getFullName()} -{$entitlement->course->title}")

@section('content')
    <div class="row">
        @include('cms.purchaced_courses.partials._header')

        <div class="col-12 col-lg-8" >
            @include('cms.purchaced_courses.partials._payment_actions')
        </div>

        <div class="col-12 col-lg-4" >
            @include('cms.purchaced_courses.partials._right_side_actions')
        </div>
    </div>
    <!-- .row -->
    <x-delete-modal-form name="modalDeletePayment" message="Da li ste sigurni da želite da stornirate uplatu za kupljeni kurs?" title="Brisanje uplate"></x-delete-modal-form>
    @include('cms.purchaced_courses.partials._poreska-modal')
@endsection

@section('scripts')
    @parent
    <script>
        const entitlementId = @json($entitlement->id);
        const handlePoreskaClick = (e) => {
            e.preventDefault()
            document.querySelector("#h5-successfully-sent").classList.add('d-none');
            document.querySelector("#btn-send-poreska-fiscal").classList.add('d-none')
            const invoicePayment = JSON.parse(e.target.dataset.invoicePayment);
            const invoicePaymentFiscal = invoicePayment.invoice_payment_fiscal;
            
            $("#poreskaModal").modal('show');

            // Unos nacina placanja
            document.querySelector("#invoice-payment-type").innerHTML = invoicePayment.method == 2 ? "Uplatnica" : invoicePayment.invoice_payment_type?.name;

            // Datum i vreme slanja se cita ukoliko ima invoicePaymentFiscal njegov parametar sent_at
            document.querySelector("#sent-at-invoice-payment-fiscal").innerHTML = invoicePaymentFiscal &&
                invoicePaymentFiscal.sent_at ?
                `${new Date(invoicePaymentFiscal.sent_at).toLocaleDateString('sr-RS')} ${new Date(invoicePaymentFiscal.sent_at).toLocaleTimeString('sr-RS')}` :
                "-";
            // Datum i vreme preuzimanja se cita ukoliko ima invoicePaymentFiscal njegov parametar downloadet_at
            document.querySelector("#downloaded-at-invoice-payment-fiscal").innerHTML = invoicePaymentFiscal &&
                invoicePaymentFiscal.downloadet_at ?
                `${new Date(invoicePaymentFiscal.downloadet_at).toLocaleDateString('sr-RS')} ${new Date(invoicePaymentFiscal.downloadet_at).toLocaleTimeString('sr-RS')}` :
                "-";

            // Poslato se cita ukoliko ima invoicePaymentFiscal njegov parametar sent
            document.querySelector("#sent-invoice-payment-fiscal").innerHTML = invoicePaymentFiscal ?
                invoicePaymentFiscal.sent : "Ne";

            // Preuzeto0 se cita ukoliko ima invoicePaymentFiscal njegov parametar downloaded
            document.querySelector("#downloaded-invoice-payment-fiscal").innerHTML = invoicePaymentFiscal ?
                invoicePaymentFiscal.downloaded : "Ne";
            
            document.querySelector("#invoice-payment-amount-with-pdv").value = (+invoicePayment.amount_with_pdv)
                .toLocaleString('sr-RS', {
                    minimumFractionDigits: 2,
                    maximumFractionDigits: 2
                });

            // ukoliko postoji invoicePaymentFiscal tada se  prikazuje ovaj tekst
            if (invoicePaymentFiscal) {
                document.querySelector("#h5-successfully-sent").classList.remove('d-none')
            }

            // ukoliko postoji invoicePaymentFiscal tada se ne prikazuje ovo dugme
            if (!invoicePaymentFiscal) {
                document.querySelector("#btn-send-poreska-fiscal").dataset.invoice_payment_id = invoicePayment.id;
                document.querySelector("#btn-send-poreska-fiscal").classList.remove('d-none');
            }


        }
        const poreskaBtns = document.querySelectorAll(".btn-poreska")
        poreskaBtns.forEach(poreskaBtn => {
            poreskaBtn.addEventListener('click', handlePoreskaClick)
        });

        $(document).on('click', '#btn-send-poreska-fiscal', function(e) {
            fetch(route('cms.invoice-payment-fiscal.store_purchased_course_invoice_payment_fiscal'), {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json',
                        'X-Requested-With': 'XMLHttpRequest',
                        'X-CSRF-Token': '{{ csrf_token() }}'
                    },
                    body: JSON.stringify({
                        invoice_payment_id: e.target.dataset.invoice_payment_id,
                        entitlement_id: entitlementId
                    })
                })
                .then(response => {
                    if (!response.ok) {
                        throw new Error('Network response was not ok');
                    }
                    return response.json();
                })
                .then(data => {
                    if (data.status == 'created') {
                        alert('Uplata je uspešno kreirana i poslata poreskoj.');
                        window.location.reload();
                    } else {
                        alert('Uplata je već poslata poreskoj!');
                    }
                })
                .catch(error => {
                    //alert('Greska na serveru!');
                });
        });
    </script>
    @if(session()->has('ga4_purchase'))
        @php
            $ga4Purchase = session()->get('ga4_purchase');
        @endphp

        <script src="{{ mix('js/front/b2c/GA4Analytics.js') }}"></script>
        
        <script>
            const item = @json($ga4Purchase['item']);
            const invoice_id = @json($ga4Purchase['invoice_id']);

            window.GA4Analytics.triggerEvent({
                event: "purchase",
                items: [item],
                ecommerce: {
                    transaction_id: `TRANSACTION_${invoice_id}`,
                    value: 1,
                    currency: 'RSD'
                }
            });

            console.log("POslato na GA4", {
                event: "purchase",
                items: [item],
                ecommerce: {
                    transaction_id: `TRANSACTION_${invoice_id}`,
                    value: 1,
                    currency: 'RSD'
                }
            });
        </script>
    @endif
@endsection