@extends(layoutTenant())

@section('content')
  <div class="row">
    <div class="col-12">
      <div class="page-title-box">
        <h4 class="page-title float-left">Adicionar novo Usuario</h4>
        <div class="clearfix"></div>
      </div>
    </div>
  </div>
  <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::open([
              'url' => routeTenant('usuariosapp.store'),
              'enctype' => 'multipart/form-data',
              'class' => 'needs-validation',
              'id' => 'formulario',
          ]) !!}
          <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">
                <input value="Selecione a foto" type="text" id="uploadFile" disabled="disabled" class="file"
                  name="file_info">
                <div class="file_upload">
                  <input name="foto" type="file" 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">
            </div>
            <div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12 mb-2">
              <label for="validationCustom02">Assinatura do Usuario</label>
              <div class="custom_file_upload">
                <input value="Selecione a assinatura .pfx " type="text" id="uploadFile" disabled="disabled"
                  class="file" name="file_info">
                <div class="file_upload">
                  <input name="assinatura" type="file" id="file_upload" name="file_upload">
                </div>
              </div>
            </div>
          </div>
          <div class="form-row" style="margin-top: 30px;">
            <div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12 mb-2">
              <div class="form-group row">
                <label class="col-sm-4 col-form-label text-sm-right">Permissão do Diario</label>
                <div class="col-sm-6">
                  <div class="custom-controls-stacked ">
                    <label class="custom-control custom-checkbox">
                      <input id="documentos" name="diario" type="checkbox" value="1"
                        class="custom-control-input"><span class="custom-control-label">Diario</span>
                    </label>
                    <label class="custom-control custom-checkbox">
                      <input id="documentos" name="vertodasmaterias" type="checkbox" value="1"
                        class="custom-control-input"><span class="custom-control-label">Acesso total a Materias</span>
                    </label>
                    <div class="feriado">
                      <label class="custom-control custom-checkbox">
                        <input id="feriado" name="feriado" type="checkbox" value="1"
                          class="custom-control-input ">
                        <span class="custom-control-label">Feriados</span>
                      </label>
                      <div class="subtopic">
                        <ul class="inputs-list">
                          <li>
                            <label class="custom-control custom-checkbox">
                              <input type="checkbox" class="custom-control-input" name="feriadoincluir"
                                value="1">
                              <span class="custom-control-label">Incluir</span>
                            </label>
                          </li>
                        </ul>
                      </div>
                    </div>
                    <label class="custom-control custom-checkbox">
                      <input id="documentos" name="cadastrarusuario" type="checkbox" value="1"
                        class="custom-control-input"><span class="custom-control-label">Vincular Usuario Orgão</span>
                    </label>
                    <label class="custom-control custom-checkbox">
                      <input id="esic" name="cadastrarexcecao" type="checkbox" value="1"
                        class="custom-control-input"><span class="custom-control-label">Cadastrar Exceção de Publicação
                      </span>
                    </label>
                    <div class="materia">
                      <label class="custom-control custom-checkbox">
                        <input id="painelemail" name="materia" type="checkbox" value="1"
                          class="custom-control-input"><span class="custom-control-label">Matéria</span>
                      </label>
                      <div class="subtopic">
                        <ul class="inputs-list1">
                          <li>
                            <label class="custom-control custom-checkbox">
                              <input type="checkbox" class="custom-control-input" name="materiaincluir"
                                value="1">
                              <span class="custom-control-label">Incluir</span>
                            </label>
                          </li>
                          <li>
                            <label class="custom-control custom-checkbox">
                              <input type="checkbox" class="custom-control-input" name="materiaaprovar"
                                value="1">
                              <span class="custom-control-label">Aprovar</span>
                            </label>
                          </li>
                        </ul>
                      </div>
                    </div>
                    <label class="custom-control custom-checkbox">
                      <input id="materiasreprovadas" name="materiasreprovadas" type="checkbox" value="1"
                        class="custom-control-input"><span class="custom-control-label">Materias Reprovadas </span>
                    </label>
                    <label class="custom-control custom-checkbox">
                      <input id="publicarmateria" name="publicarmateria" type="checkbox" value="1"
                        class="custom-control-input"><span class="custom-control-label"> Publicar Materia </span>
                    </label>
                    <label class="custom-control custom-checkbox">
                      <input id="publicarmateria" name="configuracao" type="checkbox" value="1"
                        class="custom-control-input"><span class="custom-control-label"> Configuração </span>
                    </label>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-6 col-lg-6 col-md-12 col-sm-12 col-12 mb-2">
              <div class="form-group row">
                <div class="col-sm-6">
                  <div class="custom-controls-stacked ">
                    <label class="custom-control custom-checkbox">
                      <input id="documentos" name="noticias" type="checkbox" value="on"
                        class="custom-control-input"><span class="custom-control-label">Noticias</span>
                    </label>
                    <label class="custom-control custom-checkbox">
                      <input id="documentos" name="role" type="checkbox" value="Admin"
                        class="custom-control-input"><span class="custom-control-label">Administrar Portal</span>
                    </label>
                    <label class="custom-control custom-checkbox">
                      <input id="documentos" name="pauta" type="checkbox" value="1"
                        class="custom-control-input"><span class="custom-control-label">Pautas/Reuniões</span>
                    </label>
                    <label class="custom-control custom-checkbox">
                      <input id="documentos" name="documentos" type="checkbox" value="1"
                        class="custom-control-input"><span class="custom-control-label">Licitações/Documetos</span>
                    </label>
                    <label class="custom-control custom-checkbox">
                      <input id="documentos" name="esic" type="checkbox" value="1"
                        class="custom-control-input"><span class="custom-control-label">E-sic</span>
                    </label>
                    <label class="custom-control custom-checkbox">
                      <input id="trasparencia" name="trasparencia" type="checkbox" value="1"
                        class="custom-control-input"><span class="custom-control-label"> Transparência </span>
                    </label>
                    <label class="custom-control custom-checkbox">
                      <input id="covid" name="covid" type="checkbox" value="1"
                        class="custom-control-input"><span class="custom-control-label"> Covid 19 </span>
                    </label>
                    <label class="custom-control custom-checkbox">
                      <input id="event" name="event" type="checkbox" value="1"
                        class="custom-control-input"><span class="custom-control-label"> Eventos </span>
                    </label>
                    <label class="custom-control custom-checkbox">
                      <input id="projeto" name="projeto" type="checkbox" value="1"
                        class="custom-control-input"><span class="custom-control-label"> Projetos </span>
                    </label>
                  </div>
                </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=estado]').change(function() {
      var idEstado = $(this).val();
      $.get('/get-cidades/' + idEstado, function(cidades) {
        $('select[name=cidade]').empty();
        $.each(cidades, function(key, value) {
          $('select[name=cidade]').append('<option value=' + value.id + '>' + value.name + '</option>');
        });
      });
    });
  </script>
  <script src="{{ asset('assets/vendor/inputmask/js/jquery.inputmask.bundle.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() {
      $(".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);
      });
    });
  </script>
@endsection