@extends('layouts.mypage')

@section('page-header')
<h1 class="page-header">My Student</h1>
@endsection


@section('content')
<style>
.table > thead > tr > th {
	vertical-align: middle;
}


/* Student list table Style 2018.1.18.from lauren*/

@media only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px) {
    /* Force table to not be like tables anymore */
    table.student_list_table,
    table.student_list_table thead,
    table.student_list_table tbody,
    table.student_list_table th,
    table.student_list_table td,
    table.student_list_table tr {
        display: block;
        float: left;
        /* ie9 fix */
        width: 100%;
        clear: both;
    }
    /* Hide table headers (but not display: none;, for accessibility) */
    table.student_list_table thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    table.student_list_table tr {
        border: 1px solid #ccc;
    }
    table.student_list_table td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 50%;
        word-break: break-all;
        white-space: normal;
        display: block;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        text-align: center;
    }

    /*고정값을 주게 되면 제목과 내용이 제대로 안나오는 문제 발생*/
    table.student_list_table td:before {
        padding-right: 10px;
        /* white-space: nowrap; */
        text-align: left;
        font-weight: bold;
        float: left;
        width: 45%;
        padding: 0 0 0 1%;
        /*  margin-left:-100%;*/
     
    }
 

    /*
    Label the data 각 테이블마다 tr에 작성 된 제목을 지정해준다 
    */


    /* Local coodinator table */
    table.student_list_table td:nth-of-type(1):before {
        content: "No";
    }
    table.student_list_table td:nth-of-type(2):before {
        content: "Student\name";
				white-space: pre-wrap;
    }
    table.student_list_table td:nth-of-type(3):before {
        content: "State";
    }
    table.student_list_table td:nth-of-type(4):before {
        content: "Gender";
    }
    table.student_list_table td:nth-of-type(5):before {
        content: "Grade";
    }
    table.student_list_table td:nth-of-type(6):before {
        content: "School";
    }
    table.student_list_table td:nth-of-type(7):before {
        content: "H/F";
    }

}


/* Smartphones (portrait and landscape) ----------- */

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
    body {
        padding: 0;
        margin: 0;
        width: 100%;
    }
    table.student_list_table thead th:nth-of-type(3),
    table.student_list_table tbody td:nth-of-type(3){
        display:none;
    }
    table.student_list_table thead th:nth-of-type(4),
    table.student_list_table tbody td:nth-of-type(4){
        display:none;
    }
    table.student_list_table thead th:nth-of-type(5),
    table.student_list_table tbody td:nth-of-type(5){
        display:none;
    }
    table.student_list_table thead th:nth-of-type(6),
    table.student_list_table tbody td:nth-of-type(6){
        display:none;
    }
    table.student_list_table thead th:nth-of-type(7),
    table.student_list_table tbody td:nth-of-type(7){
        display:none;
    }
    
}


/* iPads (portrait and landscape) ----------- */

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
    body {
        width: 100%;
    }
    table.student_list_table thead th:nth-of-type(3),
    table.student_list_table tbody td:nth-of-type(3){
        display:block;
    }
    table.student_list_table thead th:nth-of-type(4),
    table.student_list_table tbody td:nth-of-type(4){
        display:block;
    }
    table.student_list_table thead th:nth-of-type(5),
    table.student_list_table tbody td:nth-of-type(5){
        display:block;
    }
    table.student_list_table thead th:nth-of-type(6),
    table.student_list_table tbody td:nth-of-type(6){
        display:block;
    }
    table.student_list_table thead th:nth-of-type(7),
    table.student_list_table tbody td:nth-of-type(7){
        display:block;
    }
}

/* Student list table Style 2018.1.18.from lauren */

</style>
@if($auth->grade_id==6||$auth->grade_id==4||$auth->grade_id==10)
<div class="form-inline">
<form name="search_list" class="form-horizontal">
<div class="row">
	<div class="col-sm-10"><!--
		<select class="form-control" name="sl_country">
		<option value="">Country of Origin</option>
		<option value="usa">USA</option>
		<option value="china">China</option>
		<option value="korea">Korea</option>
		</select>

		<select class="form-control" name="sl_document_status">
		<option value="">Document Status</option>
		<option value="process" {{ Request::Input('sl_document_status') == 'process' ? 'selected' : '' }}>Process</option>
		<option value="completed" {{ Request::Input('sl_document_status') == 'completed' ? 'selected' : '' }}>Completed</option>
		<option value="cancelled" {{ Request::Input('sl_document_status') == 'cancelled' ? 'selected' : '' }}>Cancelled</option>
		<option value="edited" {{ Request::Input('sl_document_status') == 'edited' ? 'selected' : '' }}>Edited</option>
		</select>

		<select class="form-control" name="sl_status">
		<option value="">Status</option>
		<option value="new" {{ Request::Input('sl_status') == 'new' ? 'selected' : '' }}>New</option>
		<option value="reentry" {{ Request::Input('sl_status') == 'reentry' ? 'selected' : '' }}>Re-entry</option>
		<option value="application" {{ Request::Input('sl_status') == 'application' ? 'selected' : '' }}>Application</option>
		<option value="invoice" {{ Request::Input('sl_status') == 'invoice' ? 'selected' : '' }}>Invoice</option>
		<option value="pc" {{ Request::Input('sl_status') == 'pc' ? 'selected' : '' }}>P/C</option>
		<option value="flight" {{ Request::Input('sl_status') == 'flight' ? 'selected' : '' }}>Flight</option>
		<option value="changehf" {{ Request::Input('sl_status') == 'changehf' ? 'selected' : '' }}>Change H/F</option>
		<option value="finished" {{ Request::Input('sl_status') == 'finished' ? 'selected' : '' }}>Finished</option>
		<option value="springsemester" {{ Request::Input('sl_status') == 'springsemester' ? 'selected' : '' }}>Spring semester</option>
		<option value="fallsemester" {{ Request::Input('sl_status') == 'fallsemester' ? 'selected' : '' }}>Fall semester</option>
		<option value="warning" {{ Request::Input('sl_status') == 'warning' ? 'selected' : '' }}>Warning</option>
		</select>
-->
		<select class="form-control" name="sl_search">
		<option value="name" {{ Request::Input('sl_search') == 'name' ? 'selected' : '' }}>Name(First or Last)</option>
		<option value="email" {{ Request::Input('sl_search') == 'email' ? 'selected' : '' }}>Account ID</option>
		<option value="hf_name" {{ Request::Input('sl_search') == 'hf_name' ? 'selected' : '' }}>H/F Name</option>
		<option value="state" {{ Request::Input('sl_search') == 'state' ? 'selected' : '' }}>State</option>
		<option value="school_name" {{ Request::Input('sl_search') == 'school_name' ? 'selected' : '' }}>School</option>
		</select>
		<input type="text" name="sl_keyword" class="form-control" value="{{ Request::Input('sl_keyword') }}">
		<button class="btn btn-primary"><i class="fa fa-search"></i></button>
	
	</div>
	<div class="col-sm-2 text-right">
		<select aria-controls="editable" class="form-control" name="page_size" onchange="document.search_list.submit();">
		<option value="25" {{ $students->perPage() == 25 ? 'selected' : '' }}>List 25</option>
		<option value="50" {{ $students->perPage() == 50 ? 'selected' : '' }}>List 50</option>
		<option value="100" {{ $students->perPage() == 100 ? 'selected' : '' }}>List 100</option>
		</select>
	</div>
</div>
</form>
</div>
@endif

<div class="row mt20">
	<div class="col-xs-6">
		<p style="margin-bottom:0px;height:41px;line-height: 41px;">* Total <b>{{ number_format($students->total()) }}</b> Records.</p>
	</div>
</div>

<div class="panel mt5">
  <div class="panel-body pn">
    <div class="bs-component">
		
      <table class="table table-bordered table-hover student_list_table" style="word-wrap:break-word;word-break:break-all;">
        <thead>
          <tr>
            <th width="80" class="text-center">No</th>
            <th class="text-center">Student<br>name</th>
            <th class="text-center">State</th>
            <th class="text-center">Gender</th>
            <th class="text-center">Grade</th>
            <th class="text-center">School</th>
            @if($auth->grade_id==6)
            <th class="text-center">H/F</th>
            @endif
          </tr>
        </thead>
        <tbody>
        	@for($i=0,$cnt=count($students);$i<$cnt;$i++)
				<tr data-id="{{ $student->user_id }}">
			<td class="text-center">{{ $students->total() - ($students->perPage() * ($students->currentPage()-1)) - $i }}</td>
			<td class="text-center"><a href="/mypage/student/{{ $student->user_id }}">{{ $student->user->lastname }}, {{ $student->user->firstname }}</a></td>
			<td>{{ $student->inputState }}</td>
            <td class="text-center">{{ $student->user->sex }}</td>
            			<td class="text-center">{{$grade}}</td>
			<td class="text-center">{{ $student->school ? $student->school->school_name : '' }}</td>
			 @if($auth->grade_id==6)
			<td class="text-center">@if(!empty($student->host))<a href="/mypage/host/{{ $student->host_id }}">{{ $student->host ? $student->host->user->lastname : '' }}, {{ $student->host ? $student->host->user->firstname : '' }}</a>@endif</td>	
			@endif
		</tr>
		@endfor
	     @if (count($students) <= 0)
	       <tr>
		     <td colspan="10" class="text-center">No search result.</td>
		   </tr>
	     @endif
        </tbody>
      </table>
    </div>
  </div>
</div>

<nav class="text-center">
	{{ $students->appends(Request::only('sl_search', 'sl_keyword', 'page_size'))->links() }}
</nav>
@endsection

@section('script')
@endsection