@extends('admin.layout.master')

@section('content')

<div class="app-content  my-3 my-md-5">
				<div class="side-app">
					<div class="page-header">
						<ol class="breadcrumb">
							<li class="breadcrumb-item" aria-current="page"><a href="javascript:void()">Package Review</a></li>
        					<li class="breadcrumb-item" aria-current="page"><a href="{{route('admin.package-review.ongoing.list')}}">Ongoing</a></li>
							<li class="breadcrumb-item active" aria-current="page">Test Details</li>
						</ol>
					</div>
					<!-- MAIN BODY CONTENT -->
		            <div class="card-header pt-5">
			          <h1>Test Details</h1>
			          <div class="filter-group flex-nowrap minWidth">
			            <p>Percentage</p>
			            <div id="myProgress" class="custmProgress" style="width: 100%">
			              <div id="myBar" style="width: {{$packageReviewDetails->completion_percent}}%"><span class="loader-text">{{$packageReviewDetails->completion_percent}}%</span></div>
			            </div>
			            @if($packageReviewDetails->completion_status == 1)
			            	<a href="{{route('admin.package-review.ongoing.report_list', base64_encode($packageReviewDetails->id))}}" class="btn btn-outline-primary btn-pill fs-14">All Tests Completed</a>
			            @else
			            	<a href="{{route('admin.package-review.ongoing.report_list', base64_encode($packageReviewDetails->id))}}" class="btn  btn-outline-primary btn-pill fs-14">Mark As Complete All Tests</a>
			            @endif
			            
			          </div>
			        </div>
		            <div class="row ">
		              <div class="col-xl-4 col-lg-6 col-md-12">
		                <div class="card">
		                  <div class="card-body small-card">
		                    <h5 class="font-medium">Total No of Test(s)</h5>
		                    <div class="counter">
		                      <svg
		                        id="small-card-icon"
		                        class="red"
		                        xmlns="http://www.w3.org/2000/svg"
		                        width="24"
		                        height="24"
		                        viewBox="0 0 24 24"
		                      >
		                        <g transform="translate(21090 -1397)">
		                          <rect
		                            width="24"
		                            height="24"
		                            transform="translate(-21090 1397)"
		                            fill="none"
		                          />
		                          <path
		                            d="M14.222,18H1.778A1.791,1.791,0,0,1,0,16.2V3.6A1.792,1.792,0,0,1,1.778,1.8H5.494a2.646,2.646,0,0,1,5.014,0h3.715A1.791,1.791,0,0,1,16,3.6V16.2A1.791,1.791,0,0,1,14.222,18ZM4.445,12.6a.9.9,0,0,0,0,1.8H8.89a.9.9,0,0,0,0-1.8Zm0-3.6a.9.9,0,0,0,0,1.8h7.111a.9.9,0,0,0,0-1.8Zm0-3.6a.9.9,0,0,0,0,1.8h7.111a.9.9,0,0,0,0-1.8ZM8,1.8a.9.9,0,1,0,.889.9A.9.9,0,0,0,8,1.8Z"
		                            transform="translate(-21086 1400)"
		                            fill=""
		                          />
		                        </g>
		                      </svg>
		                      <span class="maintotalSet">{{$totalTests}}</span>
		                    </div>
		                    <svg
		                      id="small-card-bg-icon"
		                      class="red"
		                      xmlns="http://www.w3.org/2000/svg"
		                      width="24"
		                      height="24"
		                      viewBox="0 0 24 24"
		                    >
		                      <g transform="translate(21090 -1397)">
		                        <rect
		                          width="24"
		                          height="24"
		                          transform="translate(-21090 1397)"
		                          fill="none"
		                        />
		                        <path
		                          d="M14.222,18H1.778A1.791,1.791,0,0,1,0,16.2V3.6A1.792,1.792,0,0,1,1.778,1.8H5.494a2.646,2.646,0,0,1,5.014,0h3.715A1.791,1.791,0,0,1,16,3.6V16.2A1.791,1.791,0,0,1,14.222,18ZM4.445,12.6a.9.9,0,0,0,0,1.8H8.89a.9.9,0,0,0,0-1.8Zm0-3.6a.9.9,0,0,0,0,1.8h7.111a.9.9,0,0,0,0-1.8Zm0-3.6a.9.9,0,0,0,0,1.8h7.111a.9.9,0,0,0,0-1.8ZM8,1.8a.9.9,0,1,0,.889.9A.9.9,0,0,0,8,1.8Z"
		                          transform="translate(-21086 1400)"
		                          fill=""
		                        />
		                      </g>
		                    </svg>
		                  </div>
		                </div>
		              </div>

		              <div class="col-xl-4 col-lg-6 col-md-12">
		                <div class="card">
		                  <div class="card-body small-card">
		                    <h5 class="font-medium">
		                      Total No. Of Subject(s)
		                    </h5>
		                    <div class="counter">
		                      <svg
		                        id="small-card-icon"
		                        class="orange"
		                        xmlns="http://www.w3.org/2000/svg"
		                        width="24"
		                        height="24"
		                        viewBox="0 0 24 24"
		                      >
		                        <g transform="translate(21090 -1397)">
		                          <rect
		                            width="24"
		                            height="24"
		                            transform="translate(-21090 1397)"
		                            fill="none"
		                          />
		                          <path
		                            d="M14.222,18H1.778A1.791,1.791,0,0,1,0,16.2V3.6A1.792,1.792,0,0,1,1.778,1.8H5.494a2.646,2.646,0,0,1,5.014,0h3.715A1.791,1.791,0,0,1,16,3.6V16.2A1.791,1.791,0,0,1,14.222,18ZM4.445,12.6a.9.9,0,0,0,0,1.8H8.89a.9.9,0,0,0,0-1.8Zm0-3.6a.9.9,0,0,0,0,1.8h7.111a.9.9,0,0,0,0-1.8Zm0-3.6a.9.9,0,0,0,0,1.8h7.111a.9.9,0,0,0,0-1.8ZM8,1.8a.9.9,0,1,0,.889.9A.9.9,0,0,0,8,1.8Z"
		                            transform="translate(-21086 1400)"
		                            fill=""
		                          />
		                        </g>
		                      </svg>
		                      <span>{{$totalSubjects}}</span>
		                    </div>
		                    <svg
		                      id="small-card-bg-icon"
		                      class="orange"
		                      xmlns="http://www.w3.org/2000/svg"
		                      width="24"
		                      height="24"
		                      viewBox="0 0 24 24"
		                    >
		                      <g transform="translate(21090 -1397)">
		                        <rect
		                          width="24"
		                          height="24"
		                          transform="translate(-21090 1397)"
		                          fill="none"
		                        />
		                        <path
		                          d="M14.222,18H1.778A1.791,1.791,0,0,1,0,16.2V3.6A1.792,1.792,0,0,1,1.778,1.8H5.494a2.646,2.646,0,0,1,5.014,0h3.715A1.791,1.791,0,0,1,16,3.6V16.2A1.791,1.791,0,0,1,14.222,18ZM4.445,12.6a.9.9,0,0,0,0,1.8H8.89a.9.9,0,0,0,0-1.8Zm0-3.6a.9.9,0,0,0,0,1.8h7.111a.9.9,0,0,0,0-1.8Zm0-3.6a.9.9,0,0,0,0,1.8h7.111a.9.9,0,0,0,0-1.8ZM8,1.8a.9.9,0,1,0,.889.9A.9.9,0,0,0,8,1.8Z"
		                          transform="translate(-21086 1400)"
		                          fill=""
		                        />
		                      </g>
		                    </svg>
		                  </div>
		                </div>
		              </div>

		              <div class="col-xl-4 col-lg-6 col-md-12">
		                <div class="card">
		                  <div class="card-body small-card">
		                    <h5 class="font-medium">
		                      Status
		                    </h5>
		                    <div class="counter">
		                      <svg
		                        id="small-card-icon"
		                        class="blue"
		                        xmlns="http://www.w3.org/2000/svg"
		                        width="24"
		                        height="24"
		                        viewBox="0 0 24 24"
		                      >
		                        <g transform="translate(21090 -1397)">
		                          <rect
		                            width="24"
		                            height="24"
		                            transform="translate(-21090 1397)"
		                            fill="none"
		                          />
		                          <path
		                            d="M14.222,18H1.778A1.791,1.791,0,0,1,0,16.2V3.6A1.792,1.792,0,0,1,1.778,1.8H5.494a2.646,2.646,0,0,1,5.014,0h3.715A1.791,1.791,0,0,1,16,3.6V16.2A1.791,1.791,0,0,1,14.222,18ZM4.445,12.6a.9.9,0,0,0,0,1.8H8.89a.9.9,0,0,0,0-1.8Zm0-3.6a.9.9,0,0,0,0,1.8h7.111a.9.9,0,0,0,0-1.8Zm0-3.6a.9.9,0,0,0,0,1.8h7.111a.9.9,0,0,0,0-1.8ZM8,1.8a.9.9,0,1,0,.889.9A.9.9,0,0,0,8,1.8Z"
		                            transform="translate(-21086 1400)"
		                            fill=""
		                          />
		                        </g>
		                      </svg>
		                        <ul class="list">
									<li>
										<span class="list-label">Not Started</span>
										<span class="list-count">{{$totalUnderProgressStatus}}</span>
									</li>
									<li>
										<span class="list-label">Ongoing</span>
										<span class="list-count">{{$totalCompletedStatus}}</span>													
									</li>
									<li>
										<span class="list-label">Completed</span>
										<span class="list-count">{{$totalReviewedStatus}}</span>													
									</li>
								</ul>	
		                    </div>
		                    <svg
		                      id="small-card-bg-icon"
		                      class="blue"
		                      xmlns="http://www.w3.org/2000/svg"
		                      width="24"
		                      height="24"
		                      viewBox="0 0 24 24"
		                    >
		                      <g transform="translate(21090 -1397)">
		                        <rect
		                          width="24"
		                          height="24"
		                          transform="translate(-21090 1397)"
		                          fill="none"
		                        />
		                        <path
		                          d="M14.222,18H1.778A1.791,1.791,0,0,1,0,16.2V3.6A1.792,1.792,0,0,1,1.778,1.8H5.494a2.646,2.646,0,0,1,5.014,0h3.715A1.791,1.791,0,0,1,16,3.6V16.2A1.791,1.791,0,0,1,14.222,18ZM4.445,12.6a.9.9,0,0,0,0,1.8H8.89a.9.9,0,0,0,0-1.8Zm0-3.6a.9.9,0,0,0,0,1.8h7.111a.9.9,0,0,0,0-1.8Zm0-3.6a.9.9,0,0,0,0,1.8h7.111a.9.9,0,0,0,0-1.8ZM8,1.8a.9.9,0,1,0,.889.9A.9.9,0,0,0,8,1.8Z"
		                          transform="translate(-21086 1400)"
		                          fill=""
		                        />
		                      </g>
		                    </svg>
		                  </div>
		                </div>
		              </div>
		            </div>
		           
		            <!-- Table -->
		            <div class="card">
		              <div class="card-header pt-5">
		                <h2>Test</h2>
		                <div class="filter-group">
		                	<select class="form-control test_search_filter" id="exam_type_filter" name="exam_type_filter">
		                    <option value="" >Exam Type</option>
		                    @if($examTypes)
	                    		@foreach($examTypes as $exams)
	                    		    <option value="{{$exams->exam_type_id}}">{{$exams->exam_type}}</option>
	                    		@endforeach
		                    @endif
		                  </select>
		                  
		                  <select class="form-control test_search_filter" id="testtype_filter" name="testtype_filter">
		                    <option value="" >Test Type</option>
		                    @if($testTypes)
	                    		@foreach($testTypes as $types)
	                    		    <option value="{{$types->package_test_type_id}}">{{$types->test_type_name}}</option>
	                    		@endforeach
		                    @endif
		                  </select>

		                  <select class="form-control test_search_filter" id="faculty_filter" name="faculty_filter">
		                    <option value="" >Faculty</option>
		                    @if($faculties)
	                    		@foreach($faculties as $faculty)
	                    		    <option value="{{$faculty->faculty_id}}">{{$faculty->faculty_name}}</option>
	                    		@endforeach
		                    @endif
		                  </select>


		                  <select class="form-control test_search_filter" id="status_filter" name="status_filter">
		                    <option value="" >Select Status</option>
		                    <option value="1" >Not Started</option>
		                    <option value="2">Ongoing</option>
		                    <option value="3" >Reviewed</option>
		                  </select>
		                </div>
		              </div>
		              <div class="card-body pt-0">
		                <p class="text-right font-bold total_test">Total No. Of Test(s): 0</p>
		                
		                <div class="table-responsive">
		                  <table id="package-review-test-list" class="stripe row-border order-column">
		                    <thead>
		                      <tr>
		                        <th>Test Name <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
		                        <th>Subject Name <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
		                        <th>Total Question Available <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
		                        <th>Duration Of Test <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
		                        <th>Status <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
		                        <th>Completion Status <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
		                        <th>Action <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
		                      </tr>
		                    </thead>
		                  </table>
		                </div>
		              </div>
		            </div>
		            </form>
		            <!-- //Table -->
		            <!--// MAIN BODY CONTENT -->
				</div>
			</div>
@endsection
@section('scripts')
<script type="text/javascript">
	var package_review_test_list = "{{route('admin.package-review.ongoing.test_list', base64_encode($packageReviewDetails->id))}}"; 
</script>
<script type="text/javascript" src="{{asset('js/package_review_ongoing.js?v='.time())}}"></script>
@endsection