@extends('layouts.protocolo')
@section('content')
    <style>
        .ui-autocomplete-loading {
            background: white url({{url('img/gif/ajax-loader.gif')}}) right center no-repeat;
        }
    </style>
<div class="shadow-sm p-1 mb-5 bg-white rounded"><h3>Gerenciador</h3>(Incluir Novo Registro)</div>
<form name="FrmCreateGerenciador" action="{{route('protocolo-gerenciador.store')}}" method="post">
    @csrf
    <div class="row">
        <div class="col-md-12">
            <label for=""><i style="color: grey">* Campo de Preenchimento Obrigatório</i></label>
        </div>
    </div>
    <div class="row">
        <div class="col-md-2">
            <label for="">* CPF</label>
            <input type="text" class="form-control" name="USU_CPF" id="cpf" onkeypress="return digitos(event);" maxlength="11">
        </div>
        <div class="col-md-4">
            <label for="">* Nome Completo</label>
            <input type="text" class="form-control" name="USU_NOME">
        </div>
        <div class="col-md-2">
            <label for="">* Celular</label>
            <input type="text" class="form-control" name="USU_FONE" id="celular">
        </div>
        <div class="col-md-4">
            <label for="">* E-Mail</label>
            <input type="email" class="form-control" name="USU_EMAIL">
        </div>
    </div>
    <div class="row">
        <div class="col-md-2">
            <label for="">* Login</label>
            <input type="text" class="form-control" maxlength="20" name="USU_LOGIN">
        </div>
        <div class="col-md-2">
            <label for="">* Senha</label>
            <input type="password" class="form-control" maxlength="15" name="password">
        </div>
        <div class="col-md-2">
            <label for="">* Confirmar Senha</label>
            <input type="password" class="form-control" maxlength="15" name="password_confirm">
        </div>
        <div class="col-md-2">
            <label for="">* Nível Permissão</label>
            <div class="input-group-prepend">
                <select name="USU_NIVEL" class="form-control">
                    <option selected></option>
                    <option value="1">Administrador</option>
                    <option value="2">Avançado</option>
                    <option value="3">Básico</option>
                </select>
                <div class="input-group-text"><i class="fa fa-question" aria-hidden="true"></i></div>
            </div>
        </div>
        <div class="col-md-4">
            <label for="">* Setor/Lotação</label>
            <select name="SERTOR_ID" class="form-control">
                <option value="" selected></option>
                @foreach($departamento as $dep)
                    <option value="{{$dep->SET_ID}}">{{$dep->SET_DESCRICAO}}</option>
                @endforeach
            </select>
        </div>
    </div>
    <hr class="p-1 mb-3">

    <div class="row">
        <div class="col-md-12">
            <button type="submit" class="btn btn-primary"><i class="fa fa-save" aria-hidden="true"></i> Salvar</button>
            <button type="button" class="btn btn-light" onclick="javascript:history.back();"><i class="fa fa-home" aria-hidden="true"></i>  Voltar</button>
        </div>
    </div>
    <hr class="p-1 mb-3">

</form>

    <div class="table-responsive">
        <table class="table table-hover">
            <thead>
            <tr>
                <th width="20%">Nome Completo</th>
                <th width="10%">Login</th>
                <th width="10%">Celular</th>
                <th width="10%">Status</th>
                <th width="15%">Nivel</th>
                <th width="30%">Setor/Lotação</th>
                <th width="5%">Ação</th>
            </tr>
            </thead>
            <tbody>
            @foreach($gerenciadores as $g)
                <tr>
                    <td>{{$g->USU_NOME}}</td>
                    <td>{{$g->USU_LOGIN}}</td>
                    <td>{{$g->USU_FONE}}</td>
                    <td>{{$g->USU_ATIVO == 'A' ? 'Ativo' : 'Inativo'}}</td>
                    <td>{{$nivel[$g->USU_NIVEL]}}</td>
                    <td>{{$g->SET_DESCRICAO}}</td>
                    <td><a href="{{route('protocolo-gerenciador.edit', $g->USU_ID)}}" class="btn btn-warning btn-sm" title="Editar Gerenciador"><i class="fa fa-edit" aria-hidden="true"></i></a></td>
                </tr>
            @endforeach
            </tbody>
        </table>
    </div>

    <!--Grupo de modal-->
<div class="modal fade bs-legenda_nivel_acesso-modal-lg" tabindex="-1" role="dialog" aria-labelledby="ModalNivelAcesso">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="gridSystemModalLabel">Nível Acesso</h4>
            </div>
            <div class="modal-body">
                (1) Avançado = Insersão/edição/exclusão/consulta/relatórios
                (2) Gerênciador = Inclusão de novos gerênciadores e documentos
                (3) Básico = Apenas consultas/relatórios
            </div>
        </div>
    </div>
</div>

@endsection
@push('script')
    <script>
        $(function () {
            $('#celular').mask("99999-9999");
            $('#cpf').mask("999.999.999-99");
        })
    </script>
    <script src="{{url(mix('modulos/protocolo/assets/js/gerenciador/create-update-gerenciador.js'))}}"></script>
@endpush