Jquery: calculations with real money mask and date sum

Asked

Viewed 153 times

1

I have a screen ready. But there are some adjustments that I’m having trouble solving.

One of them is the calculation of values with the mask of Real. Without it, it works perfectly. With it the result is Nan (the "Value" field receives the same and calculates for "Provision franchising royalties", "Provision advertising fund" and "Provision franchising royalties"). The date is adding up, but with crazy results (the "Issue date" calculates for "1st maturity", "2nd maturity" and "3rd maturity").

I’ve been working on it all day and I tried to add the script links, but I couldn’t.

This is the mask for Real (* maskMoney plugin for jQuery * http://plentz.github.com/jquery-maskmoney/) and this is the date mask (jQuery Mask Plugin v1.14.10 // github.com/igorescobar/jQuery-Mask-Plugin).

Follow what I’ve managed to do so far.

$(document).ready(function() {
  /****** Função percentual ******/
  function funcao_percentual(valor_1, destino, percentual) {
    $(valor_1).on("click", function() {
      $(destino).val('');
    });

    function arredondar(valor, casas) {
      var novo = Math.round(valor * Math.pow(10, casas)) / Math.pow(10, casas);
      return (novo);
    }

    $(valor_1).blur(function() {
      valor = $(this).val();
      porcentagem = percentual; // PORCENTAGEM A SER ADICIONADA
      total = (parseFloat((valor * porcentagem) / 100));
      $(destino).val(arredondar(total, 2));
    });
  }

  /****** Função subtrair ******/
  function funcao_subtrair(valor_1, valor_2, inicio, destino) {
    $(inicio).on("click", function() {
      $(destino).val('');
    });

    function arredondar(valor, casas) {
      var novo = Math.round(valor * Math.pow(10, casas)) / Math.pow(10, casas);
      return (novo);
    }

    $(inicio).blur(function() {
      valor_1_v = $(valor_1).val();
      valor_2_v = $(valor_2).val();
      total = (parseFloat((valor_1_v - valor_2_v)));
      $(destino).val(arredondar(total, 2));
    });
  }

  /****** Função calcular a data ******/
  function funcao_calcular_data(data_inicial, data_final, dias) {
    $(data_inicial).blur(function() {
      $(data_inicial).on("click", function() {
        $(data_final).val('');
      });

      var data_ini = $(data_inicial).val();

      var date = new Date(data_ini);
      date.setDate(date.getDate() + dias);
      var futDate = date.getDate() + "/" + date.getMonth() + "/" + date.getFullYear();


      $(data_final).val(futDate);
    });
  }

  /****** Percentual de Provisão - Royalties (franchising) ******/
  funcao_percentual("#valor", "#provisao_royalties_franchising", 39.85)

  /****** Percentual de Provisão Fundo Propaganda ******/
  funcao_percentual("#valor", "#provisao_fundo_propaganda", 3)

  /****** Subtração de Provisão - Royalties ( franchising) ******/
  funcao_subtrair("#provisao_royalties_franchising", "#provisao_fundo_propaganda", "#valor", "#provisao_royalties_franchising_2")

  /****** 1º vencimento ******/
  funcao_calcular_data("#data_emissao", "#1_venc", 28)

  /****** 2º vencimento ******/
  funcao_calcular_data("#data_emissao", "#2_venc", 42)

  /****** 3º vencimento ******/
  funcao_calcular_data("#data_emissao", "#3_venc", 56)


});

$(document).ready(function() {
  $('#data_emissao').mask('00/00/0000');
  $('#vencimento').mask('00/00/0000');
  $('#1_venc').mask('00/00/0000');
  $('#2_venc').mask('00/00/0000');
  $('#3_venc').mask('00/00/0000');
  $('#data_emissao_2').mask('00/00/0000');
  $('#vencimento_2').mask('00/00/0000');
  $('#data_emissao_3').mask('00/00/0000');
  $('#vencimento_3').mask('00/00/0000');
});

$(function() {
  $(".valor").maskMoney({
    symbol: 'R$ ',
    showSymbol: true,
    thousands: '.',
    decimal: ',',
    symbolStay: true
  });
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>




<div class="row">


  <div class="col-md-2">
    <div class="form-group">
      <label class="control-label">Data da emissão</label>
      <div class="input-group date date-picker" data-date="">
        <div class="input-group date">
          <span class="input-group-btn">
    															<button class="btn default" type="button">
    																<i class="fa fa-calendar"></i>
    															</button>
    														</span>
          <input type="text" class="form-control" name="data_emissao" id="data_emissao">
        </div>
      </div>
    </div>
    <div class="col-md-2">
      <div class="form-group">
        <label class="control-label">Tipo</label>
        <input type="text" placeholder="Tipo" name="tipo" id="tipo" value="" class="form-control" />
      </div>
    </div>
    <div class="col-md-2">
      <div class="form-group">
        <label class="control-label">Nº nota fiscal</label>
        <input type="text" placeholder="Nº nota fiscal" name="num_nf" id="num_nf" value="" class="form-control" />
      </div>
    </div>
    <div class="col-md-6">
      <div class="form-group">
        <label class="control-label">Razão social</label>
        <input type="text" placeholder="Razão social" name="razao_social" id="razao_social" value="" class="form-control" />
      </div>
    </div>
    <div class="col-md-2">
      <div class="form-group">
        <label class="control-label">Valor</label>
        <input type="text" placeholder="Valor" name="valor" id="valor" value="" class="form-control valor" />
      </div>
    </div>
    <div class="col-md-2">
      <div class="form-group">
        <label class="control-label">Vencimento</label>
        <div class="input-group date date-picker" data-date="">
          <span class="input-group-btn">
    															<button class="btn default" type="button">
    																<i class="fa fa-calendar"></i>
    															</button>
    														</span>
          <input type="text" class="form-control" name="vencimento" id="vencimento">
        </div>
      </div>
    </div>
    <div class="col-md-2">
      <div class="form-group">
        <label class="control-label">Forma de pagamento</label>
        <input type="text" placeholder="Forma de pagamento" name="forma_pgto" id="forma_pgto" value="" class="form-control" />
      </div>
    </div>
    <div class="col-md-6">
      <div class="form-group">
        <label class="control-label">Descrição</label>
        <input type="text" placeholder="Descrição" name="descricao" id="descricao" value="" class="form-control" />
      </div>
    </div>
    <div class="col-md-2">
      <div class="form-group">
        <label class="control-label">1º vencimento</label>
        <div class="input-group date">
          <span class="input-group-btn">
    															<button class="btn default" type="button">
    																<i class="fa fa-calendar"></i>
    															</button>
    														</span>
          <input type="text" class="form-control" name="1_venc" id="1_venc" readonly>
        </div>
      </div>
    </div>
    <div class="col-md-2">
      <div class="form-group">
        <label class="control-label">2º vencimento</label>
        <div class="input-group date">
          <span class="input-group-btn">
    															<button class="btn default" type="button">
    																<i class="fa fa-calendar"></i>
    															</button>
    														</span>
          <input type="text" class="form-control" name="2_venc" id="2_venc" readonly>
        </div>
      </div>
    </div>
    <div class="col-md-2">
      <div class="form-group">
        <label class="control-label">3º vencimento</label>
        <div class="input-group date">
          <span class="input-group-btn">
    															<button class="btn default" type="button">
    																<i class="fa fa-calendar"></i>
    															</button>
    														</span>
          <input type="text" class="form-control" name="3_venc" id="3_venc" readonly>
        </div>
      </div>
    </div>

    <div class="col-md-3">
      <div class="form-group">
        <label class="control-label">Data da emissao</label>
        <div class="input-group date date-picker" data-date="">
          <span class="input-group-btn">
    															<button class="btn default" type="button">
    																<i class="fa fa-calendar"></i>
    															</button>
    														</span>
          <input type="text" class="form-control" name="data_emissao_2" id="data_emissao_2">
        </div>
      </div>
    </div>
    <div class="col-md-3">
      <div class="form-group">
        <label class="control-label">Provisão royalties franchising</label>
        <input type="text" placeholder="Provisão royalties franchising" name="provisao_royalties_franchising" id="provisao_royalties_franchising" value="" class="form-control valor" readonly />
      </div>
    </div>
    <div class="col-md-3">
      <div class="form-group">
        <label class="control-label">Provisão fundo propaganda</label>
        <input type="text" placeholder="Provisão fundo propaganda" name="provisao_fundo_propaganda" id="provisao_fundo_propaganda" value="" class="form-control valor" readonly />
      </div>
    </div>
    <div class="col-md-3">
      <div class="form-group">
        <label class="control-label">Nº documento</label>
        <input type="text" placeholder="Nº documento" name="num_doc" id="num_doc" value="" class="form-control" />
      </div>
    </div>
    <div class="col-md-3">
      <div class="form-group">
        <label class="control-label">Valor</label>
        <input type="text" placeholder="Valor" name="valor_2" id="valor_2" value="" class="form-control valor" />
      </div>
    </div>
    <div class="col-md-3">
      <div class="form-group">
        <label class="control-label">Vencimento</label>
        <div class="input-group date date-picker" data-date="">
          <span class="input-group-btn">
    															<button class="btn default" type="button">
    																<i class="fa fa-calendar"></i>
    															</button>
    														</span>
          <input type="text" class="form-control" name="vencimento_2" id="vencimento_2">
        </div>
      </div>
    </div>
    <div class="col-md-3">
      <div class="form-group">
        <label class="control-label">Provisão royalties franchising</label>
        <input type="text" placeholder="Provisão royalties franchising" name="provisao_royalties_franchising_2" id="provisao_royalties_franchising_2" value="" class="form-control valor" readonly />
      </div>
    </div>
    <div class="col-md-3">
      <div class="form-group">
        <label class="control-label">Nº nota fiscal</label>
        <input type="text" placeholder="Nº nota fiscal" name="num_nf_2" id="num_nf_2" value="" class="form-control" />
      </div>
    </div>
    <div class="col-md-4">
      <div class="form-group">
        <label class="control-label">Data de emissão</label>
        <div class="input-group date date-picker" data-date="">
          <span class="input-group-btn">
    															<button class="btn default" type="button">
    																<i class="fa fa-calendar"></i>
    															</button>
    														</span>
          <input type="text" class="form-control" name="data_emissao_3" id="data_emissao_3">
        </div>
      </div>
    </div>
    <div class="col-md-4">
      <div class="form-group">
        <label class="control-label">Valor</label>
        <input type="text" placeholder="Valor" name="valor_3" id="valor_3" value="" class="form-control valor" />
      </div>
    </div>
    <div class="col-md-4">
      <div class="form-group">
        <label class="control-label">Vencimento</label>
        <div class="input-group date date-picker" data-date="">
          <span class="input-group-btn">
    															<button class="btn default" type="button">
    																<i class="fa fa-calendar"></i>
    															</button>
    														</span>
          <input type="text" class="form-control" name="vencimento_3" id="vencimento_3">
        </div>
      </div>
    </div>
    <div class="col-md-6">
      <div class="form-group">
        <label class="control-label">Xml</label>
        <input type="text" placeholder="Xml" name="xml" id="xml" value="" class="form-control" />
      </div>
    </div>
    <div class="col-md-6">
      <div class="form-group">
        <label class="control-label">Visto arquivo</label>
        <input type="text" placeholder="Visto arquivo" name="visto_arquivo" id="visto_arquivo" value="" class="form-control" />
      </div>
    </div>
  </div>

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.