@extends('layouts.master')
@section('contain')
    <div class="row page-titles"
        >
        <div class="col-md-5 align-self-center">
            <h3 class="text-themecolor">Leader Board Management</h3>
        </div>
        <div class="col-md-7 align-self-center text-end">
            <div class="d-flex justify-content-end align-items-center">
                <ol class="breadcrumb justify-content-end">
                    <li><a class="breadcrumb-item active" href="{{ url('/') }}">Home</a></li>
                    {{-- <li class="breadcrumb-item active">User Table</li> --}}
                </ol>

                {{-- @if (now()->greaterThan($leader_board->end)) --}}
                @if ($leader_board->status == false)
                    <a href="{{ route('leaderBoard.create') }}"><button type="button"
                            class="btn btn-info d-none d-lg-block m-l-15 text-white"><i class="fa fa-plus-circle"></i>Create
                            New</button></a>
                @endif
            </div>
        </div>
    </div>
    <div class="card" style="font-size: small;">
        <div class="card-body">
            {{-- <h6 class="card-subtitle">Data table example</h6> --}}
            <div class="table-responsive m-t-40">
                <table id="myTable" class="table table-striped border">
                    <thead>
                        <tr class="text-white" style="background-color: gray">
                            <th>Image</th>
                            <th>Title</th>
                            <th>Prize</th>
                            <th>Start Date</th>
                            <th>End Date</th>
                            <th>Status</th>
                            <th>Action</th>
                        </tr>
                    </thead>
                    <tbody>
                        @php
                            $num = 1;
                        @endphp
                        <tr>
                            <td>
                                <a href="{{ URL::asset($leader_board->image != null ? env('MEDIA_URL') . $leader_board->image : 'images/placeholderimage.png') }}"
                                    target="_blank">
                                    <img src="{{ $leader_board->image != null ? env('MEDIA_URL') . $leader_board->image : asset('images/placeholderimage.png') }}"
                                        class="img-circle"
                                        style="height: 50px; width: 50px; border: 1px solid #a7a7a7; border-radius: 50%;" />
                                </a>
                            </td>
                            <td style="vertical-align: middle">{{ $leader_board->title }}</td>
                            <td style="vertical-align: middle">$ {{ $leader_board->prize }}</td>
                            <td style="vertical-align: middle">
                                {{ date('F d Y', strtotime($leader_board->start)) }}
                            </td>
                            <td style="vertical-align: middle">
                                {{ date('F d Y', strtotime($leader_board->end)) }}
                            </td>
                            <td style="vertical-align: middle">
                                @if ($leader_board->status == 1)
                                    <p class="badge rounded-pill bg-success ms-auto mb-2 mb-md-0">Active</p>
                                @else
                                    <p class="badge rounded-pill bg-warning ms-auto mb-2 mb-md-0">Finished</p>
                                @endif
                            </td>
                            <td style="vertical-align: middle">
                                {{-- <button class="btn btn-info" data-bs-toggle="modal" data-bs-target="#exampleModal"
                                    data-msg="{{ json_encode($leader_board) }}" onclick="setMsg(this)">
                                    <i title="View Detail" class="fa fa-eye"></i>
                                </button> --}}
                                <a title="edit" href="{{ route('leader.edit', $leader_board->id) }}"><i class="far fa-edit"
                                        style="font-size:20px"></i>
                                </a>
                            </td>

                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    <!-- sample modal detail -->
    <div class="modal" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel1">
        <div class="modal-dialog " role="document">
            <div class="modal-content" style="background-color: darkgray;border-radius: 5%;">
                <div class="modal-header">
                    <h4 class="font-bold" id="exampleModalLabel1">Ad Detail
                    </h4>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true"></span></button>
                </div>
                <div class="modal-body">
                    <div class="table-responsive">
                        <table id="" class="table table-striped">
                            <thead>
                                <tr class="text-white" style="background-color: gray">
                                    <th>S.No</th>
                                    {{-- <th>Thumbnail</th> --}}
                                    <th>Reason</th>
                                    <th>Description</th>
                                    {{-- <th>Media</th> --}}
                                    {{-- <th>Created</th> --}}
                                </tr>
                            </thead>
                            <tbody class="mydata">

                                <tr>
                                    <td>0</td>
                                    <td
                                        value="https://images.unsplash.com/photo-1604964432806-254d07c11f32?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxzZWFyY2h8M3x8ZGV2ZWxvcGVyfGVufDB8fDB8fA%3D%3D&auto=format&fit=crop&w=700&q=60">
                                        image</td>
                                    <td>null</td>
                                </tr>
                                <tr>
                                    <td>1</td>
                                    <td
                                        value="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/WeAreGoingOnBullrun.mp4">
                                        video</td>
                                    <td>null</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                {{-- <div class="modal-footer"> --}}
                <button type="button" class="btn btn-default text-dark" data-bs-dismiss="modal">Close</button>
                {{-- </div> --}}
            </div>
        </div>
    </div>
    <!-- /.modal detail end-->
    {{-- reason modal --}}

    {{-- reason modal end --}}
    <script>
        // popup method detail
        function setMsg(e) {
            let dataList = '';
            var s_no = 1;
            let mydata = $(e).attr("data-msg");
            let value = JSON.parse(mydata);
            if (mydata.length > 0) {
                // alert(value.thumbnail)
                if (value) {
                    let data = '<a href="{{ URL::asset(env('MEDIA_URL')) }}' + value.thumbnail +
                        '" target="_blank"><img width="50px" style ="height: 50px" class="img-circle" src="{{ URL::asset(env('MEDIA_URL')) }}' +
                        value.thumbnail +
                        '" /></a>';
                    let reason = value.reason ? value.reason : 'N/A';
                    let description = value.description ? value.description : 'N/A';
                    dataList += '<tr><td>' + s_no++ + '</td><td>' + reason + '</td><td>' + description + '</td></tr><br>';
                }
            } else {
                dataList = '<tr><td colspan="4"> No Data </td></tr>';
            }
            console.log(dataList);
            $('.mydata').empty();
            $('.mydata').html(dataList);
            // $('#tdMdlMsg').html($(e).attr("data-msg"));
        }



        // popup method detail end
        // popup method

        function populateModal(adId) {
            var form = document.getElementById('my-form');
            var reasonInput = document.getElementById('message-text').value;

            var modal = new bootstrap.Modal(document.getElementById('responsive-modal'));
            $('#adId').val(adId);
            // modal.show();
        }

        function swalll(id) {
            event.preventDefault();
            swal({
                    title: "Are you sure want to Reject this Ad?",
                    // text: "Pending this Ad !",
                    icon: "warning",
                    buttons: true,
                    dangerMode: true,
                })
                .then((willDelete) => {
                    if (willDelete) {
                        var formId = "delete-form-" + id;
                        document.getElementById(formId).submit();
                        // swal("Poof! Your imaginary file has been deleted!", {
                        //     icon: "success",
                        // });
                    } else {
                        // swal("Your imaginary file is safe!");
                    }
                });


            // alert(id);
        }

        function swal2(id) {
            event.preventDefault();
            swal({
                    title: "Are you sure want to Approve this Ad?",
                    // text: "Active this Ad !",
                    icon: "warning",
                    buttons: true,
                    dangerMode: true,
                })
                .then((willDelete) => {
                    if (willDelete) {
                        var formId = "approve-leader_board-" + id;
                        document.getElementById(formId).submit();
                        // swal("Poof! Your imaginary file has been deleted!", {
                        //     icon: "success",
                        // });
                    } else {
                        // swal("Your imaginary file is safe!");
                    }
                });


            // alert(id);
        }
    </script>
@endsection