@extends('layouts.master')

@section('content')
<style type="text/css">
  
</style>

<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
  <!-- Content Header (Page header) -->
  <div class="content-header">
    <div class="container-fluid">
      <div class="row mb-2">
        <div class="col-sm-6">
          <h1 class="m-0 text-dark">{{ trans('breadcrumbs.Tournament User Ticket') }}</h1>
        </div>
        <!-- /.col -->
        <div class="col-sm-3"></div>
        <div class="col-sm-3">
          <ol class="breadcrumb float-sm-right">
            <li class="breadcrumb-item">{{ Breadcrumbs::render('Tournament User Ticket') }}</li>
          </ol>
        </div>
        <!-- /.col -->
      </div>
      <!-- /.row -->
    </div>
    <!-- /.container-fluid -->
  </div>
  <!-- /.content-header -->

  <section class="content">
    <div class="card" id="filterDiv">
      <div class="card-header">
        <h3 class="card-title">{{ trans('layout.Filter') }}</h3>
        <div class="col-md-6 card-primary card-form-1">
          <div class="card-body">
           
            <div class="form-col-1">
              {{ Form::label('TOURNAMENT_NAME',  trans('tournament.Tournament Name'))}}
              {{ Form::select('TOURNAMENT_NAME', $tournamentName, '',['class' => 'form-control select2','placeholder' => trans('reports.Select option'),'id' => 'TOURNAMENT_NAME']) }}
              <span id="TOURNAMENT-error" class="error-help-block"></span>
            </div>
             <div class="button_sec">
              <button class="btn btn-primary" id="getReport">{{ trans('layout.Submit') }}</button>
              <button class="btn btn-default" id="reloadPage">{{ trans('layout.Clear') }}</button>
            </div>
          </div>
        </div>
      </div>
      <!-- /.card-body -->
    </div>
    <div class="card" id="report" style="display:none">
            <div class="card-header">
                <h3 class="card-title" id="report_title"></h3>
            </div>
            <div class="card-body">
                <!-- <div class="dt-buttons" onClick="post()"><button class="dt-button buttons-excel buttons-html5" tabindex="0" type="button" title="Excel"><span><i class="fa fa-file-excel-o"></i></span></button> </div> -->
                <table id="table" class="table table-bordered table-striped">
                    <thead>
                        <tr>
                            <th class="text-center">{{ trans('tournament.Username') }}</th>
                            <th class="text-center">{{ trans('tournament.Email Id') }}</th>
                            <th class="text-center">{{ trans('tournament.Registered Date') }}</th>
                            <th class="text-center">{{ trans('tournament.Status') }}</th>
                        </tr>
                    </thead>
                </table>
            </div>
            <!-- /.card-body -->
        </div>
 
  </section>

</div>
@endsection
@section('javascript')
@include('datatablejs')
<script type="text/javascript">
  var reportTable;

  $(document).on('change', '.form-control', function(){
      $(this).closest('div').find('.error-help-block').html('');
      $('#report').hide();
  });

  $("#getReport").click(function() {

    
    var tournament = $("#TOURNAMENT_NAME").val();
    if (tournament.length < 3) {
        $("#TOURNAMENT-error").html('Select valid tournament');
        return;
    }else{
        $("#TOURNAMENT-error").html('');
    }

   
    $('#report_title').html("Tournament User Ticket: ");
    $('#report').show();

    reportTable = $('#table').DataTable({
      "responsive": true,
      "paging": false,
      "processing": true,
      "bDestroy": true,
      "serverSide": true,
      "searching": false,
      "ordering": false,
      "aaSorting": [],
      "columnDefs": [
        {
          "className": 'text-center',
          "targets": [0, 1, 2, 3],
        }
      ],
      "ajax": {
        "url": "{{ route('userTicket.fetch') }}",
        "type": "GET",
        "data": function(d) {
          d.filter_tournament = $("#TOURNAMENT_NAME").val();
        },
        "error": function(e) {
          swal("{{ trans('layout.Something went wrong') }}", {
            icon: "warning",
          });
        },
      },
      "drawCallback": function(response, settings) {
        var api = this.api();
        var rows = api.rows({
          page: 'current'
        }).nodes();
        if (rows.length > 0) {
          $('.dt-buttons').show();
        } else {
          $('.dt-buttons').hide();
        }
      }
    });
  });
  function post() {
    const form = document.createElement('form');
    form.method = 'get';
    form.action = "{{ route('userTicket.download') }}";

    const hiddenField2 = document.createElement('input');
    hiddenField2.type = 'hidden';
    hiddenField2.name = 'filter_tournament_name';
    hiddenField2.value = $("#TOURNAMENT_NAME").val();
    
    form.appendChild(hiddenField2);

    document.body.appendChild(form);
    form.submit();
  }
</script>
@stop