@extends('backend.layouts.app')
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0/css/bootstrap.css" rel="stylesheet">
<link href="https://cdn.datatables.net/1.10.16/css/dataTables.bootstrap4.min.css" rel="stylesheet">
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
<script>
    $('document').ready(function(){
        var table = $('#example').DataTable({
            language: {
                "lengthMenu": "Display _MENU_ Records",
                'paginate': {
                    'previous': '<span> <i class="fa fa-arrow-circle-left" style=" font-size: 18px; " aria-hidden="true"></i></span>',
                    'next': '<span><i class="fa fa-arrow-circle-right" style=" font-size: 18px; " aria-hidden="true"></i></span>',
                },
            },
            "lengthMenu": [[5,10,50,100,300,500, -1], [5,10,50,100,300,500, "All"]],
            "ordering":false,
            columnDefs: [
                // { width: 50, targets:1},
            ],
            fixedColumns: false,
            initComplete: function () {
                this.api().columns([1,2,]).every( function () {
                    var column = this;
                    var select = $('<select class="form-control select2" style="width: 100%;"><option value="">Search</option></select>')
                        .appendTo( $(column.header()).empty() )
                        .on( 'change', function () {
                            var val = $.fn.dataTable.util.escapeRegex(
                                $(this).val()
                            );
    
                            column
                                .search( val ? '^'+val+'$' : '', true, false )
                                .draw();
                        } );
    
                    column.data().unique().sort().each( function ( d, j ) {
                        select.append( '<option value="'+d+'">'+d+'</option>' )
                    } );
                } );
            },
            "infoCallback": function( settings, start, end, max, total, pre ) {
                var api = this.api();
                var pageInfo = api.page.info();
                var htmlView = '<strong>Total Records: '+total+'</strong>'
                return htmlView;
            },
        });
        $('.select2').select2();
    });
</script>
@section('content')
<div class="col-xl-12">
	<div class="breadcrumb-holder">
		<h5 style="text-align: center"> Individual Member Report </h5>
		 <a href="{{route('drivingrange.add')}}" class="btn btn-success" style="color: #000000; border: 1px solid #eee; margin: 0px auto;" >
					<i class="fa fa-home" aria-hidden="true" style="font-size: 20px; "></i>
					{{-- <img src="{{ url('public/backend/images/icons/admission.png') }}" style="width: 20px"> --}}
					 Driving Dashboard
				</a>
		
		<br>
	
		<div class="clearfix"></div>
	</div>
</div>
<div class="container-fluid" >
	<div class="row">
		<div class="col-xl-12">
			<form method="get">
				<div class="card">
					<div class="card-body">	
                        <form action="{{ route('memberWiseReport') }}" method="get">
                            <div class="row justify-content-center daily-filter">
                                <label class="col-sm-1 control-label text-right">Member</label>
                                <div class="col-sm-3 text-center">								
                                    <select class="form-control select2" name="row_id" id="row_id" style="width: 100%;">
                                        <option value="" selected="selected">Membership No</option>
                                        @if(sizeof($name) > 0)
                                        @foreach($name as $n)
                                        <option value="{{ $n['id'] }}"
                                            @if(isset($request->row_id))
                                                @if($n['id'] == $request->row_id)
                                                    selected
                                                @endif
                                            @endif
                                        >{{ $n['name'] }}</option>
                                        @endforeach
                                        @endif
                                    </select>
                                </div>
                                <label class="col-sm-1 control-label text-right">Start Date</label>
                                    <div class="col-sm-2 text-center">								
                                        <input type="text" name="date_from" class="datepickerjui text-center form-control" value="{{$date_from}}" autocomplete="off" required="" id="date_from"/>
                                    </div>
                                <label class="col-sm-1 control-label text-right">End Date</label>
                                    <div class="col-sm-2 text-center">
                                        <input type="text" name="date_to" class="datepickerjui text-center form-control" value="{{$date_to}}" autocomplete="off" required="" id="date_to" />
                                    </div>
                                <div class="col-sm-2 " style="display: inline-flex;">							
                                    <button type="submit" class="btn btn-info"><i class="fa fa-search"></i></button>
                                    <button type="button" id="categoryPrint" class="btn btn-info" style="margin-left: 7px;"><i class="fa fa-print"></i></button>
                                </div>

                            </div>
                        </form>
					</div>
					<div class="card-footer text-center">					
                        <form id="categoryPrintForm" target="_blank" action="{{ route('memberWiseReportPrintIndivisual') }}" method="get">
                            <input type="hidden" name="row_id" id="print_row_id">
                            <input type="hidden" name="date_from" id="print_date_from">
                            <input type="hidden" name="date_to" id="print_date_to">
                        </form>
					</div>
				</div>
			</form>
		</div>
        <div class="card-body" style="background: white;">	
            <div class="row">
                <div class="col-xl-12">	
                    <table class="table table-striped table-bordered" id="example" style="width: 100%;">
                        <thead>
                            <tr>
                                <th>SL</th>
                                <th>Date</th>
                                <!-- <th>Category</th> -->
                                <!-- <th>Name</th> -->
                                <th>Shift</th>
                                <th>Service Name</th>
                                <th>Total</th>
                            </tr>
                            <tr>
                                <th>SL</th>
                                <th>Date</th>
                                <!-- <th>Category</th> -->
                                <!-- <th>Name</th> -->
                                <th>Shift</th>
                                <th>Service Name</th>
                                <th>Total</th>
                            </tr>
                        </thead>
                        <tbody>
                            @if(sizeof($model) > 0)
                            @foreach($model as $m)
                                <tr>
                                    <td>{{ ++$sl }}</td>
                                    <td>{{ date("d-m-Y", strtotime($m->created_at)) }}</td>
                                    <!-- <th>{{ $m->player_type }}</th> -->
                                    <!-- <td>{{ App\Drivingrangeservice::getMemberWiseName($m->id) }}</td> -->
                                    <td>{{ $m->shift }}</td>
                                    <td style="width: 40%;">
                                        <table>
                                            <tbody>