@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 ">
          <a href="">Package Review</a>
        </li>
        <li class="breadcrumb-item active" aria-current="page">
          Ongoing
        </li>
      </ol>
    </div>
    <!-- MAIN BODY CONTENT -->
    <div class="card-header">
    <h1>Ongoing</h1>
    <!-- <div class="filter-group">
      <label class="switch-light switch-md" onclick="">
          <input type="checkbox" id="summary" name="summary" value="1" />
          <span class="alert alert-light">
            <span class="off">Todays Summary</span>
            <span class="on">Total Summary</span>
            <a class="btn btn-primary"></a>
          </span>
        </label>
    </div> -->
    </div>
      <div class="row ">
        <div class="col-xl-4 col-lg-4 col-md-6">
          <div class="card">
            <div class="card-body small-card">
              <h5 class="font-medium">Today's Review Received</h5>
              <div class="counter list-group">
                <p class="list-item test_series_today">
                  Test Series: <span> 0</span>
                </p>
                <p class="list-item practice_set_today">
                  Practice Set: <span> 0</span>
                </p>
                <p class="list-item quiz_today">
                  Quiz: <span> 0</span>
                </p>
              </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-6">
          <div class="card">
            <div class="card-body small-card">
              <h5 class="font-medium">Review Recieved Till Now</h5>
              <div class="counter list-group">
                <p class="list-item test_series_seven">
                  Test Series: <span> 0</span>
                </p>
                <p class="list-item practice_set_seven">
                  Practice Set: <span> 0</span>
                </p>
                <p class="list-item quiz_seven">
                  Quiz: <span> 0</span>
                </p>
              </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-6">
          <div class="card">
            <div class="card-body small-card">
              <h5 class="font-medium">Review Resolved Till Now</h5>
              <div class="counter list-group">
                <p class="list-item test_series_thirty">
                  Test Series: <span> 0</span>
                </p>
                <p class="list-item practice_set_thirty">
                  Practice Set: <span> 0</span>
                </p>
                <p class="list-item quiz_thirty">
                  Quiz: <span> 0</span>
                </p>
              </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>
      <div class="row ">
        <div class="col-xl-4 col-lg-4 col-md-6">
          <div class="card">
            <div class="card-body small-card">
              <h5 class="font-medium">Test Series</h5>
              <div class="counter list-group">
                <p class="list-item test_series_pending_resolved">
                  Pending: <span> 0</span>
                </p>
                <p class="list-item test_series_ongoing_resolved">
                  Ongoing: <span> 0</span>
                </p>
                <p class="list-item test_series_complete_resolved">
                  Complete: <span> 0</span>
                </p>
              </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-6">
          <div class="card">
            <div class="card-body small-card">
              <h5 class="font-medium">Practice Sets</h5>
              <div class="counter list-group">
                <p class="list-item practice_set_pending_resolved">
                  Pending: <span> 0</span>
                </p>
                <p class="list-item practice_set_ongoing_resolved">
                  Ongoing: <span> 0</span>
                </p>
                <p class="list-item practice_set_complete_resolved">
                  Complete: <span> 0</span>
                </p>
              </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-6">
          <div class="card">
            <div class="card-body small-card">
              <h5 class="font-medium">Quizes</h5>
              <div class="counter list-group">
                <p class="list-item quiz_pending_resolved">
                  Pending: <span> 0</span>
                </p>
                <p class="list-item quiz_ongoing_resolved">
                  Ongoing: <span> 0</span>
                </p>
                <p class="list-item quiz_complete_resolved">
                  Complete: <span> 0</span>
                </p>
              </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>

      <!-- Table -->
      <div class="card">
        <div class="card-header pt-5">
          <h2 class="head_title">Test Packages</h2>
          <div class="filter-group ml-auto">
              @if(Auth::guard('admin')->user()->role_type == 1 || Auth::guard('admin')->user()->role_type == 2)
              <button class="btn btn-primary add-btn add-btn-sm add_assign_package"><i class="fa fa-plus-circle"></i>Add Assign </button>
              
              <select class="form-control search_filter  input-sm search_filter" id="employee_filter" name="employee_filter">
                  <option value="" selected>Employee</option>
                  @if($employees)
                    @foreach($employees as $row)
                      <option value="{{$row->id}}">{{$row->username}}</option>
                    @endforeach
                  @endif
              </select>
              @endif
              <select class="form-control search_filter  input-sm search_filter" id="package_type_filter" name="package_type_filter">
                  <option value="1" selected>Test Package</option>
                  <option value="2">Practice Set</option>
                  <option value="3">Quiz</option>
              </select>
              <select class="form-control search_filter  input-sm search_filter" id="status_filter" name="status_filter">
                  <option value="" selected>Status</option>
                  <option value="1">Pending</option> 
                  <option value="2">In Review</option> 
                  <option value="3">Approved</option> 
                  <option value="4">Rejected</option> 
              </select>
                <div class="dropdown custom-date">
                  <button class="btn btn-custom-toggle dropdown-toggle btn-block" type="button" id="dropdownMenuButton"
                    data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    Custom Date
                  </button>
                  <div class="dropdown-menu custom-dropdown-menu right-move" aria-labelledby="dropdownMenuButton"
                    x-placement="bottom-start"
                    style="position: absolute; will-change: transform; top: 0px; left: 0px; transform: translate3d(0px, 44px, 0px);">
                    <div class="custom-date-content">
                      <h6>Filter by submit date</h6>
                      <ul>
                        <li data-id="1" style="cursor: pointer;" class="date_selector">Today</li>
                        <li data-id="2" style="cursor: pointer;" class="date_selector">Last 7 Days</li>
                        <li data-id="3" style="cursor: pointer;" class="date_selector">This Month</li>
                        <li data-id="4" style="cursor: pointer;" class="date_selector">This Year: {{date('Y')}}</li>
                        <li data-id="5" style="cursor: pointer;" class="date_selector">Last Year: {{date('Y')-1}}</li>
                        <li data-id="6" style="cursor: pointer;" class="date_selector">All Time</li>
                      </ul>
                      <h6>Filter by submit date range</h6>
                      <div class="date-group">
                        <div class="input-group">
                          <div class="input-group-prepend">
                            <div class="input-group-text">
                              <i class="fa fa-calendar tx-16 lh-0 op-6"></i>
                            </div>
                          </div>
                          <input class="form-control input-sm all_from_date" name="all_from_date" placeholder="MM/DD/YYYY" type="text" id="dp1588836251070">
                        </div>
                        <span>To</span>
                        <div class="input-group">
                          <div class="input-group-prepend">
                            <div class="input-group-text">
                              <i class="fa fa-calendar tx-16 lh-0 op-6"></i>
                            </div>
                          </div>
                          <input class="form-control input-sm all_to_date" name="all_to_date" placeholder="MM/DD/YYYY" type="text" id="dp1588836251072">
                        </div>
                      </div>
                      <input type="hidden" name="date_type" id="date_type">
                      <div class="btn-content">
                        <button type="button" class="btn btn-outline-primary btn-pill add-btn-sm btn-streach-md cancel_date">Cancel</button>
                        <button type="button" class="btn btn-primary add-btn-sm btn-streach-md apply">Apply</button>
                      </div>
                    </div>

                  </div>
                </div>
            </div>
        </div>
        <div class="card-body pt-0">
          <p class="text-right font-bold total_no_test_count">Total No. of Package(s): 0</p>
          <div class="table-responsive">
            <table id="package-review-ongoing" class="stripe row-border order-column">
              <thead>
                <tr>
                  <th></th>                  
                  <th>Sr. No. <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
                  <th>Coching Name <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
                  <th>Package Name <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
                  <th class="total_test">Total Test <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
                  <th>Total Question <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
                  <th>Submitted Date <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
                  <th>Assign To <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
                  <th>Work Status <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>Assign Date <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>
    <!-- //Table -->
    <!--// MAIN BODY CONTENT -->
  </div>
</div>


<!---modals -->
  <!-- Modal coaching list new coaching section add -->
<div class="modal fade" id="packageAssignModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle"
  aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLongTitle">Assign Package Module</h5>
        <span class="examInfoErr" style="color:#f00"></span>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <p class="total_selected_review text-center">Total selected review: 0</p>
        <form id="home_page_coaching_section_add_frm" >
                <div class="form-group">
                    <label for="examName">Department Name</label>
                    <input type="text" id="department_name" name="department_name" class="form-control" value="Reviewer Employee" readonly>
                </div>
                <div class="form-group">
                  <label for="examName">Employee</label>
                  <select id="assigned_user_id" name="assigned_user_id" class="form-control">
                      <option value="" selected>Select Employee</option>
                      @if($employees)
                        @foreach($employees as $row)
                          <option value="{{$row->id}}">{{$row->username}}</option>
                        @endforeach
                      @endif
                </select>
                </div>
          <div class="modal-footer text-center">
            <button type="btn" class="btn btn-primary btn-streach-md" id="review_assign_now">Asssign Now</button>
          </div>
        </form>
      </div>
    </div>
  </div>
</div>

<!-- Modal Quiz Final Submit Success-->
<div class="modal fade" id="assignSuccesModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle"
  aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
         </button>          
      </div>
      <div class="modal-body text-center pt-0 px-9">
          <img class="modal-icon" src="{{asset('admin/images/check_circle.svg')}}" alt="">
          <h5 class="modal-title" id="exampleModalLongTitle">Your Packages assigned successfully.</h5>
          <div class="modal-footer text-center">
            <a href="javascript:void(0)" class="assignContinueSubmit"><button type="button" class="btn btn-primary btn-streach-md">Continue</button></a>
          </div>
      </div>
    </div>
  </div>
</div>
<!---modals -->
@endsection
@section('scripts')
<script type="text/javascript" src="{{asset('js/package_review_ongoing.js')}}"></script>
@endsection