0

Estou encontrando dificuldades na realização de um cálculo para um formulário.

Queria poder somar dias a uma data selecionada pelo usuário. Vi que há no fórum vários exemplos mas com dias especificados (hoje para a data e a escolha dos dias já com ele previsto).

Contudo, o que eu gostaria é de que fosse livre escolha do usuário. Preciso que a data seja escolhida em um calendário em português que já fiz usando datepicker.

Desativei no calendário os feriados e alguns dias da semana (sextas, sábados e domingos). Nos cálculos que achei não consigo acoplar o calendário para escolha.

Não tenho experiência na área, não sei muito sobre os código e estou tentando aprender sozinha.

O meu projeto:

$(document).ready(function() {
  var dateMin = new Date();
  var weekDays = AddWeekDays(1);
  dateMin.setDate(dateMin.getDate() + weekDays);
  var natDays = [
    [1, 1, 'uk'],
    [4, 21, 'uk'],
    [5, 1, 'uk'],
    [9, 7, 'uk'],
    [9, 20, 'uk'],
    [10, 12, 'uk'],
    [11, 2, 'uk'],
    [15, 11, 'uk'],
    [12, 25, 'uk'],

    [2, 13, 'uk'],
    [3, 30, 'uk'],
    [4, 1, 'uk'],
    [5, 10, 'uk'],
    [5, 31, 'uk']
  ];

  function noWeekendsOrHolidays(date) {
    var noWeekend = $.datepicker.noWeekends(date);
    if (noWeekend[0]) {
      return nationalDays(date);
    } else {
      return noWeekend;
    }

  }

  function nationalDays(date) {
    for (i = 0; i < natDays.length; i++) {
      if (date.getMonth() == natDays[i][0] - 1 && date.getDate() == natDays[i][1]) {
        return [false, natDays[i][2] + '_day'];
      }

    }
    return [true, ''];
  }

  function AddWeekDays(weekDaysToAdd) {
    var mydate = new Date();
    if (mydate.getHours() >= 10) var daysToAdd = 1;
    else var daysToAdd = 0;
    var day = mydate.getDay()
    weekDaysToAdd = weekDaysToAdd - (5 - day)
    if ((5 - day) < weekDaysToAdd || weekDaysToAdd == 1) {
      daysToAdd = (5 - day) + 2 + daysToAdd
    } else { // (5-day) >= weekDaysToAdd
      daysToAdd = (5 - day) + daysToAdd
    }
    while (weekDaysToAdd != 0) {
      var week = weekDaysToAdd - 5
      if (week > 0) {
        daysToAdd = 7 + daysToAdd
        weekDaysToAdd = weekDaysToAdd - 5
      } else { // week < 0
        daysToAdd = (5 + week) + daysToAdd
        weekDaysToAdd = weekDaysToAdd - (5 + week)
      }

    }
    return daysToAdd;
  }

  jQuery('#datepicker').datepicker({
    minDate: dateMin,
    minDate: 30,
    defaultDate: +1,
    firstDay: 0,
    changeFirstDay: true,
    changeMonth: true,
    changeYear: true,
    dateFormat: "dd/mm/yy",
    dayNames: ['Domingo', 'Segunda-feira', 'Terça-feira', 'Quarta-feira', 'Quinta-feira', 'Sexta-feira', 'Sábado', 'Domingo'],
    dayNamesMin: ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'Sáb', 'Dom'],
    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'],
    constrainInput: true,
    beforeShowDay: function(day) {
      if (day.getDay() < 1 || day.getDay() > 4) {
        return [false, ""];
      }
      return noWeekendsOrHolidays(day);
    }
  });
});
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

Beggining: <input type="text" id="datepicker" size="10" maxlength="10"><br><br> Days: <input type="text" id="days" size="2" maxlength="2"><br><br> End: <input type="text" id="return" size="10" maxlength="10" disabled><br><br>

1
  • Coloque na pergunta o trecho de código referente à soma de dias e indique qual o problema que está a ter
    – Isac
    Commented 2/08/2017 às 16:23

1 Resposta 1

2

Acredito ser isso o que precisa:

  // Quando houver uma alteração no valor do input days
  jQuery('#days').change(function() {
    // Se o valor do input datepicker estiver vazio, não faz nada
    if(jQuery("#datepicker").val() == "" ) return;
    // Pego a data do input datepicker
    var date = $("#datepicker").datepicker("getDate");
    // Adiciono o valor de dias digitado no input days
    date.setDate(date.getDate() + Number(this.value));
    // Seto a data no input return
    $("#return").datepicker("setDate", date);
  });
  jQuery('#return').datepicker({
    dateFormat: "dd/mm/yy",
  }); 

Veja funcionando:

$(document).ready(function() {
  var dateMin = new Date();
  var weekDays = AddWeekDays(1);
  dateMin.setDate(dateMin.getDate() + weekDays);
  var natDays = [
    [1, 1, 'uk'],
    [4, 21, 'uk'],
    [5, 1, 'uk'],
    [9, 7, 'uk'],
    [9, 20, 'uk'],
    [10, 12, 'uk'],
    [11, 2, 'uk'],
    [15, 11, 'uk'],
    [12, 25, 'uk'],

    [2, 13, 'uk'],
    [3, 30, 'uk'],
    [4, 1, 'uk'],
    [5, 10, 'uk'],
    [5, 31, 'uk']
  ];

  function noWeekendsOrHolidays(date) {
    var noWeekend = $.datepicker.noWeekends(date);
    if (noWeekend[0]) {
      return nationalDays(date);
    } else {
      return noWeekend;
    }

  }

  function nationalDays(date) {
    for (i = 0; i < natDays.length; i++) {
      if (date.getMonth() == natDays[i][0] - 1 && date.getDate() == natDays[i][1]) {
        return [false, natDays[i][2] + '_day'];
      }

    }
    return [true, ''];
  }

  function AddWeekDays(weekDaysToAdd) {
    var mydate = new Date();
    if (mydate.getHours() >= 10) var daysToAdd = 1;
    else var daysToAdd = 0;
    var day = mydate.getDay()
    weekDaysToAdd = weekDaysToAdd - (5 - day)
    if ((5 - day) < weekDaysToAdd || weekDaysToAdd == 1) {
      daysToAdd = (5 - day) + 2 + daysToAdd
    } else { // (5-day) >= weekDaysToAdd
      daysToAdd = (5 - day) + daysToAdd
    }
    while (weekDaysToAdd != 0) {
      var week = weekDaysToAdd - 5
      if (week > 0) {
        daysToAdd = 7 + daysToAdd
        weekDaysToAdd = weekDaysToAdd - 5
      } else { // week < 0
        daysToAdd = (5 + week) + daysToAdd
        weekDaysToAdd = weekDaysToAdd - (5 + week)
      }

    }
    return daysToAdd;
  }

  jQuery('#datepicker').datepicker({
    minDate: dateMin,
    minDate: 30,
    defaultDate: +1,
    firstDay: 0,
    changeFirstDay: true,
    changeMonth: true,
    changeYear: true,
    dateFormat: "dd/mm/yy",
    dayNames: ['Domingo', 'Segunda-feira', 'Terça-feira', 'Quarta-feira', 'Quinta-feira', 'Sexta-feira', 'Sábado', 'Domingo'],
    dayNamesMin: ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'Sáb', 'Dom'],
    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'],
    constrainInput: true,
    beforeShowDay: function(day) {
      if (day.getDay() < 1 || day.getDay() > 4) {
        return [false, ""];
      }
      return noWeekendsOrHolidays(day);
    }
  });
  // Quando houver uma alteração no valor do input days
  jQuery('#days').change(function() {
    // Se o valor do input datepicker estiver vazio, não faz nada
    if(jQuery("#datepicker").val() == "" ) return;
    // Pego a data do input datepicker
    var date = $("#datepicker").datepicker("getDate");
    // Adiciono o valor de dias digitado no input days
    date.setDate(date.getDate() + Number(this.value));
    // Seto a data no input return
    $("#return").datepicker("setDate", date);
  });
  jQuery('#return').datepicker({
    dateFormat: "dd/mm/yy",
  }); 
});
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

Beggining: <input type="text" id="datepicker" size="10" maxlength="10"><br><br> Days: <input type="text" id="days" size="2" maxlength="2"><br><br> End: <input type="text" id="return" size="10" maxlength="10" disabled><br><br>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .