import { useState } from 'react' import { Button } from "/components/ui/button" import { Card, CardContent, CardHeader, CardTitle } from "/components/ui/card" import { Label } from "/components/ui/label" import { Input } from "/components/ui/input" import { Slider } from "/components/ui/slider" export default function HomeLoanCalculator() { const [loanAmount, setLoanAmount] = useState(5000000) const [interestRate, setInterestRate] = useState(8.5) const [loanTenure, setLoanTenure] = useState(20) const [calculated, setCalculated] = useState(false) const [emi, setEmi] = useState(0) const [totalInterest, setTotalInterest] = useState(0) const [totalPayment, setTotalPayment] = useState(0) const calculateEMI = () => { // EMI calculation formula: [P x R x (1+R)^N]/[(1+R)^N-1] const principal = loanAmount const monthlyRate = interestRate / 12 / 100 const months = loanTenure * 12 const emiValue = principal * monthlyRate * Math.pow(1 + monthlyRate, months) / (Math.pow(1 + monthlyRate, months) - 1) const totalPaymentValue = emiValue * months const totalInterestValue = totalPaymentValue - principal setEmi(emiValue) setTotalInterest(totalInterestValue) setTotalPayment(totalPaymentValue) setCalculated(true) } const resetCalculator = () => { setLoanAmount(5000000) setInterestRate(8.5) setLoanTenure(20) setCalculated(false) setEmi(0) setTotalInterest(0) setTotalPayment(0) } const getPieChartStyle = () => { if (!calculated) return {} const principalPercentage = (loanAmount / totalPayment) * 100 const interestPercentage = (totalInterest / totalPayment) * 100 return { background: `conic-gradient( #4f46e5 0% ${principalPercentage}%, #10b981 ${principalPercentage}% 100% )` } } const formatCurrency = (amount: number) => { return new Intl.NumberFormat('en-IN', { style: 'currency', currency: 'INR', maximumFractionDigits: 0 }).format(amount) } return (

Home Loan EMI Calculator

Loan Amount (₹) setLoanAmount(Number(e.target.value))} /> setLoanAmount(value)} />

₹1L ₹20L ₹50L ₹1Cr ₹2Cr

Interest Rate (%) setInterestRate(Number(e.target.value))} /> setInterestRate(value)} />

6% 9% 12% 15% 20%

Loan Tenure (Years) setLoanTenure(Number(e.target.value))} /> setLoanTenure(value)} />

5 10 15 20 30

{calculated && (

Monthly EMI

{formatCurrency(emi)}

Total Interest

{formatCurrency(totalInterest)}

Total Payment

{formatCurrency(totalPayment)}

Payment Breakdown

Principal: {formatCurrency(loanAmount)}

Interest: {formatCurrency(totalInterest)}

Loan Details:

Loan Amount

{formatCurrency(loanAmount)}

Interest Rate

{interestRate}% p.a.

Loan Tenure

{loanTenure} years ({loanTenure * 12} months)

Total EMI Payments

{loanTenure * 12}

)}

) }