@php
  $user = Auth::user();
  $conso = App\Consorciado::where('cidade', $form->empreedimento_municipio)->first();
  $DocumentosFixos = \App\DocimentosTipo::whereIn('nome', ['Parecer Assinado', '2ª Publicação da Decisão', 'Publicação do Diário Eletrônico'])->get();
@endphp

<link rel="stylesheet" href="{{ url('') }}/css/fileinput.min.css" type="text/css">
<div class="modal fade" id="exampleModalaprovar" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
  aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header bg-success text-white">
        <h3 class="modal-title text-white " id="exampleModalLabel">Expedir Licença </h3>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <form name="form2" action="" method="post" enctype="multipart/form-data">
        <div class="modal-body">
          <input value="{{ csrf_token() }}" type="hidden" name="_token">
          <input id="documentoss" type="hidden" name="documentoss">
          <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12 mb-2"
            style="padding: 10px; font-weight: bold; border-bottom: black solid 1px;">
            Tem certeza que deseja Expedir Licença?
          </div>
          @if($user->account_id == 2 || $user->account_id == 5)
            <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12 mb-2"
              style="padding: 10px; border-bottom: black solid 1px;">
              Subtitulo:
              <input type="text" name="titulo" class="form-control titulo"
                value="{{ isset($certificado) ? $certificado->title : '' }}">
            </div>
          @endif
          <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12 mb-2"
            style="padding: 10px; border-bottom: black solid 1px;">

            Frente do Certificado:
            <textarea name="messagem" id="my-editor" class="form-control messagem" required>
              {{ isset($certificado) ? $certificado->msg : '' }}
            </textarea>
          </div>
          <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12 mb-2"
            style="padding: 10px; border-bottom: black solid 1px;">
            <div class="row border-bottom">
  <p class="col-11">
    Verso do Certificado :
  </p>
  <button class="col-1 btn btn-outline" onclick="toggleVerseCertificate()" type="button"><i id="verse-certificate-toggle-icon" class="la la-angle-down"></i></button>

  </div>
<textarea name="messagemverso" id="my-editor2" class="form-control messagemverso" required>
 {{ isset($certificado) ? $certificado->msgverso : '' }}
</textarea>
<script>
  function toggleVerseCertificate() {
    var icon = document.getElementById('verse-certificate-toggle-icon');
    var element = document.getElementById("toggleVerseCertificate");
    var computedStyle = window.getComputedStyle(element);
    var currentDisplay = computedStyle.display;
    if (currentDisplay == "none") {
      element.style.display = "block";
      icon.classList.remove('la-angle-down');
      icon.classList.add('la-angle-up');
    } else {
      element.style.display = "none";
      icon.classList.remove('la-angle-up');
      icon.classList.add('la-angle-down');
    }
    console.log("Display atual: ", currentDisplay);
  }
</script>
            <input type="checkbox" name="temverso" class="temverso" value="1" checked>Utilizar verso do
            certificado</input>
          </div>
         
          @if($user->account->subdomain == 'uba' || $user->account->subdomain == 'devuba' || $user->account->subdomain == 'demo')
            @include('app.admin.explicenca.partials.aprovar.assinaturas')
          @else
            <input type="hidden" name="qtd_assinaturas" value="0">
          @endif

          <table class="table table-bordered table-condensed container-items">
            @php
              $tiposDocumentos = App\DocimentosTipo::where('processo_id', 1)
                ->where('nome', '!=', 'Publicação da Decisão')
                ->where('status', 1)
                ->orderBy('descricao', 'asc')
                ->get();
            @endphp
            <tbody id="conteudo-tabela">
              <tr>
                <th style="width: 40%">Tipo de documento</th>
                <th>Arquivo</th>
                <th style="width: 5%"></th>
              </tr>
               @foreach ($DocumentosFixos as $index => $documento)
                <tr class="item">
                  <td style="width: 30%!important;">
                    <div class="form-group field-arquivo-{{$index}}-tipo_documento_id">
                      <select id="arquivo-{{$index}}-tipo_documento_id" class="form-control" name="Arquivo[{{$index}}][tipo_documento_id]">
                        <option value="{{$documento->id}}">{{$documento->nome}}</option>
                      </select>
                    <p class="help-block help-block-error"></p>
                    <td style="width: 35%!important;">
                  <div class="form-group field-arquivo-{{$index}}-file">
                    <input type="file" id="arquivo-{{$index}}-file" class="form-control" name="Arquivo[{{$index}}][file]"
                      data-krajee-fileinput="fileinput_f93e59fe">
                    <p class="help-block help-block-error"></p>
                  </div>
                </td>
                @if($documento->nome == '2ª Publicação da Decisão')
                  <td style="width: 35%!important;">
                    <input type="text" name="data_publicacao_decisao2" required id="date_p" placeholder="Data Publicação"
                      class="form-control">
                  </td>
                @endif
                </tr>
              @endforeach
                
                @if($form->processOrder->cod == 1)
                @include('components.document-upload-row', ['index' => 0, 'tiposDocumentos' => $tiposDocumentos])
              @endif

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

        <div class="modal-footer ">
          <a onclick="visualizar('madara')" target="_blank" type="button"
            class="btn btn-primary text-white">Previsualizar</a>
          <button type="submit" class="btn btn-success deletar2" id="btn-confirm-aprovar">Expedir Licença</button>
        </div>
      </form>
    </div>
  </div>

</div>

@section('post-script2')
  <script src="https://cdn.ckeditor.com/4.13.1/standard/ckeditor.js"></script>
  {!! config('tenant.editor') !!}

  {!! config('tenant.editor2') !!}

  <script>
    function visualizar($id) {
      var messagem = $(".messagem").val();
      var messagemverso = $(".messagemverso").val();
      var temverso = $(".temverso").is(":checked");
      var titulo = $(".titulo").val();
      var qtd_assinaturas = $("#qtd_assinaturas").val();
      var assinatura_1 = $("#assinatura_1").val();
      var assinatura_2 = $("#assinatura_2").val();

      var atividadesCodElements = document.querySelectorAll('input[name="atividades_cod[]"]');
      var atividadesDescricaoElements = document.querySelectorAll('input[name="atividades_descricao[]"]');
      var atividadesQuantidadeElements = document.querySelectorAll('input[name="atividades_quantidade[]"]');
      var atividadesParametroElements = document.querySelectorAll('input[name="atividades_paramentro[]"]');
      var atividadesUniElements = document.querySelectorAll('input[name="atividades_uni[]"]');

      var condityNumberElements = document.querySelectorAll('input[name="numberCondity[]"]');
      var condityElements = document.querySelectorAll('input[name="condity[]"]');
      var condityValidadeElements = document.querySelectorAll('input[name="valityCondity[]"]');

      var atividades = [];

      atividadesCodElements.forEach(function (element, index) {
        var atividade = {
          cod: element.value,
          descricao: atividadesDescricaoElements[index].value,
          quantidade: atividadesQuantidadeElements[index].value,
          parametro: atividadesParametroElements[index].value,
          uni: atividadesUniElements[index].value
        };
        atividades.push(atividade);
      });
      var condicionantes = [];

      condityElements.forEach(function (element, index) {
        var condicionante = {
          numero: condityNumberElements[index].value,
          condicionante: element.value,
          validade: condityValidadeElements[index].value,
        };
        condicionantes.push(condicionante);
      });
      $.ajaxSetup({
        headers: {
          'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
      });
      $.ajax({
        url: '{{ routeTenant("explicenca.sessao") }}',
        dataType: 'html',
        type: 'POST',
        data: {
          atividades: atividades,
          condicionantes: condicionantes,
          messagem: messagem,
          messagemverso: messagemverso,
          temverso: temverso,
          titulo: titulo,
          qtd_assinaturas: qtd_assinaturas,
          assinatura_1: assinatura_1,
          assinatura_2: assinatura_2
        },

        success: function (retorno) {
          if (JSON.parse(retorno) == 'ok') {
            window.open('{{ url("") }}/app/admin/explicenca/previsualizar/{{ $form->id }}/{{ $type }}', '_blank');
          }
        },
        error: function (a, b, c) {
          alert('Erro: ' + a['status'] + ' ' + c);
        }
      });
    }

    $("#arquivo-0").on('change', function () {
      var nomeDoArquivo = $("#arquivo-0").val(); // obtem o nome
      $('input[name=arquivo-0]').val(nomeDoArquivo);
    });

    function readURL(input) {
      var url = input.value;
      $('input[name=' + input.id + ']').val(url);
    }

    function deletar(input) {
      var url = input.id;
      $('.item-' + url + '').remove();
    }

    var clique = 1;
    $(".add-item").click(function () {
      const template = $("#document-upload-template").html().replace(/__INDEX__/g, clique);
      console.log('add item 2');
      $("#conteudo-tabela").append(template);
      clique++;
    });

    $(document).on('click', '.remove-item', function () {
      $(this).closest('tr').remove();
    });
  </script>
  <link rel="stylesheet" href="https://code.jquery.com/ui/1.9.0/themes/base/jquery-ui.css" />
  <script src="https://code.jquery.com/jquery-migrate-1.2.1.js"></script>
  <script src="https://code.jquery.com/ui/1.9.0/jquery-ui.js"></script>
  <script>
    $(function () {

      var dates = $("#date_p").datepicker({
        dateFormat: 'dd/mm/yy',
        defaultDate: "+1w",
        dayNames: ['Domingo', 'Segunda', 'Terça', 'Quarta', 'Quinta', 'Sexta', 'Sábado', 'Domingo'],
        dayNamesMin: ['D', 'S', 'T', 'Q', 'Q', 'S', 'S', 'D'],
        dayNamesShort: ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'Sáb', 'Dom'],
        monthNames: ['Janeiro', 'Fevereiro', 'Março', 'Abril', 'Maio', 'Junho', 'Julho', 'Agosto', 'Setembro',
          'Outubro', 'Novembro', 'Dezembro'
        ],
        monthNamesShort: ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez'],

      });


    });
  </script>
@endsection