@php
    $participant = ['No limit', '1 KTP unique 1 for day', '1 phone unique 1 for day', '1 KTP unique on event', '1 phone unique on event'];
@endphp

@extends('layout.default')
@include('layout.filter')

@section('styles')
    <!--begin::Page Vendors Styles(used by this page)-->
    <link href="{{env('STORAGE_URL_VIEW')}}plugins/custom/datatables/datatables.bundle.css?v=7.0.8" rel="stylesheet" type="text/css" />
    <!--end::Page Vendors Styles-->

    <style>
        /*To nowrap text*/
        .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default, .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default{
            white-space: nowrap;
        }
        .pagination {
            justify-content: right !important;
        }
    </style>
@endsection

@section('content')
@yield('filter_view')
    <br>
    <div class="card">
        <div class="card-body">
            @include('layout.notifications')
            <!--begin: Datatable-->
            <div class="row">
                <div class="col-2"><b>Brand</b></div>
                <div class="col-5">: {{$detail_event['brand_name']}}</div>
            </div>
            <div class="row">
                <div class="col-2"><b>Product</b></div>
                <div class="col-5">: {{$detail_event['product_name']}}</div>
            </div>
            <div class="row">
                <div class="col-2"><b>Time Start</b></div>
                <div class="col-5">: {{$detail_event['event_time_start'] ? date('d-m-Y H:i', strtotime($detail_event['event_time_start'])) : null}}</div>
            </div>
            <div class="row">
                <div class="col-2"><b>Time End</b></div>
                <div class="col-5">: {{$detail_event['event_time_end'] ? date('d-m-Y H:i', strtotime($detail_event['event_time_end'])) : null}}</div>
            </div>
            <div class="row">
                <div class="col-2"><b>QTY Available</b></div>
                <div class="col-5">: {{$detail_event['event_qty_available']}}</div>
            </div>
            <div class="row">
                <div class="col-2"><b>Method</b></div>
                <div class="col-5">: {{$detail_event['event_method']}}</div>
            </div>
            <br>
            @if($detail_event['event_method'] == 'Raffle' && $detail_event['generate_status'] == 0)
                <div class="row">
                    <div class="col-10"></div>
                    <div class="col-2" style="text-align: right">
                        <a data-toggle="confirmation" data-popout="true" class="btn btn-sm btn-primary" onclick="generateWinner({{$detail_event['dropzone_event_id']}})"><i class="ki ki-reload icon-nm"></i>Generate Winner</a>
                    </div>
                </div>
            @endif
            <div style="overflow-x: scroll;white-space:nowrap">
                <table class="table table-bordered table-checkable" id="kt_datatable">
                    <thead>
                    <tr>
                        <th>No</th>
                        <th>Ticket Number</th>
                        <th>Name</th>
                        <th>ID Card Number</th>
                        <th>Address</th>
                        <th>Phone</th>
                        <th>Action</th>
                    </tr>
                    </thead>
                    <tbody>
                    @if(!empty($data))
                        @foreach($data as $value)
                            <tr>
                                <td>{{$value['winner_number']}}</td>
                                <td>{{$value['user_participant_ticket_number']}}</td>
                                <td>{{$value['user_participant_name']}}</td>
                                <td>{{$value['user_participant_id_card_number']}}</td>
                                <td>{{$value['user_participant_address']}}</td>
                                <td>{{$value['user_participant_phone']}}</td>
                                <td>
                                    <a data-toggle="confirmation" data-popout="true" data-name="{{$value['user_participant_name']}}" data-user="{{$value['user_participant_id']}}" data-id="{{$detail_event['dropzone_event_id']}}" class="btn btn-sm btn-primary update"><i class="ki ki-reload icon-nm"></i> Update</a>
                                </td>
                            </tr>
                        @endforeach
                    @else
                        <tr>
                            <td colspan="10" style="text-align: center">Data Not Available</td>
                        </tr>
                    @endif
                    </tbody>
                </table>
            </div>
            <br>
            <div class="row">
                <div class="col-md-12">
                    @if (!empty($data_paginator))
                        {{ $data_paginator->links('pagination') }}
                    @endif
                </div>
            </div>
        </div>
    </div>
@endsection

@section('scripts')
    <!--begin::Page Vendors(used by this page)-->
    <script src="{{env('STORAGE_URL_VIEW')}}plugins/custom/datatables/datatables.bundle.js?v=7.0.8"></script>
    <!--end::Page Vendors-->
    @yield('filter_script')
    <script>
        rules={
            user_participant_name:{
                display:'Name',
                operator:[
                    ['=','='],
                    ['like','like']
                ],
                opsi:[]
            },
            user_participant_id_card_number:{
                display:'ID Card Number',
                operator:[
                    ['=','='],
                    ['like','like']
                ],
                opsi:[]
            },
            user_participant_address:{
                display:'Address',
                operator:[
                    ['=','='],
                    ['like','like']
                ],
                opsi:[]
            },
            user_participant_phone:{
                display:'Phone',
                operator:[
                    ['=','='],
                    ['like','like']
                ],
                opsi:[]
            },
            user_participant_size:{
                display:'Size',
                operator:[
                    ['=','='],
                    ['like','like']
                ],
                opsi:[]
            }
        };
        var table;
        $(document).ready(function() {
            table = $('#kt_datatable').DataTable({searching: false, "paging": false, ordering: false, dom: 'Bfrtip',
            columnDefs: [
                            {
                                targets: 3,
                                type: 'text',
                                render: function (data, type, row) {
                                if (type === 'export') {
                                    return '\u200C' + data;
                                }
                                return data;
                                }
                            }
                        ],
            buttons:    [{
                            extend: 'excelHtml5',
                            text: 'Download Excel',
                            exportOptions: { 
                                orthogonal: 'export',
                                columns: [ 0, 1, 2, 3, 4, 5 ]
                             },
                        }]
            });
            $('#kt_datatable').on('click', '.update', function () {
                const row = $(this).parents('tr');
                const url = "{{url('dropzoneevent/update-winner')}}"
                const user_id = $(this).data("user");
                const id = $(this).data("id");

                Swal.fire({
                    title: "Are you sure want to update winner "+$(this).data("name")+"?",
                    text: "You won't be able to revert this!",
                    icon: "warning",
                    showCancelButton: true,
                    confirmButtonText: "Yes, delete it!"
                }).then(function (result) {
                    if (result.value) {
                        $.ajax({
                            type: "POST",
                            url: url,
                            data: {
                                '_token': '{{csrf_token()}}',
                                'user_participant_id' : user_id,
                                'dropzone_event_id' : id
                            },
                            success: function (response) {
                                if (response.status == 'success') {
                                    swal.fire({
                                        title: "Updated!",
                                        text: "Winner has been update.",
                                        icon: "success",
                                        timer: 900,
                                        showConfirmButton:false,
                                        confirmButtonText: false
                                    }).then(function () {
                                        window.location.href = "{{url('dropzoneevent/list-winner')}}/"+id;
                                    });
                                } else {
                                    Swal.fire(
                                        "Failed!",
                                        response.messages ? response.messages[0] : 'Something went wrong',
                                        "error"
                                    )
                                }
                            },
                            error: function () {
                                Swal.fire(
                                    "Failed!",
                                    "Failed update data",
                                    "error"
                                )
                            }
                        });
                    }
                });
            });
        });

        function generateWinner(event_id){
            const url = "{{url('dropzoneevent/generate-winner')}}"
            Swal.fire({
                title: "Are you sure want to generate pasticipant winner?",
                text: "You won't be able to revert this!",
                icon: "warning",
                showCancelButton: true,
                confirmButtonText: "Yes, generate it!"
            }).then(function (result) {
                if (result.value) {
                    $.ajax({
                        type: "POST",
                        url: url,
                        data: {
                            '_token': '{{csrf_token()}}',
                            "dropzone_event_id" : event_id
                        },
                        beforeSend: function() {
                            swal.fire({
                                html: '<h5>Loading...</h5>',
                                showConfirmButton: false
                            });
                        },
                        success: function (response) {
                            if (response.status == 'success') {
                                swal.fire({
                                    title: "Generated!",
                                    text: "Winner has been generated.",
                                    icon: "success",
                                    timer: 900,
                                    showConfirmButton:false,
                                    confirmButtonText: false
                                }).then(function () {
                                    window.location.href = "{{url('dropzoneevent/list-winner')}}/"+event_id;
                                });
                            } else {
                                Swal.fire(
                                    "Failed!",
                                    response.messages ? response.messages[0] : 'Something went wrong',
                                    "error"
                                )
                            }
                        },
                        error: function () {
                            Swal.fire(
                                "Failed!",
                                "Failed delete data",
                                "error"
                            )
                        }
                    });
                }
            });
        }
    </script>
@endsection