This commit is contained in:
omkieit 2024-10-13 18:08:36 +05:30
parent e365da1c7a
commit ec25e4d637
4 changed files with 690 additions and 825 deletions

File diff suppressed because one or more lines are too long

View File

@ -45,7 +45,7 @@
<script type="module" crossorigin src="/assets/index-BiIJaVB0.js"></script> <script type="module" crossorigin src="/assets/index-CKYSXRdS.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-iEl-il0E.css"> <link rel="stylesheet" crossorigin href="/assets/index-iEl-il0E.css">
</head> </head>

View File

@ -206,32 +206,31 @@ const Addproperty = () => {
}; };
const handlePriceChange = (e, index) => { const handlePriceChange = (e, index) => {
let value = e.target.value; let value = e.target.value;
// Remove the dollar sign before validating // Remove the dollar sign before validating
value = value.replace(/^\$/, '').trim(); // Remove '$' if it exists value = value.replace(/^\$/, "").trim(); // Remove '$' if it exists
// Use a regular expression to allow only numbers and decimals // Use a regular expression to allow only numbers and decimals
const isNumber = /^\d*\.?\d*$/.test(value); const isNumber = /^\d*\.?\d*$/.test(value);
// If valid number, update state, otherwise show the alert
if (isNumber || value === "") {
const updatedCosts = formData.costPaidAtoB.map((cost, i) =>
i === index
? { ...cost, price: value, isInvalid: false } // Reset isInvalid if valid number
: cost
);
setFormData({ ...formData, costPaidAtoB: updatedCosts });
} else {
const updatedCosts = formData.costPaidAtoB.map((cost, i) =>
i === index
? { ...cost, isInvalid: true } // Keep isInvalid true for invalid input
: cost
);
setFormData({ ...formData, costPaidAtoB: updatedCosts });
}
};
// If valid number, update state, otherwise show the alert
if (isNumber || value === "") {
const updatedCosts = formData.costPaidAtoB.map((cost, i) =>
i === index
? { ...cost, price: value, isInvalid: false } // Reset isInvalid if valid number
: cost
);
setFormData({ ...formData, costPaidAtoB: updatedCosts });
} else {
const updatedCosts = formData.costPaidAtoB.map((cost, i) =>
i === index
? { ...cost, isInvalid: true } // Keep isInvalid true for invalid input
: cost
);
setFormData({ ...formData, costPaidAtoB: updatedCosts });
}
};
const calculateTotalPurchaseCosts = () => { const calculateTotalPurchaseCosts = () => {
const totalCostsFromArray = formData.costPaidAtoB.reduce((total, cost) => { const totalCostsFromArray = formData.costPaidAtoB.reduce((total, cost) => {
@ -272,8 +271,6 @@ const Addproperty = () => {
const handleCreditPriceChange = (e, index) => { const handleCreditPriceChange = (e, index) => {
const value = e.target.value; const value = e.target.value;
// Regular expression to allow only numbers and optional decimals // Regular expression to allow only numbers and optional decimals
const isNumber = /^\d*\.?\d*$/.test(value); const isNumber = /^\d*\.?\d*$/.test(value);
@ -845,10 +842,10 @@ const Addproperty = () => {
return NetProfitBeforeFinancingCosts - FinancingCostClosingCost; return NetProfitBeforeFinancingCosts - FinancingCostClosingCost;
}; };
const calculaterateofreturn =() => { const calculaterateofreturn = () => {
const rateofreturn = calculateNetProfit(); const rateofreturn = calculateNetProfit();
return rateofreturn; return rateofreturn;
} };
const handleSubmit = () => { const handleSubmit = () => {
if ( if (
@ -945,7 +942,7 @@ const Addproperty = () => {
netBtoCsalevalue: netBtoCsalevalue, netBtoCsalevalue: netBtoCsalevalue,
netprofitbeforefinancingcosts: netprofitbeforefinancingcosts, netprofitbeforefinancingcosts: netprofitbeforefinancingcosts,
NetProfit: NetProfit, NetProfit: NetProfit,
rateofreturn:rateofreturn rateofreturn: rateofreturn,
}; };
// Check if propertyTaxInfo is an array and has values // Check if propertyTaxInfo is an array and has values
@ -1939,25 +1936,37 @@ const Addproperty = () => {
</div> </div>
<div> <div>
<p><span style={{ <p>
color: "#fda417", <span
fontSize: "14px", style={{
fontWeight: "bold", color: "#fda417",
}}>[M-D-Y] </span>: <span style={{ fontSize: "14px",
color: "#000000", fontWeight: "bold",
fontSize: "14px", }}
fontWeight: "normal", >
}}>{new Date(formData.closeDateAtoB).toLocaleDateString('en-US', { [M-D-Y]{" "}
month: 'numeric', </span>
day: 'numeric', :{" "}
year: 'numeric' <span
})}</span></p> style={{
</div> color: "#000000",
fontSize: "14px",
fontWeight: "normal",
}}
>
{new Date(formData.closeDateAtoB).toLocaleDateString(
"en-US",
{
month: "numeric",
day: "numeric",
year: "numeric",
}
)}
</span>
</p>
</div>
</div> </div>
<div className="row gy-3"> <div className="row gy-3">
{/* Close Date B to C */} {/* Close Date B to C */}
<div className="col-md-4"> <div className="col-md-4">
@ -1991,23 +2000,34 @@ const Addproperty = () => {
</div> </div>
<div> <div>
<p><span style={{ <p>
color: "#fda417", <span
fontSize: "14px", style={{
fontWeight: "bold", color: "#fda417",
}}>[M-D-Y] : </span> fontSize: "14px",
<span style={{ fontWeight: "bold",
color: "#000000", }}
fontSize: "14px", >
fontWeight: "normal", [M-D-Y] :{" "}
}}>{new Date(formData.closeDateBtoC).toLocaleDateString('en-US', { </span>
month: 'numeric', <span
day: 'numeric', style={{
year: 'numeric' color: "#000000",
})}</span> fontSize: "14px",
fontWeight: "normal",
}}
>
{new Date(formData.closeDateBtoC).toLocaleDateString(
"en-US",
{
month: "numeric",
day: "numeric",
year: "numeric",
}
)}
</span>
</p> </p>
</div> </div>
</div> </div>
<div className="row gy-3 align-items-center"> <div className="row gy-3 align-items-center">
@ -2069,7 +2089,7 @@ const Addproperty = () => {
className="form-control" className="form-control"
name="rateofreturn" name="rateofreturn"
// value={calculaterateofreturn()} // value={calculaterateofreturn()}
value={`$ ${calculaterateofreturn().toFixed(2)}`} value={`$ ${calculaterateofreturn().toFixed(2)}`}
readOnly readOnly
style={{ style={{
borderColor: "#fda417", // Custom border color for the input field borderColor: "#fda417", // Custom border color for the input field
@ -2081,10 +2101,7 @@ const Addproperty = () => {
</div> </div>
</div> </div>
<br /> <br />
<div className="row gy-3 align-items-center"> <div className="row gy-3 align-items-center">
<span <span
@ -2114,8 +2131,6 @@ const Addproperty = () => {
</div> </div>
<br /> <br />
<hr <hr
style={{ style={{
borderColor: "#fda417", // Set the color of the line borderColor: "#fda417", // Set the color of the line
@ -2125,56 +2140,56 @@ const Addproperty = () => {
}} }}
/> />
<div className="row gy-3 align-items-center"> <div className="row gy-3 align-items-center">
<span <span
className="col-md-4" className="col-md-4"
style={{ style={{
color: "#fda417", color: "#fda417",
fontSize: "14px", fontSize: "14px",
fontWeight: "bold", fontWeight: "bold",
}} }}
> >
Purchase Price Purchase Price
</span> </span>
<div className="col-md-4"> <div className="col-md-4">
<input <input
type="text" type="text"
className={`form-control ${formData.isPurchaseCostInvalid ? "is-invalid" : ""}`} className={`form-control ${
value={`$ ${formData.purchaseCost}`} // Display the dollar sign in the input formData.isPurchaseCostInvalid ? "is-invalid" : ""
name="purchaseCost" }`}
onChange={(e) => { value={`$ ${formData.purchaseCost}`} // Display the dollar sign in the input
let value = e.target.value.replace(/[^\d.]/g, ''); // Remove anything thats not a digit or decimal point name="purchaseCost"
const isValid = /^\d*\.?\d*$/.test(value); // Regex to allow only numbers and decimal points onChange={(e) => {
setFormData({ let value = e.target.value.replace(/[^\d.]/g, ""); // Remove anything thats not a digit or decimal point
...formData, const isValid = /^\d*\.?\d*$/.test(value); // Regex to allow only numbers and decimal points
purchaseCost: value, setFormData({
isPurchaseCostInvalid: !isValid, // Set isPurchaseCostInvalid to true if the value is not a valid number ...formData,
}); purchaseCost: value,
}} isPurchaseCostInvalid: !isValid, // Set isPurchaseCostInvalid to true if the value is not a valid number
onKeyPress={(e) => { });
const charCode = e.charCode; }}
// Allow only numbers and decimal points onKeyPress={(e) => {
if ((charCode < 48 || charCode > 57) && charCode !== 46) { const charCode = e.charCode;
e.preventDefault(); // Prevent non-numeric input // Allow only numbers and decimal points
setFormData({ if ((charCode < 48 || charCode > 57) && charCode !== 46) {
...formData, e.preventDefault(); // Prevent non-numeric input
isPurchaseCostInvalid: true, // Set isPurchaseCostInvalid to true to show the alert setFormData({
}); ...formData,
} isPurchaseCostInvalid: true, // Set isPurchaseCostInvalid to true to show the alert
}} });
placeholder="Enter Purchase Cost" }
style={{ textAlign: "right" }} }}
required placeholder="Enter Purchase Cost"
/> style={{ textAlign: "right" }}
{formData.isPurchaseCostInvalid && ( required
<div className="invalid-feedback"> />
Please enter a valid number. {formData.isPurchaseCostInvalid && (
</div> <div className="invalid-feedback">
)} Please enter a valid number.
</div> </div>
</div> )}
</div>
</div>
<hr <hr
style={{ style={{
@ -2196,47 +2211,48 @@ const Addproperty = () => {
</span> </span>
{formData.costPaidAtoB.map((cost, index) => ( {formData.costPaidAtoB.map((cost, index) => (
<div key={index} className="row gy-3 align-items-center"> <div key={index} className="row gy-3 align-items-center">
<div className="col-md-4"> <div className="col-md-4">
<input <input
type="text" type="text"
className="form-control" className="form-control"
value={cost.title} value={cost.title}
onChange={(e) => onChange={(e) =>
handleCostChange(index, "title", e.target.value) handleCostChange(index, "title", e.target.value)
} }
placeholder="Title" placeholder="Title"
required required
/> />
</div> </div>
<div className="col-md-4"> <div className="col-md-4">
<input <input
type="text" type="text"
className={`form-control ${cost.isInvalid ? "is-invalid" : ""}`} className={`form-control ${
value={`$ ${cost.price}`} cost.isInvalid ? "is-invalid" : ""
onChange={(e) => handlePriceChange(e, index)} }`}
placeholder="Price" value={`$ ${cost.price}`}
style={{ textAlign: "right" }} onChange={(e) => handlePriceChange(e, index)}
required placeholder="Price"
/> style={{ textAlign: "right" }}
{cost.isInvalid && ( required
<div className="invalid-feedback"> />
Please enter a valid number. {cost.isInvalid && (
</div> <div className="invalid-feedback">
)} Please enter a valid number.
</div> </div>
<div className="col-md-2 d-flex justify-content-start"> )}
<button </div>
className="btn btn-danger" <div className="col-md-2 d-flex justify-content-start">
onClick={() => deleteCost(index)} <button
style={{ marginLeft: "5px" }} className="btn btn-danger"
> onClick={() => deleteCost(index)}
x style={{ marginLeft: "5px" }}
</button> >
</div> x
</div> </button>
))} </div>
</div>
))}
<div className="col-md-4"> <div className="col-md-4">
<button <button
@ -2268,21 +2284,20 @@ const Addproperty = () => {
Total Purchase Cost Total Purchase Cost
</span> </span>
<div className="col-md-4"> <div className="col-md-4">
<input <input
type="text" type="text"
className="form-control" className="form-control"
name="totalPurchaseCosts" name="totalPurchaseCosts"
value={`$ ${calculateTotalPurchaseCosts().toFixed(2)}`} // Add dollar sign before the calculated total and format it to 2 decimal places value={`$ ${calculateTotalPurchaseCosts().toFixed(2)}`} // Add dollar sign before the calculated total and format it to 2 decimal places
readOnly readOnly
style={{ style={{
borderColor: "#fda417", // Custom border color for the input field borderColor: "#fda417", // Custom border color for the input field
color: "#fda417", // Optionally apply text color to the input text color: "#fda417", // Optionally apply text color to the input text
textAlign: "right", textAlign: "right",
}} }}
required required
/> />
</div> </div>
</div> </div>
<hr <hr
style={{ style={{
@ -2320,8 +2335,9 @@ const Addproperty = () => {
<div className="col-md-4"> <div className="col-md-4">
<input <input
type="text" type="text"
className={`form-control ${credits.isInvalid ? "is-invalid" : "" className={`form-control ${
}`} // Apply 'is-invalid' class when invalid credits.isInvalid ? "is-invalid" : ""
}`} // Apply 'is-invalid' class when invalid
value={credits.price} value={credits.price}
onChange={(e) => handleCreditPriceChange(e, index)} // New handler for price validation onChange={(e) => handleCreditPriceChange(e, index)} // New handler for price validation
placeholder="Price" placeholder="Price"
@ -2468,8 +2484,9 @@ const Addproperty = () => {
<div className="col-md-4"> <div className="col-md-4">
<input <input
type="text" type="text"
className={`form-control ${cost.isInvalid ? "is-invalid" : "" className={`form-control ${
}`} // Apply 'is-invalid' class when invalid cost.isInvalid ? "is-invalid" : ""
}`} // Apply 'is-invalid' class when invalid
value={cost.price} value={cost.price}
onChange={(e) => onChange={(e) =>
handlecashAdjustmentsCostChange(e, index) handlecashAdjustmentsCostChange(e, index)
@ -2621,8 +2638,9 @@ const Addproperty = () => {
<div className="col-md-4"> <div className="col-md-4">
<input <input
type="text" type="text"
className={`form-control ${cost.isInvalid ? "is-invalid" : "" className={`form-control ${
}`} // Apply 'is-invalid' class when invalid cost.isInvalid ? "is-invalid" : ""
}`} // Apply 'is-invalid' class when invalid
value={cost.price} value={cost.price}
onChange={(e) => handleincidentalCostChange(e, index)} // Use a new handler for price validation onChange={(e) => handleincidentalCostChange(e, index)} // Use a new handler for price validation
placeholder="Price" placeholder="Price"
@ -2730,8 +2748,9 @@ const Addproperty = () => {
<div className="col-md-4"> <div className="col-md-4">
<input <input
type="text" type="text"
className={`form-control ${cost.isInvalid ? "is-invalid" : "" className={`form-control ${
}`} // Apply 'is-invalid' class when invalid cost.isInvalid ? "is-invalid" : ""
}`} // Apply 'is-invalid' class when invalid
value={cost.price} value={cost.price}
onChange={(e) => handlecarryCostsChange(e, index)} // Use a new handler for price validation onChange={(e) => handlecarryCostsChange(e, index)} // Use a new handler for price validation
placeholder="Price" placeholder="Price"
@ -2847,8 +2866,9 @@ const Addproperty = () => {
<div className="col-md-4"> <div className="col-md-4">
<input <input
type="text" type="text"
className={`form-control ${cost.isInvalid ? "is-invalid" : "" className={`form-control ${
}`} // Apply 'is-invalid' class when invalid cost.isInvalid ? "is-invalid" : ""
}`} // Apply 'is-invalid' class when invalid
value={cost.price} value={cost.price}
onChange={(e) => handlerenovationCostChange(e, index)} // Use a new handler for price validation onChange={(e) => handlerenovationCostChange(e, index)} // Use a new handler for price validation
placeholder="Price" placeholder="Price"
@ -3024,8 +3044,9 @@ const Addproperty = () => {
<div className="col-md-4"> <div className="col-md-4">
<input <input
type="text" type="text"
className={`form-control ${formData.isPurchaseCostInvalid ? "is-invalid" : "" className={`form-control ${
}`} formData.isPurchaseCostInvalid ? "is-invalid" : ""
}`}
name="sellingPriceBtoC" name="sellingPriceBtoC"
value={formData.sellingPriceBtoC} value={formData.sellingPriceBtoC}
onChange={(e) => { onChange={(e) => {
@ -3100,8 +3121,9 @@ const Addproperty = () => {
<div className="col-md-4"> <div className="col-md-4">
<input <input
type="text" type="text"
className={`form-control ${cost.isInvalid ? "is-invalid" : "" className={`form-control ${
}`} // Apply 'is-invalid' class when invalid cost.isInvalid ? "is-invalid" : ""
}`} // Apply 'is-invalid' class when invalid
value={cost.price} value={cost.price}
onChange={(e) => onChange={(e) =>
handlecostPaidOutofClosingChange(e, index) handlecostPaidOutofClosingChange(e, index)
@ -3287,8 +3309,9 @@ const Addproperty = () => {
<div className="col-md-4"> <div className="col-md-4">
<input <input
type="text" type="text"
className={`form-control ${cost.isInvalid ? "is-invalid" : "" className={`form-control ${
}`} // Apply 'is-invalid' class when invalid cost.isInvalid ? "is-invalid" : ""
}`} // Apply 'is-invalid' class when invalid
value={cost.price} value={cost.price}
onChange={(e) => handleadjustmentsChange(e, index)} // Use a new handler for price validation onChange={(e) => handleadjustmentsChange(e, index)} // Use a new handler for price validation
placeholder="Price" placeholder="Price"
@ -3438,8 +3461,9 @@ const Addproperty = () => {
<div className="col-md-4"> <div className="col-md-4">
<input <input
type="text" type="text"
className={`form-control ${cost.isInvalid ? "is-invalid" : "" className={`form-control ${
}`} // Apply 'is-invalid' class when invalid cost.isInvalid ? "is-invalid" : ""
}`} // Apply 'is-invalid' class when invalid
value={cost.price} value={cost.price}
onChange={(e) => handleincomestatementChange(e, index)} // Use a new handler for price validation onChange={(e) => handleincomestatementChange(e, index)} // Use a new handler for price validation
placeholder="Price" placeholder="Price"
@ -3605,8 +3629,9 @@ const Addproperty = () => {
<div className="col-md-4"> <div className="col-md-4">
<input <input
type="text" type="text"
className={`form-control ${formData.isfundspriortoclosingInvalid ? "is-invalid" : "" className={`form-control ${
}`} formData.isfundspriortoclosingInvalid ? "is-invalid" : ""
}`}
value={formData.fundspriortoclosing} value={formData.fundspriortoclosing}
name="fundspriortoclosing" name="fundspriortoclosing"
onChange={(e) => { onChange={(e) => {
@ -3680,8 +3705,9 @@ const Addproperty = () => {
<div className="col-md-4"> <div className="col-md-4">
<input <input
type="text" type="text"
className={`form-control ${formData.isPurchaseCostInvalid ? "is-invalid" : "" className={`form-control ${
}`} formData.isPurchaseCostInvalid ? "is-invalid" : ""
}`}
value={formData.shorttermrental} value={formData.shorttermrental}
name="shorttermrental" name="shorttermrental"
onChange={(e) => { onChange={(e) => {
@ -3730,8 +3756,9 @@ const Addproperty = () => {
<div className="col-md-4"> <div className="col-md-4">
<input <input
type="text" type="text"
className={`form-control ${formData.isPurchaseCostInvalid ? "is-invalid" : "" className={`form-control ${
}`} formData.isPurchaseCostInvalid ? "is-invalid" : ""
}`}
value={formData.OtherIncome} value={formData.OtherIncome}
name="OtherIncome" name="OtherIncome"
onChange={(e) => { onChange={(e) => {
@ -3780,8 +3807,9 @@ const Addproperty = () => {
<div className="col-md-4"> <div className="col-md-4">
<input <input
type="text" type="text"
className={`form-control ${formData.isPurchaseCostInvalid ? "is-invalid" : "" className={`form-control ${
}`} formData.isPurchaseCostInvalid ? "is-invalid" : ""
}`}
value={formData.InsuranceClaim} value={formData.InsuranceClaim}
name="InsuranceClaim" name="InsuranceClaim"
onChange={(e) => { onChange={(e) => {
@ -3830,8 +3858,9 @@ const Addproperty = () => {
<div className="col-md-4"> <div className="col-md-4">
<input <input
type="text" type="text"
className={`form-control ${formData.isPurchaseCostInvalid ? "is-invalid" : "" className={`form-control ${
}`} formData.isPurchaseCostInvalid ? "is-invalid" : ""
}`}
value={formData.LongTermRental} value={formData.LongTermRental}
name="LongTermRental" name="LongTermRental"
onChange={(e) => { onChange={(e) => {
@ -3911,10 +3940,11 @@ const Addproperty = () => {
<div className="col-md-4"> <div className="col-md-4">
<input <input
type="text" type="text"
className={`form-control ${formData.isFinancingCostClosingCostInvalid className={`form-control ${
formData.isFinancingCostClosingCostInvalid
? "is-invalid" ? "is-invalid"
: "" : ""
}`} }`}
value={formData.FinancingCostClosingCost} value={formData.FinancingCostClosingCost}
name="FinancingCostClosingCost" name="FinancingCostClosingCost"
onChange={(e) => { onChange={(e) => {

File diff suppressed because it is too large Load Diff