@extends('layouts.master')
@section('styles')
    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet">
    <!-- Toastify CSS -->
    <link rel="stylesheet" href="{{ asset('build/assets/libs/toastify-js/src/toastify.css') }}">
@endsection
@section('content')
    <meta name="csrf-token" content="{{ csrf_token() }}" />
    <!-- Page Header -->
    @php
        $breadcrumbs = [
            ['label' => 'Dashboard', 'url' => route('admin.dashboard')],
            ['label' => 'Leaderboard Winning', 'url' => '#', 'active' => true],
        ];
    @endphp
    <!-- Page Header Close -->

    <!-- Start::row-1 -->
    <div class="row">
        <div class="col-xl-12">
            <x-ui.card :cardClass="'overflow-hidden'" :hr_line="false" title="All User Activity">
                <x-slot name="header">
                  
                </x-slot>

                @php
                    $columns = [
                        ['checkbox' => true, 'class' => 'ps-4'],
                        ['label' => 'Rank'],
                        ['label' => 'User Name'],
                        ['label' => 'Amount'],
                        ['label' => 'Paid AT'],
                    ];
                @endphp

                <x-ui.table id="mytable" :columns="$columns"></x-ui.table>
            </x-ui.card>
        </div>
    </div>
@endsection

@section('scripts')
    @include('layouts.components.common-script')

    @vite('resources/assets/js/modal.js')

    <script>
        $(document).ready(function() {
            const table = new DataTableUtility('mytable', "{{ route('admin.leaderboard.winning.data') }}", {
                id:"{{ $leaderboard->id }}"
            }, [{
                    data: 'id',
                    orderable: false
                },
                {
                    data: 'user_id',
                    render:function(data,type,row){
                        return `<a href='/admin/users/track/${data}' target='blank' class='text-primary'>${data}</a>`;
                    }
                },
                {
                    data: 'task'
                },
                {
                    data: 'amount',
                    render: function(data, type, row) {
                        return (row.type == "credit") ?
                            `<span class=" fw-semibold  text-success fs-13">+${data}</span>` :
                            `<span class="fw-semibold text-danger fs-13">-${data}</span>`;
                    }
                },
                {
                    data: 'offer_id'
                },
                {
                    data: 'ip'
                },
                {
                    data: 'diamond',
                    render: function(data, type, row) {
                        return (data == 1) ? `Yes` : `No`;
                    }
                },
                {
                    data: 'created_at',
                   
                },
                {
                    data: null,
                    orderable: false,
                    render: function(data, type, row) {
                        return `
                            <a href="/admin/users/track/` + row.user_id + `" class="btn btn-icon btn-sm btn-info-light btn-wave waves-effect waves-light " id="${row.id}">
                                <i class="ri-edit-line"></i>
                            </a>`;
                    }
                }
            ]);
            table.initialize();

        });
    </script>
@endsection