done
This commit is contained in:
parent
cd02a6405b
commit
51b0ef91a6
|
@ -23,6 +23,7 @@ const propertySchema = mongoose.Schema({
|
|||
parcel: { type: String, required: true },
|
||||
subdivision: { type: String, required: true },
|
||||
legal: { type: String, required: true },
|
||||
costpersqft: { type: String, required: true },
|
||||
propertyType: { type: String, required: true },
|
||||
lotacres: { type: String, required: true },
|
||||
yearBuild: { type: String, required: true },
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -45,7 +45,7 @@
|
|||
|
||||
|
||||
|
||||
<script type="module" crossorigin src="/assets/index-Bapz8xqd.js"></script>
|
||||
<script type="module" crossorigin src="/assets/index-Rr-EF2Cj.js"></script>
|
||||
<link rel="stylesheet" crossorigin href="/assets/index-DepkKhoc.css">
|
||||
</head>
|
||||
|
||||
|
|
|
@ -31,6 +31,7 @@ const Addproperty = () => {
|
|||
parcel: "",
|
||||
subdivision: "",
|
||||
legal: "",
|
||||
costpersqft: "",
|
||||
propertyType: "",
|
||||
lotacres: "",
|
||||
yearBuild: "",
|
||||
|
@ -120,6 +121,7 @@ const Addproperty = () => {
|
|||
formData.parcel &&
|
||||
formData.subdivision &&
|
||||
formData.legal &&
|
||||
formData.costpersqft &&
|
||||
formData.propertyType &&
|
||||
formData.lotacres &&
|
||||
formData.yearBuild &&
|
||||
|
@ -443,6 +445,21 @@ const Addproperty = () => {
|
|||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-md-4">
|
||||
<div className="form-floating mb-3">
|
||||
Cost per SQFT
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
name="costpersqft"
|
||||
value={formData.costpersqft}
|
||||
onChange={handleInputChange}
|
||||
placeholder="Cost per SQFT"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="row gy-3">
|
||||
|
|
|
@ -1,7 +1,10 @@
|
|||
import { useEffect } from "react";
|
||||
import { useEffect, useState } from "react";
|
||||
import { useDispatch, useSelector } from "react-redux";
|
||||
import { useParams } from "react-router-dom";
|
||||
import { fetchPropertyById } from "../redux/features/propertySlice";
|
||||
import propertydummy from "../img/propertydummy.jpg";
|
||||
import Navbar from "./Navbar";
|
||||
import Footer from "./Footer";
|
||||
|
||||
|
||||
|
||||
|
@ -9,11 +12,13 @@ const PropertyView = () => {
|
|||
const { id } = useParams(); // Extract the property ID from the route
|
||||
const dispatch = useDispatch();
|
||||
const { selectedProperty, status, error } = useSelector((state) => state.property);
|
||||
const [loading, setLoading] = useState(true); // Loader state
|
||||
|
||||
useEffect(() => {
|
||||
// Fetch the property by ID when the component loads
|
||||
if (id) {
|
||||
dispatch(fetchPropertyById(id));
|
||||
setLoading(false);
|
||||
}
|
||||
}, [id, dispatch]);
|
||||
|
||||
|
@ -30,18 +35,137 @@ const PropertyView = () => {
|
|||
return (
|
||||
<>
|
||||
|
||||
<div className="container property-view">
|
||||
{selectedProperty ? (
|
||||
<div className="property-details">
|
||||
<h1>{selectedProperty.title}</h1>
|
||||
<Navbar />
|
||||
<br /> <br /> <br /> <br />
|
||||
|
||||
<div className="container col-12">
|
||||
{loading ? (
|
||||
<div className="loader">Loading...</div> // Loader
|
||||
) : selectedProperty ? (
|
||||
<div className="py-3 py-md-5 bg-light">
|
||||
{/* <div className="container"> */}
|
||||
<div className="card-header bg-white">
|
||||
<div className="row">
|
||||
<div className="col-md-5 mt-3">
|
||||
<div className="bg-white border">
|
||||
<img
|
||||
src={propertydummy}
|
||||
className="w-70"
|
||||
alt="Img"
|
||||
style={{
|
||||
marginTop: "0px",
|
||||
maxWidth: "450px",
|
||||
maxHeight: "450px",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-7 mt-3">
|
||||
<div className="product-view">
|
||||
<h4
|
||||
className="product-name"
|
||||
style={{ color: "#fda417", fontSize: "25px" }}
|
||||
>
|
||||
{selectedProperty.address}
|
||||
<label className="label-stock bg-success">
|
||||
Verified Property
|
||||
</label>
|
||||
</h4>
|
||||
<hr />
|
||||
<p className="product-path">
|
||||
<span style={{ color: "#fda417", fontSize: "15px" }}>
|
||||
city:{" "}
|
||||
</span>{" "}
|
||||
{selectedProperty.city} /
|
||||
<span style={{ color: "#fda417", fontSize: "15px" }}>
|
||||
County:{" "}
|
||||
</span>{" "}
|
||||
{selectedProperty.county} /
|
||||
<span style={{ color: "#fda417", fontSize: "15px" }}>
|
||||
State:{" "}
|
||||
</span>{" "}
|
||||
{selectedProperty.state} /
|
||||
<span style={{ color: "#fda417", fontSize: "15px" }}>
|
||||
Zipcode:
|
||||
</span>{" "}
|
||||
{selectedProperty.zip}
|
||||
</p>
|
||||
<div>
|
||||
<span
|
||||
className="selling-price"
|
||||
style={{ color: "#fda417", fontSize: "15px" }}
|
||||
>
|
||||
Total Living Square Foot:{" "}
|
||||
</span>
|
||||
{selectedProperty.totallivingsqft}
|
||||
<p></p>
|
||||
<span
|
||||
className=""
|
||||
style={{ color: "#fda417", fontSize: "15px" }}
|
||||
>
|
||||
Cost per Square Foot:{" "}
|
||||
</span>
|
||||
${selectedProperty.costpersqft}/sqft
|
||||
<p></p>
|
||||
<span
|
||||
className=""
|
||||
style={{ color: "#fda417", fontSize: "15px" }}
|
||||
>
|
||||
Year Built:{" "}
|
||||
</span>
|
||||
{selectedProperty.yearBuild}
|
||||
</div>
|
||||
|
||||
<p>Email: {selectedProperty.useremail}</p>
|
||||
{/* Add more property details as needed */}
|
||||
<div className="mt-3 card bg-white">
|
||||
<h5 className="mb-0" style={{ color: "#fda417", fontSize: "15px" }}>
|
||||
Legal Description
|
||||
</h5>
|
||||
<span>
|
||||
{selectedProperty.legal
|
||||
? selectedProperty.legal
|
||||
: "No data available"}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-md-12 mt-3">
|
||||
<div className="card">
|
||||
<div className="card-header bg-white">
|
||||
<h4
|
||||
className="product-name"
|
||||
style={{ color: "#fda417", fontSize: "25px" }}
|
||||
>
|
||||
Description
|
||||
</h4>
|
||||
</div>
|
||||
<div className="card-body">
|
||||
<p>
|
||||
Lorem Ipsum is simply dummy text of the printing and
|
||||
typesetting industry. Lorem Ipsum has been the
|
||||
industry's standard dummy text ever since the 1500s,
|
||||
when an unknown printer took a galley of type and
|
||||
scrambled it to make a type specimen book. It has
|
||||
survived not only five centuries, but also the leap into
|
||||
electronic typesetting, remaining essentially unchanged.
|
||||
It was popularised in the 1960s with the release of
|
||||
Letraset sheets containing Lorem Ipsum passages, and
|
||||
more recently with desktop publishing software like
|
||||
Aldus PageMaker including versions of Lorem Ipsum.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<p>Property not found.</p>
|
||||
<p>No property details found.</p>
|
||||
)}
|
||||
</div>
|
||||
<Footer />
|
||||
|
||||
</>
|
||||
);
|
||||
|
|
|
@ -51,7 +51,7 @@ const UserProperties = () => {
|
|||
to={`/property/${property.propertyId}`}
|
||||
target="_blank"
|
||||
>
|
||||
{property.title}
|
||||
{property.address}
|
||||
{"....."}
|
||||
</NavLink>
|
||||
</h5>
|
||||
|
|
Loading…
Reference in New Issue