diff --git a/src/api/count/counts.js b/src/api/count/counts.js new file mode 100644 index 0000000..338a6bf --- /dev/null +++ b/src/api/count/counts.js @@ -0,0 +1,12 @@ +import axios from "axios"; + +// Function to fetch data from the backend +export async function getCounts() { + try { + const response = await axios.get("/getcounts"); // Replace with your API endpoint URL + return response.data; + } catch (error) { + console.error("Error fetching data from the backend:", error); + throw error; + } +} diff --git a/src/layouts/dashboard/index.js b/src/layouts/dashboard/index.js index 7b15a0c..9001d59 100644 --- a/src/layouts/dashboard/index.js +++ b/src/layouts/dashboard/index.js @@ -1,19 +1,4 @@ -/** -========================================================= -* 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. -*/ - -// @mui material components +import { useEffect } from "react"; import Grid from "@mui/material/Grid"; import AnchorLink from "react-anchor-link-smooth-scroll"; @@ -36,11 +21,27 @@ import ComplexStatisticsCard from "examples/Cards/StatisticsCards/ComplexStatist import Projects from "layouts/dashboard/components/Projects"; import SearchBar from "./components/SearchBar/searchBar"; import { AdCard } from "./components/adCard"; +import { useState } from "react"; +import { getCounts } from "api/count/counts"; import { Link } from "react-router-dom"; // import OrdersOverview from "layouts/dashboard/components/OrdersOverview"; function Dashboard() { + const [counts, setCounts] = useState([]); // const { sales, tasks } = reportsLineChartData; + useEffect(() => { + // Fetch data from the backend using the imported function + const fetchData = async () => { + try { + const data = await getCounts(); + setCounts(data); + } catch (error) { + console.error("Error fetching data from the backend:", error); + } + }; + + fetchData(); + }, []); return ( @@ -54,7 +55,7 @@ function Dashboard() { color="dark" icon="newspaper" title="Total Advertisements" - count={281} + count={counts.ad_count} percentage={{ color: "success", amount: "+55%", @@ -64,7 +65,6 @@ function Dashboard() { - @@ -82,13 +82,12 @@ function Dashboard() { - - {/* + + + + + + - */} + {" "} {/*