@extends('layouts.host', ['header' => true, 'header_image' => false])
@section('title', 'Event Details')
@section('back_button')
    <a href="{{ route('host.event.library') }}" class="back-btn-back">
        <i class="fa-solid fa-chevron-left"></i>
    </a>
@endsection

@section('content')
    <section class="main-sec event-library-section">
        <h4 class="live-event-top-text event-library">Event Detail</h4>
        <div class="container">
            <div class="event-library-main-row event-libraryDetails">
                <div class="memeber-price-box">
                    <label for="memeber-price-card" class="mb-0">
                        <div class="memeber-price-details-outer becomehost-div">
                            <div class="event-code">
                                <h5>Event Code No.</h5>
                                <span>{{ $event->event_code ?? '' }}</span>
                                @if (is_null($event->event_code))
                                    <a href="{{ route('host.event.payment.form', ['plan_id' => jsencode_userdata(getHostPlan()->id), 'event_id' => jsencode_userdata($event->id)]) }}"
                                        class="button primary-btn orange-outline">Pay For Event Code</a>
                                @endif
                            </div>
                        </div>
                    </label>
                </div>
                <h4 class="eventName">Event Name: {{ $event->event_name ?? '' }}</h4>
                <h4 class="eventName">Hosted By: {{ $event->hosted_by ?? '' }}</h4>
                <div class="event-library-gund-details">
                    <div class="event-library-gund-detail-innner">
                        <h4>Start Date</h4>
                        <h5>{{ $event->start_date ? $event->start_date->format('m/d/Y') : '' }}</h5>
                    </div>
                    <div class="event-library-gund-detail-innner">
                        <h4>End Date</h4>
                        <h5>{{ $event->end_date ? $event->end_date->format('m/d/Y') : '' }}</h5>
                    </div>
                    <div class="event-library-gund-detail-innner">
                        <h4>Participants</h4>
                        {{-- <h5>{{ getParticipantsByEvent($event) ?? '0'}}</h5> --}}
                        <h5>{{ $event->totalEventRevenue ? $event->totalEventRevenue->count() : 0 }}</h5>
                    </div>
                    <div class="event-library-gund-detail-innner">
                        <h4>Event fee</h4>
                        <h5>${{ $event->event_fee ?? 0.0 }}</h5>
                    </div>
                    <div class="event-library-gund-detail-innner">
                        <h4>New RAF Members</h4>
                        <h5>{{ $event->totalEventRevenue && $event->newRafMembers()->count() > 0 ? $event->newRafMembers()->count() : 0 }}
                        </h5>
                    </div>
                    <div class="event-library-gund-detail-innner">
                        <h4>Total revenue</h4>
                        {{-- <h5>${{ getTotalEventRevenue($event) ?? '0.00' }}</h5> --}}
                        <h5>${{ number_format(getTotalEventRevenue($event) ?? 0, 2) }}</h5>
                    </div>
                </div>

            </div>
        </div>
        <div class="event-library-round-zone mt-5">
            <!--evnet round zone -->
            @foreach ($rounds as $index => $round)
                @if (!is_null($round['yards']))
                    <div class="lb-round-list-main">
                        <div class="lb-round-list-box event-libraryDetails">
                            <div class="lb-round-list-inner">
                                <div class="event-library-rounds">
                                    <div class="lb-round-list-rank">
                                        <h4>Photo Required</h4>
                                        <span>{{ $event->image_required ? 'Y' : 'N' }}</span>
                                    </div>
                                    <div class="lb-round-list-rank">
                                        <h4>Video Required</h4>
                                        <span>{{ $event->video_required ? 'Y' : 'N' }}</span>
                                    </div>
                                </div>
                                <div class="event-library-rounds">
                                    <div class="lb-round-list-rank">
                                        <h4>Yards</h4>
                                        <span>{{ $round['yards'] ?? '' }}</span>
                                    </div>
                                    <div class="lb-round-list-rank">
                                        <h4>Re-load Required (y/n)</h4>
                                        <span>{{ $round['reload_required'] ? 'Y' : 'N' }}</span>
                                    </div>
                                </div>

                                <div class="event-library-rounds">
                                    <div class="lb-round-list-rank">
                                        <h4>Shots</h4>
                                        <span>{{ $round['shots'] ?? '' }}</span>
                                    </div>
                                    <div class="lb-round-list-rank">
                                        <h4>target Zone</h4>
                                        <span>{{ $round['target_zone'] ? strtoupper($round['target_zone']) : '' }}</span>
                                    </div>
                                    <div class="lb-round-list-rank">
                                        <h4>Hand (s/w)</h4>
                                        <span>{{ $round['hand'] ?? '' }}</span>
                                    </div>
                                </div>
                                @if ($round['shots2'])
                                    <div class="event-library-rounds">
                                        <div class="lb-round-list-rank">
                                            <h4>Shots</h4>
                                            <span>{{ $round['shots2'] ?? '' }}</span>
                                        </div>
                                        <div class="lb-round-list-rank">
                                            <h4>target Zone</h4>
                                            <span>{{ $round['target_zone2'] ? strtoupper($round['target_zone2']) : '' }}</span>
                                        </div>
                                        <div class="lb-round-list-rank">
                                            <h4>Hand (s/w)</h4>
                                            <span>{{ $round['hand2'] ?? '' }}</span>
                                        </div>
                                    </div>
                                @endif
                            </div>
                        </div>
                        <img src="{{ asset('images/round' . ($index + 1) . '-badge.svg') }}" alt=""
                            class="leaderboard-round-list-badge">
                    </div>
                @endif
            @endforeach
        </div>
        <div class="create-event-rules-row event-libraryDetails">
            @php
                $eventDescription = $event->media->where('type', 'event_description')->first();
                $eventDescription = $eventDescription ? $eventDescription->path : null;

                $eventRules = $event->media->where('type', 'event_rules')->first();
                $eventRules = $eventRules ? $eventRules->path : null;

                $eventPrize = $event->media->where('type', 'event_prize')->first();
                $eventPrize = $eventPrize ? $eventPrize->path : null;
            @endphp
            <div class="create-event-rules-column">
                <div class="form-group">
                    <label>Event Description</label>
                    <div class="formfield">
                        <img src="{{ asset('images/copy.png') }}">
                        <button id="view-desc" class="view-docs" @if (!$eventDescription) disabled @endif>
                            <h4>click to view</h4>
                        </button>
                        <input type="hidden" name="event_description_text" id="event_description_text"
                            value="{{ $eventDescription }}">
                    </div>
                </div>
            </div>
            <div class="create-event-rules-column">
                <div class="form-group">
                    <label>Event Rules</label>
                    <div class="formfield">
                        <img src="{{ asset('images/copy.png') }}">
                        <button id="view-rules" class="view-docs" @if (!$eventRules) disabled @endif>
                            <h4>click to view</h4>
                        </button>
                        <input type="hidden" name="event_rules_text" id="event_rules_text" value="{{ $eventRules }}">
                    </div>
                </div>
            </div>

            <div class="create-event-rules-column">
                <div class="form-group">
                    <label>Event prizes</label>
                    <div class="formfield">
                        <img src="{{ asset('images/copy.png') }}">
                        <button id="view-prize" class="view-docs" @if (!$eventPrize) disabled @endif>
                            <h4>click to view</h4>
                        </button>
                        <input type="hidden" name="event_prize_text" id="event_prize_text" value="{{ $eventPrize }}">
                    </div>
                </div>
            </div>
            <div class="event-library-division-row">
                <div class="create-event-rules-column">
                    <div class="form-group">
                        <label>Divisions</label>
                        <div class="event-library-division-stock formfield">
                            @if ($challengeCompatibles->isEmpty())
                                <p>No divisions found.</p>
                            @else
                                @foreach ($challengeCompatibles as $challengeCompatible)
                                    <p>{{ optional($challengeCompatible->divisions)->code }} -
                                        {{ optional($challengeCompatible->divisions)->name }} @if ($challengeCompatible->division_type == 'male')
                                            <a type='button' class='event-joined-by-division-list'
                                                href="{{ route('host.event.division.userScores', ['event_id' => jsencode_userdata($event->id), 'division_id' => jsencode_userdata($challengeCompatible->division_id), 'type' => 'male']) }}">Men's
                                                <img src="{{ asset('images/copy.png') }}"></a>
                                        @elseif($challengeCompatible->division_type == 'female')
                                            <a type='button' class='event-joined-by-division-list'
                                                href="{{ route('host.event.division.userScores', ['event_id' => jsencode_userdata($event->id), 'division_id' => jsencode_userdata($challengeCompatible->division_id), 'type' => 'female']) }}">Women's
                                                <img src="{{ asset('images/copy.png') }}"></a>
                                        @else
                                            <a type='button' class='event-joined-by-division-list'
                                                href="{{ route('host.event.division.userScores', ['event_id' => jsencode_userdata($event->id), 'division_id' => jsencode_userdata($challengeCompatible->division_id), 'type' => 'male']) }}">Men's
                                                <img src="{{ asset('images/copy.png') }}"></a>

                                            <a type='button' class='event-joined-by-division-list'
                                                href="{{ route('host.event.division.userScores', ['event_id' => jsencode_userdata($event->id), 'division_id' => jsencode_userdata($challengeCompatible->division_id), 'type' => 'female']) }}">Women's
                                                <img src="{{ asset('images/copy.png') }}"></a>
                                        @endif

                                    </p>
                                @endforeach
                            @endif
                        </div>
                    </div>
                </div>
                <div class="create-event-rules-column">
                    <div class="form-group">
                        <div class="event-library-promote-event formfield">
                            <div class="event-library-promote-checkbox">
                                <h6> Promote Event on RAF Web/app</h6>
                                <div class="filter-checkbox">
                                    <input type="checkbox" class="disabled-checkboxe" name="promote_event"
                                        value="" id="my-checkbox" {{ $event->promote_event ? 'checked' : '' }}
                                        disabled>
                                    <label for="my-checkbox" class="label-hidden"></label>
                                    <label for="my-checkbox" class="first-label label-displayed">No</label>
                                    <label for="my-checkbox" class="second-label label-displayed">Yes</label>
                                </div>
                            </div>
                            <div class="event-library-promote-checkbox">
                                <h6> Target photo required</h6>
                                <div class="filter-checkbox">
                                    <input type="checkbox" class="disabled-checkboxe" name="image_required"
                                        value="" id="my-checkbox2" {{ $event->image_required ? 'checked' : '' }}
                                        disabled>
                                    <label for="my-checkbox2" class="label-hidden"></label>
                                    <label for="my-checkbox2" class="first-label label-displayed">No</label>
                                    <label for="my-checkbox2" class="second-label label-displayed">Yes</label>
                                </div>
                            </div>
                            <div class="event-library-promote-checkbox">
                                <h6> Video required</h6>
                                <div class="filter-checkbox">
                                    <input type="checkbox" class="disabled-checkboxe" name="video_required"
                                        value="" id="my-checkbox3" {{ $event->video_required ? 'checked' : '' }}
                                        disabled>
                                    <label for="my-checkbox3" class="label-hidden"></label>
                                    <label for="my-checkbox3" class="first-label label-displayed">No</label>
                                    <label for="my-checkbox3" class="second-label label-displayed">Yes</label>
                                </div>
                            </div>
                            <div class="event-library-promote-checkbox">
                                <h6> Allow Multiple Attempts</h6>
                                <div class="filter-checkbox">
                                    <input type="checkbox" class="disabled-checkboxe" name="multiple_attempts"
                                        value="" id="my-checkbox3" {{ $event->multiple_attempts ? 'checked' : '' }}
                                        disabled>
                                    <label for="my-checkbox3" class="label-hidden"></label>
                                    <label for="my-checkbox3" class="first-label label-displayed">No</label>
                                    <label for="my-checkbox3" class="second-label label-displayed">Yes</label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="create-event-rules-column">
                    <div class="form-group">
                        <div class="formfield event-library-division-logo event-library-division-grid">
                            <div class="target-img-wrap">
                                <h5>Official Target</h5>
                                <div class="target-img-box">
                                    <img src="{{ '/storage/' . optional($event->eventTarget()->first())->path }}"
                                        class="target-img-uploaded">
                                    <img src="{{ asset('images/official-target-badge.png') }}"
                                        class="official-target-badge" alt="badge">
                                    <img src="{{ asset('images/frame-tail.png') }}" class="frame-tail" alt="badge">
                                </div>
                            </div>
                            <div class="logo-img-wrap">
                                <h5>Event Logo</h5>
                                <div class="logo-img-box">
                                    {{-- <img src="{{ ($event && !is_null(optional($event->eventLogo()->first())->path)) ? '/storage/' . optional($event->eventLogo()->first())->path : asset('images/hostedBy-logo.png') }}"> --}}
                                    <img
                                        src="{{ $event && !is_null(optional($event->eventLogo()->first())->thumbnail_path) ? '/storage/' . optional($event->eventLogo()->first())->thumbnail_path : asset('images/hostedBy-logo.png') }}">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="event-promotional-video">
                    <h3>Host’s Promotional Video</h3>
                    <div class="video-container mt-3">
                        {{-- <img src="{{ asset('images/video-bg1.png') }}" id="video-thumbnail"> --}}
                        <video id="video" controls>
                            <!-- Video source -->
                            <source src="{{ '/storage/' . optional($event->eventVideo()->first())->path }}">
                        </video>

                        <!-- Controlers continer -->
                        {{-- <div class="controls">
                            <!-- div for progress bar -->

                            <div class="playback-line">
                                <div class="progress-bar"></div>
                            </div>
                            <!-- Left controller div -->
                            <div class="inner-controls">
                                <div class="left">
                                    <button id="skipminus-10">
                                        <i class="fa-solid fa-backward"></i>
                                    </button>
                                    <button id="play-pause">
                                        <i class="fa-solid fa-play"></i>
                                    </button>
                                    <button id="skip-10">
                                        <i class="fa-solid fa-forward"></i>
                                    </button>
                                </div>
                                <!-- Right controller div -->
                                <div class="right">
                                    <div class="volume-container">
                                        <div class="video-timer">
                                            <span id="current-time">00:00</span>
                                            <span id="separator">/</span>
                                            <span id="max-duration">00:23</span>
                                        </div>
                                        <div id="mute">
                                            <i class="fas fa-volume-up"></i>
                                        </div>
                                        <input type="range" id="volume" min="0" max="1"
                                            step="0.01" value="1">
                                    </div>
                                </div>
                            </div>
                        </div> --}}
                    </div>
                </div>
                <div class="round-video-btns mt-2">
                    {{-- <a href="#" class="button primary-btn full-btn orange-outline action-btn"
                        data-title="Close Editing" data-request="direct"
                        data-message="Are you sure you want to close editing without saving your changes? Your changes will be lost."
                        data-btntext="YES SURE" data-method="get"
                        data-href="{{ route('host.event.newform', ['eventId' => jsencode_userdata($event->id)]) }}">Edit</a> --}}

                    {{-- <a href="{{ route('host.event.newform', ['eventId' => jsencode_userdata($event->id)]) }}" class="button primary-btn full-btn orange-outline">Edit</a> --}}

                    <a href="{{ route('host.event.editform', ['eventId' => jsencode_userdata($event->id)]) }}"
                        class="button primary-btn full-btn orange-outline">Edit</a>

                    <button href="#" class="button primary-btn full-btn action-btn" data-title="Delete The Event"
                        data-request="ajax"
                        data-message="Are you sure you want to delete the Event You won't be able to reverse this!"
                        data-btntext="YES I'M SURE" data-method="get"
                        data-href="{{ route('host.event.deleteEvent', ['eventId' => jsencode_userdata($event->id)]) }}">Delete</button>
                </div>
                <div class="round-video-btns mt-2">
                    <a href="#"
                        data-href="{{ route('host.event.duplicate', ['eventId' => jsencode_userdata($event->id)]) }}"
                        data-title="Are you sure you want to copy the event and purchase a new event Code ?"
                        data-message="By copying a prior event, you can fast track to hosting your next event. All of your prior details we carry over and you will only need to create a new event name, start and end dates and  datermine the appropriate event fee. All the other details can be modified individually if required."
                        data-btntext="YES I'M SURE-CONTINUE TO PAYMENT" data-request="ajax" data-method="post"
                        class="button primary-btn full-btn orange-outline create-duplicate-btn action-btn">Copy Event -
                        purchase new
                        event
                        code
                        <div class="spinner-border d-none" role="status">
                            <span class="sr-only">Loading...</span>
                        </div>
                    </a>
                </div>
            </div>
        </div>


    </section>

    <div class="modal fade purchase-event-code-modal" id="general-modal" tabindex="-1" aria-labelledby="modalTitle"
        aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-body modal-custm-body">
                    <div class="comman-modal-box">
                        <img src="{{ asset('images/why-icons.svg') }}">
                        <h3 class="modal-title" id="modalTitle">Modal Title</h3>
                        <p id="modalMessage">Modal message goes here.</p>
                        <div class="btn-outer mb-3">
                            <button type="button" class="button primary-btn full-btn"
                                data-bs-dismiss="modal">Cancel</button>
                        </div>
                        <a href="#" id="confirmLink" class="button primary-btn full-btn">Confirm
                            <div class="spinner-border d-none" role="status">
                                <span class="sr-only">Loading...</span>
                            </div>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>


    {{-- modal event prize --}}
    @include('host.event-new-flow.modal.event-prize')

    </div>
    {{-- common modal for event description and event rules  --}}
    @include('host.event-new-flow.modal.comon-modal')

  
    {{-- EVENT JOINED USERS LIST --}}
    {{-- <div class="modal  fade" id="show-event-joined-users" tabindex="-1" data-bs-backdrop="static" role="dialog"
        aria-labelledby="formModal" aria-hidden="true">
        <div class="modal-dialog wide-modal" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="formModal">Users List</h5>
                    <button type="button" class="close popup-btn-close" data-bs-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body joined-users-list-by-division">

                </div>
            </div>
        </div>
    </div> --}}

    <div class="modal fade " id="show-event-joined-users" tabindex="-1" data-bs-backdrop="static"
        aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-body modal-custm-body">
                    <div class="comman-modal-box">
                        <div class="cms-heading-bx">
                            <h5>Users List</h5>
                        </div>

                        <div class="modal-body joined-users-list-by-division">

                        </div>
                    </div>
                    <button type="button" class="close-modal button primary-btn full-btn" data-bs-dismiss="modal"
                        aria-label="Close">
                        <span aria-hidden="true">Close</span>
                    </button>
                </div>
            </div>
        </div>
    </div>
    
      {{-- score delete confirmation --}}
      @include('include.host.host-delete-score-confirmation')


    @push('scripts')
        <!-- <script src="{{ asset('js/custom-video.js') }}"></script> -->
        <script>
            jQuery(document).ready(function() {

                //show btn loader
                function showBtnLoader(element) {
                    jQuery(element).children('.spinner-border').removeClass('d-none')
                    jQuery(element).attr('disabled', true)
                }

                //hide btn loader
                function hideBtnLoader(element) {
                    jQuery(element).children('.spinner-border').addClass('d-none')
                    jQuery(element).attr('disabled', false)
                }

                // show event prize file preview on view button
                jQuery('#view-prize').click(function(e) {
                    showBtnLoader(jQuery(this));
                    // $('#event-prize-modal-content').html($('#event_prize_text').val());
                    let pdfUrl = "{{ asset('storage/' . @$event->pdfFile('event_prize')->path) }}";
                    // jQuery('#event-prize-preview').attr('src', pdfUrl + '#toolbar=0&navpanes=0');
                    previewPrizePdf(pdfUrl , jQuery('#event-prize-preview'))
                    jQuery('#preview-event-prize').modal('show');

                    hideBtnLoader(jQuery(this));
                });

                jQuery('#view-rules').click(function(e) {
                    e.preventDefault();
                    showBtnLoader(jQuery(this));

                    jQuery('#title').text('Event Rules');

                    // jQuery('#common-modal-content').html($('#event_rules_text').val());
                    let pdfUrl = "{{ Storage::url(@$event->pdfFile('event_rules')->path) }}";
                    
                    previewPdf(pdfUrl , jQuery('#pdf-preview'));
                    // jQuery('#pdf-preview').attr('src', pdfUrl + '#toolbar=0&navpanes=0');
                    jQuery('#pdf-preview-modal').modal('show');

                    hideBtnLoader(jQuery(this));
                });

                jQuery('#view-desc').click(function(e) {
                    e.preventDefault();

                    jQuery('#title').text('Event Description');

                    showBtnLoader(jQuery(this));
                    //showing preview of pdf
                    // jQuery('#common-modal-content').html($('#event_description_text').val());
                    let pdfUrl = "{{ Storage::url(@$event->pdfFile('event_description')->path) }}";
                    // console.log(pdfUrl);

                    // jQuery('#pdf-preview').attr('src', pdfUrl + '#toolbar=0&navpanes=0');
                    previewPdf(pdfUrl , jQuery('#pdf-preview'));
                    jQuery('#pdf-preview-modal').modal('show');

                    hideBtnLoader(jQuery(this));

                });

                // jQuery('.create-duplicate-btn').click(function(e) {
                //     e.preventDefault();
                //     showBtnLoader(jQuery(this));
                //     let url =
                //         "{{ route('host.event.duplicate', ['eventId' => jsencode_userdata($event->id)]) }}";
                //     let response = ajaxCall(url, 'post', null, true, true);
                //     response.then((response) => {
                //         if (response.status == true) {
                //             hideBtnLoader(jQuery(this));
                //             window.location.href = response.url;
                //         } else {
                //             errorShow('Error', response.message, 'Try again');
                //         }
                //     });
                //     hideBtnLoader(jQuery(this));
                // });

                function showConfirmPopup(title, message, href, requestType, buttonText, method) {
                    // Show modal with dynamic content
                    $('#modalTitle').text(title);
                    $('#modalMessage').text(message);
                    $('#confirmLink').attr('href', href);

                    // Show modal
                    $('#general-modal').modal('show');
                    $('#confirmLink').data('request', requestType);
                    $('#confirmLink').data('method', method);
                    $('#confirmLink').text(buttonText);
                }

                $('.action-btn').on('click', function(event) {
                    event.preventDefault(); // Prevent default anchor behavior

                    showBtnLoader(jQuery(this));
                    // Get data attributes
                    var title = $(this).data('title');
                    var message = $(this).data('message');
                    var href = $(this).data('href');
                    var requestType = $(this).data('request');
                    var buttonText = $(this).data('btntext');
                    var method = $(this).data('method');
                    showConfirmPopup(title, message, href, requestType, buttonText, method);
                    hideBtnLoader(jQuery(this));
                });

                $('#confirmLink').on('click', function(event) {
                    event.preventDefault();
                    showBtnLoader(jQuery(this));

                    var url = $(this).attr('href');
                    var requestType = $(this).data('request');
                    var method = $(this).data('method');
                    if (requestType != 'ajax') {
                        $("#general-modal").hide();
                        window.location.href = url;
                        // return false;
                    } else {
                        let response = ajaxCall(url, method, null, true, true);
                        response.then((response) => {
                            $("#general-modal").hide();
                            if (response.status == true) {
                                hideBtnLoader(jQuery(this));
                                errorShow('Success', response.message, 'Ok');
                                jQuery('#error-description').click(function() {
                                    window.location.href = response.url;
                                });
                            } else {
                                errorShow('Error', response.message, 'Try again');
                            }
                        });
                    }
                    hideBtnLoader(jQuery(this));
                });

                //SHOWING USERS JOINED EVENT LIST 
                jQuery('.event-joined-by-division-list').click(function(e) {
                    e.preventDefault();
                    let url = jQuery(this).attr('href');
                    let response = ajaxCall(url, 'get');

                    response.then((response) => {
                        if (response.status === true) {
                            let parentElement = jQuery('.joined-users-list-by-division');
                            parentElement.html(response.html);
                            jQuery('#show-event-joined-users').modal('show');
                        } else {
                            errorShow('Error', response.message, 'RETURN')
                        }
                    });
                });



            });

            jQuery(document).on('click', '.delete-score-event', function(e) {
                e.preventDefault();
                let anchorElement = jQuery(this);
                let ajaxUrl = jQuery(this).attr('href');
            });

            //WHEN USER CLICK ON DELETION BUTTON
            jQuery(document).on('click', '.confirm-score-event-delete', function(e) {
                e.preventDefault();
                let anchorElement = jQuery(this);
                jQuery('#delete-confirmation-modal').modal('show');

                //WHEN USER CLICK ON CONFIRM BUTTON
                jQuery('.delete-score-event').click(function(event) {
                    event.preventDefault();
                    let ajaxUrl = anchorElement.attr('href');
                    $.ajax({
                        url: ajaxUrl, 
                        type: 'get', 
                        success: function(response) {
                            if (response.status === true) {
                                if (jQuery(document).find('.challenge-user-row').length == 1) {
                                    anchorElement.closest('.challenge-user-row').find('td')
                                        .remove();
                                    jQuery(document).find('.challenge-user-row').html(
                                        '<td><center>No data found</center></td>')
                                } else {
                                    anchorElement.closest('.challenge-user-row').remove();
                                }
                                errorShow('Success', response.message, 'OK');
                                jQuery('#delete-confirmation-modal').modal('hide');
                            } else {
                                errorShow('Error', response.message, 'RETURN');
                            }
                        },
                        error: function(xhr, status, error) {
                            // Handle any errors that occurred during the request
                            errorShow('Error' , error , 'RETURN');
                            jQuery('#delete-confirmation-modal').modal('hide');
                        }
                    });
                });
            });
        </script>
    @endpush
@endsection