How to change months to years as a result of the calculation?

  • 0
    Good day. I am writing a program that performs one simple function - it shows how long it will take to save money in order to accumulate a certain amount. I want to fix one point.

    Now the result of the program is displayed in the following form (for example) - "Time will take: 28 months". And I need the result to look like this - "It will take 2 years 4 months".

    Question: how to make it so that starting from 12 months a year starts to be added to the date?

    <div class="my-wallet-wrap">
      <form action="#" method="post" class="form-wallet">
        <label class="income-wrap">
          <span class="income">Доход в месяц</span>
          <input id="must-write" type="number" step="100" min="1000" name="income" placeholder="Введите сумму" class="income-field" required>
        </label>
        <label class="expense-wrap">
          <span class="expense">Расход в месяц</span>
          <input id="must-write" type="number" step="100" name="expense" placeholder="Введите сумму" class="expense-field" required>
        </label>
        <label class="wishful-amount-wrap">
          <span class="wishful-amount">Желаемая сумма</span>
          <input id="must-write" type="number" step="100" name="amount" placeholder="Введите сумму" class="wishful-amount-field" required>
        </label>
        <div class="buttons-wrap">
        <button type="button" class="calculation-button">Посчитать</button>
        <button type="reset" class="reset-button">Очистить</button>
        </div>
      </form>
      <div class="how-long">
        <h2 class="how-long-title">Уйдёт времени:</h2>
        <p class="how-long-answer"></p>
      </div>
    </div>


    'use strict';
    
    let income = document.querySelector('.income-field');
    let expense = document.querySelector('.expense-field');
    let amount = document.querySelector('.wishful-amount-field');
    let result = document.querySelector('.how-long-answer');
    let buttonCalc = document.querySelector('.calculation-button');
    let buttonReset = document.querySelector('.reset-button');
    let buttonDisabled = document.querySelector('.disabled-button');
    
    let getDisable = function () {
      buttonCalc.disabled = true;
      buttonCalc.classList.add('disabled-button');
    }
    getDisable();
    
    let getEnable = function () {
      buttonCalc.disabled = false;
      buttonCalc.classList.remove('disabled-button');
    }
    
    income.addEventListener('input', function (event) {
        if (Number(income.value) <= Number(expense.value) || Number(amount.value) < (Number(income.value) - Number(expense.value)) || Number(expense.value) >= Number(income.value) || income.value == '' || expense.value == '' || amount.value == '') {
         getDisable();
        }  else {
         getEnable();
        }
      });
    
    expense.addEventListener('input', function (event) {
        if (Number(expense.value) >= Number(income.value) || Number(income.value) <= Number(expense.value) || Number(amount.value) < (Number(income.value) - Number(expense.value)) || expense.value == '' || income.value == '' || amount.value == '') {
         getDisable();
        }  else {
         getEnable();
        }
      });
    
    amount.addEventListener('input', function (event) {
       if (Number(amount.value) < (Number(income.value) - Number(expense.value)) || Number(income.value) <= Number(expense.value) || Number(expense.value) >= Number(income.value) || amount.value == '' || expense.value == '' || income.value == '') {
        getDisable();
       }  else {
        getEnable();
      }
    });
    
    let getResult = function () {
      let balance = income.value - expense.value;
      let resultFirst = amount.value / balance;
      return resultFirst;
    }
    
    buttonCalc.addEventListener('click', function (event) {
      const ending = [' Месяц',' Месяцев', ' Месяца'];
      let sampleNumber = Math.round(getResult()),
      lastDigit = sampleNumber % 10;
        if (lastDigit === 1) {
          result.textContent = Math.round(getResult()) + ending[0];
        } else if (lastDigit === 2 || lastDigit === 3 || lastDigit === 4) {
          result.textContent = Math.round(getResult()) + ending[2];
        } else {
          result.textContent = Math.round(getResult()) + ending[1];
        }
    });
    
    buttonReset.addEventListener('click', function (event) {
      result.textContent = '';
    });
    JavaScript Josephine Hood, Dec 11, 2020

  • 1 Answers
  • 0
    const totalMonths = 28;
    const years = Math.floor(totalMonths / 12);
    const months = totalMonths % 12;

    console.log(`Уйдёт времени: ${years} лет ${months} месяцев`) // Уйдёт времени: 2 лет 4 месяцев
    Anonymous

Your Answer
To place the code, please use CodePen or similar tool. Thanks you!