@extends('admin_template')
@section('content')
<main class="main-con">
	<section class="breadcrumb-con align-items-center">
		<div class="container-fluid">
			<div class="row row-cols-1 row-cols-md-2 justify-content-between">
				<div class="col-lg-6 col-12 align-self-center">
					<h5>{{$allhalls[$_GET['hallid']]}} - {{$allsessions[$_GET['hall_sessionid']]}}, Attendance List</h5>
				</div>	
				<div class="col-lg-6 col-12 align-self-center text-end">
					<div class="row justify-content-end">
						@if($session['role'] == 1 || $session['role'] == 2)
						<div class="col">
 							<input type="text" id="audience_id" value="" class="col-12 alwaysfocus">
						</div>
						@endif
						<div class="col-auto align-self-center">
							<a href="{{ url('hall-session-scanner').(isset($_GET) ? '?'.http_build_query($_GET):''); }}" class="btn-warning">Refresh Data</a>
						</div>
						@if($session['role'] == 1 || $session['role'] == 2 || $session['role'] == 8)
						@if(isset($res) && is_array($res) && count($res) > 0)
						<div class="col-2 align-self-center">
							<a type="button" href="{{ url('hallsession_scanned_export').'?'.(isset($_GET) ? http_build_query($_GET) : '') }}" class="btn-info-border pt-1 pb-1">Export</a>
						</div>
						@endif
						<div class="col-auto align-self-center">
							<a href="{{ url('audience-event-list').'?event_id='.$_GET['eid'].'&event_key='.$_GET['ekey'] }}" class="btn-info pt-1 pb-1" title="Add Checkpoint">Audience</a>
						</div>
						@endif
					</div>
				</div>	
			</div>
		</div>	
	</section>
	<section>
		<div class="container-fluid">
			<div class="row">
				<div class="col-lg-9 col-12 order-2 order-sm-1">
					<div id="no-more-tables">
							<table class="col-md-12 table-bordered table-striped table-condensed cf bg-white">
								<thead class="cf">
									<tr>
										<th class="numeric bg-m">Sr. No.</th>
										<th class="numeric bg-m">Key</th>
										<th class="numeric bg-m">Name</th>
										<th class="numeric bg-m">Email</th>
										<th class="numeric bg-m">Company</th>
										<th class="numeric bg-m">Designation</th>
										<th class="numeric fw-bold bg-m p-2 pt-1 pb-1">Lead Status</th>
										<th class="numeric bg-m">Visit Count</th>
									</tr>
								</thead>
								<tbody>
									<tr>
																				<tr>
											<td colspan="5">No Visitor Found</td>
										</tr>
											
									</tr>
								</tbody>
							</table>
						</div>
				</div>
				<div class="col-lg-3 col-12 order-1 order-sm-2 mb-3">
					
					<div class="w-100 shadow p-3 mb-3 bg-body rounded border-start border-success border-5">
						<h3 id="enteredcount" class="text-primary">
							{{ $event_data['entered']; }}
						</h3>
						<h6>Entered</h6>
					</div>
					<div class="w-100 shadow p-3 mb-3 bg-body rounded border-start border-warning border-5">
						<h3 id="remainingcount" class="text-warning">
							{{ $event_data['capacity']-$event_data['entered']; }}
						</h3>
						<h6>Remaining</h6>
					</div>
					
					<div class="w-100 shadow p-3 mb-3 bg-body rounded border-start border-info border-5">
						<h3 id="capacitycount" class="text-sec">
							{{ $event_data['capacity']; }}
						</h3>
						<h6>Capacity</h6>
					</div>
				</div>
			</div>
		</div>
	</section>
</main>	
<!-- Modal -->
<div class="modal fade" id="scanPopup" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-body">
        <h3 class="bg-primary text-white pt-5 pb-5 text-center" id="scansuccess"></h3>
				<h3 class="bg-danger text-white  pt-5 pb-5 text-center" id="scanerror"></h3>
      </div>
    </div>
  </div>
</div>





<script>
	function _qsave(){
		var audience_id = $('#audience_id').val();
		$.ajax({
    	url:"{{url('hall-session-scanner-submit')}}",
    	type:'POST',
    	data:{"_token": "{{ csrf_token() }}", audience_id:audience_id, eid:'', ekey:'', hallid:'', hall_sessionid:''},
    	error:err=>{
    		console.log(err)
    	},
    	success:function(resp){
    		$("#audience_id").val('');
				resp = JSON.parse(resp);
				console.log(resp);
				$('#scanPopup').modal("show");
          		if(resp.success == 0)
          		{
          			console.log(resp.msg);
          			$('#scanerror').text(resp.msg);
					$('#scanerror').show();
          		}
          		if(resp.success == 1)
          		{
          			console.log(resp.msg);
          			$('#scansuccess').text(resp.msg);
					$('#scansuccess').show();
					
          			$('#capacitycount').text(resp.capacity);
          			$('#enteredcount').text(resp.entered);
          			$('#remainingcount').text(parseInt(resp.capacity) - parseInt(resp.entered));	
          		}
          		setTimeout(function(){
					$('#scanerror, #scansuccess').hide();
					$('#scanPopup').modal("hide");
				}, 1000);
				$('#audience_id').focus();
				$('#audience_id').val('');
    	}
    })
	}
    
    $(document).ready(function(){
		$('#audience_id').focus();
		$('#scanerror, #scansuccess').hide();
		setInterval(function () {
			var myInput = document.getElementById("audience_id");
			if (myInput && myInput.value) {
				_qsave();
			}
		},1000);
	});
</script>
@endsection