@extends('admin/layout')
@section('page_title','Manage School Data')
@section('marketing_schools_select','active')
@section('container')
@if(session()->has('message'))
<div class="sufee-alert alert with-close alert-success alert-dismissible fade show">
    {{session('message')}}
    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
        <span aria-hidden="true">×</span>
    </button>
</div>
@endif

@if ($errors->any())
    <div class="alert alert-danger">
        <ul>
            @foreach ($errors->all() as $error)
                <li>{{ $error }}</li>
            @endforeach
        </ul>
    </div>
@endif
    <h1 class="mb10">Add Principal</h1>
    <a href="{{url('admin/schools_principal')}}">
        <button type="button" class="btn btn-success">Back</button>
    </a>
        <div class="row m-t-30">
        <div class="col-md-12">
            <form action="{{route('schools_principal.manage_schools_principal_process')}}" method="post" id="schoolPrincipal">
<div class="row">
<div class="col-lg-12">
<div class="card">
    <div class="card-body">
    @csrf
    <div class="form-group">
        <div class="row">
            <div class="col-md-4">
                <label for="princ_school_id" class="control-label mb-1">School Name</label>          
                 <p style="display: none;" id="princ_school_code"></p>
               @if(empty($princ_school_id))
                <select id="princ_school_id" name="princ_school_id" type="text" class="form-control form-select {{$sdisable}}" aria-required="true" aria-invalid="false" required {{$readonly}}>
                   <option value="">Select School</option>
                    @foreach($schools as $list)
                        <option value="{{$list->id}}">{{$list->school_name}}</option>
                    @endforeach
               </select>
                @else
                    <select id="princ_school_id" name="princ_school_id" class="form-control form-select {{$sdisable}}" aria-required="true" aria-invalid="false" required {{$readonly}}>
                    <option value="">Select School</option>                    
                        @if(!empty($princ_school_id))
                            <option selected value="{{$princ_school_id->school_id}}">{{$princ_school_id->school_name}}</option>
                        @endif
                </select>
                @endif
                <div id="school_name_error" class="error"></div>
            </div>

            <!-- <div class="col-md-4" id="schoolCode" style="display: none;">
                <label for="princ_school_code" class="control-label mb-1">School Code</label>
                 <input id="princ_school_code" name="princ_school_code" type="hidden" class="form-control" value="">
            </div> -->

            <div class="col-md-4">
             <label for="principal_name" class="control-label mb-1">Principal Name</label>
                <input id="principal_name" name="principal_name" type="text" class="form-control" aria-required="true" aria-invalid="false" required value="{{$principal_name}}">
            </div>
            <div class="col-md-4">
                <label for="principal_phone_number" class="control-label mb-1">Phone Number</label>
                <input id="principal_phone_number" name="principal_phone_number" type="text" class="form-control numbersOnly {{$sdisable}}" aria-required="true" aria-invalid="false" maxlength="10" required value="{{$principal_phone_number}}" {{$readonly}}>
                <span id="principal_error_phone"></span>
                @error('name')
                <div class="alert alert-danger" role="alert">
                    {{$message}}
                </div>
                @enderror
            </div>
            
            <div class="col-md-4">
             <label for="principal_whatsapp_number" class="control-label mb-1">Whats App Number</label>
                <input id="principal_whatsapp_number" value="{{$principal_whatsapp_number}}" name="principal_whatsapp_number" type="text" maxlength="10" class="form-control numbersOnly" aria-required="true" aria-invalid="false">
            </div>
            <div class="col-md-4">
             <label for="principal_email" class="control-label mb-1">Email</label>
                <input id="principal_email" value="{{$principal_email}}" name="principal_email" type="email" class="form-control {{$sdisable}}" aria-required="true" aria-invalid="false" {{$readonly}}>
                <span id="principal_error_email"></span>
            </div>
            <div class="col-md-4">
             <label for="principal_amount" class="control-label mb-1">Amount</label>
                <input id="principal_amount" value="{{$principal_amount}}" name="principal_amount" type="text" class="form-control" aria-required="true" aria-invalid="false">
            </div>
            
        </div>
    </div>
    </div>
</div>
</div>
</div>     
    <div class="position-relative form-check">
        <button id="content-upload-button" type="submit" class="mt-2 btn btn-primary pull-left">
            Submit
        </button>
    </div>             
<input type="hidden" name="id" value="{{$id}}">
<input type="hidden" name="action" value="{{$action}}">
<input id="principal_school_code" name="principal_school_code" type="hidden" class="form-control" value="">
</form>
</div>
</div>
      
      <!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Change Principal Email</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <form method="post"  action="{{route('schools_principal.manage_schools_principal_emailedit')}}" id="changeEmailForm">
                    @csrf
                <div class="modal-body">
                    <div class="form-group">
                        <label for="principal_email">Principal Email:</label>
                        <input type="email" value="{{$principal_email}}" class="form-control" id="principal_email" name="principal_email" aria-required="true">
                        <input type="hidden" name="id" value="{{$id}}">
                        <input type="hidden" name="uid" value="{{$usersData}}">
                    </div>
               
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary closebtn" data-dismiss="modal">Close</button>
                    <button type="submit" class="btn btn-primary" id="editEmailBtn">Edit</button>
                </div>
            </form>
        </div>
    </div>
</div>

<div class="modal fade" id="myMobileModal" tabindex="-1" role="dialog" aria-labelledby="exampleMobileModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleMobileModalLabel">Change Principal Mobile</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <form method="post"  action="{{route('schools_principal.manage_schools_principal_mobileedit')}}" id="changeMobileForm">
                    @csrf
                <div class="modal-body">
                    <div class="form-group">
                        <label for="phone_number">Principal Mobile:</label>
                        <input type="text" value="{{$principal_phone_number}}" class="form-control" id="phone_number" name="phone_number" aria-required="true">
                        <input type="hidden" name="id" value="{{$id}}">
                        <input type="hidden" name="uid" value="{{$usersData}}">
                    </div>
               
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary closebtn" data-dismiss="modal">Close</button>
                    <button type="submit" class="btn btn-primary" id="editMobileBtn">Edit</button>
                </div>
            </form>
        </div>
    </div>
</div>

     <script>
        var select_school_element = document.querySelector('#princ_school_id');
        dselect(select_school_element, {
            search: true
        }); 

    </script>

                  
@endsection