@extends('layouts.header')
@section('content')
<br>
<div class="page-header">
	<div class="breadcrumb-four">
		<ul class="breadcrumb">
			<li><a href="{{url('dashboard')}}" title="Go to Home Page!"><svg xmlns="http://www.w3.org/2000/svg"
						width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
						stroke-linecap="round" stroke-linejoin="round" class="feather feather-home">
						<path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path>
						<polyline points="9 22 9 12 15 12 15 22"></polyline>
					</svg></a></li>
			<li class="active">
				<a href="" title="Show Existing Reports">
					<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
						stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
						class="feather feather-database">
						<ellipse cx="12" cy="5" rx="9" ry="3"></ellipse>
						<path d="M21 12c0 1.66-4 3-9 3s-9-1.34-9-3"></path>
						<path d="M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5"></path>
					</svg>
					UserWise - First Response TAT Report
				</a>
			</li>
		</ul>
	</div>
</div>
<br>
<div class="row">
	<div class="col-lg-12 col-md-12 layout-spacing">
		<div id="iconsAccordion" class="accordion-icons accordion">
			<div class="card">
				<div class="card-header" id="...">
					<section class="mb-0 mt-0">
						<div role="menu" class="collapsed" data-bs-toggle="collapse" data-bs-target="#iconAccordionTwo"
							aria-expanded="false" aria-controls="iconAccordionTwo">
							<div class="accordion-icon"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
									viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
									stroke-linecap="round" stroke-linejoin="round" class="feather feather-zoom-in">
									<circle cx="11" cy="11" r="8"></circle>
									<line x1="21" y1="21" x2="16.65" y2="16.65"></line>
									<line x1="11" y1="8" x2="11" y2="14"></line>
									<line x1="8" y1="11" x2="14" y2="11"></line>
								</svg></div>
							Search Filters <div class="icons"><svg xmlns="http://www.w3.org/2000/svg" width="24"
									height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
									stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-down">
									<polyline points="6 9 12 15 18 9"></polyline>
								</svg></div>
						</div>
					</section>
				</div>
				<div id="iconAccordionTwo" class="collapse" aria-labelledby="..." data-parent="#iconsAccordion">
					<div class="card-body">
						<form id="ReportSearchForm" name="ReportSearchForm">
							<div class="row">
								<div class="col-md-4">
								<label>Created Date</label>
										@php
											$todaydate=date("Y-m-d");
										@endphp
										<input type="date" name="SearchDate" id="SearchDate" class="form-control" value="" placeholder="Search Date" >
								</div>
							</div>
						</form>
						<br>
						<div class="row">
							<div class="col-md-12" align="center">
								<input type="button" class="btn btn-primary" value="submit"
									onclick="DisplayUserFRTATReport()">
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="statbox widget box box-shadow">
			<div id="DisplayUserFRTATReport"></div>
		</div>
	</div>
</div>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
	$(document).ready(function() {
		DisplayUserFRTATReport();
	});

	function DisplayUserFRTATReport() {
		var SearchDate=document.getElementById('SearchDate').value;
		console.log("SearchDate ",SearchDate)
		var formData = {
			Mode : 'ReportView',
			SearchDate : SearchDate,
		};
		$.ajax({
			type: "post",
			url: "{{url('DisplayUserFRTATReport')}}",
			data: formData,
			headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
			beforeSend: function() {
				$('#DisplayUserFRTATReport').html('<center> <div class="spinner-border text-primary align-self-center loader-lg"></div><center>');
			},
			success: function(result) {
				$('#DisplayUserFRTATReport').html(result);
				console.log(result);
			},
			complete: function() {
				//inner ajax from here
				//inner ajax till here
			},
			error: function(response) {
				alert("error:" + response);
			}
		});
	}


	
</script>
@endsection