@extends('web.default.panel.layouts.panel_layout')

@push('styles_top')
    <link rel="stylesheet" href="https://cdn.datatables.net/1.11.5/css/dataTables.bootstrap5.min.css">
@endpush

@section('content')
    <div class="row">
        <div class="col-12">
            <div class="card shadow-sm">
                <div class="card-header">
                    <h2 class="card-title">Purchase History</h2>
                </div>
                <div class="card-body p-5">

                    @if (!empty($sales) and !$sales->isEmpty())
                        <table class="table table-hover" id="purchasesTable">
                            <thead>
                                <tr>
                                    <th>{{ trans('public.title') }}</th>
                                    {{-- <th>{{ trans('public.instructor') }}</th> --}}
                                    <th>{{ trans('panel.purchase_date') }}</th>
                                    {{-- <th>{{ trans('public.category') }}</th> --}}
                                    <th>{{ trans('public.price') }}</th>
                                    <th></th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($sales as $sale)
                                    @php
                                        $item = !empty($sale->webinar) ? $sale->webinar : $sale->bundle;
                                        $lastSession = !empty($sale->webinar) ? $sale->webinar->lastSession() : null;
                                        $nextSession = !empty($sale->webinar) ? $sale->webinar->nextSession() : null;
                                        $isProgressing = false;
                                        if (
                                            !empty($sale->webinar) &&
                                            $sale->webinar->start_date <= time() &&
                                            !empty($lastSession) &&
                                            $lastSession->date > time()
                                        ) {
                                            $isProgressing = true;
                                        }
                                    @endphp

                                    @if (!empty($item))
                                        <tr>
                                            <td>{{ $item->title }}</td>
                                            {{-- <td>{{ $item->teacher->full_name }}</td> --}}
                                            <td>{{ dateTimeFormat($sale->created_at, 'j M Y') }}</td>
                                            {{-- <td>{{ !empty($item->category_id) ? $item->category->title : '' }}</td> --}}
                                            <td>{{ handlePrice($item->price, true, true, false, null, true) }}</td>
                                            <td>
                                                <div class="dropdown">
                                                    <button class="btn btn-sm btn-light dropdown-toggle" type="button"
                                                        id="actionsDropdown" data-bs-toggle="dropdown"
                                                        aria-expanded="false">
                                                        <i class="ki-outline ki-setting-2"></i>
                                                    </button>
                                                    <ul class="dropdown-menu">
                                                        @if (!empty($sale->gift_id) and $sale->buyer_id == $authUser->id)
                                                            {{-- <li>
                                                                <a class="dropdown-item" href="javascript:void(0);"
                                                                    onclick="saleInvoice.show({{ $item->id }}, {{ $sale->id }})">
                                                                    {{ trans('public.invoice') }}
                                                                </a>
                                                            </li> --}}
                                                        @else
                                                            @if (!empty($item->access_days) and !$item->checkHasExpiredAccessDays($sale->created_at, $sale->gift_id))
                                                                <li><a class="dropdown-item" href="{{ $item->getUrl() }}"
                                                                        target="_blank">{{ trans('update.enroll_on_course') }}</a>
                                                                </li>
                                                            @elseif(!empty($sale->webinar))
                                                                <li><a class="dropdown-item"
                                                                        href="{{ $item->getLearningPageUrl() }}"
                                                                        target="_blank">{{ trans('update.learning_page') }}</a>
                                                                </li>
                                                                @if (!empty($item->start_date) and ($item->start_date > time() or $item->isProgressing() and !empty($nextSession)))
                                                                    <li><button type="button"
                                                                            data-webinar-id="{{ $item->id }}"
                                                                            class="join-purchase-webinar dropdown-item">{{ trans('footer.join') }}</button>
                                                                    </li>
                                                                @endif
                                                                @if (!empty($item->downloadable) or !empty($item->files) and count($item->files))
                                                                    <li><a class="dropdown-item"
                                                                            href="{{ $item->getUrl() }}?tab=content"
                                                                            target="_blank">{{ trans('home.download') }}</a>
                                                                    </li>
                                                                @endif
                                                                @if ($item->price > 0)
                                                                    <a class="dropdown-item" href="javascript:void(0);"
                                                                        onclick="saleInvoice.show({{ $item->id }}, {{ $sale->id }})">
                                                                        {{ trans('public.invoice') }}
                                                                    </a>
                                                                @endif
                                                            @endif
                                                            <li><a class="dropdown-item"
                                                                    href="{{ $item->getUrl() }}?tab=reviews"
                                                                    target="_blank">{{ trans('public.feedback') }}</a></li>
                                                        @endif
                                                    </ul>
                                                </div>
                                            </td>
                                        </tr>
                                    @endif
                                @endforeach
                            </tbody>
                        </table>
                    @else
                        @include(getTemplate() . '.includes.no-result', [
                            'file_name' => 'student.png',
                            'title' => trans('panel.no_result_purchases'),
                            'hint' => trans('panel.no_result_purchases_hint'),
                            'btn' => ['url' => '/classes?sort=newest', 'text' => trans('panel.start_learning')],
                        ])
                    @endif
                </div>
            </div>
        </div>
    </div>

    @include('web.default.panel.webinar.join_webinar_modal')
@endsection

@push('scripts_bottom')
    <script src="https://cdn.datatables.net/2.1.8/js/dataTables.min.js"></script>

    <script>
        $(document).ready(function() {
            $('#purchasesTable').DataTable({
                "paging": false,
                "lengthChange": false,
                "searching": true,
                "ordering": true,
                "info": false,
                "autoWidth": false,
                "responsive": true,
            });

            $('#dt-search-0').addClass('form-control');
            $('#dt-search-0').removeClass('dt-input');
            $('.dt-search').removeClass("dt-search");
            $('label[for="dt-search-0"]').remove();
            $('#dt-search-0').attr('placeholder', 'Search...');


        });

        class SaleInvoice {
            constructor() {
                this.modalId = 'invoiceModal';
            }

            show(webinarId, saleId) {
                // Show loading state
                const loading = Swal.fire({
                    title: 'Loading...',
                    allowOutsideClick: false,
                    showConfirmButton: false,
                    didOpen: () => {
                        Swal.showLoading();
                    }
                });

                // Make AJAX request
                $.ajax({
                    url: `/panel/webinars/${webinarId}/sale/${saleId}/invoice`,
                    type: 'GET',
                    success: (response) => {
                        // Close loading indicator
                        loading.close();

                        // Remove any existing invoice modal
                        $(`#${this.modalId}`).remove();

                        // Append the new modal HTML to the body
                        $('body').append(response);

                        // Initialize and show the modal
                        const invoiceModal = new bootstrap.Modal(document.getElementById(this
                            .modalId));
                        invoiceModal.show();

                        // Setup print handler
                        this.setupPrintHandler();
                    },
                    error: () => {
                        loading.close();
                        Swal.fire({
                            icon: 'error',
                            title: 'Error',
                            text: 'Failed to load invoice'
                        });
                    }
                });
            }

            setupPrintHandler() {
                $(`#${this.modalId} .print-invoice`).on('click', () => {
                    const printContents = $(`#${this.modalId} .modal-body`).html();
                    const originalContents = document.body.innerHTML;

                    document.body.innerHTML = printContents;
                    window.print();
                    document.body.innerHTML = originalContents;

                    // Reinitialize the modal after printing
                    const invoiceModal = new bootstrap.Modal(document.getElementById(this.modalId));
                    invoiceModal.show();
                });
            }
        }

        // Initialize the Invoice class
        const saleInvoice = new SaleInvoice();
        var undefinedActiveSessionLang = '{{ trans('webinars.undefined_active_session') }}';
    </script>

    <script src="/assets/default/js/panel/join_webinar.min.js"></script>
@endpush