@extends('admin.include.main')
@section('content')

    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <div class="col-lg-12">
                <div class="ibox ">
                    <div class="ibox-title">
                        <h5>Academics</h5>
                        <div class="ibox-tools">
                            <a class="collapse-link">
                                <i class="fa fa-chevron-up"></i>
                            </a>
                            <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                                <i class="fa fa-wrench"></i>
                            </a>
                            <ul class="dropdown-menu dropdown-user">
                                <li><a href="#" class="dropdown-item">Config option 1</a>
                                </li>
                                <li><a href="#" class="dropdown-item">Config option 2</a>
                                </li>
                            </ul>
                            <a class="close-link">
                                <i class="fa fa-times"></i>
                            </a>
                        </div>
                    </div>
                    <div class="tabs-container">
                        <ul class="nav nav-tabs" role="tablist">
                            <li><a class="nav-link active" data-toggle="tab" href="#tab-1"> Academics</a></li>
                            <li><a class="nav-link" data-toggle="tab" href="#tab-2">Slides</a></li>
                        </ul>

                        <div class="tab-content">
                            <div role="tabpanel" id="tab-1" class="tab-pane active">
                                <div class="panel-body">
                                     <form action="{{route('sitesetting.update',$site->id)}}" method="POST" enctype="multipart/form-data">
                                     @csrf
                                        <div class="form-group">
                                            <div class="row">
                                                <div class="col-md-6">
                                                    <h4>Upload Logo of School</h4>
                                                    @if(is_null($site->image))
                                                    <div class="text-center"><img src="{{asset('adminpanel/img/gallery/student.png')}}" id="current_image" width="150px" height="150px"></div><br>
                                                       @else
                                                    <div class="text-center"><img src="{{asset($site->image)}}" id="current_image" width="150px" height="150px"></div><br>
                                                      @endif
                                                        <div>
                                                                <div class="controls">
                                                                    <input type="file" id="image" name="image" class="form-control btn btn-success" > </div><br>
                                                                    <!-- <img src="" id="current_image" width="100px"> -->
                                                            </label>
                                                        </div>
                                                </div>
                                    
                                            </div>
                                            <div class="row">
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <h5> School Name<span class="text-danger">*</span></h5>
                                                        <div class="controls">
                                                            <input type="text" name="name" id="name" value="{{$site->name}}" class="form-control" data-validation-required-message="School Name is required" >
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <h5> School Address</h5>
                                                        <div class="controls">
                                                            <input type="text" name="address" id="address" value="{{$site->address}}" class="form-control" data-validation-required-message="Address is required" >
                                                        </div>
                                                    </div>
                                                </div>
                                               
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <h5>Phone Number:<span class="text-danger">*</span></h5>
                                                        <div class="controls">
                                                            <input type="number" name="phone_no" id="phone_no" value="{{$site->phone_no}}" class="form-control" data-validation-required-message="Phone Number is required" >
                                                        </div>
                                                    </div>
                                                </div>

                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <h5> Phone Number(2):</h5>
                                                        <div class="controls">
                                                            <input type="number" name="phone_no2" id="phone_no2" value="{{$site->phone_no2}}" class="form-control">
                                                        </div>
                                                    </div>

                                                </div>
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <h5> Email<span class="text-danger">*</span></h5>
                                                        <div class="controls">
                                                            <input type="email" name="email" id="email" class="form-control" value="{{$site->email}}" data-validation-required-message="Email is required" >
                                                        </div>
                                                    </div>

                                                </div>
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <h5> Pan Number:</h5>
                                                        <div class="controls">
                                                            <input type="number" name="pan_no" id="pan_no" class="form-control" value="{{$site->pan_no}}">
                                                        </div>
                                                    </div>

                                                </div>
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <h5> Established Year:<span class="text-danger">*</span></h5>
                                                        <div class="controls">
                                                            <input type="string" name="estd" id="estd" class="form-control" value="{{$site->estd}}" data-validation-required-message="Established Year required" >
                                                        </div>
                                                    </div>

                                                </div>  
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <h5> Facebook:</h5>
                                                        <div class="controls">
                                                            <input type="string" name="facebook" id="facebook"class="form-control" value="{{$site->facebook}}">
                                                        </div>
                                                    </div>

                                                </div>
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <h5> Twitter:</h5>
                                                        <div class="controls">
                                                            <input type="string" name="twitter" id="twitter" class="form-control" value="{{$site->twitter}}">
                                                        </div>
                                                    </div>

                                                </div>
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <h5>Instagram</h5>
                                                        <div class="controls">
                                                            <input type="string" name="instagram" id="instagram" class="form-control" value="{{$site->instagram}}">
                                                        </div>
                                                    </div>

                                                </div>
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <h5>Youtube</h5>
                                                        <div class="controls">
                                                            <input type="string" name="youtube" id="youtube" class="form-control" value="{{$site->youtube}}">
                                                        </div>
                                                    </div>

                                                </div>
                                                <div class="col-md-4">

                                                    <div class="form-group"><label>Select Language</label>
                                                        <select class="form-control m-b" name="language">

                                                            <option value="" selected disabled>Select Language</option>
                                                            <option @if($site->language == "english") selected @endif value="english">English</option>
                                                            <option @if($site->language == "nepali") selected @endif value="nepali">Nepali</option>                                                            


                                                        </select>

                                                    </div>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <h5> School Slogan</h5>
                                                        <div class="controls">
                                                            <input type="text" name="slogan"  id="slogan" value="{{$site->slogan}}" class="form-control" >
                                                        </div>
                                                    </div>

                                                </div>
                                        </div>

                                        <button type="submit" class="btn btn-w-m btn-success">Submit</button>
                                    </form>
                                </div>
                               
                            </div>
                            </div>

                            <div role="tabpanel" id="tab-2" class="tab-pane">
                                <div class="panel-body">

                                    <div class="form-group">
                                        <form action="{{route('slider.add')}}" method="POST" enctype="multipart/form-data">
                                       @csrf
                                        <div class="row">
                                            <div class="col-md-6">
                                                <div class="form-group">

                                                    <h5> Write Caption:</h5>
                                                    <div class="controls">
                                                        <input type="text" name="caption" id="caption" class="form-control" data-validation-required-message=" Caption is required" >
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <h5> Slogan</h5>
                                                    <div class="controls">
                                                        <input type="text" name="slider_slogan" id="slider_slogan" class="form-control" data-validation-required-message="Slogan is required" >
                                                    </div>
                                                </div>
                                            </div>


                                            <div class="col-md-6">
                                                    <h4>Upload Image:<span class="text-danger">*</span></h4>
                                                 
                                                    <div class="text-center"><img src="{{asset('adminpanel/uploads/slider.jpg')}}" class="slider_current_image" width="150px" height="150px"></div><br>
                                                    
                                                        <div>
                                                                <div class="controls">
                                                                    <input type="file" class="slider_image" name="slider_image" class="form-control btn btn-success" > </div><br>
                                                                    <!-- <img src="" id="current_image" width="100px"> -->
                                                            </label>
                                                        </div>
                                                </div>

                                        </div>

                                        <button type="submit" class="btn btn-w-m btn-success">Upload</button>

                                        </form>

                                    </div>
                                
                                </div>
                                <div class="row">
                                        <div class="col-lg-12">
                                        <div class="ibox ">
                                            <div class="ibox-title">
                                                <h5>Sliders</h5>
                                                <div class="ibox-tools">
                                                    <a class="collapse-link">
                                                        <i class="fa fa-chevron-up"></i>
                                                    </a>
                                                    <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                                                        <i class="fa fa-wrench"></i>
                                                    </a>
                                                    <ul class="dropdown-menu dropdown-user">
                                                        <li><a href="#" class="dropdown-item">Config option 1</a>
                                                        </li>
                                                        <li><a href="#" class="dropdown-item">Config option 2</a>
                                                        </li>
                                                    </ul>
                                                    <a class="close-link">
                                                        <i class="fa fa-times"></i>
                                                    </a>
                                                </div>
                                            </div>
                                            <div class="ibox-content">

                                                <div class="table-responsive">
                                            <table class="table table-striped table-bordered table-hover dataTables-example" >
                                            <thead>
                                            <tr>
                                                <th>Caption</th>
                                                <th>Slogan</th>
                                                <th>Image</th>
                                                <th>Action</th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            @foreach($slider as $sl)
                                            <tr>
                                                <td>{{$sl->caption}}</td>
                                                <td>{{$sl->slogan}}</td>
                                                <td><img src="{{asset($sl->image)}}" id="slider_current_image" width="60px" height="60px"></td>
                                                <td>
                                                <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal4{{$sl->id}}">
                                                        <i class="fa fa-edit"></i> Edit
                                                        </button>
                                                        <div class="modal inmodal" id="myModal4{{$sl->id}}" tabindex="-1" role="dialog"  aria-hidden="true">
                                                            <div class="modal-dialog">
                                                                <div class="modal-content animated fadeIn">
                                                                    <div class="modal-header">
                                                                        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                                                                        <h4 class="modal-title">Update Installment Type</h4>
                                                                    </div>
                                                                    <div class="modal-body">
                                                                    <form action="{{route('slider.update',$sl->id)}}" method="POST">
                                                                    @csrf
                                                                        <div class="form-group row"><label class="col-sm-4 col-form-label">Caption</label>
                                                                            <div class="col-sm-8"><input type="text" value="{{$sl->caption}}" placeholder="Enter Caption" name="caption" class="form-control"> <span class="form-text m-b-none"></span>
                                                                            </div>
                                                                        </div>
                                                                        <div class="form-group row"><label class="col-sm-4 col-form-label">Slogan</label>
                                                                            <div class="col-sm-8"><input type="text" value="{{$sl->caption}}" placeholder="Enter Slogan for Slider" name="slider_slogan" class="form-control"> <span class="form-text m-b-none"></span>
                                                                            </div>
                                                                        </div>

                                                                        <div class="form-group row">
                                                                        <label class="col-sm-4 col-form-label">Image</label>
                                                                            <div class="col-sm-8">
                                                                            <input type="file" class="slider_image" name="slider_image_update" class="form-control btn btn-success" >
                                                                            <div class="text-center" style="padding-top:5px;">
                                                                             <img src="{{asset($sl->image)}}" class="slider_current_image" width="60px" height="60px">

                                                                            </div>
                                                                            
                                                                             </div><br>
                                                                          
                                                                        </div>
                                                                        
                                                                        <div class="hr-line-dashed"></div>
                                                                        
                                                                    </div>  
                                                                    <div class="modal-footer">
                                                                        <button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
                                                                        <button type="submit" class="btn btn-success">Update</button>
                                                                                                            
                                                                    </div>
                                                                    </form>

                                                                </div>
                                                            </div>
                                                        </div>

                                                    <a href="{{route('slider.delete',$sl->id)}}" class="btn btn-success"><i class="fa fa-trash"></i>Delete</a>
                                                
                                                </td>
                                        
                                            </tr>
                                            @endforeach

                                            </tbody>
                                            
                                            </table>
                                                </div>

                                            </div>
                                        </div>
                                    </div>
                                    </div>
                            </div>


                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <script type="text/javascript">
        function readURL(input) {
                if (input.files && input.files[0]) {
                    var reader = new FileReader();

                    reader.onload = function (e) {
                        $('#current_image').attr('src', e.target.result);
                    }
                    reader.readAsDataURL(input.files[0]);
                }
            }
            $("#image").change(function(){
                readURL(this);
            });

            function getURL(input) {
                if (input.files && input.files[0]) {
                    var reader = new FileReader();

                    reader.onload = function (e) {
                        $('.slider_current_image').attr('src', e.target.result);
                    }
                    reader.readAsDataURL(input.files[0]);
                }
            }
            $(".slider_image").change(function(){
                getURL(this);
            });
    </script>
@endsection