Prototype of Donation Certificate

README.md

@@ -59,7 +59,7 @@ PETARI, The Food Donate WebApp, is an initiative by an organization aiming to re
 - <h4>Environmental Consciousness: </h4> By redistributing excess food and reducing food waste, Petari helps alleviate the pressure on finite natural resources and minimizes the environmental impact associated with food wastage.
 - <h4>Economic Impact:</h4> Through its activities, Petari not only addresses social issues related to hunger but also contributes to economic sustainability by efficiently utilizing excess resources and reducing wastage.
 - <h4>Collaboration with Events:</h4> Petari likely collaborates with various events, such as weddings and parties, to collect surplus food, emphasizing the importance of partnerships and community involvement in achieving its goals.
-
+- <h4>Rewards for Donation:</h4> Donors  get personalised certificates of donation they make, acknowledging their effort for making a donation.
 <p align="right">(<a href="#top">back to top</a>)</p>
 
 
@@ -275,4 +275,4 @@ Admins have special privileges and access to manage the platform. The admin logi
 </a>
 </center>
 <br>
-<p align="right"><a href="#top">Back to top</a></p>
+<p align="right"><a href="#top">Back to top</a></p>

routers/userRoutes.js

@@ -326,6 +326,7 @@ router.post("/User_singUp", async function (req, res) {
       phoneNo: foundUser.Mobile,
       address: foundUser.address,
       complain: userQuerys,
+      donationInfo: donationInfo
     });
   } catch (error) {
     console.error("Error during user registration:", error);
@@ -470,6 +471,7 @@ router.route("/reset-password-user").post(async (req, res) => {
         phoneNo: user.Mobile,
         address: user.address,
         complain: userQuerys,
+        donationInfo: donationInfo
       });
 
       // Redirect to login page or any other desired page
@@ -502,6 +504,7 @@ router.post("/delete-query/:id/:email", async (req, res) => {
       phoneNo: foundUser.Mobile,
       address: foundUser.address,
       complain: userQuerys,
+      donationInfo: donationInfo
     });
   } catch (error) {
     console.error(error);

views/UserDashBoard.ejs

@@ -595,7 +595,28 @@
             font-size: 20px;
             display: flex;
         }
+        .certificate {
+            font-family: Arial, sans-serif;
+            border: 2px solid #000;
+            padding: 20px;
+            width: 600px;
+            margin: 50px auto;
+            text-align: center;
+        }
+
+        .certificate h1 {
+            font-size: 2em;
+            margin-bottom: 0.5em;
+        }
+
+        .certificate h2 {
+            font-size: 1.5em;
+            margin: 0.5em 0;
+        }
 
+        .certificate p {
+            margin: 0.5em 0;
+        }
         /* Responsive Css  */
 
         @media (max-width: 980px) {
@@ -687,7 +708,7 @@
                 <div class="form-container">
                     <h2>Donation Form</h2>
                     <br>
-                    <form id="donationForm" action="/add-details" method="post">
+                    <form id="donationForm" method="post" onsubmit="generateCertificate(event)">
                         <label for="userId">Email Id:</label>
                         <input type="email" id="userId" name="email" required>
                         <span id="emailError" class="error"></span>
@@ -767,7 +788,7 @@
                             <button type="button" class="button" onclick="deleteRow()">Delete Row</button>
                         </div>
                         <div style="display: flex; justify-content: center;">
-                            <button class="button" type="submit">Donate</button>
+                            <button class="button" type="submit" >Donate</button>
                         </div>
                     </form>
         </section>
@@ -1042,7 +1063,33 @@
                     alert("Cannot delete the only row");
                 }
             }
+
+            //event hadler to get customised certificate
+            function generateCertificate(event) {
+                event.preventDefault();
+
+                const form = document.getElementById('donationForm');
+                const formData = new FormData(form);
+                const fullname='<%= fullName %>'
+                const foodItem = formData.get('foodItem');
+                const quantity = formData.get('quantity');
+
+                const certificateContent = `
+                    <div class="certificate">
+                        <h1>Certificate of Donation</h1>
+                        <p>This certificate is proudly presented to</p>
+                        <h2>${fullname}</h2>
+                        <p>for their generous donation.</p>
+                        <p>Food Item: ${foodItem} Food Quantity:${quantity}</p>
+                        <p>Thank you for your support!</p>
+                    </div>
+                `;
 
+                const certificateWindow = window.open('', '_blank');
+                certificateWindow.document.write(certificateContent);
+                //certificateWindow.document.close();
+            }
+
             function validateForm() {
                 var isValid = true;
 
@@ -1179,8 +1226,11 @@
             //     four.classList.add("active");
             //     // five.classList.add("active");
             // }
-
+        
         </script>
+
+
+
 </body>
 
 </html>