@extends('layouts.adminapp')

@section('content')

{{-- Create New Student --}}

<div class="container grid px-6 my-8">
    <h4 class="mb-4 text-lg font-semibold text-gray-600 dark:text-gray-300">
        {{__('lng.CreateNewLeave')}}
    </h4>

    <form method="post" action="{{route('LeaveIssue.store')}}" enctype="multipart/form-data">
    @csrf
            <div class="grid gap-6 mb-8 md:grid-cols-2">
                <div class="min-w-0">
                    <label class="block text-sm">
                        <span class="text-gray-700 dark:text-gray-400">{{__('lng.Date')}}</span>
                        <input type="date" value="{{ old('date') }}" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input @error('date') border-red-600 @enderror" name="date" id="date" required/>
                        @error('date')<span class="text-xs text-red-700" id="passwordHelp">{{$message}}</span>@enderror
                    </label>
                </div>
            <div class="min-w-0">
                <label class="block text-sm">
                    <span class="text-gray-700 dark:text-gray-400">{{__('lng.Student')}}</span>
                    <input type="hidden" value="{{ old('student_id') }}" id="cbStudentID" name="student_id">
                    <input oninput="StudentNameSearch()" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input @error('student_id') border-red-600 @enderror"
                        type="text" placeholder="Search for students by name or admission no." aria-label="Search" id="StudentSearch" name="studentsearch" autocomplete="off"
                    />
                    @error('student_id')<span class="text-xs text-red-700" id="passwordHelp">{{$message}}</span>@enderror
                    <div id="hint_tbl">
                    </div>
                </label>
            </div>
            <div class="min-w-0">
                <label class="block text-sm">
                    <span class="text-gray-700 dark:text-gray-400">{{__('lng.FromDate')}}</span>
                    <input type="date" value="{{ old('from') }}" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input @error('from') border-red-600 @enderror" name="from" id="from" />
                    @error('from')<span class="text-xs text-red-700" id="passwordHelp">{{$message}}</span>@enderror
                </label>
            </div>
            <div class="min-w-0">
                <label class="block text-sm">
                    <span class="text-gray-700 dark:text-gray-400">{{__('lng.Todate')}}</span>
                    <input type="date" value="{{ old('to') }}" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input @error('to') border-red-600 @enderror" name="to" id="to" />
                    @error('to')<span class="text-xs text-red-700" id="passwordHelp">{{$message}}</span>@enderror
                </label>
            </div>
            
            <div class="min-w-0">
                <label class="block text-sm">
                    <span class="text-gray-700 dark:text-gray-400">{{__('lng.Teacher')}}</span>
                    <select class="block w-full mt-1 text-sm dark:text-gray-300 dark:border-gray-600 dark:bg-gray-700 form-select focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:focus:shadow-outline-gray @error('employee_id') border-red-600 @enderror" id="cbHead" name="employee_id" required>
                        @php
                        echo App\Http\Controllers\EmployeeController::TeacherListForCombo(0);
                        @endphp
                    </select>
                    @error('employee_id')<span class="text-xs text-red-700" id="passwordHelp">{{$message}}</span>@enderror
                </label>
            </div>
            <div class="min-w-0">
                <label class="block text-sm">
                    <span class="text-gray-700 dark:text-gray-400">{{__('lng.Reson')}}</span>
                    <input value="{{ old('reson') }}" type="text" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input  @error('reson') border-red-600 @enderror" name="reson" id="txtreson"/>
                    @error('reson')<span class="text-xs text-red-700" id="passwordHelp">{{$message}}</span>@enderror
                </label>
            </div>
            {{-- <div class="min-w-0">
                <div class="flex items-center mb-4">
                    <input id="default-checkbox" type="checkbox" value="" class="w-4 h-4 text-blue-600 bg-gray-100 rounded border-gray-300 focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600 ">
                    <label for="default-checkbox" class="ml-2 text-sm font-medium text-gray-600 dark:text-gray-700">Default checkbox</label>
                </div>
            </div> --}}

        </div>
        <div class="grid gap-6 mb-8 md:grid-cols-1">
            <label class="block text-sm">
                <span class="text-gray-700 dark:text-gray-400">{{__('lng.Narration')}}</span>
                <input value="{{ old('narration') }}" type="text" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input" name="narration" id="txtNarration"/>
            </label>
        </div>
        <div class="flex flex-col items-center justify-end px-6 py-3 -mx-6 -mb-4 space-y-4 sm:space-y-0 sm:space-x-6 sm:flex-row bg-gray-50 dark:bg-gray-800">
            <a href="{{route('LeaveIssue.index')}}" class="w-full px-5 py-3 text-sm font-medium leading-5 text-gray-700 transition-colors duration-150 border border-gray-300 rounded-lg dark:text-gray-400 sm:px-4 sm:py-2 sm:w-auto active:bg-transparent hover:border-gray-500 focus:border-gray-500 active:text-gray-500 focus:outline-none focus:shadow-outline-gray">
                {{__('lng.Back')}}
            </a>
            <button type="submit" class="w-full px-5 py-3 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-lg sm:w-auto sm:px-4 sm:py-2 active:bg-purple-600 hover:bg-purple-700 focus:outline-none focus:shadow-outline-purple">
                {{__('lng.Save')}}
            </button>
        </div>
    </form>
</div>


<script>
    function StudentNameSearch() {
      hint_tbl.style.display ="block";
      var items = document.getElementById("StudentSearch").value;
  
      $.ajax({
        url: '{{ route('StudentNameSearch') }}',
        method: "get",
        data: {_token: '{{ csrf_token() }}',searchitems:items },
        success: function (response){   
          document.getElementById('hint_tbl').innerHTML=response; 
        }
      });
    }
    function clickSelect(ID,Name) {
        hint_tbl.style.display ="none";
        document.getElementById('StudentSearch').value=Name;
        document.getElementById('cbStudentID').value=ID;   
    }
  </script>

@endsection