@extends('adminlte::page')
@section('content_header')
    <h1>File Routing</h1>
@stop

<script src="//code.jquery.com/jquery.js"></script>

@section('content')
   @notifyCss
 @notifyJs    
 @if ($errors->any())
     <div class="alert alert-danger">
         <ul>
             @foreach ($errors->all() as $error)
                <li>{{ $error }}</li>
             @endforeach
        </ul>
    </div>
 @endif
@if (session('status'))
    <div class="alert alert-success">
         {{ session('status') }}
    </div>
@endif
@include('notify::messages')
    <div class="row">
            <!--row starts-->
     <div class="col-md-12">
        <div class="panel panel-primary">
           <div class="panel-heading">
                <h3 class="panel-title">
                            {{request()->session()->get('session_fname')}}Route Configuration
                        </h3>
           </div>

                        <div class="panel-body">
                             <div class="container">
                                <form class="form-horizontal"  action="{{ url('fileroute') }}" method="post" >
                                  {{ csrf_field() }}
                                  <div class="form-group">
                                      <label for="filegroup">{{request()->session()->get('session_fname')}} Group </label>
                                      <select class="form-control" name="filegroup" id="subject">
                                		<option value="0"placeholder="">Select Subject</option> 
                                       @foreach($file_group as $file_groups)
                                       <option value="{{$file_groups->id}}"placeholder="">{{$file_groups->file_group}}</option> 
                                       @endforeach 
                                    
                                     </select>
                                  </div>
                                    <div class="form-group">
                                       <label for="username">User Name:</label>
                                       <input class="form-control" id="username"value="{{$name}}"type="text"name="username">
                                   </div>
                                    
                                     <div class="form-group">
                                     <label for="frouteame">Route Name:</label>
                                     <input class="form-control" id="froutename" type="text"name="froutename">
                                      </div>
                                  

                         
                                    <div id="optiondiv">
                                      <div class="col-md-12">
                                       <div class="form-group" >
                                        <div class="col-sm-4"><b>LEVEL</b></div>
                                        <div class="col-sm-4"><b>OFFICE</b></div>
                                        <div class="col-sm-4"> <b> SEAT</b></div>
                                        <button type="button" class="btn btn-primary btn-xs pull-right" id="addmore">Add More</button>
                                       </div>
                                       </div>
                                        <div class="col-md-12">
                                        <div class="form-group" >
                                        <input type="hidden" name="optioncount" id="optioncount" value="1">
                                        <div class="col-sm-4">
                                        <input type="text" name="level1" id="level1" class="form-control" placeholder="Enter the level" >
                                       </div>
                                  
                                 @php print("<script>var officeidarray=[]; var officenamearray=[];</script>"); @endphp 
                                    @php $i=0; @endphp
                                   @foreach($offz as $off)

                                    @php 
                                   

                                    print("<script>officeidarray.push($off->id); officenamearray.push('$off->office_name');</script>");
                                    
                                   $i++; 
                                     @endphp
                                   @endforeach
                                 

                                   
                                       <div class="col-sm-4">
                                       <select class="form-control" name="office1" id="office1" onchange="fetchseats(1)" >
                                        <option value="">Select an Office</option>
                                       @foreach($offz as $off)

                                       <option value="{{$off->id}}">{{$off->office_name}}</option>
                                       @endforeach
                                       
                                        </select>
                                      </div>
                                       <div class="col-sm-4">
                                        <select class="form-control" name="seat1" id="seat1">
                                         <option value=""placeholder="seat"></option>
                                       </select>
                                           </div>
                              </div>
                                </div>
                            </div>
                            </div>
                                <button type="submit" name="submit" class="btn btn-primary mb-2">Submit</button>
                          </form>
                       </div>             
            </div>
         </div>
     </div>
     
     
<table class="table table-bordered" id="froutetable">
        <thead>
            <tr>
                <th>Id</th>
                <th>File_Group</th>
                <th>Route Name</th>
                <th>Updated At</th>
                <th>Actions</th>
            </tr>
        </thead>
    </table>

<script>
$(function() {

    $('#froutetable').DataTable({
        processing: true,
        serverSide: true,
        ajax: '{!! url('froutedatatable') !!}',
        columns: [
            { data: 'id', name: 'id' },
            { data: 'file_group', name: 'file_group' },
            { data: 'froutename', name: 'froutename' },
            { data: 'updated_at', name: 'updated_at' },
            { data: 'action', name: 'action' },
        ],
       
    });
});

</script>





<script type="text/javascript">
function fetchseats(cnt)
{

  var officeid=$("#office"+cnt).val();

        $.get("{{ url('getseat')}}",
        { option: officeid },
        function(data) {
           
            
            $('#seat'+cnt).empty();
            $('#seat'+cnt).append("<option value='0'>Select a seat</option>");
            $.each(data, function(key, element) {
                $('#seat'+cnt).append("<option value='" + key +"'>" + element + "</option>");
            });
        });
    
}

$('#addmore').click(function(){
      var optioncount=$('#optioncount').val();
      optioncount++;
      var fieldHTML='<div class="col-sm-12"><div class="form-group" ><div class="col-sm-4"><input type="text" name="level'+optioncount+'" id="level'+optioncount+'" class="form-control" placeholder="enter the level" ></div><div class="col-sm-4"><select name="office'+optioncount+'" id="office'+optioncount+'" class="form-control" placeholder="office" onchange="fetchseats('+optioncount+')"><option value="">Select an Office</option>';
      for(i=0;i<officeidarray.length;i++)
      {
        fieldHTML=fieldHTML+'<option value='+officeidarray[i]+'>'+officenamearray[i]+'</option>';
      }
      fieldHTML=fieldHTML+'</select></div> <div class="col-sm-4"><select name="seat'+optioncount+'" id="seat'+optioncount+'" class="form-control" placeholder="seat" ></div> </div></div>';
      $('#optiondiv').append(fieldHTML);
      $('#optioncount').val(optioncount);
    }); 



</script>






@stop