@if($type == 'base')
<div class="row form-group">
	<div class="col-md-6">
		@if(!empty($log_details))
		@php $company_id =$log_details[0]->company_id;  @endphp
			{{ $log_details ?  Carbon\Carbon::parse($log_details[0]->created_at)->format('jS F \\, Y') : ""}}
		@endif
	</div>
	<div class="col-md-12 text-right">
		 @if(!empty($is_image_proctering))
		  @if(count($images) != 0)
		 	<a href="javascript:void(0)" class="md-trigger btn screen-capture-btn" data-modal="pro-report-view" data-backdrop="static" data-keyboard="false" data-proctoring-type="{{$proctoringType}}" id="jp-image-proctoring"><i class="fa fa-picture-o"></i>View test taker's images</a>
		 	@endif
			@if($video)
			  	@if(!empty($video->video_filepath) && (!$is_proctored_rec_video))
			  		<a href="javascript:void(0)" class="md-trigger btn screen-capture-btn" data-modal="pro-video-view" data-backdrop="static" data-keyboard="false" id="jp-video-proctoring"><i class="fa fa-video-camera"></i>View Video Capture</a>
				  	@php $proct_video = \HireMeeHelper::getAWSVideoUrl($video->video_filepath,getenv('prodevbucket'),'hiremeeprodev'); @endphp
				  	<input type="hidden" class="video_links" data-values="{{ $proct_video }}"> 
				@endif  	
			@endif	
		 @endif		
		 @if(!empty($is_screen_capture))
		    <a href="javascript:void(0)" class="md-trigger btn screen-capture-btn" data-modal="pro-report-captured-screen" data-backdrop="static" data-keyboard="false"  id="js-image-captured-screen"><i class="fa fa-picture-o"></i>Assessment screen images</a>
	    @endif

		{{-- @if(isset($company_id)&&(in_array($company_id,explode(',',getenv('NCVET_company')))))
			@if($is_proctored_rec_video)
			<a href="javascript:;" class="md-trigger btn screen-capture-btn" id="js-pro-proctoring-video"><i class="fa fa-video-camera"></i>Video</a>
			@endif
		@endif --}}
		<a href="javascript:;" class="md-trigger btn screen-capture-btn" id="js-pro-proctoring-recorded-video"><i class="fa fa-video-camera"></i>videos</a>
	</div>
</div>
<div></div>
@endif
@forelse($log_details as $log_detail)
@php if($loop->iteration % 2 == 0){
	$classname = 'light-grey';
}else {		
	$classname = 'dark-grey-bg';
} 
 @endphp
<div class="proctoring-report-list-wrapper">
	<div class="proctoring-report-list {{$classname}}">
		<div class="row d-flex align-items-center">
			<div class="col-xs-12 col-md-12">
				<div class="row">
					<div class="col-md-2 "><span class="label-dark">{{$log_detail ? Carbon\Carbon::parse($log_detail->created_at)->format('g:i:s a') : ""}}  </span></div> 
					<div class="col-md-10 "><span class="data label-dark">{{$log_detail->event_name}}</span></div>
				</div>
			</div>
		</div>
	</div>
</div>
@empty
No record found
@endforelse

@if(isset($hasmore))
<div class="col-md-12">
	<div class="text-center">
  		<input type="hidden" id="load-more" data-value="true">
    	<a href="javascript:;" class="btn btn-outline-info" id="js-pro-proctoring-report-loadmore" data-page='2'>Load more...</a>
	</div>
</div>
@endif

	<div class="md-modal m-w-950 md-effect-1 md-effect-new1" id="pro-report-view"  style="width: 96%;
max-width: none;
height: 100%;
margin: 0;">
		<div class="hme-loading-mask" style="height:100% !important;">
    <div class="hme-loading-container">
        <div class="hme-dual-ring"></div>
        <div>Please wait, Loading...</div>
    </div>
  </div>
		<form name="feedbackpost" id="feedbackpost">
			<div class="md-content p-l-0 p-r-0 p-t-0" style="height: 92vh !important;">
				<button type="button" class="btn btn-primary btn-icon-custom waves-effect md-close login-close-btn"><span class="hiremee-multiply f-18"></span></button>
				<div class="report-modal-head p-b-5 p-t-5">
					@php $invalid_image = 0; @endphp
					@foreach($images as $image)
					  @php 
						if($image->is_valid == 0){
							$invalid_image = $image->is_valid + 1;
						}else {
							$invalid_image = 0;
						} 
						@endphp
					@endforeach
					<div class="d-flex justify-content-between align-items-center">
						<div><h2>Proctoring Report Screen Capture Preview <span class="pull-right pt-3 pr-3"> </span></h2>
					<span>Screen captured at consecutive timestamp while assessment</span>
				</div>
						<div>
							<button type="button" class="btn report-modal-btn btn-info mr-3 btn-download-custom" id="jp-pdf" data-flagged='0' style="border: 1px solid #fff;">Download</button>
						</div>

					</div>

				</div>
				<div class="report-modal-content report-modal-content-new">
					{{-- @version 20.0 @author Dilip <V2E17314> - Start --}}
					
					
						<!--<li class="nav-item">
							<a class="nav-link active flaggedtabs" data-toggle="tab" href="#all-proctored" data-imcount="0" role="tab">All </a>
						</li>-->
						
						
						@if($proctoringType == 1)
						{{--<ul id="imgTab" class="nav nav-tabs md-tabs" role="tablist" style="background:#fff;padding: 0px;">
						<li class="nav-item">
							<a class="nav-link active flaggedtabs" data-toggle="tab" href="#all-proctored" data-imcount="0" role="tab">All</a>
						</li>
							<li class="nav-item">
							<a class="nav-link flaggedtabs" data-toggle="tab" href="#flagged-proctored" data-imcount="0" role="tab">AI Processed </a>
						</li>
						</ul>--}}
						<ul id="imgTab" class="nav nav-tabs md-tabs" role="tablist" style="background:#fff;padding: 0px;">
							<li class="nav-item">
							<a class="nav-link active flaggedtabs" data-toggle="tab" href="#flagged-proctored" data-imcount="0" role="tab">AI Processed </a>
						</li>
						<!--<li class="nav-item">
							<a class="nav-link flaggedtabs" data-toggle="tab" href="#all-proctored" data-imcount="0" role="tab">All</a>
						</li>-->
						</ul>
					@endif	
					
					<div class="tab-content p-0">
						
							<!--<div class="tab-pane active" id="all-proctored" role="tabpanel">
								<div class="tab-content row p-l-0 p-r-10" id="js-pro-image-data"></div>
							</div>-->
					
						@if($proctoringType == 1)
						<div class="tab-pane " id="all-proctored" role="tabpanel">
							<div class="tab-content row p-l-0 p-r-10" id="js-pro-image-data"></div>
						</div>
						<div class="tab-pane active" id="flagged-proctored" role="tabpanel">
							<div class="tab-content row p-l-0 p-r-10" id="js-pro-image-data-flagged"></div>
						</div>
						@elseif($proctoringType == 2)
							<div class="tab-pane active" id="all-proctored" role="tabpanel">
								<div class="tab-content row p-l-0 p-r-10" id="js-pro-image-data"></div>
							</div>
						@else
							<div class="tab-pane active" id="unsetting-proctored" role="tabpanel">
								<div class="tab-content row p-l-0 p-r-10" id="unsetting-image-data"></div>
							</div>
						@endif
					</div>
					<!-- <div class="tab-content row p-l-0 p-r-10" id ="js-pro-image-data"></div> -->
					{{-- @version 20.0 @author Dilip <V2E17314> - End --}}
				</div>
			<!--<div class="report-modal-footer">
				{{-- @version 20.0 @author Dilip <V2E17314> - @abstract added data-flagged --}}
				<button type="button" class="btn report-modal-btn" id="jp-pdf" data-flagged='0'>Download</button>
			</div>-->
			</div>
		</form>
	</div>

	<div class="md-modal m-w-950 md-effect-1" id="pro-video-view">
		<form name="feedbackpost" id="feedbackpost">
			<div class="md-content p-l-0 p-r-0 p-t-0">
				<button type="button" class="btn btn-primary btn-icon-custom waves-effect md-close login-close-btn"><span class="hiremee-multiply f-18"></span></button>
				<div class="report-modal-head p-b-5 p-t-5">
					<h2>Proctoring Report Screen Video Preview </h2>
				</div>
				<div class="report-modal-content">
					 <div id="myElement-video"></div>
				</div>
				<div class="report-modal-footer">
					<button type="button" class="btn report-modal-btn" id="jp-video-download">Download Proctored Video</button>
				</div>
			</div>
		</form>
	</div>
	<div class="md-overlay"></div>

	{{-- View Procotored image Modal --}}
	<div class="">
	<div class="modal fade" id="view-proctoring-screen">
	  <div class="modal-dialog modal-md modal-dialog-centered" role="document">
	    <div class="modal-content">
	      <div class="modal-header">
	        <h5 class="modal-title text-dark" id="exampleModalLongTitle"></h5>
	        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
	          <span aria-hidden="true"><i class="hiremee-multiply f-18"></i></span>
	        </button>
	      </div>
	      <div class="modal-body text-center">
	     
	        <img src="" alt="User-Profile-Image" class="report-image img-fluid" id='js-proctoring-image-preview' style="width:auto; height: 350px;" >
	        <p class="reason-content" id="exampleModalReason"></p>
	      </div>
	    </div>
	  </div>
	</div>
	</div>
{{-- @abstract --> Captured screen images @author Karthikaipriyan <V2E18436> - Start --}}
	<div class="md-modal m-w-950 md-effect-1 md-effect-new1" id="pro-report-captured-screen" style="top: 6%;width: 96%;max-width: none;height: 100%;margin: 0;">
			<div class="hme-loading-mask" style="height:100% !important;">
		        <div class="hme-loading-container">
			        <div class="hme-dual-ring"></div>
			        <div>Please wait, Loading...</div>
		       </div>
	       </div>	
	       <div class="md-content p-l-0 p-r-0 p-t-0">
		       <button type="button" class="btn btn-primary btn-icon-custom waves-effect md-close login-close-btn"><span class="hiremee-multiply f-18"></span></button>
			   <div class="report-modal-head p-b-5 p-t-5">
					<h2>Screen Capture Image Preview</h2>
			   </div>
			    <div class="report-modal-content" style="height: 549px !important;">
					<div class="tab-content row p-l-0 p-r-10" id="js-pro-screen-captured-images"></div>
			   </div>	
	      </div>
	</div>	
	<div class="modal fade" id="screen-captured-preview">
	    <div class="modal-dialog modal-md modal-dialog-centered" role="document">
	      <div class="modal-content">
	        <div class="modal-header">
		          <h5 class="modal-title text-dark" id="screen_capture_ModalLongTitle"></h5>
		          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
		            <span aria-hidden="true"><i class="hiremee-multiply f-18"></i></span>
		          </button>
	        </div>
	        <div class="modal-body text-center">
	          <img src="" alt="User-Profile-Image" class="screen-capture-report-image img-fluid" id='js-screen-capture-image-preview' style="width:auto; height: 350px;" >
	        </div>
	      </div>
	   </div>
	</div>
<div class="md-overlay"></div>

	{{-- End--}}