@extends('admin/admin')
	
	@section('content')
	<!-- Breadcrumb-->
	<ol class="breadcrumb">
	  <li class="breadcrumb-item">{{ __('Super Admin') }}</li>
	  <li class="breadcrumb-item active">{{ __('Template Report List') }}</li>
	  <!-- Breadcrumb Menu-->
	  <li class="breadcrumb-menu d-md-down-none">
		
	  </li>
	</ol>
    <!-- Page Content -->
    <div class="container-fluid">
        <div class="row justify-content-center">
			<div class="col-sm-12">
                <div class="card">
                  <div class="card-header">
                    <strong>{{ __('Template Report') }}</strong> {{ __('List') }}                            
                      <div class="card-header-actions">
                      </div>
                    </div>
					
                  <div class="card-body">
					<div class="messages">
					</div>
					
                    <table class="table table-responsive-sm table-hover table-outline mb-0 display" id="user_list">
                       
						<thead class="thead-light">
						
                            <tr>
							<th >{{ __('ID') }}</th>
						    <th >{{ __('Name') }}</th>
							<th >{{ __('Facebook') }}</th>
							<th >{{ __('Twitter') }}</th>
							<th >{{ __('Whatsapp') }}</th>
							<th >{{ __('Total Views') }}</th>
							<th >{{ __('Unique Visitor') }}</th>
                            </tr>
                        </thead>
                        <tbody>
                         
                        </tbody>
						<tfoot>
							<tr>
							<td></td>
							<td><select data-column="0" class="search-input-select">
						             <option value=""> Select All</option>
									 @foreach($list as $data)	
						             <option value="{{$data->id}}">{{$data->title}}</option>	
									 @endforeach
				          		</select>
							</td>
							<td></td>
							<td></td>
							<td></td>
							<td></td>
							<td></td>
							</tr>
						</tfoot>
                    </table>          

                  </div>
                  
                </div>
              </div>
		</div>
		
    </div>
@endsection 
@section('footer-scripts')
@parent
<script>
jQuery(document).ready(function() {                                                                                                                                                                                                                                                     
	jQuery('#user_list').DataTable( {
		"processing": true,
        "serverSide": true,
	    "ajax":{
			'type': 'POST',
			 'url': APP_URL+'/report/ajax_template_list',
			 "dataType": 'json',
			 'data':{_token: '{!! csrf_token() !!}'}
		},
		 "order": [[ 0, "asc" ]],
		 "columnDefs":[
		   {"visible": false, "targets":0},
		   ]
		
    });
	
	jQuery('.search-input-text').on( 'keyup', function () {   // for text boxes
		var i =jQuery(this).attr('data-column');  // getting column index
		var v =jQuery(this).val();  // getting search input value
		
		jQuery('#user_list').DataTable().columns(i).search(v).draw();
		
	});
	jQuery('.search-input-select').on( 'change', function () {   // for select box
		var i =jQuery(this).attr('data-column');
		var v =jQuery(this).val();
		jQuery('#user_list').DataTable().columns(i).search(v).draw();
	});
	jQuery('.dataTables_filter').hide();
});

</script>
@endsection