From e2cf14d10ac430124b8f4541040e5548614ecc76 Mon Sep 17 00:00:00 2001
From: Immanuel Onyeka <immanuel@onyeka.ca>
Date: Mon, 7 Nov 2022 18:06:27 -0500
Subject: [PATCH] Add MI and HOA fields
---
components/mi.vue | 5 ++
components/new.vue | 119 +++++++++++++++++++++++++--------------------
2 files changed, 72 insertions(+), 52 deletions(-)
create mode 100644 components/mi.vue
diff --git a/components/mi.vue b/components/mi.vue
new file mode 100644
index 0000000..17a6529
--- /dev/null
+++ b/components/mi.vue
@@ -0,0 +1,5 @@
+<template>
+</template>
+
+<script>
+</script>
diff --git a/components/new.vue b/components/new.vue
index f334c38..1a1a8e6 100644
--- a/components/new.vue
+++ b/components/new.vue
@@ -41,10 +41,10 @@ class="bi bi-plus" viewBox="0 0 16 16"> <path d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0
<h3>Borrower</h3>
<label>Number of Borrowers</label>
<input :value="estimate.borrowers"
-@input="(e) => estimate.borrowers = strip(e)">
+@input="(e) => estimate.borrowers = stripInt(e)">
<label>Credit Score</label>
<input :value="estimate.creditScore"
-@input="(e) => estimate.creditScore = strip(e)">
+@input="(e) => estimate.creditScore = stripInt(e)">
<label>Monthly Income ($)</label>
<input :value="estimate.mIncome"
@input="(e) => estimate.mIncome = strip(e)">
@@ -53,11 +53,11 @@ class="bi bi-plus" viewBox="0 0 16 16"> <path d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0
<section class="radios form">
<h3>Transaction Type</h3>
-<input type="radio" name="transaction_type" value="transaction"
+<input type="radio" name="transaction_type" value="estimate.transaction"
@input="e => estimate.transaction = 0"
selected="estimate.transaction == 0">
<label>Purchase</label>
-<input type="radio" name="transaction_type" value="refinance"
+<input type="radio" name="transaction_type" value="estimate.refinance"
@input="e => estimate.transaction = 1"
selected="estimate.transaction == 1">
<label>Refinance</label>
@@ -109,46 +109,42 @@ selected="estimate.transaction == 1">
<input :value="loans[sel].housingDti" @input="setHousingDti">
<label>Total DTI (%) - Optional</label>
<input :value="loans[sel].dti" @input="setDti">
+<label>Home Owner's Association ($/month)</label>
+<input :value="loans[sel].hoa"
+@input="(e) => { loans[sel].hoa = strip(e) }">
+
<label>Interest Rate (%)</label>
-<input :value="loans[sel].interest" @input="setInterest">
+<input :value="loans[sel].interest"
+@input="(e) => { loans[sel].interest = stripPerc(e) }">
<label>Days of Interest</label>
-<input :value="loans[sel].interestDays" @input="setInterestDays">
-
-<label>Hazard Insurance Escrowed?</label>
-<input type="checkbox" :value="loans[sel].hazardEscrowed" @input="">
-<label>Months to Escrow Hazard Insurance</label>
-<input :value="loans[sel].hazardMonths" @input="">
-<label>Hazard Insurance ($/monthly)</label>
-<input :value="loans[sel].hazard" @input="setHazard">
-
-<label>Taxes Escrowed?</label>
-<input type="checkbox" :value="loans[sel].taxEscrowed" @input="">
-<label>Months to Escrow Real Estate Tax</label>
-<input :value="loans[sel].taxEscrow" @input="">
-<label>Real Estate Tax ($/monthly)</label>
-<input :value="loans[sel].tax" @input="setTax">
+<input :value="loans[sel].interestDays"
+@input="(e) => {loans[sel].interestDays = stripInt(e)}">
+
+<label>Hazard Insurance Escrow (months)</label>
+<input :value="loans[sel].hazardEscrow"
+@input="(e) => {loans[sel].hazardEscrow = stripInt(e)}">
+<label>Hazard Insurance ($/month)</label>
+<input :value="loans[sel].hazard"
+@input="(e) => {loans[sel].hazard = strip(e)}">
+
+<label>Real Estate Tax Escrow (months)</label>
+<input :value="loans[sel].taxEscrow"
+@input="e => {loans[sel].taxEscrow = stripInt(e)}">
+<label>Real Estate Tax ($/month)</label>
+<input :value="loans[sel].tax"
+@input="(e) => {loans[sel].tax = strip(e)}">
</section>
-<section class="form inputs">
-<h3>Interest Rates</h3>
-<label>Loan Term (years)</label>
-<input :value="loans[sel].term"
-@input="(e) => loans[sel].term = strip(e)">
-
-<label>Loan Program</label>
-<select id="" name="" v-model="loans[sel].program">
- <option value="none">None</option>
-</select>
-
-<label>Loan to Value (%)</label>
-<input :value="loans[sel].ltv" @input="setLtv">
-<label>Loan Amount ($)</label>
-<input :value="loans[sel].amount"
-@input="setAmount">
-<label>Housing Expense DTI (%) - Optional</label>
-<input :value="loans[sel].housingDti" @input="setHousingDti">
-<label>Total DTI (%) - Optional</label>
-<input :value="loans[sel].dti" @input="setDti">
+<section class="form radios">
+<h3>Mortgage Insurance</h3>
+<input type="radio" name="transaction_type" value="transaction"
+@input="e => estimate.transaction = 0"
+selected="estimate.transaction == 0">
+<label>National MI</label>
+<input type="radio" name="transaction_type" value="refinance"
+@input="e => estimate.transaction = 1"
+selected="estimate.transaction == 1">
+<label>MGIC</label>
</section>
</div>
@@ -166,11 +162,10 @@ const example = {
interest: 0,
interestDays: 0,
hazard: 0, // Hazard insurance monthly payment
- hazardMonths: 0, // Hazard insurance months
- hazardEscrowed: true, // If hazard insurance is escrowed
+ hazardEscrow: 0, // Hazard insurance escrow in months (0 is none)
tax: 0, // Real Estate taxes monthly payment
- taxEscrow: 0, // Months to escrow
- taxEscrowed: true, // If tax is escrowed
+ taxEscrow: 0, // Months to escrow (0 is none)
+ hoa: 0, // Home owner's association monthly fee
program: "",
pud: true, // Property under development
zip: ''
@@ -196,13 +191,36 @@ function create() {
this.estimate.loans.push(Object.assign({}, loans[0]))
}
-// Strips non-digits from an input box event and returns it's rounded integer
+// Strips non-digits from an input box event and returns it's rounded integer.
+// It also preserves current valid entry (.)
function strip(e) {
+ let valid = e.target.value.match(/\d+\.?\d?\d?/)?.[0] ?? ""
+ e.target.value = valid
+ return Number(valid || 0)
+}
+
+function stripInt(e) {
let value = parseInt(e.target.value.replace(/\D/g, '') || 0)
e.target.value = value
return value
}
+function stripPerc(e) {
+ let num = strip(e)
+
+ if (num > 100) {
+ num = 100
+ e.target.value = num
+ }
+
+ if (num < 0) {
+ num = 0
+ e.target.value = num
+ }
+
+ return num
+}
+
function stripLetters(e) {
let value = (e.target.value.replace(/[^\w\s]/g, '').slice(0, 20) || '')
e.target.value = value
@@ -227,8 +245,7 @@ function setLtv(e) {
if (ltv < 0) ltv = 0
loan.ltv = ltv
- e.target.value = ltv
- loan.amount = Math.round(ltv / 100 * this.estimate.price)
+ loan.amount = (ltv / 100 * this.estimate.price).toFixed(2)
}
// Changes loan.amount's <input> and data() values, then syncs with data.ltv
@@ -241,15 +258,13 @@ function setAmount(e) {
if (amount < 0) amount = 0
loan.amount = amount
- e.target.value = amount
- loan.ltv = Math.round(amount / this.estimate.price * 100)
+ loan.ltv = (amount / this.estimate.price * 100).toFixed(2)
}
// Updates the property price for all loans
function setPrice(e) {
let value = strip(e)
this.estimate.price = value
- e.target.value = value
}
function setDti(e) {
@@ -278,8 +293,8 @@ function setHousingDti(e) {
export default {
methods: {
- setPrice, setLtv, setAmount, setDti, setHousingDti,
- strip, stripLetters, del, create
+ setPrice, setLtv, setAmount, setDti, setHousingDti, strip, stripInt,
+ stripLetters, stripPerc, del, create
},
props: ['user'],
data() {