@extends(layoutTenant())

@section('content')
    <div class="row">
        <div class="col-12">
            <div class="page-title-box">
                <h4 class="page-title float-left">Lista de Setores</h4>

                <div class="float-right">
                    <form action="{{ routeTenant('setor.buscar') }}" method="GET" class="form form-inline">
                        <input type="text" name="buscar" class="form-control" style="height:40px;width: 70%;">
                        <button type="submit" class="btn btn-primary btn-outline-success">Buscar</button>
                    </form>
                </div>
                <div class="clearfix"></div>
            </div>
        </div>
    </div>
    <!-- end row -->
    <div class="row" style="margin-top: -20px;  min-height: 100px; position: relative; ">

        <div style="padding: 20px;  border-radius: 12px;">
            @if (session('erro'))
                <div class="alert alert-danger"
                     style="display: flex; width: 90vw; align-items: center; justify-content: center;">
                    {{ session('erro') }}
                </div>
            @endif
            <div class="float-left" style="">
                <a href="{{ routeTenant('setor.create') }}" class="btn btn-success botao-adicionar"><i
                            class=""></i>
                    Adicionar Novo Setor</a>
            </div>
        </div>
    </div>

    <!-- recent orders  -->
    <!-- ============================================================== -->
    <div class="col-xl-12 col-lg-12 col-md-6 col-sm-12 col-12">
        <div class="card">
            <h5 class="card-header">Setores</h5>
            <div class="card-body p-0">
                <div class="table-responsive">
                    <table class="table">
                        <thead class="bg-light">
                        <tr class="border-0">
                            <th class="border-0">Nome do Setor</th>
                            <th class="border-0">Funções</th>
                        </tr>
                        </thead>
                        <tbody>
                        @foreach ($categories as $category)
                            <tr>
                                <td>
                                    <div class="m-r-10" @if ($category->status == 0) style="color: rgba(199, 199, 199, 0.61);" @endif>
                                        {{ $category->name }}
                                    </div>
                                </td>

                                <td>
                                    @if ($category->status)
                                        <a href="{{ routeTenant('setor.edit', ['setor' => $category->id]) }}"
                                           title="Editar" class="btn btn-primary">
                                            <i class="fa fa-edit" aria-hidden="true"></i>
                                        </a>
                                        <a href="{{ routeTenant('setor.delete', ['id' => $category->id]) }}"
                                           title="Deletar" data-confirm='Tem certeza de que deseja Desativar o item selecionado?'
                                           class="btn btn-danger delete-btn">
                                            <i class="fa fa-trash" aria-hidden="true"></i>
                                        </a>
                                    @endif
                                </td>
                            </tr>
                        @endforeach

                        </tbody>
                    </table>
                    {!! $categories->links() !!}
                </div>
            </div>
        </div>
    </div>
    <!-- ============================================================== -->
    <!-- end recent orders  -->
@endsection

@section('post-script')
    <script>
        $(document).ready(function () {
            $('body').on('click', '.delete-btn', function (ev) {
                ev.preventDefault();
                var href = $(this).attr('href');
                if (!$('#confirm-delete').length) {
                    $('body').append('<div class="modal fade" id="confirm-delete" tabindex="-1" role="dialog" ' +
                        'aria-labelledby="exampleModalLabel" aria-hidden="true"><div class="modal-dialog">' +
                        '<div class="modal-content"><div class="modal-header bg-danger text-white">DELETAR SETOR' +
                        '<button type="button" class="close" data-dismiss="modal" aria-label="Close">' +
                        '<span aria-hidden="true">&times;</span></button></div><div class="modal-body">' +
                        'Tem certeza de que deseja Deletar o setor ?</div><div class="modal-footer">' +
                        '<button type="button" class="btn btn-success" data-dismiss="modal">Cancelar' +
                        '</button><a class="btn btn-danger text-white" id="dataComfirmOK">Deletar</a><' +
                        '/div></div></div></div>');
                }
                $('#dataComfirmOK').attr('href', href);
                $('#confirm-delete').modal({
                    show: true
                });
            });
        });
    </script>
@endsection