@extends('admin.layouts.master')

@section('title')
    Company Settings
@stop

@section('style')
    <link rel="stylesheet" type="text/css" href="{{asset('/css/loader.css')}}">

    <style>
        tr.group,
        tr.group:hover {
            background-color: #ddd !important;
        }
        .form-sec{width:400px; background:#ccc; padding:15px;width: 400px;
        background: #f8f9fa;padding: 15px;box-shadow: 0 0 4px #ccc;}
        /*Disabled href*/
        /*
        .btn-disabled,
        .btn-disabled[disabled] {
          opacity: .4;
          cursor: default !important;
          pointer-events: none;
        */
        .modal {
           /*position: relative;*/
           z-index: 9999;
           vertical-align: middle;
        }
        .modal-content textarea.form-control {
            max-width: 100%;
        }
        textarea {
          resize: vertical;
        }
        table.dataTable th.selectall-checkbox,
        table.dataTable td.selectall-checkbox {
          cursor: pointer;
          outline: none;
          text-align: center;
        }
        /*filter on top*/
        tfoot {
            display: table-header-group;
        }
        thead {
            display: table-row-group;
        }
        /*hide show entries*/
        .dataTables_length {
            display: none;
        }
        .dataTables_filter {
            display: none;
        }
        .highlight {
          background-color: #79D3CE;
        }
        .highlight-teacher {
          background-color: #CCB5D3;
        }
        .highlight2 {
          background-color: #93ABB0;
        }
        .font-sizee {
          font-size: 16px;
          font-weight: bold;
          text-align: center;
        }
        .font-center {
          text-align: center;
        }
    </style>
@stop

@section('content')
    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <h1>
                <span class="fa fa-gear"></span> Company Settings
            </h1>
            <ol class="breadcrumb">
                <li><a href="#"><i class="fa fa-gear"></i> Admin Panel</a></li>
                <li class="active">Company Settings</li>
            </ol>
        </section>

        <!-- Main content -->
        <section class="content" style=" padding-bottom: 10%;">
            <div class="page-header">
                <a href="{{route('dashboard')}}" class="btn btn-primary"><i class="fa fa-backward"></i> Back</a> {{--<a href="{{route('students.calendar', $room[0]->student_id)}}" class="btn btn-success"><i class="fa fa-calendar"></i> Calendar View</a>--}}
            </div>

            <div id="overlay">
                <div class="cv-spinner">
                    <span class="spinner"></span>
                </div>
            </div>

            <div role="tabpanel">

              <!-- Nav tabs -->
              <ul class="nav nav-tabs" role="tablist">
                <li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">Company Info</a></li>
                <li role="presentation"><a href="#scheme" aria-controls="scheme" role="tab" data-toggle="tab">Theme Color</a></li>
                {{--<li role="presentation"><a href="#kors_plan" aria-controls="kors_plan" role="tab" data-toggle="tab">Course Plan</a></li>--}}
              </ul>

              <!-- Tab panes -->
              <div class="tab-content">
                <div role="tabpanel" class="tab-pane active" id="home">
                    <div style="margin-top: 10px;"></div>
                        <div class="row">
                        @foreach($com as $key => $cm)
                            <div style="margin-bottom: 20px;"></div>
                            <form method="post" action="{{route('settings.update')}}" enctype="multipart/form-data">
                                <div class="col-xs-3 col-sm-3">
                                    <span>
                                        <img class="profile-picture" src="{{url('images/logo/'.$cm->logo)}}" width="200px" id="avatar">
                                        <input type="hidden" name="reservephoto" value="{{$cm->logo}}">
                                        <span class="input-group-btn">
                                            <input type="file" class="btn" id="photo" name="photo" onchange="imagepreview.call(this)"/>
                                        </span>
                                    </span>

                                    <div class="space space-4"></div>

                                </div><!-- /.col -->

                            <div class="col-xs-12 col-sm-9">
                                <div class="profile-user-info">
                                        <input type="hidden" name="_id" id="_id" class="form-control" value="{{$cm->id }}" readonly>
                                        <div class="col-md-6">
                                            <div class="form-group has-feedback @if($errors->has('company_name')) has-error @endif">
                                                <label for="name" class="control-label">Company Name</label>
                                                <input type="text" name="company_name" id="company_name" class="form-control" value="{{$cm->company_name }}">
                                                <span class="fa fa-building form-control-feedback"></span>
                                                @if($errors->has('company_name')) <span class="help-block">{{$errors->first('company_name')}}</span> @endif
                                            </div>

                                            <div class="form-group has-feedback @if($errors->has('address')) has-error @endif">
                                                <label for="address" class="control-label">Address</label>
                                                <textarea name="address" id="address" class="form-control" rows="5">{{$cm->address}}</textarea>
                                                <span class="glyphicon glyphicon-skype form-control-feedback"></span>
                                                @if($errors->has('address')) <span class="help-block">{{$errors->first('address')}}</span> @endif
                                            </div>

                                        </div>

                                        <div class="col-md-6">
                                            <div class="form-group has-feedback @if($errors->has('contact_no')) has-error @endif">
                                                <label for="contact_no" class="control-label">Contact No</label>
                                                <input type="text" name="contact_no" id="contact_no" class="form-control" value="{{$cm->contact_no}}">
                                                <span class="glyphicon glyphicon-mobile form-control-feedback"></span>
                                                @if($errors->has('contact_no')) <span class="help-block">{{$errors->first('contact_no')}}</span> @endif
                                            </div>

                                            <div class="form-group has-feedback @if($errors->has('postcode')) has-error @endif">
                                                <label for="postcode" class="control-label">Post Code</label>
                                                <input type="text" name="postcode" id="postcode" class="form-control" value="{{$cm->postcode}}">
                                                <span class="glyphicon glyphicon-mail form-control-feedback"></span>
                                                @if($errors->has('postcode')) <span class="help-block">{{$errors->first('postcode')}}</span> @endif
                                            </div>

                                            <div class="form-group has-feedback @if($errors->has('email')) has-error @endif">
                                                <label for="email" class="control-label">Email</label>
                                                <input type="email" name="email" id="email" class="form-control" value="{{$cm->email}}">
                                                <span class="glyphicon glyphicon-envelope form-control-feedback"></span>
                                                @if($errors->has('email')) <span class="help-block">{{$errors->first('email')}}</span> @endif
                                            </div>

                                          <div class="form-group has-feedback @if($errors->has('website')) has-error @endif">
                                              <label for="website" class="control-label">Website</label>
                                              <input type="text" name="website" id="website" class="form-control" value="{{$cm->website}}">
                                               <span class="fa fa-whatsapp form-control-feedback"></span>
                                              @if($errors->has('website')) <span class="help-block">{{$errors->first('website')}}</span> @endif
                                          </div>
                                        </div>

                                        <div class="form-group" style="padding: 10px;padding-top:20px;">
                                            <button type="submit" class="btn btn-success btn-s"><i class="fa fa-check"></i> Update</button>
                                            <a href="{{route('dashboard')}}" class="btn btn-primary"><i class="fa fa-arrow-left"></i> Cancel</a>
                                        </div>
                                        {{csrf_field()}}

                                </div>

                                <div class="hr hr-8 dotted"></div>
                                {{--<div class="profile-user-info">
                                </div>--}}
                            </div><!-- /.col -->

                        @endforeach

                        </form>

                        </div>

                </div>

                <div style="height: 20px;"></div>
                    <div role="tabpanel" class="tab-pane" id="scheme">
                        <div class="profile-user-info">
                        <div class="col-md-6">
                            <div class="form-group has-feedback @if($errors->has('themes')) has-error @endif">
                                <label for="themes" class="control-label">Theme</label>
                                <select id="themes" name="themes" class="form-control status">
                                    <option value="" >Select Theme</option>
                                    @foreach($themes as $key => $thm)
                                        <option value="{{$thm->id}}" selected="selected">{{$thm->scheme}} </option>
                                    @endforeach
                                </select>
                                @if($errors->has('themes')) <span class="help-block">{{$errors->first('themes')}}</span> @endif
                            </div>
                            <button id="btnOk" name="btnOk" class="btn btn-success"><i class="fa fa-check-o"></i> Apply Theme</button>
                            {{--<div style="height: 30px;"></div>
                            <div>
                                <table id="layout-skins-list" class="table table-striped bring-up nth-2-center">
                                    <thead>
                                      <tr>
                                        <th style="width: 40px;">No.</th>
                                        <th style="width: 210px;">Skin Class</th>
                                        <th style="width: 110px;"></th>
                                      </tr>
                                    </thead>
                                    <tbody>
                                        @foreach($themes as $key => $thm)
                                            <tr>
                                                <td>{{$thm->id}}</td>
                                                <td><code>{{$thm->scheme}}</code></td>
                                                <td><a href="#" data-skin="skin-green" class="btn btn-primary btn-xs"><i class="fa fa-eye"></i></a></td>
                                            </tr>
                                        @endforeach
                                      <tr>
                                        <td><code>skin-blue</code></td>
                                        <td><a href="#" data-skin="skin-blue" class="btn btn-primary btn-xs"><i class="fa fa-eye"></i></a></td>
                                      </tr>
                                      <tr>
                                        <td><code>skin-blue-light</code></td>
                                        <td><a href="#" data-skin="skin-blue-light" class="btn btn-primary btn-xs"><i class="fa fa-eye"></i></a></td>
                                      </tr>
                                      <tr>
                                        <td><code>skin-yellow</code></td>
                                        <td><a href="#" data-skin="skin-yellow" class="btn btn-warning btn-xs"><i class="fa fa-eye"></i></a></td>
                                      </tr>
                                      <tr>
                                        <td><code>skin-yellow-light</code></td>
                                        <td><a href="#" data-skin="skin-yellow-light" class="btn btn-warning btn-xs"><i class="fa fa-eye"></i></a></td>
                                      </tr>
                                      <tr>
                                        <td><code>skin-green</code></td>
                                        <td><a href="#" data-skin="skin-green" class="btn btn-success btn-xs"><i class="fa fa-eye"></i></a></td>
                                      </tr>
                                      <tr>
                                        <td><code>skin-green-light</code></td>
                                        <td><a href="#" data-skin="skin-green-light" class="btn btn-success btn-xs"><i class="fa fa-eye"></i></a></td>
                                      </tr>
                                      <tr>
                                        <td><code>skin-purple</code></td>
                                        <td><a href="#" data-skin="skin-purple" class="btn bg-purple btn-xs"><i class="fa fa-eye"></i></a></td>
                                      </tr>
                                      <tr>
                                        <td><code>skin-purple-light</code></td>
                                        <td><a href="#" data-skin="skin-purple-light" class="btn bg-purple btn-xs"><i class="fa fa-eye"></i></a></td>
                                      </tr>
                                      <tr>
                                        <td><code>skin-red</code></td>
                                        <td><a href="#" data-skin="skin-red" class="btn btn-danger btn-xs"><i class="fa fa-eye"></i></a></td>
                                      </tr>
                                      <tr>
                                        <td><code>skin-red-light</code></td>
                                        <td><a href="#" data-skin="skin-red-light" class="btn btn-danger btn-xs"><i class="fa fa-eye"></i></a></td>
                                      </tr>
                                      <tr>
                                        <td><code>skin-black</code></td>
                                        <td><a href="#" data-skin="skin-black" class="btn bg-black btn-xs"><i class="fa fa-eye"></i></a></td>
                                      </tr>
                                      <tr>
                                        <td><code>skin-black-light</code></td>
                                        <td><a href="#" data-skin="skin-black-light" class="btn bg-black btn-xs"><i class="fa fa-eye"></i></a></td>
                                      </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>--}}
                    </div>
                </div>

                {{--<div style="height: 10px;"></div>
                <div role="tabpanel" class="tab-pane" id="kors_plan">

                </div>
                </div>--}}

                {{--<div role="tabpanel" class="tab-pane" id="settings">67865</div>--}}


            </div>


            <input type="hidden" id="domainn" name="domainn" value="{{$site[0]['host'] ?? '' }}" readonly>

            <div style="height: 10px;"></div>

            @if(Session('info'))
                <div class="row" style="margin-bottom: 50px;">
                    <div class="col-md-6 col-md-offset-3 text-center">
                        <div class="tem alert alert-success navbar-fixed-bottom"><span class="glyphicon glyphicon-ok-circle"></span> {{Session('info')}}</div>
                    </div>
                </div>
            @endif

              {{--<div id="overlay"></div>
              <div id="container2">
                <div id="circle">
                  <i class="fa fa-check"></i>
                </div>
                <h1>Success</h1>
                <p>Check your email for a booking confirmation. We'll see you soon!</p>
                <button>Ok</button>
              </div>--}}

        </section>

       <div class="modal fade bs-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" style=" padding-right: 0px;background-color: rgba(4, 4, 4, 0.8);">
          <div class="modal-dialog modal-lg" style="top: 20%;width: 70%;text-align: center;">
            <div class="modal-content" style="border-radius: 0px;border: none;top: 40%;">
              <div class="modal-body" id="modBody" style="background-color: #E3E1A1;color: white;"> {{--0f8845--}}
                <h3 id="h22"></h3>
                <h5 id="h44"></h5>
              </div>
            </div>
          </div>
        </div>

    </div>
@stop

@section('script')
{{--<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>--}}
{{--<script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/fixedcolumns/3.3.1/js/dataTables.fixedColumns.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/select/1.3.1/js/dataTables.select.min.js"></script>--}}


{{--<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>--}}
{{--<<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script>--}}

<script>
    $(document).ready(function() {
        //$('#overlay').show();

        $('#btnOk').on('click', function() {
            var tid   = $('#themes').find('option:selected').val();
            $("#overlay").fadeIn(300);
            $.ajax({
                url:"{{route('settings.apply-theme')}}",
                method: 'post',
                headers:  {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
                data:{
                  tid: tid
                },
                dataType:'json',
                success:function(data) {
                    console.log(data);
                    location.reload();
                },
                complete: function() {
                   //$('#wait').hide();
                   setTimeout(function(){
                   $("#overlay").fadeOut(300);
                   },500);
                },
                error: function (jqXHR, exception) {
                    console.log(jqXHR);
                }
            });
        });

    });
</script>

<script type="text/javascript">
    function imagepreview(){
        if(this.files&& this.files[0]){
            var filerd = new FileReader();
            filerd.onload=function(data){
              var image = document.getElementById("avatar");
              image.src = data.target.result;
              image.style.display = "block";
            };
            filerd.readAsDataURL(this.files[0]);
          }
    }

    function notifPopup(title,body) {
        $('#h22').text(title);
        $('#h44').text(body);
        $('.bs-modal-lg').modal('toggle');
        setTimeout(function() {$('.bs-modal-lg').modal('hide');}, 10000);
    }
</script>

@stop