@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">Master Fill</li>
						</ol>
					</div>
					<!-- MAIN BODY CONTENT -->
            <h1 class="heading">Master Fill</h1>
            <div class="row"  id="main-row-content">
                  <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 Templates Available</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">{{$totalTemplates}}</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 Templates Added In Last 30 Days
                        </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>{{$totalTemplates30}}</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 Templates Added In Last 90 Days
                        </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>{{$totalTemplates90}}</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>
            
            <!-- //Filter box -->
            <div class="card" id="main-body-content">
              <div class="card-header coaching-header center-header pt-5">
                
                <div class="filter-group ml-auto">
                  <button type="button" class="btn btn-primary add-btn add-btn-sm add_master_fill" >
                        <i class="fa fa-plus-circle"></i>Add Template
                      </button>
                  <select class="form-control input-sm search_filter" id="template_type_filter" name="template_type_filter" >
                      <option value="" selected="">Template Type</option>
                      <option value="1">Portal and Test Instruction</option>
                      <option value="2">Send Strike</option>
                      <option value="3">Restore Strike</option>
                      <option value="4">Package Review</option>
                      <option value="5">Product Manage</option>
                      <option value="6">Payout Request</option>
                      <option value="7">Test Template</option>
                    </select>
                    <select class="form-control input-sm search_filter" id="exam_type_filter" name="exam_type_filter" >
                      <option value="" selected="">Exam Type</option>
                      @if($examTypes)
                        @foreach($examTypes as $type)
                          <option value="{{$type->id}}">{{$type->exam_type}}</option>
                        @endforeach
                      @endif
                    </select>
                    <select class="form-control input-sm  search_filter" id="available_for_filter" name="available_for_filter" >
                        <option value="" selected="">Available For</option>
                      <option value="1">Coaching</option>
                      <option value="2">Company</option>
                      <option value="3">Selected Coaching</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 create 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 create 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">
                <p class="text-right font-bold mb-2 total_test">Total No of Templates: {{$totalTemplates}}</p>
                <div class="">
                  <table id="master-fill" class="stripe row-border order-column dataTable no-footer">
                    <thead>
                      <tr>
                        <th>Sr. No. <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
                        <th>Template Type <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
                        <th>Name <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
                        <th>Exam Type <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
                        <th>Exam Name <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
                        <th>Available For <span><i class="fa fa-angle-up"></i><i class="fa fa-angle-down"></i></span></th>
                        <th>Added By <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>
            <!--// MAIN BODY CONTENT -->

            <div class="next_steps" style="display: none;">
              <div class="portal_test" style="display: none;">
                <!--PORTAL INTRUCTION AREA -->
                  <div class="card instruction_area">
                    <div class="card-body">
                      <div class="inst-header">
                        <div class="inst-left">
                          <h2 id="show_template_name">Template Name: </h2>
                          </div>
                              <div class="inst-left">                      
                                <button class="btn btn-outline-primary btn-pill btn-streach font-book mb-4 fs-14 preview_html" data-id="2">Preview</button>
                          </div>
                        </div>
                      <div class="editor-inst-box">
                        <textarea name="portal_data" id="portal_data" cols="30" rows="10"></textarea>
                      </div>
                      <div class="test-footer">
                        <button class="btn btn-outline-primary btn-pill btn-streach font-book mt-6 fs-14  ml-3 back"  data-id="2">Close</button>
                        <button class="btn btn-outline-primary btn-pill btn-streach font-book mt-6 fs-14  ml-3 next_step" style="float: right; display: none;">Next</button>
                        <button class="btn btn-primary btn-streach font-book mt-6 fs-14  ml-3 save_next"  data-id="2" style="">Save</button>
                      </div>
                    </div>
                  </div>

                  <!--TEST INTRUCTION AREA -->
                  <div class="card test_instruction_area cc" style="display: none;">
                    <div class="card-body">
                      <h2 id="show_template_name2">Template Name: </h2>
                      <!-- <h3>Add Test Instruction: <span class="total_instruction">1</span></h3> -->
                      <ul class="inside-tab mt-5 mb-5">

                      </ul>

                      <div class="d-flex justify-content-between align-items-start mt-5 mb-5">     
                      <div class="inst-left">                   
                        <div class="form-group d-flex align-items-center mb-0">
                          <label for="totalMarks" class="form-label mb-0 mr-2">Test Instruction Name<span class="text-danger">*</span></label>
                          <input type="text"  name="test_filename" id="test_filename" class="form-control" placeholder="Enter your filename" value=""/>
                        </div>
                      </div>
                        <div class="inst-left">
                          <button class="btn btn-outline-primary btn-pill btn-streach font-book fs-14 add_more" style="display: none;" data-id="1">Add</button>
                          <button class="btn btn-outline-primary btn-pill btn-streach font-book fs-14 preview_html" data-id="1">Preview</button>
                        </div>
                      </div>
                      <div class="editor-inst-box">
                        <textarea name="test_data" id="test_data" cols="30" rows="10"></textarea>
                      </div>
                      <div class="test-footer">
                        <a href="javascript:void(0)" class="btn btn-outline-primary btn-pill btn-streach font-book mt-6 fs-14  ml-3 back_step" style="">Back</a>
                        <button class="btn btn-primary btn-streach font-book mt-6 fs-14  ml-3 save"  data-id="1" data-value="" style="">Save</button>
                        <button class="btn btn-primary btn-streach font-book mt-6 fs-14  ml-3 complete" style="float: right; display: none;">Finish</button>
                      </div>
                    </div>
                  </div>
              </div>

              <div class="other" style="display: none;">
                <!--PORTAL INTRUCTION AREA -->
                  <div class="card instruction_area cc">
                    <div class="card-body">
                      <div class="inst-header">
                        <div class="inst-left">
                          <h2 id="show_template_name1">Template Name: </h2>
                        </div>
                        <div class="inst-left">
                          <button class="btn btn-outline-primary btn-pill btn-streach font-book fs-14 preview_html" data-id="3">Preview</button>
                        </div>
                      </div>
                      <div class="editor-inst-box">
                        <textarea name="other" id="other" cols="30" rows="10"></textarea>
                      </div>
                      <div class="test-footer">
                        
                        <button class="btn btn-primary btn-streach font-book mt-6 fs-14  ml-3 back"  data-id="2">Back</button>
                        <button class="btn btn-primary btn-streach font-book mt-6 fs-14  ml-3 save"  data-id="3" style="float: right;">Save</button>
                      </div>
                    </div>
                  </div>
              </div>
            </div>
            <input type="hidden" name="master_fill_id" id="master_fill_id">
				</div>
			</div>

      
@endsection
@section('scripts')
<script type="text/javascript" src="{{asset('js/master_fill.js?v='.time())}}"></script>
<script type="text/javascript">
  CKEDITOR.replace( 'portal_data');
  CKEDITOR.replace( 'test_data');
  CKEDITOR.replace( 'other');
</script>
@endsection