This commit is contained in:
omkieit 2024-10-14 12:14:54 +05:30
parent c6bea888ad
commit c243bc83de
4 changed files with 71 additions and 64 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-CJacNAWv.js"></script> <script type="module" crossorigin src="/assets/index-7mv97drX.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

@ -28,7 +28,7 @@ const Addproperty = () => {
propertyTaxInfo: [ propertyTaxInfo: [
{ propertytaxowned: "0", ownedyear: "0", taxassessed: "0", taxyear: "0" }, { propertytaxowned: "0", ownedyear: "0", taxassessed: "0", taxyear: "0" },
], ],
images: [{ title: "", file: "" }], // Array to hold image objects images: [{ title: "", file: "" }],
googleMapLink: "", // Field for Google Maps link googleMapLink: "", // Field for Google Maps link
renovationRisk: null, renovationRisk: null,
purchaseCost: "0", purchaseCost: "0",
@ -129,6 +129,7 @@ const Addproperty = () => {
const [submitted, setSubmitted] = useState(false); const [submitted, setSubmitted] = useState(false);
const handleImageChange = (file, index) => { const handleImageChange = (file, index) => {
console.log("File received:", file); // Debugging log to check the file object
const updatedImages = [...formData.images]; const updatedImages = [...formData.images];
updatedImages[index].file = file.base64; // store base64 format of image updatedImages[index].file = file.base64; // store base64 format of image
setFormData({ ...formData, images: updatedImages }); setFormData({ ...formData, images: updatedImages });
@ -1784,54 +1785,60 @@ const Addproperty = () => {
Upload Images{" "} Upload Images{" "}
</h3> </h3>
<form> <form>
{formData.images.map((image, index) => ( {formData.images.map((image, 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={image.title} value={image.title}
placeholder="Image Title" placeholder="Image Title"
onChange={(e) => handleImageTitleChange(index, e)} onChange={(e) => handleImageTitleChange(index, e)}
/> />
</div> </div>
<div className="col-md-4 d-flex align-items-center"> <div className="col-md-4 d-flex align-items-center">
<FileBase64 <FileBase64
multiple={false} multiple={false}
onDone={(file) => handleImageChange(file, index)} onDone={(file) => handleImageChange(file, index)}
/> />
<button <button
type="button" type="button"
className="btn btn-danger" className="btn btn-danger"
onClick={() => handleDeleteImage(index)} onClick={() => handleDeleteImage(index)}
style={{ style={{
marginLeft: "5px", // Adjust this to minimize space between the buttons marginLeft: "5px",
}} }}
> >
Delete Delete
</button> </button>
</div> </div>
{image.file && ( {/* Check if image.file contains valid base64 data */}
<div className="col-md-12"> {image.file && (
<img <>
src={image.file} <p>Base64 Data:</p> {/* Debugging base64 data */}
alt="uploaded" <pre>{image.file.slice(0, 100)}...</pre> {/* Display first 100 characters for debugging */}
style={{ width: "150px", height: "150px" }}
/>
</div>
)}
</div>
))}
<button <div className="col-md-12">
type="button" <img
className="btn btn-primary" src={image.file}
onClick={handleAddImage} alt="uploaded"
style={{ backgroundColor: "#fda417", border: "#fda417" }} style={{ width: "150px", height: "150px", objectFit: "cover" }}
> />
+ Add Image </div>
</button> </>
)}
</div>
))}
<button
type="button"
className="btn btn-primary"
onClick={handleAddImage}
style={{ backgroundColor: "#fda417", border: "#fda417" }}
>
+ Add Image
</button>
<hr <hr
style={{ style={{

View File

@ -34,7 +34,7 @@ const UserProperties = () => {
<div className="row p-2 bg-white border rounded mt-2"> <div className="row p-2 bg-white border rounded mt-2">
<div className="col-md-3 mt-1"> <div className="col-md-3 mt-1">
<img <img
src={propertydummy} src={property.images[0].file || propertydummy}
className="w-70" className="w-70"
alt="Img" alt="Img"
style={{ style={{