@extends('layouts.acorn.acorn_admin_app')
@section('header_styles')
@endsection

@section('top_button')
@endsection

@section('content')
    <div class="row">
        <div class="mb-5">
            <form id="filterForm" class="ic-under-review-reqiest-from">
                <div class="row">
                    <div class="col-lg-2">
                        <input type="search" aria-controls="corporatePendingServiceRequestTable" id="search_text"
                            name="search_text" placeholder="Search" class="form-control" />
                    </div>

                    <div class="col-lg-2">
                        <select id="division_id" name="division_id" class="form-control">
                        </select>
                    </div>
                    <div class="col-lg-2">
                        <select id="service_category_id" name="service_category_id" class="form-control">
                        </select>
                    </div>
                    <div class="col-lg-2">
                        <select id="service_sub_category_id" name="service_sub_category_id" class="form-control">
                        </select>
                    </div>
                    <div class="col-lg-2">
                        <select id="service_id" name="service_id" class="form-control">
                        </select>
                    </div>

                    <div class="col-lg-2">
                        <button type="submit" id="filter_submit_btn" class="btn btn-primary btn-sm">Search</button>
                        <button type="submit" id="rest_btn" class="btn btn-warning btn-sm">Reset</button>
                    </div>
                </div>
            </form>
        </div>
    </div>

    <div class="row">
        @include('admin/service_request/under_review_request/individual_clients/list')
    </div>
@endsection

@section('footer_scripts')
    <script type="text/javascript">
        $(document).ready(function() {

            $('#division_id').select2({
                ajax: {
                    method: 'POST',
                    url: "{{ route('admin-load-division-list-json') }}",
                    data: function(params) {
                        var query = {
                            search: params.term,
                            type: 'public',
                            permission_code: 'ADD_INDIVIDUAL_UNDER_REVIEW_SERVICE_REQUEST'
                        }
                        return query;
                    },
                    dataType: 'json',
                    processResults: function(data) {
                        return {
                            results: data,
                        };
                    },
                },
                placeholder: 'Select Division',
            });

            $('#service_category_id').select2({
                ajax: {
                    method: 'POST',
                    data: function(params) {
                        var query = {
                            search: params.term,
                            type: 'public',
                            division_id: $('#division_id').val(),
                            permission_code: 'ADD_INDIVIDUAL_UNDER_REVIEW_SERVICE_REQUEST'
                        }
                        return query;
                    },
                    url: "{{ route('admin-load-service-category-list-json-by-division-id') }}",
                    dataType: 'json',
                    processResults: function(data) {
                        return {
                            results: data,
                        };
                    },
                },
                placeholder: 'Select Service Category',
            });

            $('#service_sub_category_id').select2({
                ajax: {
                    method: 'POST',
                    data: function(params) {
                        var query = {
                            search: params.term,
                            type: 'public',
                            service_category_id: $('#service_category_id').val(),
                            permission_code: 'ADD_INDIVIDUAL_UNDER_REVIEW_SERVICE_REQUEST'
                        }
                        return query;
                    },
                    url: "{{ route('admin-load-service-sub-category-list-json-by-service-category-id') }}",
                    dataType: 'json',
                    processResults: function(data) {
                        return {
                            results: data,
                        };
                    },
                },
                placeholder: 'Select Service Sub Category',
            });

            $('#service_id').select2({
                ajax: {
                    method: 'POST',
                    data: function(params) {
                        var query = {
                            search: params.term,
                            type: 'public',
                            service_sub_category_id: $('#service_sub_category_id').val(),
                            permission_code: 'ADD_INDIVIDUAL_UNDER_REVIEW_SERVICE_REQUEST'
                        }
                        return query;
                    },
                    url: "{{ route('admin-load-service-list-json-by-service-sub-category-id') }}",
                    dataType: 'json',
                    processResults: function(data) {
                        return {
                            results: data,
                        };
                    },
                },
                placeholder: 'Select Service',
            });


            $('#division_id').on('select2:select', function(e) {

                $('#service_category_id').val('');
                $('#service_category_id').text('');

                $('#service_sub_category_id').val('');
                $('#service_sub_category_id').text('');

                $('#service_id').val('');
                $('#service_id').text('');

            });

            $('#service_category_id').on('select2:select', function(e) {

                $('#service_sub_category_id').val('');
                $('#service_sub_category_id').text('');

                $('#service_id').val('');
                $('#service_id').text('');

            });

            $('#service_sub_category_id').on('select2:select', function(e) {

                $('#service_id').val('');
                $('#service_id').text('');

            });

        });
    </script>
@endsection