@extends('layouts.common')
 
 @section('title')
	Laiqa | Admin | Dashboard
 @endsection
 @section('content')



	<div class="page-wrapper">
		<div class="content">
			<div class="row">
				<div class="col-sm-4 col-3">
					<h4 class="page-title">Usage</h4>
				</div>
				<div class="col-sm-8 col-9 text-right m-b-20">
					<!--<a href="" class="btn btn btn-primary btn-rounded float-right"><i class="fa fa-plus"></i> Add New</a>-->
				</div>
			</div>
			<div class="row">
				<div class="col-md-12">
				
					<div class="table-responsive">
						<table id="datatable" class="datatable table table-stripped custom-table" >
							<thead>
								<tr>
									<th>ID</th>
									<th>Name</th>
									<th>Email</th>
									<th>Phone</th>
									<th>No.of logins</th>
									<th>Last Login</th>
									<th>No.of period entries</th>
									<th>Period journal entries</th>
									
									<!--<th class="text-right">Action</th>-->
								</tr>
							</thead>
							<tbody>
							
							</tbody>
						</table>
					</div>
				</div>
			</div>
		</div>
	  
		<div id="delete_appointment" class="modal fade delete-modal" role="dialog">
			<div class="modal-dialog modal-dialog-centered">
				<div class="modal-content">
					<div class="modal-body text-center">
						<img src="assets/img/sent.png" alt="" width="50" height="46">
						<h3>Are you sure want to delete this Appointment?</h3>
						<div class="m-t-20"> <a href="#" class="btn btn-white" data-dismiss="modal">Close</a>
							<button type="submit" class="btn btn-danger">Delete</button>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
		
		

@endsection

@section('scripts')

<script>
$(document).ready(function() {
  

  var table = $('.custom-table').DataTable({
		"language": {
				'loadingRecords': '&nbsp;',
				//'processing': '<div class="spinner"></div>'
				"processing": '<i class="fa fa-spinner fa-spin" style="font-size:24px;color:rgb(75, 183, 245);"></i>',
				
			 },
		dom: '<"top"ip>rt<"bottom"flp><"clear">',
        processing: true,
        serverSide: true,
		 responsive: true,
		pageLength: 20,
        ajax:  { 
			url: "{{ route('usage.index') }}" ,
		},
        columns: [
            {data: 'DT_RowIndex', name: 'DT_RowIndex'},
            {data: 'user_name', name: 'user_name'},
            {data: 'email', name: 'email'},
            {data: 'user_phone', name: 'user_phone'},
			 {data: 'login_count', name: 'login_count'},
			 {data: 'last_login', name: 'last_login'},
            {data: 'period_count', name: 'period_count'},			
            {data: 'pj_cnt', name: 'pj_cnt', orderable: true, searchable: false},
        ]
    });
});
</script>

@endsection