@extends('layouts.app_pub')
@push('css')
@endpush
@section('content')
    <style>
        .content-wrapper {
            margin: auto !important;
        }
    </style>
    <style>
        .content-wrapper {
            margin: auto !important;
        }
    
        /* Add custom CSS for the note card */
        .note-card {
            background-color: #007bff;
            color: white;
            max-width: 45rem;
            margin: 0 auto;
            margin-top: 20px; /* Adjust the margin as needed */
            padding: 10px;
            border-radius: 5px;
        }
    </style>

    @inject('carbon', 'Carbon\Carbon')
    <!-- Content Header (Page header) -->
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <div class="d-inline p-2  text-dark" style="font-size: 26px; font-weight: bold">Applicant Information
                        Update/ Application proceed</div>
                    <div class="d-inline p-2 text-white">


                    </div>
                </div>
                <!-- /.col -->
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <div class="d-inline p-2 text-white text-right">
                            <a href="{{ route('home') }}" class="btn btn-sm btn-info"><i class="fas fa-home"></i> Home</a>
                        </div>
                        <div class="d-inline p-2 text-white text-right">
                            <a href="{{ URL::previous() }}" class="btn btn-sm btn-primary text-right"><i
                                    class="fas fa-arrow-circle-left"></i> Back</a>
                        </div>
                    </ol>
                </div>
                <!-- /.col -->
            </div>
            <!-- /.row -->
        </div>
        <!-- /.container-fluid -->
    </div>

    {{-- 
    "{{ route('notice.teacher_info.store') }}" --}}


    <!-- Main content -->
    <div row>
        <section class="content">
            <div class="container-fluid">
                <!-- Main row -->

                <div class="row">
                    <div class="col-md-3 col-xs-3 col-lg-3 col-sm-3">  
                        {{-- <div class="note-card">
                            <div class="card-header">N.B: Application will be queued for review if you have made any change.</div>
                        </div> --}}
                    </div>

                    <div class="col-md-6 col-xs-6  col-lg-6 col-sm-6">
                        <form action="{{ route('notice.teacher_info.store') }}" method="POST"
                            enctype="multipart/form-data">
                            @csrf

                            <input type='text' name='teacher_id' id='teacher_id' value="{{ $teacher_data->teacher_id }}"
                                hidden />
                            <input type='text' name='notice_id' id='notice_id' value="{{ $notice_id }}" hidden />
                            <input type='text' name='name' id='name' value="{{ $teacher_data->teacher_name }}"
                                hidden />


                            <div class="form-group">
                                <label for="fname">Applicant Name</label>
                                <input id="fname" type="text" placeholder="Full Name"
                                    class="form-control @error('fname') is-invalid @enderror" name="fname"
                                    value="{{ $teacher_data->teacher_name ?? old('fname') }}" disabled />
                                @error('fname')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>


                            <div class="form-group">
                                <label for="designation">Designation</label>
                                <input id="designation" type="text" placeholder="Full Name"
                                    class="form-control @error('designation') is-invalid @enderror" name="designation"
                                    value="{{ $teacher_data->designation ?? old('designation') }}" disabled />
                                @error('designation')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>




                            @if($teacher_data->is_ws == 0)
                            <div class="form-group">
                                <label for="institute">Institute Name</label>
                                <input id="institute" type="text" placeholder="Full Name"
                                    class="form-control @error('institute') is-invalid @enderror" name="institute"
                                    value="{{ $teacher_data->institute_name ?? old('institute') }}" disabled />
                                @error('institute')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>
                            @else
                            <div class="form-group">
                                <label for="institute">Workstation</label>
                                <input id="institute" type="text" placeholder="Full Name"
                                    class="form-control @error('institute') is-invalid @enderror" name="institute"
                                    value="{{ $teacher_data->ws_name }}" disabled />
                                @error('institute')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>
                            @endif

                            <div class="form-group">
                                <label for="subject">Subject </label>
                                <select id="subject"
                                    class="js-example-basic-single form-control @error('subject') is-invalid @enderror"
                                    name="subject" readonly>

                             <option value="{{ $teacher_data->subject_id  }}">{{  $teacher_data->subject_name }}</option>

                                </select>
                            </diV>

                            <div class="form-group">
                                <label for="subject_ncf">Subject (NCF)</label>
                                <select id="subject_ncf"
                                    class="js-example-basic-single form-control @error('subject_ncf') is-invalid @enderror"
                                    name="subject_ncf" readonly>

                             <option value="{{ $teacher_data->subject_ncf_id  }}">{{  $teacher_data->subject_ncf_name }}</option>

                                </select>
                            </diV>


                            <div class="form-group">
                                <label for="email">Email</label>
                                <input id="email" type="email" placeholder="Email"
                                    class="form-control @error('email') is-invalid @enderror" name="email"
                                    value="{{ $teacher_data->email ?? old('email') }}" onkeyup="astericLoader()" />
                                @error('email')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>


                            <div class="form-group">
                                <label for="phone">Contact Number</label>
                                <input id="phone" type="text" placeholder="phone"
                                    class="form-control @error('phone') is-invalid @enderror" name="phone"
                                    value="{{ $teacher_data->phone ?? old('phone') }}" onkeyup="astericLoader()" />
                                @error('phone')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>

                            <div class="form-group">
                                <label for="is_minority">Do you belong to any small ethnic group?</label>
                                <select id="is_minority"
                                    class="js-example-basic-single form-control @error('is_minority') is-invalid @enderror"
                                    name="is_minority" >

                             @if ($teacher_data->is_minority == 1) 
                             <option value="1">Yes</option>
                             <option value="0">No</option>
                            @else
                            <option value="0">No</option>
                            <option value="1">Yes</option>
                            @endif

                                </select>
                            </diV>

                            <div class="form-group">
                                <label for="is_disabled">Are you a person with special need?</label>
                                <select id="is_disabled"
                                    class="js-example-basic-single form-control @error('is_disabled') is-invalid @enderror"
                                    name="is_disabled" >
                                @if ($teacher_data->is_disabled == 1) 
                                 <option value="1">Yes</option>
                                 <option value="0">No</option>
                                @else
                                <option value="0">No</option>
                                <option value="1">Yes</option>
                                @endif
                                </select>
                            </diV>


                            <div class="form-group" >
                                <label for="has_children">Do you want to bring children?</label>
                                <select id="has_children"
                                    class="js-example-basic-single form-control @error('has_children') is-invalid @enderror"
                                    name="has_children"  onchange="childrenLoader()">

                             <option value="0">NO</option>
                             <option value="1">Yes</option>

                                </select>
                            </diV>
                            <div class="form-group" id="num_of_children_div">
                                {{-- <label for="num_of_children">How many children do you want to bring </label>
                                <select id="num_of_children"
                                    class="js-example-basic-single form-control @error('num_of_children') is-invalid @enderror"
                                    name="num_of_children" >

                             <option value="0">0</option>
                             <option value="1">1</option>
                             <option value="2">2</option>
                             <option value="3">3</option>
                             <option value="4">4</option>
   
                                </select> --}}
                              
                            </diV>

                        
                            <div class="col-md-6 col-xl-6 col-sm-6">
                                <div class="form-group" id="id_upload">
                                    
                                </div>
                            </div>

                            
                            <div class="col-md-6 col-xl-6 col-sm-6">
                                <div class="form-group">
                                    <label for="phone">Upload Approval/Forwarding <span class="text-danger">*</span></sup></label>
                                    <input type='file' name='gpp_file' id='gpp_file'
                                        class="form-control @error('gpp_file') is-invalid @enderror" placeholder="ding"
                                        required><br>
                                    @error('gpp_file')
                                        <span class="invalid-repository" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                            </div>


                            {{-- /// plain
                            <input type="submit" class="btn btn-sm btn-success" value="Request Update">  --}}
                    
                        <div class="form-group" >
                        <input type="submit" class="btn btn-sm btn-success" value="Submit Application">
                        </div>
                      
                    </div>

                            
                            {{-- <input type="button" class="btn btn-sm btn-danger"  onclick="updateRequest()"  value="Request Update"> --}}


                          

                               
                        </form>

                    {{-- </div> --}}
                    <br><br><br>




                    <div class="col-md-3 col-xs-3 col-lg-3 col-sm-3">  
                        <div class="note-card">
                            <div class="card-header">N.B: Application will be queued for approval and review.</div>
                        </div>
                    </div>

                </div>

        </section>
    @endsection
    @push('js')
        <script>
            function reload() {
                window.location.reload();
            }


            function astericLoader() {
                

                htmlTemplate = `<label for="phone">Upload ID <sup id='load1' style='color:red'>*</sup></label>
                                    <input type='file' name='file' id='file'
                                        class="form-control @error('file') is-invalid @enderror" placeholder="ding"><br>
                                    @error('file')
                                        <span class="invalid-repository" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror`;

                document.querySelector('#id_upload').innerHTML = htmlTemplate;
            }
         
                           
         
      function childrenLoader() {

              
                var has_children = $("#has_children").val();
                console.log(has_children);
                if( has_children == 1){

                    htmlTemplate= `  <label for="num_of_children">How many children do you want to bring </label>
                                <select id="num_of_children"
                                    class="js-example-basic-single form-control @error('num_of_children') is-invalid @enderror"
                                    name="num_of_children" >

                             <option value="0">0</option>
                             <option value="1">1</option>
                             <option value="2">2</option>
                             <option value="3">3</option>
                             <option value="4">4</option>

                                </select>`;
                }
                else{

                    htmlTemplate= `  <input id="num_of_children" type="text" 
                    name="num_of_children"
                                    value="0" hidden />`;

                }

                document.querySelector('#num_of_children_div').innerHTML = htmlTemplate;



               
            }




















            function submitApplication() {



                var teacher_id = $("#teacher_id").val();
                var notice_id = $("#notice_id").val();
                var JsonData = {
                    teacher_id: teacher_id,
                    notice_id: notice_id,
                    _token: "{{ csrf_token() }}"
                }

                $.ajax({
                    url: '{{ route('notice.interested_teacher.store') }}',
                    type: "POST",
                    dataType: "json",
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    data: JsonData,
                    success: function(data) {
                        if (data == '1') {

                            swal({
                                title: " Congratulations!",
                                text: " Your Application has been submitted!",
                                icon: "success",
                                button: "oh no!",
                            });
                        }

                        elseif(data == '2')


                        swal({
                            title: " Warning!",
                            text: " You have already applied for this course!",
                            icon: "success",
                            button: "oh no!",
                        });
                    }
                });

            }

            function updateRequest() {


                var teacher_id = $("#teacher_id").val();
                var notice_id = $("#notice_id").val();
                var name = $("#name").val();
                var email = $("#email").val();
                var phone = $("#phone").val();
                var file = $("#file").val();

                var JsonData = {
                    teacher_id: teacher_id,
                    name: name,
                    notice_id: notice_id,
                    email: email,
                    phone: phone,
                    file: file,
                    _token: "{{ csrf_token() }}"
                }

                $.ajax({
                    url: '{{ route('notice.teacher_info.store') }}',
                    type: "POST",
                    dataType: "json",
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    data: JsonData,
                    success: function(data) {
                        if (data == '1') {

                            swal({
                                title: " Congratulations!",
                                text: " Your Update request has been submitted!",
                                icon: "success",
                                button: "oh no!",
                            });
                        }

                    }
                });

            }
        </script>