From cf1bab0e1b84e33192d52c25199b032eee1011ad Mon Sep 17 00:00:00 2001 From: Chanuka Lakshan Chandra Yapa <118423471+Chanuka-ChandraYapa@users.noreply.github.com> Date: Sat, 30 Sep 2023 10:21:25 +0530 Subject: [PATCH] update admin pages --- .../admin/contentapproval/contentApproval.js | 127 ++++ src/layouts/admin/managefeedback/feedback.js | 58 ++ src/layouts/admin/manageuser/data/userData.js | 103 +++ src/layouts/admin/manageuser/manageuser.js | 58 ++ .../admin/submitadvertisement/submitad.js | 636 ++++++++++++++++++ src/routes/adminroutes.js | 12 +- 6 files changed, 990 insertions(+), 4 deletions(-) create mode 100644 src/layouts/admin/contentapproval/contentApproval.js create mode 100644 src/layouts/admin/managefeedback/feedback.js create mode 100644 src/layouts/admin/manageuser/data/userData.js create mode 100644 src/layouts/admin/manageuser/manageuser.js create mode 100644 src/layouts/admin/submitadvertisement/submitad.js diff --git a/src/layouts/admin/contentapproval/contentApproval.js b/src/layouts/admin/contentapproval/contentApproval.js new file mode 100644 index 0000000..a17bbb5 --- /dev/null +++ b/src/layouts/admin/contentapproval/contentApproval.js @@ -0,0 +1,127 @@ +import React, { useState, useEffect } from "react"; +import Container from "@mui/material/Container"; +import Typography from "@mui/material/Typography"; +import Card from "@mui/material/Card"; +import CardContent from "@mui/material/CardContent"; +import Button from "@mui/material/Button"; +import Box from "@mui/material/Box"; +import DashboardLayout from "examples/LayoutContainers/DashboardLayout"; +import DashboardNavbar from "examples/Navbars/DashboardNavbar"; + +// Simulated data for advertisements pending approval +const advertisements = [ + { + id: 1, + title: "Historic Estate", + location: "Jaffna", + date: "Sun, 03 Sep 2023 18:30:04 GMT", + description: "This is a historic estate.", + image: "image_url_here", + }, + { + id: 2, + title: "Historic Estate", + location: "Jaffna", + date: "Sun, 03 Sep 2023 18:30:04 GMT", + description: "This is a historic estate.", + image: "image_url_here", + }, + // Add more advertisements as needed +]; + +function ContentApprovalPage() { + const [pendingAds, setPendingAds] = useState(advertisements); + const [currentAdIndex, setCurrentAdIndex] = useState(0); + + useEffect(() => { + // Fetch pending advertisements from the server here if needed + // Update the 'pendingAds' state with the fetched data + }, []); + + const approveAd = () => { + // Handle approval logic here (e.g., send a request to the server) + // Remove the current ad from the pending list + const updatedAds = [...pendingAds]; + updatedAds.splice(currentAdIndex, 1); + setPendingAds(updatedAds); + + // Move to the next ad + if (currentAdIndex < updatedAds.length) { + setCurrentAdIndex(currentAdIndex + 1); + } + }; + + const rejectAd = () => { + // Handle rejection logic here (e.g., send a request to the server) + // Remove the current ad from the pending list + const updatedAds = [...pendingAds]; + updatedAds.splice(currentAdIndex, 1); + setPendingAds(updatedAds); + + // Move to the next ad + if (currentAdIndex < updatedAds.length) { + setCurrentAdIndex(currentAdIndex + 1); + } + }; + + const currentAd = pendingAds[currentAdIndex]; + + return ( + + + + + + Content Approval + + {currentAd ? ( + + + + Advertisement ID: {currentAd.id} + + + Title: {currentAd.title} + + + Location: {currentAd.location} + + + Date: {currentAd.date} + + + Description: {currentAd.description} + + {currentAd.image && ( + Advertisement + )} + + + + + + + ) : ( + + No pending advertisements. + + )} + + + ); +} + +export default ContentApprovalPage; diff --git a/src/layouts/admin/managefeedback/feedback.js b/src/layouts/admin/managefeedback/feedback.js new file mode 100644 index 0000000..2b0aa80 --- /dev/null +++ b/src/layouts/admin/managefeedback/feedback.js @@ -0,0 +1,58 @@ +import React from "react"; +import { Card } from "@mui/material"; +import MDTypography from "components/MDTypography"; +import DashboardLayout from "examples/LayoutContainers/DashboardLayout"; +import DashboardNavbar from "examples/Navbars/DashboardNavbar"; + +function ManageFeedback() { + // Assuming feedbackData is an array of feedback objects + const feedbackData = [ + { + name: "John Doe", + email: "johndoe@example.com", + date: "2023-09-01", + message: + "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla eget justo eu urna condimentum elementum vel eget enim.", + }, + { + name: "Jane Smith", + email: "janesmith@example.com", + date: "2023-09-02", + message: + "Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas quis fringilla libero.", + }, + { + name: "Alice Johnson", + email: "alicejohnson@example.com", + date: "2023-09-03", + message: + "Vestibulum in metus eu ipsum finibus auctor. Curabitur feugiat urna eget elit dictum, eget elementum quam cursus.", + }, + // Add more feedback objects as needed + ]; + + return ( + + +

Manage Feedback

+ {feedbackData.map((feedback, index) => ( + +
+ + {feedback.name} + + + {feedback.email} | {feedback.date} + + + {feedback.message} + + {/* You can add buttons or actions here for managing feedback */} +
+ + ))} + + ); +} + +export default ManageFeedback; diff --git a/src/layouts/admin/manageuser/data/userData.js b/src/layouts/admin/manageuser/data/userData.js new file mode 100644 index 0000000..9b144ad --- /dev/null +++ b/src/layouts/admin/manageuser/data/userData.js @@ -0,0 +1,103 @@ +/* eslint-disable react/prop-types */ +/* eslint-disable react/function-component-definition */ +/** + * ========================================================= + * Material Dashboard 2 React - v2.2.0 + * ========================================================= + * + * Product Page: https://www.creative-tim.com/product/material-dashboard-react + * Copyright 2023 Creative Tim (https://www.creative-tim.com) + * + * Coded by www.creative-tim.com + * + * ========================================================= + * + * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. + */ + +// Material Dashboard 2 React components +import MDBox from "components/MDBox"; +import MDTypography from "components/MDTypography"; +import MDBadge from "components/MDBadge"; +import { useEffect, useState } from "react"; +import { getReportList } from "api/report/reportsdata"; + +export default function Data() { + const Job = ({ title, description }) => ( + + + {title} + + {description} + + ); + + const [reportDetails, setReportsDetails] = useState([]); + + useEffect(() => { + // Fetch average price data from the Flask API endpoint + getReportList() + .then((data) => { + setReportsDetails(data); + console.log(data); // Use 'data' instead of 'reportDetails' + }) + .catch((error) => { + console.error("Error fetching data:", error); + }); + }, []); + + const handleDownload = (pdf_Url) => { + if (pdf_Url) { + // Create an anchor element to trigger the download + const anchor = document.createElement("a"); + anchor.href = pdf_Url; + anchor.target = "_blank"; // Open the link in a new tab + anchor.download = "your_file_name.ext"; // Replace with the desired file name + + // Trigger the download + anchor.click(); + } else { + console.error("Download URL is not available."); + } + }; + + return { + columns: [ + { Header: "User", accessor: "author", align: "left" }, + { Header: "Profession", accessor: "function", align: "left" }, + { Header: "Status", accessor: "status", align: "center" }, + { Header: "Last Seen", accessor: "employed", align: "center" }, + { Header: "Manage", accessor: "action", align: "center" }, + ], + rows: reportDetails.map((report) => ({ + author: ( + + {report.Title} + + ), + function: , + status: ( + + + + ), + employed: ( + + {report.timestamp} + + ), + action: ( + handleDownload(report.PDF_URL)} // Use an arrow function + > + Download + + ), + })), + }; +} diff --git a/src/layouts/admin/manageuser/manageuser.js b/src/layouts/admin/manageuser/manageuser.js new file mode 100644 index 0000000..f2bc924 --- /dev/null +++ b/src/layouts/admin/manageuser/manageuser.js @@ -0,0 +1,58 @@ +import React from "react"; +import Grid from "@mui/material/Grid"; +import Card from "@mui/material/Card"; + +// Material Dashboard 2 React components +import MDBox from "components/MDBox"; +import MDTypography from "components/MDTypography"; + +import DataTable from "examples/Tables/DataTable"; + +import data from "./data/userData"; +import DashboardLayout from "examples/LayoutContainers/DashboardLayout"; +import DashboardNavbar from "examples/Navbars/DashboardNavbar"; +// import MDButton from "components/MDButton"; +// import { generateExcel } from "./reports"; +// import { CSVLink } from "react-csv"; + +function UserView() { + const { columns, rows } = data(); + return ( + + + + + + + + + User History + + + + + + + + + + + ); +} + +export default UserView; diff --git a/src/layouts/admin/submitadvertisement/submitad.js b/src/layouts/admin/submitadvertisement/submitad.js new file mode 100644 index 0000000..a1ad889 --- /dev/null +++ b/src/layouts/admin/submitadvertisement/submitad.js @@ -0,0 +1,636 @@ +// import React, { useState } from "react"; +// import Container from "@mui/material/Container"; +// import Typography from "@mui/material/Typography"; +// import TextField from "@mui/material/TextField"; +// import TextareaAutosize from "@mui/material/TextareaAutosize"; +// import Box from "@mui/material/Box"; +// import CloudUploadIcon from "@mui/icons-material/CloudUpload"; +// import DashboardLayout from "examples/LayoutContainers/DashboardLayout"; +// import DashboardNavbar from "examples/Navbars/DashboardNavbar"; +// import { Card } from "@mui/material"; +// import MDButton from "components/MDButton"; + +// function AdvertisementForm() { +// const [formData, setFormData] = useState({ +// title: "", +// location: "", +// date: "", +// description: "", +// image: null, +// }); + +// const [imagePreview, setImagePreview] = useState(null); // For image preview + +// const handleChange = (e) => { +// const { name, value } = e.target; +// setFormData({ ...formData, [name]: value }); +// }; + +// const handleImageChange = (e) => { +// const file = e.target.files[0]; +// setFormData({ ...formData, image: file }); + +// // Display image preview +// const reader = new FileReader(); +// reader.onload = (event) => { +// setImagePreview(event.target.result); +// }; +// reader.readAsDataURL(file); +// }; + +// const handleSubmit = (e) => { +// e.preventDefault(); +// // Handle form submission here +// console.log("Form data:", formData); +// }; + +// return ( +// +// +// +// +// +// Submit Advertisement +// +//
+// +// +// Title +// +// +// +// +// +// Location +// +// +// +// +// +// Date +// +// +// +// +// +// Description +// +// +// +// +// +// Upload Image +// +// +// +// {imagePreview && ( +// Uploaded Preview +// )} +// +// +// +// Submit Advertisement +// +// +//
+// +// +// +// ); +// } + +// export default AdvertisementForm; + +import React, { useState } from "react"; +import Container from "@mui/material/Container"; +import Typography from "@mui/material/Typography"; +import TextField from "@mui/material/TextField"; +import TextareaAutosize from "@mui/material/TextareaAutosize"; +import Box from "@mui/material/Box"; +import CloudUploadIcon from "@mui/icons-material/CloudUpload"; +import DashboardLayout from "examples/LayoutContainers/DashboardLayout"; +import DashboardNavbar from "examples/Navbars/DashboardNavbar"; +import { Card } from "@mui/material"; +import MDButton from "components/MDButton"; + +function AdvertisementForm() { + const [formData, setFormData] = useState({ + title: "", + location: "", + date: "", + description: "", + image: null, + category: "", // New category field + }); + + const [imagePreview, setImagePreview] = useState(null); + + const handleChange = (e) => { + const { name, value } = e.target; + setFormData({ ...formData, [name]: value }); + }; + + const handleImageChange = (e) => { + const file = e.target.files[0]; + setFormData({ ...formData, image: file }); + + const reader = new FileReader(); + reader.onload = (event) => { + setImagePreview(event.target.result); + }; + reader.readAsDataURL(file); + }; + + const handleSubmit = (e) => { + e.preventDefault(); + console.log("Form data:", formData); + }; + + // Define form fields based on category + let categoryFields; + if (formData.category === "landsale") { + categoryFields = ( + <> + + + Price per Perch + + + + + + Number of Perches + + + + + + Posted on + + + + + + Source + + + + + + Phone Numbers + + + + + + Email + + + + + + Nearest City + + + + + + Address + + + + + + Land Marks + + + + + ); + } else if (formData.category === "housesale") { + categoryFields = ( + <> + + + Price + + + + + + Number of rooms + + + + + + Posted on + + + + + + Source + + + + + + Phone Numbers + + + + + + Email + + + + + + Nearest City + + + + + + Address + + + + {/* Add more fields for housesale */} + + ); + } else if (formData.category === "marriageproposals") { + categoryFields = ( + <> + + + Gender + + + + + + Age + + + + + + Profession + + + + + + Nationality + + + + + + Other Requirements + + + + + + Posted on + + + + + + Source + + + + + + Phone Numbers + + + + + + Email + + + + + + Nearest City + + + + + + Address + + + + {/* Add more fields for marriageproposals */} + + ); + } + + return ( + + + + + + Submit Advertisement + +
+ + + Category + + + + {categoryFields /* Render category-specific fields */} + + + Title + + + + + + Upload Image + + + + {imagePreview && ( + Uploaded Preview + )} + + + + Submit Advertisement + + +
+ + + + ); +} + +export default AdvertisementForm; diff --git a/src/routes/adminroutes.js b/src/routes/adminroutes.js index 61ebaac..05c55a2 100644 --- a/src/routes/adminroutes.js +++ b/src/routes/adminroutes.js @@ -19,6 +19,10 @@ import App from "layouts/landing/App"; // import PrivateRoute from "utils/privateRoutes"; import { useUser } from "utils/userContext"; import PropTypes from "prop-types"; +import AdvertisementForm from "layouts/admin/submitadvertisement/submitad"; +import UserView from "layouts/admin/manageuser/manageuser"; +import ManageFeedback from "layouts/admin/managefeedback/feedback"; +import ContentApprovalPage from "layouts/admin/contentapproval/contentApproval"; // ... @@ -53,7 +57,7 @@ const adminRoutes = [ key: "admanage", icon: search, route: "/manageadvertisements", - component: , + component: , }, { type: "collapse", @@ -61,7 +65,7 @@ const adminRoutes = [ key: "usermanage", icon: newspaper, route: "/manageuser", - component: , + component: , }, { type: "collapse", @@ -69,7 +73,7 @@ const adminRoutes = [ key: "feedback", icon: equalizer, route: "/managefeedback", - component: , + component: , }, { type: "collapse", @@ -77,7 +81,7 @@ const adminRoutes = [ key: "content", icon: map, route: "/managecontent", - component: , + component: , }, { type: "collapse",