@extends(layoutTenant())
@section('title')
<title>Criar Usuario - Papel zero </title>
@php $pagina = "usuarios"; @endphp
@endsection
@section('content')


<div class="row">
    <!-- ============================================================== -->
    <!-- validation form -->
    <!-- ============================================================== -->
    <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
        <div class="card">
            <h5 class="card-header">Adicionar novo usuario</h5>


            @if($errors->all())
            <div class="alert alert-danger" role="alert">
                <ul>

                    @foreach($errors->all() as $erro)
                    <li>{{$erro}}</li>

                    @endforeach

                </ul>
            </div>
            @endif

            @if (session('success'))

            <div class="alert alert-success">
                {{ session('success') }}
            </div>

            @endif
            @if (session('erro'))

            <div class="alert alert-danger">
                {{ session('erro') }}
            </div>

            @endif
            <div class="card-body">

            <form class="needs-validation" id="formulario" method="POST" action="{{routeTenant('usuariosapp.store')}}" enctype="multipart/form-data">
                    @csrf
                <div class="form-row">
                    <div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12 mb-2">
                        <label for="validationCustom03">Nome</label>
                        <input type="text" name="name" class="form-control" id="nome" placeholder="Nome" required>
                        <input type="hidden" name="account_id" value="{{$id}}" class="form-control" id="nome">

                    </div>

                    <div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12 mb-2">
                        <label for="validationCustom05">Email</label>
                        <input type="email" name="email" class="form-control" id="email" placeholder="Email" required>

                    </div>



                </div>


                <div class="form-row">
                    <div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12 mb-2">
                        <label for="validationCustom03">Senha</label>
                        <input type="password" name="password" class="form-control" id="password" placeholder="Senha" required>

                    </div>

                    <div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12 mb-2">
                        <label for="validationCustom05">Confirmar Senha</label>
                        <input type="password" name="confirmarpassword" class="form-control" id=" confirm_password" placeholder="Confirmar Senha" required>

                    </div>


                </div>





                <div class="form-row" style="margin-top: 10px;">
                    <div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12 mb-2">
                        <label for="validationCustom03">Telefone</label>
                        <input type="text" name="telefone" class="form-control phone-inputmask" id="phone-mask" im-insert="true" placeholder="Telefone" required>

                    </div>

                    <div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12 mb-2">
                        <label for="validationCustom02">Foto do Usuario</label>


                        <div class="custom_file_upload">
                            <div class="file_upload">
                                <input name="foto" type="file" class="form-control" id="file_upload" name="file_upload">
                            </div>
                        </div>

                    </div>

                </div>

                <div class="form-row" style="margin-top: 10px;">
                    <div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12 mb-2">
                        <label for="validationCustom03">Perfil de Acesso</label>
                        <select name="perfil" class="form-control">
                            <option value="padrao">Padrão</option>
                            <option value="AnalistaS">Analista Senior</option>
                        </select>
                    </div>
                    <div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12 mb-2">
                        <label for="validationCustom03">Cargo</label>
                        <input type="text" class="form-control" name="cargo">

                    </div>

                </div>
                <div class="form-row" style="margin-top: 10px;">
                    <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12 mb-2">
                        <div class="conteudo">



                            <h1 style="color:#6300e8;" id="usuario_tipo">Usuário Padrão</h1>
                            <p style="color:#5C5C5C; ">Visualize abaixo as permissões deste perfil.</p>
                            <ul class="nav nav-tabs" id="myTab" role="tablist">
                                <li class="nav-item">
                                    <a class="nav-link active" style="color:darkblue;font-weight: bold; padding: 10px 40px 10px 40px;" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true">PERMISSÕES</a>
                                </li>

                            </ul>
                            <div class="tab-content" id="myTabContent">
                                <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">



                                    <div class="col-lg-12 col-xl-12">

                                        <div id="accordionWrap3" role="tablist" aria-multiselectable="true" style="margin-top: 30px;">
                                            <div class="card collapse-icon accordion-icon-rotate">
                                                <div id="heading31" class="card-header bg-light">
                                                    <a data-toggle="collapse" href="#accordion31" style="color: #6f2e04; font-weight: bold;" aria-expanded="true" aria-controls="accordion31" class="card-title lead ">Análise do FCE - clique para ver detalhes</a>
                                                </div>
                                                <div id="accordion31" role="tabpanel" data-parent="#accordionWrap3" aria-labelledby="heading31" class="card-collapse collapse show" aria-expanded="true">
                                                    <div class="card-content">
                                                        <div class="card-body">


                                                            <table class="table table-striped">
                                                                <thead>
                                                                    <tr>
                                                                        <th class="col-md-10" scope="col">Fucionalidade</th>
                                                                        <th class="col-md-2" scope="col">Permissão</th>
                                                                    </tr>
                                                                </thead>
                                                                <tbody>
                                                                    <tr>
                                                                        <th scope="row">Aprovar</th>
                                                                        <td><input name="analisefce[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="1" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Reprovar</th>
                                                                        <td><input name="analisefce[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="2" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Solicitar Esclarecimetos</th>
                                                                        <td><input name="analisefce[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="3" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Arquivar</th>
                                                                        <td><input name="analisefce[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="4" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Compartilhar Acesso</th>
                                                                        <td><input name="analisefce[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="5" type="checkbox"></td>

                                                                    </tr>
                                                                </tbody>
                                                            </table>



                                                        </div>
                                                    </div>
                                                </div>
                                                <div id="heading32" class="card-header bg-light" style="margin-top: 15px;">
                                                    <a data-toggle="collapse" href="#accordion32" style="color: #6f2e04; font-weight: bold;"
                                                        aria-expanded="false" aria-controls="accordion32" class="card-title lead  collapsed">Análise Técnica - clique para ver detalhes</a>
                                                </div>
                                                <div id="accordion32" role="tabpanel" data-parent="#accordionWrap3" aria-labelledby="heading32" class="card-collapse collapse" aria-expanded="false">
                                                    <div class="card-content">
                                                        <div class="card-body">


                                                            <table class="table table-striped">
                                                                <thead>
                                                                    <tr>
                                                                        <th class="col-md-10" scope="col">Fucionalidade</th>
                                                                        <th class="col-md-2" scope="col">Permissão</th>

                                                                    </tr>
                                                                </thead>
                                                                <tbody>
                                                                    <tr>
                                                                        <th scope="row">Aprovar</th>
                                                                        <td><input name="analisetecnica[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="1" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Reprovar</th>
                                                                        <td><input name="analisetecnica[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="2" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Solicitar Esclarecimetos</th>
                                                                        <td><input name="analisetecnica[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="3" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Arquivar</th>
                                                                        <td><input name="analisetecnica[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="4" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Compartilhar Acesso</th>
                                                                        <td><input name="analisetecnica[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="5" type="checkbox"></td>

                                                                    </tr>
                                                                </tbody>
                                                            </table>



                                                        </div>
                                                    </div>
                                                </div>
                                                <div id="heading33" class="card-header bg-light" style="margin-top: 15px;">
                                                    <a data-toggle="collapse" href="#accordion33" style="color: #6f2e04; font-weight: bold;"
                                                        aria-expanded="false" aria-controls="accordion33"
                                                        class="card-title lead  collapsed">Análise Jurídica - clique para ver detalhes</a>
                                                </div>
                                                <div id="accordion33" role="tabpanel" data-parent="#accordionWrap3" aria-labelledby="heading33" class="card-collapse collapse" aria-expanded="false">
                                                    <div class="card-content">
                                                        <div class="card-body">


                                                            <table class="table table-striped">
                                                                <thead>
                                                                    <tr>
                                                                        <th class="col-md-10" scope="col">Fucionalidade</th>
                                                                        <th class="col-md-2" scope="col">Permissão</th>

                                                                    </tr>
                                                                </thead>
                                                                <tbody>
                                                                    <tr>
                                                                        <th scope="row">Aprovar</th>
                                                                        <td><input name="analisejuridica[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="1" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Reprovar</th>
                                                                        <td><input name="analisejuridica[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="2" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Solicitar Esclarecimetos</th>
                                                                        <td><input name="analisejuridica[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="3" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Arquivar</th>
                                                                        <td><input name="analisejuridica[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="4" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Compartilhar Acesso</th>
                                                                        <td><input name="analisejuridica[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="5" type="checkbox"></td>

                                                                    </tr>
                                                                </tbody>
                                                            </table>


                                                        </div>
                                                    </div>
                                                </div>


                                                <div id="heading34" class="card-header bg-light" style="margin-top: 15px;">
                                                    <a data-toggle="collapse" href="#accordion34" style="color: #6f2e04; font-weight: bold;"
                                                        aria-expanded="false" aria-controls="accordion34"
                                                        class="card-title lead  collapsed">Parecer Técnico - clique para ver detalhes</a>
                                                </div>
                                                <div id="accordion34" role="tabpanel" data-parent="#accordionWrap3" aria-labelledby="heading34" class="card-collapse collapse" aria-expanded="false" style="height: 0px;">
                                                    <div class="card-content">
                                                        <div class="card-body">


                                                            <table class="table table-striped">
                                                                <thead>
                                                                    <tr>
                                                                        <th class="col-md-10" scope="col">Fucionalidade</th>
                                                                        <th class="col-md-2" scope="col">Permissão</th>

                                                                    </tr>
                                                                </thead>
                                                                <tbody>
                                                                    <tr>
                                                                        <th scope="row">Aprovar</th>
                                                                        <td><input name="parecertecnico[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="1" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Reprovar</th>
                                                                        <td><input name="parecertecnico[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="2" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Solicitar Esclarecimetos</th>
                                                                        <td><input name="parecertecnico[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="3" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Arquivar</th>
                                                                        <td><input name="parecertecnico[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="4" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Compartilhar Acesso</th>
                                                                        <td><input name="parecertecnico[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="5" type="checkbox"></td>

                                                                    </tr>
                                                                </tbody>
                                                            </table>



                                                        </div>
                                                    </div>
                                                </div>

                                                <div id="heading35" class="card-header bg-light" style="margin-top: 15px;">
                                                    <a data-toggle="collapse" href="#accordion35" style="color: #6f2e04; font-weight: bold;"
                                                        aria-expanded="false" aria-controls="accordion35"
                                                        class="card-title lead  collapsed">Plenário Codema - clique para ver detalhes</a>
                                                </div>
                                                <div id="accordion35" role="tabpanel" data-parent="#accordionWrap3" aria-labelledby="heading35" class="card-collapse collapse" aria-expanded="false" style="height: 0px;">
                                                    <div class="card-content">
                                                        <div class="card-body">


                                                            <table class="table table-striped">
                                                                <thead>
                                                                    <tr>
                                                                        <th class="col-md-10" scope="col">Fucionalidade</th>
                                                                        <th class="col-md-2" scope="col">Permissão</th>

                                                                    </tr>
                                                                </thead>
                                                                <tbody>
                                                                    <tr>
                                                                        <th scope="row">Aprovar</th>
                                                                        <td><input name="plenariocodema[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="1" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Reprovar</th>
                                                                        <td><input name="plenariocodema[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="2" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Solicitar Esclarecimetos</th>
                                                                        <td><input name="plenariocodema[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="3" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Arquivar</th>
                                                                        <td><input name="plenariocodema[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="4" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Compartilhar Acesso</th>
                                                                        <td><input name="plenariocodema[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="5" type="checkbox"></td>

                                                                    </tr>
                                                                </tbody>
                                                            </table>



                                                        </div>
                                                    </div>
                                                </div>

                                                <div id="heading36" class="card-header bg-light" style="margin-top: 15px;">
                                                    <a data-toggle="collapse" href="#accordion36" style="color: #6f2e04; font-weight: bold;"
                                                        aria-expanded="false" aria-controls="accordion36"
                                                        class="card-title lead  collapsed">Exp. de Licença - clique para ver detalhes</a>
                                                </div>
                                                <div id="accordion36" role="tabpanel" data-parent="#accordionWrap3" aria-labelledby="heading36"
                                                    class="card-collapse collapse" aria-expanded="false" style="height: 0px;">
                                                    <div class="card-content">
                                                        <div class="card-body">



                                                            <table class="table table-striped">
                                                                <thead>
                                                                    <tr>
                                                                        <th class="col-md-10" scope="col">Fucionalidade</th>
                                                                        <th class="col-md-2" scope="col">Permissão</th>

                                                                    </tr>
                                                                </thead>
                                                                <tbody>
                                                                    <tr>
                                                                        <th scope="row">Aprovar</th>
                                                                        <td><input name="espedirlicenca[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="1" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Reprovar</th>
                                                                        <td><input name="espedirlicenca[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="2" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Solicitar Esclarecimetos</th>
                                                                        <td><input name="espedirlicenca[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="3" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Arquivar</th>
                                                                        <td><input name="espedirlicenca[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="4" type="checkbox"></td>

                                                                    </tr>
                                                                    <tr>
                                                                        <th scope="row">Compartilhar Acesso</th>
                                                                        <td><input name="espedirlicenca[]" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="5" type="checkbox"></td>

                                                                    </tr>
                                                                </tbody>
                                                            </table>




                                                        </div>
                                                    </div>
                                                </div>
                                                <div id="heading37" class="card-header bg-light" style="margin-top: 15px;">
                                                        <a data-toggle="collapse" href="#accordion37" style="color: #6f2e04; font-weight: bold;" aria-expanded="false" aria-controls="accordion37" class="card-title lead  collapsed">Secretaria de Meio Ambiente - clique para ver detalhes</a>
                                                    </div>
                                                    <div id="accordion37" role="tabpanel" data-parent="#accordionWrap3" aria-labelledby="heading37" class="card-collapse collapse" aria-expanded="false" style="height: 0px;">
                                                        <div class="card-content">
                                                            <div class="card-body">

                                                                <table class="table table-striped">
                                                                    <thead>
                                                                        <tr>
                                                                            <th scope="col" class="col-md-10">Fucionalidade</th>
                                                                            <th class="col-md-2" scope="col">Permissão</th>

                                                                        </tr>
                                                                    </thead>
                                                                    <tbody>
                                                                        <tr>
                                                                            <th scope="row">Aprovar</th>
                                                                            <td><input name="secretariameioambiente[]" @if(isset($categorie->secretariameioambiente))
                                                                                @if (in_array("1", unserialize($categorie->secretariameioambiente))) checked
                                                                                @endif
                                                                                @endif
                                                                                class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="1" type="checkbox"></td>

                                                                        </tr>
                                                                        <tr>
                                                                            <th scope="row">Reprovar</th>
                                                                            <td><input name="secretariameioambiente[]" @if(isset($categorie->secretariameioambiente))
                                                                                @if (in_array("2", unserialize($categorie->secretariameioambiente))) checked
                                                                                @endif
                                                                                @endif
                                                                                class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="2" type="checkbox"></td>

                                                                        </tr>
                                                                        <tr>
                                                                            <th scope="row">Solicitar Esclarecimetos</th>
                                                                            <td><input name="secretariameioambiente[]" @if(isset($categorie->secretariameioambiente))
                                                                                @if (in_array("3", unserialize($categorie->secretariameioambiente))) checked
                                                                                @endif
                                                                                @endif
                                                                                class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="3" type="checkbox"></td>

                                                                        </tr>
                                                                        <tr>
                                                                            <th scope="row">Arquivar</th>
                                                                            <td><input name="secretariameioambiente[]" @if(isset($categorie->secretariameioambiente))
                                                                                @if (in_array("4", unserialize($categorie->secretariameioambiente))) checked
                                                                                @endif
                                                                                @endif
                                                                                class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="4" type="checkbox"></td>

                                                                        </tr>
                                                                        <tr>
                                                                            <th scope="row">Compartilhar Acesso</th>
                                                                            <td><input name="secretariameioambiente[]" @if(isset($categorie->secretariameioambiente))
                                                                                @if (in_array("5", unserialize($categorie->secretariameioambiente))) checked
                                                                                @endif
                                                                                @endif
                                                                                class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="5" type="checkbox"></td>

                                                                        </tr>
                                                                    </tbody>
                                                                </table>
                                                            </div>
                                                        </div>
                                                    </div>


                                            </div>
                                        </div>

                                    </div>





                                </div>
                                <div class="tab-pane fade" id="perfil" role="tabpanel" aria-labelledby="profile-tab"></div>

                            </div>



                            <div class="col-md-12">

                                <h1 style="color:#6300e8; ">Configuração Geral</h1>
                                <p style="color:#5C5C5C; ">Visualize abaixo as permissões gerais deste perfil.</p>
                                <table class="table table-striped">
                                    <thead>
                                        <tr>
                                            <th class="col-md-10" scope="col">Fucionalidade</th>
                                            <th class="col-md-2" scope="col">Permissão</th>

                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                            <th scope="row"> Acesso Administrativo</th>
                                            <td> <input type="checkbox" name="configuracao" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="1"></td>

                                        </tr>
                                        <tr>
                                            <th scope="row">Acesso á todos Processos</th>
                                            <td> <input type="checkbox" name="todosprocessos" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="1"> </td>

                                        </tr>
                                        <tr>
                                            <th scope="row">Acesso aos Processos Finalizados</th>
                                            <td> <input type="checkbox" name="finalizadosprocessos" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="1"> </td>

                                        </tr>
                                        <tr>
                                            <th scope="row">Acesso aos Processos Arquivados</th>
                                            <td><input type="checkbox" name="arquivadosprocessos" class="form-check-input" style="margin-left:20px; height: 17px; width: 17px" value="1"> </td>

                                        </tr>

                                    </tbody>
                                </table>

                            </div>
                            <div class="col-md-12">
                                <div class="col-md-12">
                                    <label>Acesso a todos os consorciados?</label>
                                </div>
                                <div class="col-md-6">
                                    <div class="row">
                                        <div class="col-md-3">
                                            <input type="radio" name="todos_consorciados" id="allConsorciadosSim" value="1" checked {{(old('todos_consorciados' == 1 ? 'checked' : ''))}}>
                                            <label for="allConsorciadosSim">Sim</label>
                                        </div>
                                        <div class="col-md-3">
                                            <input type="radio" name="todos_consorciados" id="allConsorciadosNao" value="0" {{(old('todos_consorciados' == 0 ? 'checked' : ''))}}>
                                            <label for="allConsorciadosNao">Não</label>
                                        </div>
                                    </div>
                                </div>
                                <div class="row" id="consorciados" style="display:none;">
                                    <div class="col-md-5">
                                        <label>Consorciados Não Vinculados:</label>
                                        <select multiple class="form-control" id="consorciados-nao-vinculados">
                                            @foreach($consorciados as $consorciado)
                                            @if(!in_array($consorciado->id, $vinculados ?? []))
                                            <option value="{{ $consorciado->id }}">{{ $consorciado->cidade }}</option>
                                            @endif
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="col-md-2 text-center">
                                        <button type="button" class="btn btn-primary mt-5" id="adicionar"> &gt;&gt; </button>
                                        <button type="button" class="btn btn-danger mt-5" id="remover"> &lt;&lt; </button>
                                    </div>
                                    <div class="col-md-5">
                                        <label>Consorciados Vinculados:</label>
                                        <select multiple class="form-control" id="consorciados-vinculados" name="">
                                        </select>
                                    </div>
                                </div> 
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12 ">
                                {!! Form::submit('Criar Usuario ', ['class'=>'btn btn-primary']) !!}
                            </div>
                        </div>
                        {!! Form::close() !!}
                    </div>
                </div>
            </div>
            <!-- ============================================================== -->
            <!-- end validation form -->
            <!-- ============================================================== -->
        </div>
        @endsection

        @section('post-script')
        <script type="text/javascript">
            $('select[name=perfil]').change(function() {
                var idEstado = $(this).val();
                if (idEstado == 'AnalistaS') {
                    $('input[type=checkbox]').prop('checked', true);
                    $('#usuario_tipo').html("Analista Senior");
                } else if (idEstado == 'padrao') {
                    $('input[type=checkbox]').prop('checked', false);
                    $('#usuario_tipo').html("Usuário Padrão");
                }
            });
        </script>
        <script src="{{ asset('assets/vendor/inputmask/js/jquery.inputmask.bundle.js') }}"></script>
        <script type="text/javascript" src="https://igorescobar.github.io/jQuery-Mask-Plugin/js/jquery.mask.min.js"></script>
        <script>
            $(function(e) {
                "use strict";
                $(".date-inputmask").inputmask("dd/mm/yyyy"),
                    $(".phone-inputmask").inputmask("(99) 99999-9999"),
                    $(".international-inputmask").inputmask("99.999.999/9999-99"),
                    $(".xphone-inputmask").inputmask("(999) 999-9999 / x999999"),
                    $(".purchase-inputmask").inputmask("aaaa 9999-****"),
                    $(".cc-inputmask").inputmask("9999 9999 9999 9999"),
                    $(".cep").inputmask("99.999-999"),
                    $(".isbn-inputmask").inputmask("999-99-999-9999-9"),
                    $(".currency-inputmask").inputmask("$9999"),
                    $(".percentage-inputmask").inputmask("99%"),
                    $(".decimal-inputmask").inputmask({
                        alias: "decimal",
                        radixPoint: "."
                    }),

                    $(".email-inputmask").inputmask({
                        mask: "*{1,20}[.*{1,20}][.*{1,20}][.*{1,20}]@*{1,20}[*{2,6}][*{1,2}].*{1,}[.*{2,6}][.*{1,2}]",
                        greedy: !1,
                        onBeforePaste: function(n, a) {
                            return (e = e.toLowerCase()).replace("mailto:", "")
                        },
                        definitions: {
                            "*": {
                                validator: "[0-9A-Za-z!#$%&'*+/=?^_`{|}~/-]",
                                cardinality: 1,
                                casing: "lower"
                            }
                        }
                    })
            });
            document.getElementById("file_upload").onchange = function() {
                document.getElementById("uploadFile").value = this.value;
            };
        </script>
        <script src="https://jqueryvalidation.org/files/dist/jquery.validate.js"></script>
        <script>
            /*
             * Translated default messages for the jQuery validation plugin.
             * Locale: PT_BR
             */
            jQuery.extend(jQuery.validator.messages, {
                required: "Este campo &eacute; requerido.",
                remote: "Por favor, corrija este campo.",
                email: "Por favor, forne&ccedil;a um endere&ccedil;o eletr&ocirc;nico v&aacute;lido.",
                url: "Por favor, forne&ccedil;a uma URL v&aacute;lida.",
                date: "Por favor, forne&ccedil;a uma data v&aacute;lida.",
                dateISO: "Por favor, forne&ccedil;a uma data v&aacute;lida (ISO).",
                number: "Por favor, forne&ccedil;a um n&uacute;mero v&aacute;lido.",
                digits: "Por favor, forne&ccedil;a somente d&iacute;gitos.",
                creditcard: "Por favor, forne&ccedil;a um cart&atilde;o de cr&eacute;dito v&aacute;lido.",
                equalTo: "Por favor, forne&ccedil;a o mesmo valor novamente.",
                accept: "Por favor, forne&ccedil;a um valor com uma extens&atilde;o v&aacute;lida.",
                maxlength: jQuery.validator.format("Por favor, forne&ccedil;a n&atilde;o mais que {0} caracteres."),
                minlength: jQuery.validator.format("Por favor, forne&ccedil;a ao menos {0} caracteres."),
                rangelength: jQuery.validator.format("Por favor, forne&ccedil;a um valor entre {0} e {1} caracteres de comprimento."),
                range: jQuery.validator.format("Por favor, forne&ccedil;a um valor entre {0} e {1}."),
                max: jQuery.validator.format("Por favor, forne&ccedil;a um valor menor ou igual a {0}."),
                min: jQuery.validator.format("Por favor, forne&ccedil;a um valor maior ou igual a {0}.")
            });
            $("#formulario").validate({

                rules: {
                    password: {
                        required: true,

                    },
                    confirmarpassword: {
                        equalTo: "#password"
                    }
                },
                messages: {
                    //exemplo
                    password: {
                        required: "Campo Obrigatorio"
                    },
                    confirmarpassword: {
                        equalTo: "As senhas não são iguais"
                    }
                }

            });
            $(document).ready(function() { 
                $('.phone-inputmask').mask('(00) 00000-0000', {
                    onKeyPress: function (val, e, field, options) {
                        var mask = (val.replace(/\D/g, '').length === 11) ? '(00) 00000-0000' : '(00) 0000-00009';
                        $(field).mask(mask, options);
                    }
                });
                $(".feriado input[type='checkbox']").click(function() {
                    var is_checked = $(this).is(":checked");
                    $(".inputs-list").find('input').prop("checked", is_checked);
                });
                $(".inputs-list > li > input[type='checkbox']").click(function() {
                    is_checked = $(this).is(":checked");
                    $(".feriado input[type='checkbox']").prop("checked", (!is_checked) ? is_checked : true);
                });
                $("#allConsorciadosSim").change(function() {
                    $("#consorciados").css('display', 'none');
                });
                $("#allConsorciadosNao").change(function() {
                    $("#consorciados").css('display', 'flex');
                });
            });
        </script>

        <script>
            document.getElementById('formulario').addEventListener('submit', function(e) {
                const hiddenInputs = document.querySelectorAll('input[name="consorciados[]"]');
                hiddenInputs.forEach(function(input) {
                    input.remove();
                });
                const select = document.getElementById('consorciados-vinculados');
                for (let i = 0; i < select.options.length; i++) {
                    let hiddenInput = document.createElement('input');
                    hiddenInput.type = 'hidden';
                    hiddenInput.name = 'consorciados[]';
                    hiddenInput.value = select.options[i].value;
                    this.appendChild(hiddenInput);
                }
            });
            document.getElementById('adicionar').addEventListener('click', function() {
                const selectNaoVinculados = document.getElementById('consorciados-nao-vinculados');
                const selectVinculados = document.getElementById('consorciados-vinculados');

                const selectedOptions = Array.from(selectNaoVinculados.selectedOptions);
                selectedOptions.forEach(option => {
                    selectVinculados.appendChild(option);
                });
            });

            document.getElementById('remover').addEventListener('click', function() {
                const selectNaoVinculados = document.getElementById('consorciados-nao-vinculados');
                const selectVinculados = document.getElementById('consorciados-vinculados');

                const selectedOptions = Array.from(selectVinculados.selectedOptions);
                selectedOptions.forEach(option => {
                    selectNaoVinculados.appendChild(option);
                });
            });
        </script>
        @endsection