diff --git a/public/fakeDB.JSON b/public/fakeDB.JSON index 7e5ae14..1fc4598 100644 --- a/public/fakeDB.JSON +++ b/public/fakeDB.JSON @@ -60,7 +60,7 @@ "cateImg2": "https://i.ibb.co/S769bW3/blood-bag.png", "cateImg3": "https://i.ibb.co/qMQxZV0/blood-transfusion.png", "btnText": "View All Bloods", - "link": "/availableBlood", + "link": "/blood", "description": "However, following a positive attitude as well as spreading that rationalist to other people will make your skills more rewarding. This blog will help you in becoming that positivist social butterfly with its everyday tips on how to be a better person as well as how to build stronger skills. Believe me, you will be surprised after reading a few posts." } ] \ No newline at end of file diff --git a/src/App.js b/src/App.js index 9bf140b..5109967 100644 --- a/src/App.js +++ b/src/App.js @@ -10,7 +10,10 @@ import AboutUs from "./Optional/AboutUs"; import Faq from "./Optional/Faq"; import PrivacyPolicy from "./Optional/PrivacyPolicy"; import Reviews from "./Pages/AllReviews/Reviews/Reviews"; -import { default as AvailableBlood, default as AvailableDonor } from "./Pages/BloodsPage/AvailableDonor/AvailableDonor"; +import { + default as AvailableBlood, + default as AvailableDonor +} from "./Pages/BloodsPage/AvailableDonor/AvailableDonor"; import BloodDonate from "./Pages/BloodsPage/BloodDonate/BloodDonate"; import BloodHome from "./Pages/BloodsPage/BloodHome/BloodHome"; import BloodPatient from "./Pages/BloodsPage/BloodPatient/BloodPatient"; @@ -61,19 +64,75 @@ function App() { <Dashboard /> </RequireAuth> } - > + > <Route index element={<DashboardHome></DashboardHome>}></Route> <Route path="addReview" element={<AddReview></AddReview>}></Route> <Route path="myOrders" element={<Orders></Orders>}></Route> <Route path="payment/:id" element={<Payment></Payment>}></Route> - <Route path="users" element={<RequireAdmin><Users></Users></RequireAdmin>}></Route> - <Route path="addCourse" element={<RequireAdmin><AddCourse></AddCourse></RequireAdmin>}></Route> - <Route path="addPlace" element={<RequireAdmin><AddPlace></AddPlace></RequireAdmin>}></Route> - <Route path="addBlog" element={<RequireAdmin><AddBlog></AddBlog></RequireAdmin>}></Route> - <Route path="manageOrders" element={<RequireAdmin><ManageOrders></ManageOrders></RequireAdmin>}></Route> - <Route path="manageCourses" element={<RequireAdmin><ManageCourses></ManageCourses></RequireAdmin>}></Route> - <Route path="managePlaces" element={<RequireAdmin><ManagePlaces></ManagePlaces></RequireAdmin>}></Route> - <Route path="allTransaction" element={<RequireAdmin><AllTransaction></AllTransaction></RequireAdmin>}></Route> + <Route + path="users" + element={ + <RequireAdmin> + <Users></Users> + </RequireAdmin> + } + ></Route> + <Route + path="addCourse" + element={ + <RequireAdmin> + <AddCourse></AddCourse> + </RequireAdmin> + } + ></Route> + <Route + path="addPlace" + element={ + <RequireAdmin> + <AddPlace></AddPlace> + </RequireAdmin> + } + ></Route> + <Route + path="addBlog" + element={ + <RequireAdmin> + <AddBlog></AddBlog> + </RequireAdmin> + } + ></Route> + <Route + path="manageOrders" + element={ + <RequireAdmin> + <ManageOrders></ManageOrders> + </RequireAdmin> + } + ></Route> + <Route + path="manageCourses" + element={ + <RequireAdmin> + <ManageCourses></ManageCourses> + </RequireAdmin> + } + ></Route> + <Route + path="managePlaces" + element={ + <RequireAdmin> + <ManagePlaces></ManagePlaces> + </RequireAdmin> + } + ></Route> + <Route + path="allTransaction" + element={ + <RequireAdmin> + <AllTransaction></AllTransaction> + </RequireAdmin> + } + ></Route> </Route> <Route path="services" element={<OfferServices />} /> @@ -89,7 +148,7 @@ function App() { </RequireAuth> } /> - + <Route path="allBlogs" element={<AllBlogs />} /> <Route path="blogDetails/:blogId" @@ -121,7 +180,7 @@ function App() { path="placeBooking/:serviceId" element={ <RequireAuth> - <PlaceBooking/> + <PlaceBooking /> </RequireAuth> } /> @@ -129,19 +188,21 @@ function App() { <Route path="register" element={<Register />} /> <Route path="aboutUs" element={<AboutUs />} /> <Route path="faq" element={<Faq />} /> - <Route path="privacyPolicy" element={<PrivacyPolicy/>} /> - <Route path="blood" element={<BloodHome/>} /> + <Route path="privacyPolicy" element={<PrivacyPolicy />} /> + <Route path="blood" element={<BloodHome />} /> <Route path="blood" element={ - <BloodHome/> + <RequireAuth> + <BloodHome /> + </RequireAuth> } - > - <Route index element={<AvailableDonor/>}></Route> - <Route path="availableDonor" element={<AvailableDonor/>}></Route> - <Route path="bloodDonate" element={<BloodDonate/>}></Route> - <Route path="bloodPatient" element={<BloodPatient/>}></Route> - <Route path="guidelines" element={<Guidelines/>}></Route> + > + <Route index element={<AvailableDonor />}></Route> + <Route path="availableDonor" element={<AvailableDonor />}></Route> + <Route path="bloodDonate" element={<BloodDonate />}></Route> + <Route path="bloodPatient" element={<BloodPatient />}></Route> + <Route path="guidelines" element={<Guidelines />}></Route> </Route> <Route path="*" element={<NotFound />} /> </Routes> diff --git a/src/Pages/BloodsPage/AvailableDonor/AvailableDonor.js b/src/Pages/BloodsPage/AvailableDonor/AvailableDonor.js index 3880414..f2aa2bc 100644 --- a/src/Pages/BloodsPage/AvailableDonor/AvailableDonor.js +++ b/src/Pages/BloodsPage/AvailableDonor/AvailableDonor.js @@ -1,9 +1,53 @@ -import React from 'react'; +import React, { useEffect, useState } from "react"; +import { Table, Toast } from "react-bootstrap"; const AvailableDonor = () => { + const [donors, setDonors] = useState([]); + + useEffect(() => { + fetch("http://localhost:5000/blood") + .then((res) => res.json()) + .then((data) => { + console.log(data); + setDonors(data); + }) + .catch((error) => Toast.error(error.message)); + }, []); return ( <div> - <h2>This is the available donor page</h2> + <div className="manage-order col-lg-10 mx-auto"> + <div className="card my-5"> + <h5 className="text-uppercase card-header danger-color white-text text-center py-4"> + <strong>Available Donor List:</strong> + </h5> + <Table striped bordered hover responsive variant="dark"> + <thead> + <tr className="bg-dark text-white"> + <th>Index</th> + <th>Donor Name</th> + <th>Donor Email</th> + <th>Phone No.</th> + <th>Blood Group</th> + <th>Last Donate Date</th> + <th>Address</th> + </tr> + </thead> + <tbody> + {donors.map((donor, index) => ( + <tr key={donor._id}> + <td>{index + 1}</td> + <td>{donor.name}</td> + <td>{donor.email}</td> + <td>{donor.phone}</td> + <td>{donor.bloodGroup}</td> + <td>{donor.lastBloodDonateDate}</td> + <td>{donor.address}</td> + </tr> + ))} + </tbody> + </Table> + </div> + </div> </div> ); }; diff --git a/src/Pages/BloodsPage/BloodHome/BloodHome.js b/src/Pages/BloodsPage/BloodHome/BloodHome.js index 20a2779..1bbd964 100644 --- a/src/Pages/BloodsPage/BloodHome/BloodHome.js +++ b/src/Pages/BloodsPage/BloodHome/BloodHome.js @@ -1,10 +1,12 @@ import React from "react"; import { Button, ButtonGroup, Container } from "react-bootstrap"; import { Link, Outlet } from "react-router-dom"; +import PageTitle from "../../../Components/Shared/PageTitle/PageTitle"; const BloodHome = () => { return ( <> + <PageTitle title="Bloods"></PageTitle> <Container> <h2 className="text-center text-uppercase mt-5 mb-4 feature"> Available Blood Donor