@extends(config('manager.views.layouts.master'))

@section('content')
    @include('manager::partials.breadcrumb', [
        'pages' => ['Regiões']
    ])

    @include('manager::partials.page-header', [
        'title' => 'Regiões',
        'link'  => [
            'route'    => route('manager.regions.create'),
            'label'    => 'Inserir nova região',
            'btn-type' => 'primary',
        ],
    ])

    @include('manager::partials.messages')

    <form action="{{ route('manager.regions.index') }}" class="form-inline well">
        <input type="text" name="title" class="form-control" value="{{ request('title') }}" placeholder="Busca por nome da região..." maxlength="255" autofocus>

        <button type="submit" class="btn btn-primary">Filtrar</button>
        <a href="{{ route('manager.regions.index') }}" class="btn btn-default">Limpar filtros</a>
    </form>

    <table class="table table-bordered table-striped table-hover">
        <thead>
            <tr>
                <th>Título</th>
                <th width="100">Ativo</th>
                <th width="150">Ações</th>
            </tr>
        </thead>
        <tbody>
            @foreach ($regions as $region)
                @if($region->regions)
                    <tr style="background-color: #aaa;" data-id_region="{{ $region->id }}" class="region">
                        <td class="text-center"><strong>{{ $region->title }}</strong></td>

                        <td>
                            <input type="checkbox"
                                    data-manager-update-checkbox="active"
                                    data-manager-update-url="{{ route('manager.regions.updateBasic', $region->id) }}"
                                    {{ $region->active ? 'checked="checked"' : null }}
                                    class="check_region">
                        </td>
                        <td>
                            <div class="btn-group btn-group-sm">
                                <a href="{{ route('manager.regions.edit', $region->id) }}" class="btn btn-default" title="Editar">
                                    <span class="glyphicon glyphicon-pencil"></span> editar
                                </a>

                                <a href="{{ route('manager.regions.destroy', $region->id) }}" class="btn btn-default region-{{ $region->id }}" data-id="{{ $region->id }}" data-delete="true" title="Excluir">
                                    <span class="glyphicon glyphicon-trash"></span> excluir
                                </a>
                            </div><!-- .btn-group -->
                        </td>
                    </tr>
                    @foreach ($regions as $state)
                        @if($state->regions)
                            <tr style="background-color: #ccc;">
                                <td>{{ $state->title }}</td>

                                <td>
                                    <input type="checkbox"
                                            data-id="{{ $state->id }}"
                                            data-id_parent="{{ $region->id }}"
                                            data-manager-update-checkbox="active"
                                            data-manager-update-url="{{ route('manager.regions.updateBasic', $state->id) }}"
                                            {{ $state->active ? 'checked="checked"' : null }}
                                            class="{{ 'reg-'.$region->id .' '. 'check_nation'  }}">
                                </td>
                                <td>
                                    <div class="btn-group btn-group-sm">
                                        <a href="{{ route('manager.regions.edit', $state->id) }}" class="btn btn-default" title="Editar">
                                            <span class="glyphicon glyphicon-pencil"></span> editar
                                        </a>

                                        <a href="{{ route('manager.regions.destroy', $state->id) }}" class="btn btn-default nation-{{ $state->id }}" data-delete="true" title="Excluir">
                                            <span class="glyphicon glyphicon-trash"></span> excluir
                                        </a>
                                    </div><!-- .btn-group -->
                                </td>
                            </tr>

                            @foreach($regions as $city)
                                @if($city->regions)
                                    <tr data-id_city="{{ $city->id }}">
                                        <td>{{ $city->title }}</td>

                                        <td>
                                            <input type="checkbox"
                                                    data-id="{{ $city->id }}"
                                                    data-id_parent="{{ $state->id }}"
                                                    data-manager-update-checkbox="active"
                                                    data-manager-update-url="{{ route('manager.regions.updateBasic', $city->id) }}"
                                                    {{ $city->active ? 'checked="checked"' : null }}
                                                    class="{{ 'reg-'.$region->id ." ". 'state-'.$state->id ." check_state" }}">
                                        </td>
                                        <td>
                                            <div class="btn-group btn-group-sm">
                                                <a href="{{ route('manager.regions.edit', $city->id) }}" class="btn btn-default" title="Editar">
                                                    <span class="glyphicon glyphicon-pencil"></span> editar
                                                </a>

                                                <a href="{{ route('manager.regions.destroy', $city->id) }}" class="btn btn-default" data-delete="true" title="Excluir">
                                                    <span class="glyphicon glyphicon-trash"></span> excluir
                                                </a>
                                            </div><!-- .btn-group -->
                                        </td>
                                    </tr>
                                @endif
                            @endforeach

                        @endif
                    @endforeach
                @endif
            @endforeach
        </tbody>
    </table><!-- .table -->

    @if ($regions->count() === 0)
        <h3 class="text-center">Nenhuma região encontrada.</h3>
    @endif

    {!! $regions->appends(request()->except('page'))->render() !!}
@stop

@section('scripts')
    @parent

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


        $(".check_nation").each(function() {
            let id_parent = $(this).data("id_parent");
            $(".region-" + id_parent).attr("disabled", true);
        });

        $(".check_state").each(function() {
            let id_parent = $(this).data("id_parent");
            $(".nation-" + id_parent).attr("disabled", true);
        });

        $(".check_region").click(function() {
            let id = $(this).data('id');

            if ( $(this).is(':checked') ) {
                toogleAttrSelect(".reg-", 1, id);
            } else {
                toogleAttrSelect(".reg-", 0, id);
            }
        });

        $(".check_nation").click(function() {
            let id = $(this).data('id');

            if ( $(this).is(':checked') ) {
                toogleAttrSelect(".state-", 1, id);
            } else {
                toogleAttrSelect(".state-", 0, id);
            }
        });

        $(".check_state").click(function() {
            id_sub_region = $(this).data('id');
            active = null;

            if ( $(this).is(':checked') ) {
                sendAjax(id_sub_region, 1);
            } else {
                sendAjax(id_sub_region, 0);
            }

        });

        function toogleAttrSelect(className, active, id) {
            $(className + id).each(function() {
                let id_sub_region = $(this).data('id');

                $(className + id).attr("checked");

                sendAjax(id_sub_region, active);

            });

            function sendAjax(id_sub_region, active) {
                $.ajaxSetup({
                   headers: {
                      'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                   }
                });

                $.ajax({
                    url: 'regions/'+id_sub_region+'/basic',
                    type: "put",
                    data: { active : active },
                    success: function() {

                    }
                });
            }

            window.location.reload();
        }


    })();
    </script>
@stop