@extends('coaching.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="{{route('coaching.practice_set.list')}}">Practice Set Manager</a></li>
				<li class="breadcrumb-item" aria-current="page"><a href="javascript:void()">{{$practiceSetDetails->set_name}}</a></li>
				<li class="breadcrumb-item active" aria-current="page">Chapter Details</li>
			</ol>
		</div>
		<!-- MAIN BODY CONTENT -->
        <h1>Chapter Details</h1>
        @if(Session::has('error'))
			<div class="alert alert-danger" style="background: none; border: none;">
				<p style="color: #f00">{{ Session::get('error') }}</p>
			</div>
		@endif
		@if(Session::has('errors'))
			<div class="alert alert-danger" style="background: none; border: none;">
				<p style="color: #f00">{{ Session::get('errors') }}</p>
			</div>
		@endif
        <form class="search_filter_frm" method="post">
        {{csrf_field()}}
        <div class="row ">
          <div class="col-xl-4 col-lg-4 col-md-4 col-sm-6">
            <div class="card">
              <div class="card-body small-card">
                <h5 class="font-medium">Total No. Of Question(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>{{$totalQuestions}}</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-4 col-md-4 col-sm-6">
            <div class="card">
              <div class="card-body small-card">
                <h5 class="font-medium">
                  Total No. Of Chapter(s) in all Practice Sets
                </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 class="maintotalSet">{{$totalChapters}}</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-4 col-md-4 col-sm-12">
            <div class="card">
              <div class="card-body small-card">
                <h5 class="font-medium">
                  Total No. Of Faculty
                </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>
                  <span>{{$totalFaculties}}</span>
                </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 result-header">
            <h2>Chapter Details</h2>
            <div class="filter-group">
              <a href="@if($practiceSetDetails->status == 3 || $practiceSetDetails->status > 4){{'javascript:void(0)'}}@else{{route('coaching.practice_set.chapter.add', base64_encode($practiceSetDetails->id))}}@endif" class="btn btn-primary add-btn add-btn-sm @if($practiceSetDetails->status == 3 || $practiceSetDetails->status > 4){{'disable-btn'}}@endif"><i class="fa fa-plus-circle"></i>Add Chapter</a>
              
              <select class="form-control search_filter" id="subject_filter" name="subject_filter">
                <option value="" >Subjects</option>
                @if($subjects)
            		@foreach($subjects as $subject)
            		    <option value="{{$subject->subject_id}}"  @if(request()->post('subject_filter') == $subject->id){{'selected'}}@endif>@if(isset($subject->subjectByPracticeSetSubject)){{$subject->subjectByPracticeSetSubject[0]->subject}}@endif</option>
            		@endforeach
                @endif
              </select>
              
          	<select class="form-control search_filter" id="status_filter" name="status_filter">
                <option value="" >Select Status</option>
                <option value="1"  @if(request()->post('status_filter') == 1){{'selected'}}@endif>Under Progress</option>
                <option value="2" @if(request()->post('status_filter') == 2){{'selected'}}@endif>Completed</option>
                <option value="3" @if(request()->post('status_filter') == 3){{'selected'}}@endif>In Review</option>
                <option value="4" @if(request()->post('status_filter') == 4){{'selected'}}@endif>Rejected</option>
                <option value="5" @if(request()->post('status_filter') == 5){{'selected'}}@endif>Live</option>
              </select>
            </div>
          </div>
          <div class="card-body pt-0">
            <p class="text-right font-bold total_test">Total No of Chapter: {{count($chapters)}}</p>
            <div class="">
              <table
                id="practice-set-chapter-manager"
                class="stripe row-border order-column dataTable no-footer">
                <thead>
                  <tr>
                    <th>Chapter <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
                    <th>Subject <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
                    <th>No of Question(s) <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
                    <th>Faculty Name <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>Action</th>
                  </tr>
                </thead>
                
              </table>
            </div>
          </div>
        </div>
        </form>
        <!-- //Table -->
        <!--// MAIN BODY CONTENT -->
	</div>
</div>
@endsection
@section('scripts')
<script type="text/javascript">
	var practice_set_chapter_data = "{{route('coaching.practice_set.chapter.list', base64_encode($practiceSetDetails->id))}}"; 
</script>
<script type="text/javascript" src="{{asset('js/coaching/practice_set_chapter.js?v='.time())}}"></script>
@endsection