@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">
			<div class="col-lg-6 col-12 align-self-center">
				<h5>Audience Gift List</h5>
			</div>
			<div class="col-lg-6 col-12 align-self-center">
				<div class="row row-cols-lg-2 row-cols-1 mb-2">

					<div class="col">
						<input type="text" id="audience_id" value="" class="alwaysfocus w-100 pt-1 pb-1  mt-2">
					</div>

					<div class="col">
						<button type="button" onClick="window.location.reload();" class="btn-warning pt-2 pb-2 d-inline mt-2">Fetch Data</button>
					</div>
				</div>
			</div>
		</div>
	</div>	
</section>

	
<section class="mt-3">
	<div class="container-fluid">
		<div class="row ">
			<div class="col-lg-3 col-12 order-1 order-sm-2 mb-3">
				<div class="row row-cols-1">
					<div class="col">
						<div class="w-100 shadow p-3 mb-3 bg-body rounded border-start border-success border-5">
							<h3 id="giftcount" class="text-primary">{{ $gift_data['total']; }}</h3>
							<h6>Total Gifts</h6>
						</div>
					</div>
					<div class="col">
						<div class="w-100 shadow p-3 mb-3 bg-body rounded border-start border-warning border-5">
							<h3 id="giftgiven" class="text-warning">{{ $gift_data['given']; }}</h3>
							<h6>Given</h6>
						</div>
					</div>
					<div class="col">
						<div class="w-100 shadow p-3 mb-3 bg-body rounded border-start border-info border-5">
							<h3 id="giftremaining" class="text-sec">{{ $gift_data['total']-$gift_data['given']; }}</h3>
							<h6>Remaining</h6>
						</div>
					</div>
				</div>
			</div>
			<div class="col-lg-9 col-12 order-2 order-sm-1">
				<div class="row">
					<div class="col-12">
						<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 pt-1 pb-1">Sr. No.</th>
								<th class="numeric bg-m bg-m pt-1 pb-1">Name</th>
								<th class="numeric bg-m bg-m pt-1 pb-1">Email</th>
								<th class="numeric bg-m bg-m pt-1 pb-1">Company</th>
								<th class="numeric bg-m bg-m pt-1 pb-1">Designation</th>
								<th class="numeric bg-m bg-m pt-1 pb-1">Gift Count</th>
							</tr>
						</thead>
						<tbody>
														<tr>
								<td colspan="6">No Visitor Found</td>
							</tr>
								
						</tbody>
					</table>
				</div>
					</div>
				</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(){
	        // $('#audience_id').trigger('blur').attr('readonly','readonly');
			var audience_id = $('#audience_id').val();

			$.ajax({
                	// url:_base_url_+'classes/Master.php?f=register',
                	url:"{{url('scan_gift_submit')}}",
                	type:'POST',
                	data:{"_token": "{{ csrf_token() }}", audience_id:audience_id, event_id:'', event_key:'', gift_id:''},
                	error:err=>{
                		console.log(err)
                	},
                	success:function(resp){
                		$("#audience_id").val('');
						resp = JSON.parse(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();
							$('#giftcount').text(resp.giftcount);
	            			$('#giftgiven').text(resp.giftgiven);
	            			$('#giftremaining').text(parseInt(resp.giftcount) - parseInt(resp.giftgiven));
                		}
                		// window.location.reload(1);
						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();
				}
			},2000);
		});
	</script>
@endsection