Increase interest v1

hristop · Apr 7, 2023 · be13022 · be13022
1 parent 8a3995b
commit be13022
Show file tree

Hide file tree

Showing 4 changed files with 36 additions and 27 deletions.
diff --git a/index.html b/index.html
@@ -38,20 +38,11 @@
           <div class="table-container">
             <div>
               <ui5-panel
-                fixed
                 accessible-role="Complementary"
-                header-text="Extra Payments" >
+                header-text="Advanced settings"
+                collapsed >
                 <div id="extraPayments"></div>
                 <ui5-button id="addExtraPayment">Add extra payment</ui5-button>
-              </ui5-panel>
-            </div>
-          </div>
-          <div class="table-container">
-            <div>
-              <ui5-panel
-                fixed
-                accessible-role="Complementary"
-                header-text="Interest Rate Changes" >
                 <div id="interestChanges"></div>
                 <ui5-button id="addInterestChange">Add Interest Rate Change</ui5-button>
               </ui5-panel>

diff --git a/src/js/calcLoan.js b/src/js/calcLoan.js
@@ -52,17 +52,20 @@ export function setUpCalc(element) {
                 if(!isNaN(interestRateChange[1])) {
                     // the new interest rate should take effect (converted from %)
                     monthlyInterestRate = interestRateChange[1] / 12 / 100;
-                    // Calculate the new variable monthly payment based on
-                    // - the remaining loan principal
-                    // - the new interest rate
-                    // - the remaining time
-                    // payment = remainingBalance * (monthlyInterestRate * (Math.pow(1 + monthlyInterestRate, numberOfPayments - i + 1))) / ((Math.pow(1 + monthlyInterestRate, numberOfPayments - i + 1)) - 1);
-                    fixedMonthlyPayment = remainingPrincipal * (monthlyInterestRate * (Math.pow(1 + monthlyInterestRate, remainingMonths + 1))) / ((Math.pow(1 + monthlyInterestRate, remainingMonths + 1)) - 1);
-                    //if (newPayment > fixedMonthlyPayment) {
-                    //    fixedMonthlyPayment = newPayment;
-                    //}
-                    //console.log(fixedMonthlyPayment);
-                    // fixedMonthlyPayment = calcfixedMonthlyPayment(remainingPrincipal, monthlyInterestRate, Math.abs(loanData.loanTerm - index));
+                    console.log(interestRateChange[2]);
+                    if (interestRateChange[2]) {
+                        // Calculate the new variable monthly payment based on
+                        // - the remaining loan principal
+                        // - the new interest rate
+                        // - the remaining time
+                        // payment = remainingBalance * (monthlyInterestRate * (Math.pow(1 + monthlyInterestRate, numberOfPayments - i + 1))) / ((Math.pow(1 + monthlyInterestRate, numberOfPayments - i + 1)) - 1);
+                        fixedMonthlyPayment = remainingPrincipal * (monthlyInterestRate * (Math.pow(1 + monthlyInterestRate, remainingMonths + 1))) / ((Math.pow(1 + monthlyInterestRate, remainingMonths + 1)) - 1);
+                        //if (newPayment > fixedMonthlyPayment) {
+                        //    fixedMonthlyPayment = newPayment;
+                        //}
+                        //console.log(fixedMonthlyPayment);
+                        //const fixedMonthlyPayment2 = calcFixedMonthlyPayment(remainingPrincipal, monthlyInterestRate, Math.abs(loanData.loanTerm - index));
+                    }
                 }
             })
 

diff --git a/src/js/interestChanges.js b/src/js/interestChanges.js
@@ -1,14 +1,16 @@
 const gatherInterestChanges = () => {
     const interestChanges = [];
-    const interestChangesRows = document.querySelectorAll("#interestChangesTable ui5-table-row");
+    const interestChangesRows = document.querySelectorAll('#interestChangesTable ui5-table-row');
 
     interestChangesRows.forEach((row) => {
-        const inputs = row.querySelectorAll("ui5-input");
+        const inputs = row.querySelectorAll('ui5-input');
+        const recalculateSwitch = row.querySelector('ui5-switch');
 
         const month = Number.parseFloat(inputs[0].value);
         const newMonthly = Number.parseFloat(inputs[1].value) || 0;
+        const recalculatePayment = recalculateSwitch.getAttribute('checked') === '';
 
-        interestChanges.push([month, newMonthly]);
+        interestChanges.push([month, newMonthly, recalculatePayment]);
     });
 
     return interestChanges;
@@ -28,6 +30,10 @@ function setUpInterestChanges (addInterestChangesButton) {
                     <ui5-label>New Interest</ui5-label>
                 </ui5-table-column>
 
+                <ui5-table-column class="table-header-text-alignment" slot="columns" min-width="400" popin-text="Recalculate payment" demand-popin>
+                    <ui5-label>Recalculate Payment</ui5-label>
+                </ui5-table-column>
+
                 <ui5-table-column class="table-header-text-alignment" slot="columns" min-width="400" popin-text="Delete row" demand-popin>
                     <ui5-label>Delete row</ui5-label>
                 </ui5-table-column>
@@ -64,11 +70,19 @@ function setUpInterestChanges (addInterestChangesButton) {
         });
 
         const cell = document.createElement('ui5-table-cell')
+        const recalculateSwitch = document.createElement('ui5-switch');
+        recalculateSwitch.setAttribute('text-on', 'Yes');
+        recalculateSwitch.setAttribute('text-off', 'No');
+        cell.appendChild(recalculateSwitch);
+        row.appendChild(cell);
+
+
+        const cellDel = document.createElement('ui5-table-cell')
         const button = document.createElement('ui5-button');
         button.setAttribute('icon', 'delete');
         button.addEventListener('click', () => deleteRow(row));
-        cell.appendChild(button);
-        row.appendChild(cell);
+        cellDel.appendChild(button);
+        row.appendChild(cellDel);
 
         table.appendChild(row);
 

diff --git a/src/js/main.js b/src/js/main.js
@@ -23,6 +23,7 @@ import "@ui5/webcomponents/dist/Icon";
 import "@ui5/webcomponents/dist/List";
 import "@ui5/webcomponents/dist/StandardListItem.js";
 import "@ui5/webcomponents/dist/Slider";
+import "@ui5/webcomponents/dist/Switch";
 
 import "@ui5/webcomponents-icons/dist/delete";