.alert.alert-warning[role="alert" id="alert-content" style="display: none;"]
  span#alert-message

ol.breadcrumb
  li = link_to 'Pagamento', @pagamento_da_retencao.retencao.pagamento, class: 'link_breadcrumb '
  li.active = @pagamento_da_retencao.retencao.descricao_imposto
= simple_form_for(@pagamento_da_retencao) do |f|
  = f.input :retencao_id, as: :hidden
  .widget
    .widget-body
      legend 
        strong Informações
      .row
        .col-sm-6

          p 
            span.bold Unidade Orçamentária:   
            span = @pagamento_da_retencao.retencao.get_liquidacao.empenho.unidade_orcamentaria.codigo_e_nome

          p 
            span.bold Fonte de Recurso: 
            span = @pagamento_da_retencao.retencao.get_liquidacao.empenho.fonte_de_recursos_codigo_e_descricao

          p 
            span.bold Elemento de Despesa: 
            span = @pagamento_da_retencao.retencao.get_liquidacao.empenho.elemento_de_despesa.codigo_e_descricao

        .col-sm-6
          p 
            span.bold Valor Bruto Total:  
            span = @pagamento_da_retencao.retencao.pagamento.valor.to_d.real_contabil

          p 
            span.bold Descontos Totais: 
            span = @pagamento_da_retencao.retencao.valor_calculado.to_d.real_contabil

          p 
            span.bold Valor Líquido: 
            span = @pagamento_da_retencao.retencao.valor_pagamento_com_desconto.real_contabil


  .widget 
    .widget-body
      = error_for @pagamento_da_retencao, :unidade_orcamentaria
      = error_for @pagamento_da_retencao, :sim
      .row
        .col-sm-12
          legend style='color: black'
            strong style='margin-right: 10px'
              | #{@pagamento_da_retencao.retencao.tipo_de_acao_i18n}

            i.fa.fa-question-circle.info_inss_pj title="#{@pagamento_da_retencao.retencao.descricao_imposto} #{@pagamento_da_retencao.retencao.descricao_da_acao}"
      .row
        .col-md-3
          = f.input :data_do_pagamento, label: "Data", as: :string, input_html: { class: "date-picker" }

      .row 
        .col-sm-5
          = f.input :conta_origem_id, label: 'Conta Origem', collection: @contas_bancarias_origem, label_method: :to_s, include_blank: "Selecione",
          input_html: { class: 's2', id: 'conta_origem' }, label_html: { class: 'conta_origem_label' }
        .col-sm-6
          = f.input :conta_destino_id, label: 'Conta Destino', collection: @contas_bancarias, label_method: :nomeclatura_com_unidade_principal_do_exercicio, include_blank: "Selecione",
          input_html: { class: 's2', id: 'conta_destino' }, label_html: { class: 'conta_destino_label' }


      - if @pagamento_da_retencao.retencao.transferir?
        .row 
          .col-sm-6
            = f.input :fonte_de_recursos_origem_id, label: 'Fonte de Recursos Origem', collection: [@pagamento_da_retencao.fonte_de_recursos_do_empenho],
            label_method: :codigo_e_descricao, selected: @pagamento_da_retencao.fonte_de_recursos_do_empenho.id,
            include_blank: "Selecione", disabled: true, input_html: { class: 's2' }

          .col-sm-6
            = f.input :fonte_de_recursos_destino_id, label: 'Fonte de Recursos Destino', collection: @fontes_de_recursos,
            label_method: :codigo_e_descricao, include_blank: "Selecione", input_html: { class: "s2", id: 'fonte_de_recursos_destino' }

      - if f.object.errors[:base].size > 0
        .row
          .col-md-12
            span class="error_explanation "
              = f.object.errors[:base].map { |e| e.capitalize }.join(", ")
  .widget
    .widget-body 

      .form-actions
        .row
          .col-md-12 
            = f.submit 'Salvar', class: 'btn btn-primary', onclick: 'LoadingInterface("Aguarde...");'
            = link_to 'Voltar', @pagamento_da_retencao.retencao.pagamento, class: 'btn btn-default'


javascript:
  $(document).ready(function(){
    montaElementoLinkDaConta($('.conta_origem_label'), $('#conta_origem').val(), 'link_label_origem');
    montaElementoLinkDaConta($('.conta_destino_label'), $('#conta_destino').val(), 'link_label_destino');
  });

  $('#conta_destino').on('change', function(){
    $('#fonte_de_recursos_destino').empty().append('<option selected="selected" value="">Selecione</option>')

    if($('#conta_destino').val() != '' && $('#conta_destino').val() != undefined){
      LoadingInterface("Aguarde...")
      $.getJSON(urlFonteDeRecursos(), function(dados){

        dados.forEach(function(dado){
          $('#fonte_de_recursos_destino').append($('<option>', {
            value: dado.id,
            text: dado.codigo_e_descricao
          }));
        })
      })
    }
  })

  $('#conta_origem').on('change', function(){
    montaElementoLinkDaConta($('.conta_origem_label'), $(this).val(), 'link_label_origem');
  })

  $('#conta_destino').on('change', function(){
    montaElementoLinkDaConta($('.conta_destino_label'), $(this).val(), 'link_label_destino');
  })

  function montaElementoLinkDaConta(label, contaId, nomeDaClasse){
    $(`.${nomeDaClasse}`).remove();
    label.append(`<a href="${montaLinkDaConta(contaId)}" target="_blank" class="${nomeDaClasse}"> Ver conta</a>`)
  }

  function montaLinkDaConta(contaId){
    return `${root_url}base/contas_bancarias/${contaId}`
  }

  function urlFonteDeRecursos(){
    var url = new URL(`${root_url}Orcamento/2022/fontes_de_recursos`);
    url.searchParams.append('q[fontes_de_recursos_da_conta_bancaria_conta_bancaria_id_eq]', $('#conta_destino').val());

    return url.href
  }