@extends('admin.layouts.masterlayout')
@section('styles')

<link href="{{asset('new_theme/assets/plugins/datatable/css/dataTables.bootstrap5.min.css')}}" rel="stylesheet" />
@endsection
@section('content')
<div class="main-content">
    <div class="row page-titles mx-0" data-aos="fade-up">
        <div class="card" data-aos="fade-up">
            <div class="card-header">
              <h4>Joined Leagues </h4>

            </div>
        <form target="_blank" action="{{ route($modelName.'.downloadUserjoinleague_pdf') }}" method="post">
            @csrf  <!-- Add CSRF token for security -->
            <div class="col-md-12 mt-5" id="daterange">
                <div class="form-row d-flex align-items-center">

                    <input type="hidden" name="user_id" value="{{ $id }}"/>

                    <div class="form-group col-md-4 mb-0">
                        Start Date:
                        <input placeholder="Start Date" type="text" required name="start_date" id="start_date" class="form-control datetimepickerget" value="{{ request('start_date', date('Y-m-01')) }}" autocomplete="off">
                    </div>

                    <div class="form-group col-md-4 mb-0 mx-3">
                        End Date:
                        <input placeholder="End Date" type="text" required name="end_date" id="end_date" class="form-control datetimepickerget" value="{{ request('end_date', date('Y-m-t')) }}" autocomplete="off">
                    </div>

                    <div class="form-group col-md-2 mb-0">
                        <button type="submit" class="btn btn-primary btn-down">
                            <i class="fa fa-file-excel-o mr-2"></i> Download PDF
                        </button>
                    </div>

                </div>
            </div>
        </form>

        <div class="col-12">
            <div class="card" data-aos="fade-up">

                <div class="card-body">
                    <div class="table-responsive">
                        <table id="dataList" class="table table-striped table-bordered" style="min-width: 845px">
                            <thead>
                                <tr>
                                <th>S No.</th>
                                <th>Season</th>
                                <th>Title</th>
                                <th>Format</th>
                                <th>Team 1 Name</th>
                                <th>Team 2 Name</th>
                                <th>Final Status</th>
                                <th>Start Date</th>
                                <th>Entryfee</th>
                                <th>Win Amount</th>
                                <th>Action</th>
                            </tr>
                            </thead>

                            <tfoot>
                                <tr>
                                <th>S No.</th>
                                <th>Season</th>
                                <th>Title</th>
                                <th>Format</th>
                                <th>Team 1 Name</th>
                                <th>Team 2 Name</th>
                                <th>Final Status</th>
                                <th>Start Date</th>
                                <th>Entryfee</th>
                                <th>Win Amount</th>
                                <th>Action</th>
                            </tr>
                            </tfoot>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
@php
$id = base64_encode(serialize($id));
@endphp
<!--End Edit User Balance Modal -->
@endsection
@section('scripts')
<script src="{{asset('new_theme/assets/plugins/datatable/js/jquery.dataTables.min.js')}}"></script>
<script src="{{asset('new_theme/assets/plugins/datatable/js/dataTables.bootstrap5.min.js')}}"></script>
<script type="text/javascript">
$(document).ready(function() {
  let start_date = '';
  let end_date= '';
  join_league(start_date ,end_date);

      $("#start_date").datetimepicker({
         timepicker:false,
         closeOnDateSelect:true,
         format: 'Y-m-d',
         onClose: function(current_time, $input){
            var end_date = $("#end_date").val().trim();
            var start_date = $('#start_date').val().trim();
            join_league(start_date,end_date);
         }
      });

      $("#end_date").datetimepicker({
        timepicker:false,
        closeOnDateSelect:true,
        initTime: true,
        format: 'Y-m-d',
        maxDate:0,
        onClose: function(current_time, $input){
          var end_date = $("#end_date").val().trim();
          var start_date = $('#start_date').val().trim();
          join_league(start_date,end_date);
        }
      });

});

 function join_league(start_date='',end_date=''){

  if(start_date !='' && end_date !=''){
    var url = window.location.href.split('?')[0];
    history.pushState('', '', url+"?filter=1&start_date="+start_date+"&end_date="+end_date);
  }
  $('#dataList').DataTable().clear().destroy();
  $('#dataList').DataTable({
    /*order: [1, 'desc'],*/
      "processing": true,
      "serverSide": true,
      "ajax":{
        url:"{{route($modelName.'.join_leauges',[$id,])}}",
        type: "POST",
          data : {"_token": "{{ csrf_token() }}" ,"start_date":start_date,"end_date":end_date}
      },
      "columns": [
          {data: 'DT_RowIndex', name: 'DT_RowIndex'},
          {data: 'season', name: 'season'},
          {data: 'title', name: 'title'},
          {data: 'format', name: 'format'},
          {data: 'team1display', name: 'team1display'},
          {data: 'team2display', name: 'team2display'},
          {data: 'final_status', name: 'final_status'},
          {data: 'start_date', name: 'start_date'},
          {data: 'entryfee', name: 'entryfee'},
          {data: 'win_amount', name: 'win_amount'},
          {data: 'action', name: 'action', orderable: false, searchable: false},
      ]
  });
}
</script>
@endsection