update dashboard

Newspaper-Advertisement-Analyzer · Sep 13, 2023 · 97e06c1 · 97e06c1
1 parent 2c2f3cd
commit 97e06c1
Show file tree

Hide file tree

Showing 12 changed files with 178 additions and 78 deletions.
diff --git a/src/layouts/graph/components/barCharts/categoryDist.js b/src/layouts/graph/components/barCharts/categoryDist.js
@@ -25,7 +25,7 @@ function CategoryDistribution() {
   return (
     <MDBox mt={4}>
       <HorizontalBarChart
-        icon={{ color: "info", component: "leaderboard" }}
+        icon={{ color: "info", component: "category" }}
         title="Distribution by Category"
         description="Overall category distribution in the database"
         chart={{

diff --git a/src/layouts/graph/components/barCharts/houseSaleChart.js b/src/layouts/graph/components/barCharts/houseSaleChart.js
@@ -40,7 +40,7 @@ function HousesaleAveragePrice() {
   return (
     <MDBox mt={4}>
       <VerticalBarChart
-        icon={{ color: "info", component: "leaderboard" }}
+        icon={{ color: "info", component: "house" }}
         title="House Sales"
         description={`Average Price - ${selectedItem}`}
         chart={{

diff --git a/src/layouts/graph/components/barCharts/landSaleChart.js b/src/layouts/graph/components/barCharts/landSaleChart.js
@@ -38,7 +38,7 @@ function LandsaleAveragePrice() {
   return (
     <MDBox mt={4}>
       <VerticalBarChart
-        icon={{ color: "info", component: "leaderboard" }}
+        icon={{ color: "info", component: "land" }}
         title="Land Sales"
         description={`Average Price Per Perch - ${selectedItem}`}
         chart={{

diff --git a/src/layouts/graph/components/lineCharts/demographic.js b/src/layouts/graph/components/lineCharts/demographic.js
@@ -34,7 +34,7 @@ function Demographic() {
   return (
     <MDBox mt={4}>
       <DefaultLineChart
-        icon={{ color: "info", component: "leaderboard" }}
+        icon={{ color: "info", component: "people" }}
         title="Demographic Analysis"
         description={`Subject to ${selectedItem}`}
         menuItems={[

diff --git a/src/layouts/graph/components/lineCharts/pricefluctuation.js b/src/layouts/graph/components/lineCharts/pricefluctuation.js
@@ -30,7 +30,7 @@ function PriceFluctuation() {
   return (
     <MDBox mt={4}>
       <DefaultLineChart
-        icon={{ color: "info", component: "leaderboard" }}
+        icon={{ color: "info", component: "money" }}
         title="Price Fluctuation"
         description="Estimation for future years"
         chart={{

diff --git a/src/layouts/graph/components/pieCharts/houseSaleDDist.js b/src/layouts/graph/components/pieCharts/houseSaleDDist.js
@@ -32,7 +32,7 @@ function HouseSaleDistribution() {
           labels: housesalebyCity.map((data) => data._id),
           datasets: {
             label: "City",
-            backgroundColors: ["info", "dark", "error", "secondary", "primary", "success"],
+            backgroundColors: ["info", "dark", "#8A6FC5", "secondary", "primary", "#C08DD8"],
             data: housesalebyCity.map((data) => data.count),
           },
         }}

diff --git a/src/layouts/graph/components/pieCharts/marriageDist.js b/src/layouts/graph/components/pieCharts/marriageDist.js
@@ -28,7 +28,7 @@ function MarriageDistribution() {
   return (
     <MDBox mt={4}>
       <PieChart
-        icon={{ color: "info", component: "leaderboard" }}
+        icon={{ color: "info", component: "people" }}
         title="Distribution Marriage Proposal"
         description=" According to Age"
         chart={{

diff --git a/src/layouts/graph/index.js b/src/layouts/graph/index.js
@@ -34,6 +34,8 @@ function GraphViewer() {
   const [includeMarriageDist, setIncludeMarriageDist] = useState(false);
   const [includeHouseSaleDist, setIncludeHouseSaleDist] = useState(false);
   const [includePriceFluct, setIncludePriceFluct] = useState(false);
+  const [includeDemographic, setIncludeDemographic] = useState(false);
+  const [includeHouseSale, setIncludeHouseSale] = useState(false);
   const [includeAll, setIncludeAll] = useState(false);
   const [title, settitle] = useState("");
 
@@ -44,7 +46,9 @@ function GraphViewer() {
         includeHouseSaleDist &&
         includeLandSale &&
         includeMarriageDist &&
-        includePriceFluct
+        includePriceFluct &&
+        includeDemographic &&
+        includeHouseSale
       ) {
         setIncludeAll(true);
       } else {
@@ -65,6 +69,8 @@ function GraphViewer() {
     includeMarriageDist,
     includeAll,
     includePriceFluct,
+    includeDemographic,
+    includeHouseSale,
   ]);
 
   const handleAll = () => {
@@ -74,6 +80,8 @@ function GraphViewer() {
     setIncludeLandSale(true);
     setIncludeMarriageDist(true);
     setIncludePriceFluct(true);
+    setIncludeDemographic(true);
+    setIncludeHouseSale(true);
   };
   const createPDF = () => {
     const selectedComponents = [];
@@ -94,6 +102,12 @@ function GraphViewer() {
     if (includePriceFluct) {
       selectedComponents.push(<PriceFluctuation key="priceFluct" />);
     }
+    if (includeDemographic) {
+      selectedComponents.push(<Demographic key="demographic" />);
+    }
+    if (includeHouseSale) {
+      selectedComponents.push(<HousesaleAveragePrice key="houseSale" />);
+    }
 
     // Pass the selected components to your PDF generator function (ChartToPDF)
     generatePDF(selectedComponents, contentRef, title, user.user_ID);
@@ -134,8 +148,8 @@ function GraphViewer() {
               </MDBox>
               <MDBox mt={0.5}>
                 <Switch
-                  checked={includeLandSale}
-                  onChange={() => setIncludeLandSale(!includeLandSale)}
+                  checked={includeHouseSale}
+                  onChange={() => setIncludeHouseSale(!includeHouseSale)}
                 />
               </MDBox>
             </MDBox>
@@ -215,8 +229,8 @@ function GraphViewer() {
               </MDBox>
               <MDBox mt={0.5}>
                 <Switch
-                  checked={includePriceFluct}
-                  onChange={() => setIncludePriceFluct(!includePriceFluct)}
+                  checked={includeDemographic}
+                  onChange={() => setIncludeDemographic(!includeDemographic)}
                 />
               </MDBox>
             </MDBox>

diff --git a/src/layouts/reports/data/reportsdata.js b/src/layouts/reports/data/reportsdata.js
@@ -64,34 +64,84 @@ export default function Data() {
   return {
     rawData: [
       {
-        Name: "John Doe",
-        Age: 30,
-        Email: "[email protected]",
-        City: "New York",
+        id: 1,
+        name: "Historic Estate",
+        location: "Jaffna",
+        date: "Sun, 03 Sep 2023 18:30:04 GMT",
+        contactNumbers: ["0774698456", "0768596489"],
+        price: "Rs.250000",
       },
       {
-        Name: "Jane Smith",
-        Age: 28,
-        Email: "[email protected]",
-        City: "Los Angeles",
+        id: 2,
+        name: "Seaview Bungalow",
+        location: "Trincomalee",
+        date: "Wed, 30 Aug 2023 18:30:07 GMT",
+        contactNumbers: ["0774698459", "0768596492"],
+        price: "Rs.190000",
       },
       {
-        Name: "Bob Johnson",
-        Age: 35,
-        Email: "[email protected]",
-        City: "Chicago",
+        id: 3,
+        name: "Ancient Property",
+        location: "Anuradhapura",
+        date: "Wed, 30 Aug 2023 18:30:05 GMT",
+        contactNumbers: ["0774698457", "0768596490"],
+        price: "Rs.120000",
       },
       {
-        Name: "Alice Brown",
-        Age: 25,
-        Email: "[email protected]",
-        City: "San Francisco",
+        id: 4,
+        name: "Mountain View Property",
+        location: "Kandy",
+        date: "Wed, 30 Aug 2023 18:30:01 GMT",
+        contactNumbers: ["0774698453", "0768596486"],
+        price: "Rs.150000",
       },
       {
-        Name: "What",
-        Age: "am",
-        Email: "I",
-        City: "doing?",
+        id: 5,
+        name: "Hillside Property",
+        location: "Nuwara Eliya",
+        date: "Thu, 24 Aug 2023 18:30:09 GMT",
+        contactNumbers: ["0774698461", "0768596494"],
+        price: "Rs.120000",
+      },
+      {
+        id: 6,
+        name: "Seaside Paradise",
+        location: "Galle",
+        date: "Sat, 19 Aug 2023 18:30:02 GMT",
+        contactNumbers: ["0774698454", "0768596487"],
+        price: "Rs.200000",
+      },
+      {
+        id: 7,
+        name: "Beachfront Villa",
+        location: "Negombo",
+        date: "Thu, 10 Aug 2023 18:30:03 GMT",
+        contactNumbers: ["0774698455", "0768596488"],
+        price: "Rs.180000",
+      },
+      {
+        id: 8,
+        name: "Riverside Land",
+        location: "Matara",
+        date: "Fri, 04 Aug 2023 18:30:08 GMT",
+        contactNumbers: ["0774698460", "0768596493"],
+        price: "Rs.80000",
+      },
+      {
+        id: 9,
+        name: "Lakefront Retreat",
+        location: "Batticaloa",
+        date: "Thu, 03 Aug 2023 18:30:06 GMT",
+        contactNumbers: ["0774698458", "0768596491"],
+        price: "Rs.150000",
+      },
+      {
+        id: 10,
+        name: "Prime Lands",
+        location: "Colombo",
+        date: "Sun, 30 Jul 2023 18:30:00 GMT",
+        contactNumbers: ["0774698452", "0768596485"],
+        price: "Rs.100000",
       },
     ],
     columns: [

diff --git a/src/layouts/reports/graphs/graphdetails.js b/src/layouts/reports/graphs/graphdetails.js
@@ -2,7 +2,17 @@ import React from "react";
 import { useParams } from "react-router-dom"; // For accessing route parameters
 import { Container, Typography } from "@mui/material";
 
+// Material Dashboard 2 React components
+import MDBox from "components/MDBox";
+
+import data from "../data/reportsdata";
+import MDButton from "components/MDButton";
+import { generateExcel } from "../reports";
+import { CSVLink } from "react-csv";
+import Projects from "layouts/dashboard/components/Projects";
+
 const GraphDetails = () => {
+  const { rawData } = data();
   // Get the advertisement id from the URL
   const { title } = useParams();
 
@@ -13,6 +23,17 @@ const GraphDetails = () => {
       <Typography variant="h4" gutterBottom>
         {title}
       </Typography>
+      <Projects />
+      <MDBox mt={5} textAlign="center">
+        <MDButton color="primary" onClick={() => generateExcel(rawData, "uselessReport")}>
+          Export to Excel
+        </MDButton>
+      </MDBox>
+      <MDBox mt={5} textAlign="center">
+        <CSVLink data={rawData} filename={`uselessCSV.csv`}>
+          <MDButton color="primary">Export to CSV</MDButton>
+        </CSVLink>
+      </MDBox>
     </Container>
   );
 };

diff --git a/src/layouts/reports/reports.js b/src/layouts/reports/reports.js
@@ -3,9 +3,9 @@ import "jspdf-autotable";
 import html2canvas from "html2canvas";
 import * as XLSX from "xlsx";
 
-import { savePdf } from "api/report/saveReport";
-import { storage } from "../../firebase";
-import { ref, uploadBytes, getDownloadURL } from "firebase/storage";
+// import { savePdf } from "api/report/saveReport";
+// import { storage } from "../../firebase";
+// import { ref, uploadBytes, getDownloadURL } from "firebase/storage";
 
 export const generateCSV = (data, filename) => {
   const csvContent = "data:text/csv;charset=utf-8," + data.map((row) => row.join(",")).join("\n");
@@ -55,23 +55,24 @@ const generatePDF = async (componentsToPrint, contentRef, title, user_ID) => {
     }
 
     doc.save(`${title}.pdf`);
-    const pdfBlob = doc.output("blob");
+    // const pdfBlob = doc.output("blob");
     const userID = user_ID;
-    const pdfRef = ref(storage, `Reports/${title}`);
+    console.log(userID);
+    // const pdfRef = ref(storage, `Reports/${title}`);
 
-    // Upload the PDF to Firebase Storage
-    await uploadBytes(pdfRef, pdfBlob);
+    // // Upload the PDF to Firebase Storage
+    // await uploadBytes(pdfRef, pdfBlob);
 
-    // Get the download URL of the uploaded PDF
-    const downloadURL = await getDownloadURL(pdfRef); // Add this import: import { getDownloadURL } from "firebase/storage";
-    // Send the PDF URL to the backend using the savePdf function or do whatever you need with it
-    const response = await savePdf(downloadURL, userID, title);
+    // // Get the download URL of the uploaded PDF
+    // const downloadURL = await getDownloadURL(pdfRef); // Add this import: import { getDownloadURL } from "firebase/storage";
+    // // Send the PDF URL to the backend using the savePdf function or do whatever you need with it
+    // const response = await savePdf(downloadURL, userID, title);
 
-    if (response && response.message) {
-      console.log("PDF uploaded successfully!");
-    } else {
-      console.error("Failed to upload PDF:", response.error);
-    }
+    // if (response && response.message) {
+    //   console.log("PDF uploaded successfully!");
+    // } else {
+    //   console.error("Failed to upload PDF:", response.error);
+    // }
   } catch (error) {
     console.error("An error occurred while generating/uploading PDF:", error);
   }