@extends('admin.layouts.admin', ['title' => __('Create Panel')])
@section('content')  
<!-- Main content -->
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

  <link rel="stylesheet" href="{{ asset('bootstrap/css/bootstrap-select.css') }}">
 <!-- PAGE-HEADER -->
<div class="page-header">
    <h1 class="page-title">Create Manager Panel</h1>
   <!--  <div>
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="javascript:void(0)">Home</a></li>
            <li class="breadcrumb-item active" aria-current="page">Create Panel</li>
        </ol>
    </div> -->
</div>
<!-- PAGE-HEADER END -->
                 @if(count($errors) > 0)
                    <div class="alert alert-danger">
                        <ul>
                            @foreach($errors->all() as $error)
                                <li>{{$error}}</li>
                            @endforeach
                        </ul>
                    </div>
                @endif
                <div class="row">
                    <div class="col-lg-12 col-md-12 col-sm-12 col-xl-12">
                <!-- /.box-header -->
                   <!-- form start -->
                   <form action="{{ route('storeManagerPanelManagement') }}" method="post" enctype="multipart/form-data" >
                    @csrf
                      <div class="box-body">
                        <div class="col-md-6" style="float: left;">
                            <div class="form-group">
                                <label for="name">Name*</label>
                                <input type="text"  name="name" class="form-control" >
                            </div>
                        </div>
                        <div class="col-md-6" style="float: left;">
                            <div class="form-group">
                                <label for="email">Email*</label>
                                <input   type="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$" name="email" class="form-control" >
                            </div>
                        </div>
                        <div class="col-md-6" style="float: left;">
                            <div class="form-group">
                                <label for="password">Set Password*</label>
                                <input type="password"  name="password" class="form-control">
                            </div>
                        </div>
                         
                         <div class="col-md-6" style="float: left;">
                            <div class="form-group">
                                <label for="authorities">Authorities*</label><br>
                                <div class="col-md-6" style="float: left;">

                                   <input type="checkbox" name="authorities[]" value="Reports"> Reports<br>

                                   <input type="checkbox" name="authorities[]" value="Net Quantity"> Net Quantity<br>
                                  </div>
                                  <div class="col-md-6" style="float: left;">
                                   <input type="checkbox" name="authorities[]" value="Survelliance"> Survelliance<br>
                                 
                                   <input type="checkbox" name="authorities[]" value="Commision & Rebate"> Commision & Rebate<br>
                                 </div>
                                 <div class="col-md-6" style="float: left;">
                                   <input type="checkbox" name="authorities[]" value="Weekly Statement For Brokers"> Weekly Statement For Brokers<br>
                                 </div>
                                
                            </div>
                        </div>
                        <div class="col-md-6" style="float: left;">
                            <div class="form-group">
                                <label for="validity">Validity*</label>
                                <input type="date"  name="validity" class="form-control" type="date" >
                            </div>
                        </div>
                    </div>
                      <!-- /.box-body -->

                      <div class="box-footer">
                         <div class="col-md-12" style="float: left;">  
                            <button type="submit" class="btn btn-primary">Save</button>
                        </div>
                      </div>
                   </form>
               </div>
           </div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="{{ asset('bootstrap/js/bootstrap-select.js') }}"></script>

<script>
function createOptions(number) {
  var options = [], _options;

  for (var i = 0; i < number; i++) {
    var option = '<option value="' + i + '">Option ' + i + '</option>';
    options.push(option);
  }

  _options = options.join('');
  
  $('#number')[0].innerHTML = _options;
  $('#number-multiple')[0].innerHTML = _options;


  $('#number2')[0].innerHTML = _options;
  $('#number2-multiple')[0].innerHTML = _options;
}

var mySelect = $('#first-disabled2');

createOptions(4000);

$('#special').on('click', function () {
  mySelect.find('option:selected').prop('disabled', true);
  mySelect.selectpicker('refresh');
});

$('#special2').on('click', function () {
  mySelect.find('option:disabled').prop('disabled', false);
  mySelect.selectpicker('refresh');
});

$('#basic2').selectpicker({
  liveSearch: true,
  maxOptions: 1
});
</script>
<style type="text/css">
  .bootstrap-select > .dropdown-toggle.bs-placeholder, .bootstrap-select > .dropdown-toggle.bs-placeholder:hover, .bootstrap-select > .dropdown-toggle.bs-placeholder:focus, .bootstrap-select > .dropdown-toggle.bs-placeholder:active{
    background: transparent;
    border: 0;
  }
  .bootstrap-select .dropdown-menu li{
    padding: 10px;
  }
.dark-mode .form-control:focus {
    background: transparent !important;
}
</style>
@endsection