@php
 $current_route = $request->route()->getName();
$plants = \App\Models\Plant::select('name','id')->get();
$departments = [];
$buildings = [];
if(request('plant_id')){
    $departments  = \App\Models\Department::select('name','id')->where('plant_id',request('plant'))->get();
    $buildings =  \App\Models\Buildings::select('name','id')->where('plant_id',request('plant'))->get();
}
$sections = [];
if(request('department_id')){
    $sections  = \App\Models\Section::select('name','id')->where('dept_id',request('department'))->get();
}
$zones = [];
if(request('section_id')){
    $zones  = \App\Models\Zone::select('name','id')->where('section_id',request('section'))->get();
}
$area_offices = [];
if(request('zone_id')){
    $area_offices  = \App\Models\AreaOffice::select('ao_name','id')->where('zone_id',request('zone'))->get();
}
$collection_points = [];
$dispatch_points = [];
if(request('ao_id')){
    $collection_points  = \App\Models\CollectionPoint::select('name','id')->where('area_office_id',request('ao_id'))->get();
    $dispatch_points  = \App\Models\DispatchPoint::select('name','id')->where('ao_id',request('ao_id'))->get();
    $buildings =  \App\Models\Buildings::select('name','id')->where('ao_id',request('ao_id'))->get();
}
@endphp

        <div class="col-md-3 col-6 plant">
            <label class="form-label">Plant</label>
            <div class="mb-1">
                <select name="plant_id" class="form-control select2" id="plant_search" required onchange="getDropdownData('department_search',this.value)">
                    <option value="" selected="" disabled="">Plant</option>
                    @foreach($plants as $plant)
                        <option value="{{$plant->id}}" {{request('plant_id')==$plant->id?'selected':''}}>{{$plant->name}}</option>
                    @endforeach
                 </select>
            </div>
        </div>
        <div class="col-md-3 col-6 department">
            <label class="form-label">Department</label>
            <div class="mb-1">
                <select name="department_id" id="department_search" class=" form-control select2" onchange="getDropdownData('section_search',this.value)">
                    <option value="" selected="" disabled="">Department</option>
                    @foreach($departments as $data)
                        <option value="{{$data->id}}"  {{request('department_id')==$data->id?'selected':''}}>{{$data->name}}</option>
                    @endforeach
                </select>
            </div>
        </div>
        <div class="col-md-3 col-6 section">
            <label class="form-label">Section</label>
            <div class="mb-1">
                <select name="section_id" id="section_search" class=" form-control select2" onchange="getDropdownData('zone_search',this.value)">
                    <option value="" selected="" disabled="">Section</option>
                    @foreach($sections as $data)
                        <option value="{{$data->id}}"  {{request('section_id')==$data->id?'selected':''}}>{{$data->name}}</option>
                    @endforeach
                </select>
            </div>
        </div>
        <div class="col-md-3 col-6 zone">
            <label class="form-label">Zone</label>
            <div class="mb-1">
                <select name="zone_id" class="form-control select2" id="zone_search" onchange="getDropdownData('area_office_search',this.value)">
                    <option value="" selected="" disabled="">Zone</option>
                    @foreach($zones as $data)
                        <option value="{{$data->id}}"  {{request('zone_id')==$data->id?'selected':''}}>{{$data->name}}</option>
                    @endforeach
                </select>

            </div>
        </div>
        <div class="col-md-3 col-6 ao">
            <label class="form-label">Area Office</label>
            <div class="mb-1">
                <select name="ao_id" id="area_office_search" onchange="getDropdownData('collection_point_search',this.value)" class="form-control select2">
                    <option value="" selected="" disabled="">Area Office</option>
                    @foreach($area_offices as $data)
                        <option value="{{$data->id}}"  {{request('ao_id')==$data->id?'selected':''}}>{{$data->name}}</option>
                    @endforeach
                </select>

            </div>
        </div>
        <div class="col-md-3 col-6 dp">
            <label class="form-label">Dispatch Points</label>
            <div class="mb-1">
                <select name="dp_id" id="dispatch_point_search" class="form-control select2" onchange="getDropdownData('dp_search',this.value)">
                    <option value="" selected="" disabled="">Dispatch Point</option>
                    @foreach($dispatch_points as $data)
                        <option value="{{$data->id}}"  {{request('dp_id')==$data->id?'selected':''}}>{{$data->name}}</option>
                    @endforeach
                </select>

            </div>
        </div>
        <div class="col-md-3 col-6 cp">
            <label class="form-label">Collection Point</label>
            <div class="mb-1">
                <select name="mcc_id" id="collection_point_search" class="form-control select2" onchange="getDropdownData('cp_search',this.value)">
                    <option value="" selected="" disabled="">Collection Point</option>
                    @foreach($collection_points as $data)
                        <option value="{{$data->id}}"  {{request('cp_id')==$data->id?'selected':''}}>{{$data->name}}</option>
                    @endforeach
                </select>

            </div>
        </div>
        <div class="col-md-3 col-6 bd">
            <label class="form-label">Buildings</label>
            <div class="mb-1">
                <select name="building_id" id="building_search" class="form-control select2" onchange="getDropdownData('bd_search',this.value)">
                    <option value="" selected="" disabled="">Buildings</option>
                    @foreach($buildings as $data)
                        <option value="{{$data->id}}"  {{request('building_id')==$data->id?'selected':''}}>{{$data->name}}</option>
                    @endforeach
                </select>

            </div>
        </div>

<script>
   function getDropdownData(input_id,id){

        var selectedValue = $('#parent').val();

      if(input_id=='department_search'){
          $('#department_search,#section_search,#zone_search,#area_office_search,#collection_point_search,#dispatch_point_search,#building_search').html(`<option value="" selected="" disabled="">Select Option</option>`)
      }else if(input_id=='section_search'){
          $('#section_search,#zone_search,#area_office_search,#collection_point_search,#dispatch_point_search,#building_search').html(`<option value="" selected="" disabled="">Select Option</option>`)
      }else if(input_id=='zone_search'){
          $('#zone_search,#area_office_search,#collection_point_search,#dispatch_point_search,#building_search').html(`<option value="" selected="" disabled="">Select Option</option>`)
      }else if(input_id=='area_office_search'){
          $('#area_office_search,#collection_point_search,#dispatch_point_search,#building_search').html(`<option value="" selected="" disabled="">Select Option</option>`)
      }else if(input_id=='collection_point_search'){
          $('#collection_point_search,#dispatch_point_search,#building_search').html(`<option value="" selected="" disabled="">Select Option</option>`)
      }

       $.ajax('{{route('get.electricityDropdown.data')}}', {
           type: 'get',
           data: { id: id, type: input_id, parent: selectedValue },
           success: function (data) {
               if(data.success== true){

                if(input_id == 'department_search')
                {
                    $('#'+input_id).html(data.data);
                    $('#building_search').html(data.buildings);
                    $('#meter_no').val('');
                }
                else if(input_id == 'collection_point_search')
                {
                    $('#'+input_id).html(data.data);
                    $('#dispatch_point_search').html(data.dp);
                    $('#building_search').html(data.buildings);
                    $('#meter_no').val(data.meterNo);
                }
                else if(input_id == 'bd_search' || input_id == 'cp_search' || input_id == 'dp_search')
                {
                    $('#meter_no').val(data.meterNo);
                }
                else
                {
                    $('#meter_no').val('');
                    $('#'+input_id).html(data.data);
                }
                
             
               }
           },
           error: function (jqXhr, textStatus, errorMessage) {
               alert('Error Occurred')
           }
       });

    }


</script>