@extends('admin.default')
@section('title', 'Admin | Add or Update Routes')
@section('content')

<nav class="page-breadcrumb">
      <ol class="breadcrumb">
         <li class="breadcrumb-item"><a href="#">Dashboard</a></li>
         <li class="breadcrumb-item active" aria-current="page">Add or Update Route</li>
      </ol>
   </nav>
   <div class="row">
      <div class="col-md-12 grid-margin stretch-card">
         <div class="card">
            <div class="card-body">
                <h6 class="card-title">Add or Update Route</h6>
                <form method="post" class="form" action="{{route('routesStore',$id)}}" enctype="multipart/form-data">
                    {{csrf_field()}}
                    <div class="form-group row">
                        <div class="col-md-2">
                            <label>Name<sup class="text-danger">*</sup></label>
                        </div>
                        <div class="col-md-10">
                            <input type="text" class="form-control" name="name" id="name" placeholder="Route" value="{{isset($data->name)?$data->name:''}}" required>
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-md-2">
                            <label>Route</label>
                        </div>
                        <div class="col-md-10">
                            <input type="text" class="form-control" name="route" id="route" placeholder="route" value="{{isset($data->route)?$data->route:''}}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-md-2">
                            <label>Icon</label>
                        </div>
                        <div class="col-md-10">
                            <input type="text" class="form-control" name="icon" id="icon" placeholder="icon" value="{{isset($data->icon)?$data->icon:''}}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-md-2">
                            <label>Strip</label>
                        </div>
                        <div class="col-md-10">
                            <select class="form-control" name="strip_id" id="strip_id">
                                <option value="0">-</option>
                                @if(isset($route) && !empty($route))
                                    @foreach($route as $key)
                                        <option value="{{$key->id}}" {{isset($data->strip_id)?(($key->id == $data->strip_id)?'selected':''):''}}>{{$key->name}}</option>
                                    @endforeach
                                @endif
                            </select>
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-md-2">
                            <label>Dropdown</label>
                        </div>
                        <div class="col-md-10">
                            <select class="form-control" onchange="getDropDown()" name="dropdown_id" id="dropdown_id">
                                <option value="0">-</option>
                                @if(isset($route->dropdown))
                                    @foreach($route->dropdown as $key)
                                        <option value="{{$key->id}}" {{isset($data->dropdown_id)?(($key->id == $data->dropdown_id)?'selected':''):''}}>{{$key->name}}</option>
                                    @endforeach
                                @endif
                            </select>
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-md-2">
                            <label>Child Dropdown</label>
                        </div>
                        <div class="col-md-10">
                            <select class="form-control" name="child_dropdown_id" id="child_dropdown_id">
                                <option value="0">-</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-md-2">
                            <label>Type</label>
                        </div>
                        <div class="col-md-10">
                            <select class="form-control" name="type" id="type">
                                <option @if(isset($data->type) && $data->type=="sidebar") selected @endif value="sidebar">Sidebar</option>
                                <option @if(isset($data->type) && $data->type=="action") selected @endif value="action">Action</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-md-12">
                            <button type="submit" class="btn btn-info text-white float-right " id="save" value="Save">
                                <span class="mr-2" id="save_text">Save </span> 
                                <div class="spinner-border spinner-border-sm text-primary float-right" id="loader" style="display:none" role="status">
                                <span class="sr-only">Loading...</span>
                                </div>
                            </button>
                        </div>
                    </div>
                </form>
            </div>
         </div>
      </div>
   </div>
@endsection
@push('script')
<script>
    function getDropDown(){
        var id = $('#dropdown_id').val();
        $.ajax({
                dataType: "json",
                url: "/administrator/get-drop-down/"+id,
                type: 'get',
                success: function(data){
                    if(data){
                        $.each(data, function() {
                            // country (country name)
                            $("#child_dropdown_id").append($("<option />").val(this.id).text(this.name));
                        });
                    }
                    // selected options
                    // country (country name)
                    $("#child_dropdown_id").val("{{isset($data->child_dropdown_id)?$data->child_dropdown_id:''}}");
                }
            });
    }
    getDropDown()
</script>
@endpush