-
محتوای آمار و تحلیل بهزودی اضافه خواهد شد
+
+
+
+
آمار بازدید کننده ها
+
+
+ {dropDownOpen && (
+
+
+ - امروز
+ - این هفته
+ - این ماه
+ - این سال
+
+
+ )
+
+ }
+
+
+
+
+
+
+
+ راهنما
+
+
+
+ راهنما
+
+
+
+
+
+
+
+
+
+
+
آمار بازدید کننده ها
+
+ همه
+
+
+
+
+
+
+
+ راهنما
+
+
+
+ راهنما
+
+
+
+
+
+
+
+
+
+
+
+
آمار بازدید کننده ها
+
+ همه
+
+
+
+
+
+
+
+ راهنما
+
+
+
+ راهنما
+
+
+
+
+
+
+
);
diff --git a/src/pages/Stats/components/mostView.jsx b/src/pages/Stats/components/mostView.jsx
new file mode 100644
index 0000000..624d4fa
--- /dev/null
+++ b/src/pages/Stats/components/mostView.jsx
@@ -0,0 +1,48 @@
+
+
+import {
+ PieChart,
+ Pie,
+ Cell,
+ ResponsiveContainer,
+ Tooltip,
+} from "recharts";
+
+const data = [
+ { name: "دان", value: 48, color: "#b52424" },
+ { name: "وی", value: 38, color: "#C0BCBC" },
+ { name: "آنی", value: 19, color: "#7f7376" },
+];
+
+export default function CafeVisitPie() {
+ return (
+
+ {/*
پربازدیدترین کافهها
*/}
+
+
+
+
+ `${value}%`}
+ >
+ {data.map((item, i) => (
+ |
+ ))}
+
+
+
+
+ );
+}
diff --git a/src/pages/Stats/components/popular.jsx b/src/pages/Stats/components/popular.jsx
new file mode 100644
index 0000000..7f19e7f
--- /dev/null
+++ b/src/pages/Stats/components/popular.jsx
@@ -0,0 +1,50 @@
+import {
+ BarChart,
+ Bar,
+ XAxis,
+ Tooltip,
+ ResponsiveContainer,
+ Cell,
+} from "recharts";
+
+const data = [
+ { name: "وی", value: 120 },
+ { name: "پل", value: 90 },
+ { name: "دولت", value: 60 },
+ { name: "و", value: 180 },
+ { name: "تریح", value: 100 },
+ { name: "دان", value: 110 },
+];
+
+const colors = ["#efecec", "#efecec", "#efecec", "#7f7376", "#efecec", "#efecec"];
+
+export default function CafePopularity() {
+ return (
+
+ {/*
محبوبترین کافهها
*/}
+
+
+
+
+
+
+ {data.map((entry, i) => (
+ |
+ ))}
+
+
+
+
+
+ );
+}
\ No newline at end of file
diff --git a/src/pages/Stats/components/viewstats.jsx b/src/pages/Stats/components/viewstats.jsx
new file mode 100644
index 0000000..b6db325
--- /dev/null
+++ b/src/pages/Stats/components/viewstats.jsx
@@ -0,0 +1,88 @@
+import {
+ ComposedChart,
+ Line,
+ XAxis,
+ YAxis,
+ Tooltip,
+ ResponsiveContainer,
+ Area
+} from "recharts";
+
+const data = [
+ { name: "هفته اول", a: 200000, b: 250000 },
+ { name: "هفته دوم", a: 450000, b: 380000 },
+ { name: "هفته سوم", a: 350000, b: 600000 },
+ { name: "هفته چهارم", a: 150000, b: 500000 },
+ { name: "هفته پنجم", a: 500000, b: 700000 },
+ { name: "هفته ششم", a: 600000, b: 800000 },
+ { name: "هفته هفتم", a: 700000, b: 900000 },
+ { name: "هفته هشتم", a: 800000, b: 950000 },
+ { name: "هفته نهم", a: 900000, b: 1000000 },
+];
+
+export default function VisitorsChart() {
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/src/styles/index.css b/src/styles/index.css
index e2bc351..f643367 100644
--- a/src/styles/index.css
+++ b/src/styles/index.css
@@ -4,29 +4,48 @@
:root {
--color-primary: #7f4629;
--color-button1: #99582a;
-
+ --color-text1: #402e32;
+ --color-text2: #ffffff;
--color-header: #f3efe7;
--color-header2: #e6dbcc;
-
--color-sidebar: #efeeee;
-
--color-background: #fdf8f4;
-
+ --color-hover: #e6dbcc;
+ --color-hover2: #a2795c;
+ --color-thead: #7f4629;
+ --color-border: #7f4629;
--font-sans: "Vazirmatn", system-ui, sans-serif;
-
}
-
.dark {
- --color-primary: #d9cab3;
+ --color-primary: #93836c;
--color-button1: #99582a;
-
+ --color-text1: #fdf8f4;
+ --color-text2: #272322;
--color-header: #342e2c;
--color-header2: #5e5450;
-
--color-sidebar: #564c49;
-
--color-background: #272322;
+ --color-hover: #5e5450;
+ --color-hover2: #a2795c;
+ --color-thead: #d9cab3;
+ --color-border: #93836c;
+}
+
+@theme {
+ --font-MyEstedad: "MyEstedad", sans-serif;
+
+ --color-primary: var(--color-primary);
+ --color-header: var(--color-header);
+ --color-sidebar: var(--color-sidebar);
+ --color-background: var(--color-background);
+ --color-button1: var(--color-button1);
+ --color-text1: var(--color-text1);
+ --color-text2: var(--color-text2);
+ --color-hover: var(--color-hover);
+ --color-hover2: var(--color-hover2);
+ --color-thead: var(--color-thead);
+ --color-border: var(--color-border);
}
/* Chrome / Edge / Safari autofill FIX (light + dark, no color) */
@@ -37,9 +56,9 @@ input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:focus,
select:-webkit-autofill {
- -webkit-box-shadow: 0 0 0 1000px #fdf8f4 inset !important;
- box-shadow: 0 0 0 1000px #fdf8f4 inset !important;
- -webkit-text-fill-color: inherit !important;
+ -webkit-box-shadow: 0 0 0 1000px #fdf8f4 inset !important;
+ box-shadow: 0 0 0 1000px #fdf8f4 inset !important;
+ -webkit-text-fill-color: inherit !important;
}
.dark input:-webkit-autofill,
@@ -48,13 +67,49 @@ select:-webkit-autofill {
.dark textarea:-webkit-autofill,
.dark textarea:-webkit-autofill:focus,
.dark select:-webkit-autofill {
- -webkit-box-shadow: 0 0 0 1000px #272322 inset !important;
- box-shadow: 0 0 0 1000px #272322 inset !important;
- -webkit-text-fill-color: inherit !important;
+ -webkit-box-shadow: 0 0 0 1000px #272322 inset !important;
+ box-shadow: 0 0 0 1000px #272322 inset !important;
+ -webkit-text-fill-color: inherit !important;
}
+.primary {
+ color: var(--color-primary);
+ background-color: var(--color-primary);
+}
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+td,
+body {
+ color: var(--color-text1);
+}
+div:hover
+{
+ color: var(--color-text1);
+}
+
+.dark h1,
+.dark h2,
+.dark h3,
+.dark h4,
+.dark h5,
+.dark h6,
+.dark p,
+.dark span,
+.dark td,
+.dark body {
+ color: var(--color-text1) !important;
+}
+
+.dark div:hover {
+ color: var(--color-text1);
+}
@@ -82,36 +137,7 @@ body {
src: url("/fonts/Estedad.ttf") format("truetype");
}
-@theme {
- --font-MyEstedad: "MyEstedad", sans-serif;
- --color-primary: var(--color-primary);
- --color-header: var(--color-header);
- --color-sidebar: var(--color-sidebar);
- --color-background: var(--color-background);
-
- --color-button1: var(--color-button1);
-
- /* --color-text1: var(--color-text1-menu-and-card);
- --color-text2: var(--color-text2);
- --color-text3: var(--color-text3);
- --color-text4: var(--color-text4);
-
- --color-btn1: var(--color-button1);
- --color-btn2: var(--color-button2);
- --color-btn3: var(--color-button3);
-
- --color-primary1: var(--color-primary1);
- --color-primary2: var(--color-primary2);
- --color-primary3: var(--color-primary3);
- --color-primary4: var(--color-primary4);
- --color-primary5-dark: var(--color-primary5-dark);
- --color-primary6-dark: var(--color-primary6-dark);
-
-
- --color-bg-light: var(--color-background-light);
- --color-bg-dark: var(--color-background-dark); */
-}
@layer base {
html {
@@ -153,8 +179,34 @@ svg {
/* رنگ انتخاب متن (drag select) */
::selection {
- background-color: var(--primary-200);
+ background-color: var(--color-hover);
/* بکگراند انتخاب */
- color: var(--primary-foreground);
+ color: var(--color-text1);
/* رنگ متن انتخاب */
-}
\ No newline at end of file
+}
+
+/* جلوگیری کامل از رینگ / بوردر فوکوس در Recharts */
+.recharts-wrapper:focus,
+.recharts-wrapper:focus-visible,
+.recharts-surface:focus,
+.recharts-surface:focus-visible,
+.recharts-responsive-container:focus,
+.recharts-responsive-container:focus-visible,
+.recharts-layer:focus,
+.recharts-layer:focus-visible,
+svg:focus,
+svg:focus-visible,
+g:focus,
+g:focus-visible {
+ outline: none !important;
+ border: none !important;
+ box-shadow: none !important;
+}
+
+/* برای اطمینان بیشتر روی کل پروژه */
+*:focus,
+*:focus-visible {
+ outline: none !important;
+ box-shadow: none !important;
+}
+
-
);
};
diff --git a/src/components/layout/Sidebar/sidebar.jsx b/src/components/layout/Sidebar/sidebar.jsx
index d6f62e9..5d21f75 100644
--- a/src/components/layout/Sidebar/sidebar.jsx
+++ b/src/components/layout/Sidebar/sidebar.jsx
@@ -1,13 +1,15 @@
import { Link, useLocation, useNavigate } from "react-router-dom";
+import { useState, useEffect } from "react";
import LogoDM from "../../../assets/icons/LogoDM.svg";
+import LogoLM from "../../../assets/icons/Logo-LM.svg";
import { BiBarChartAlt2 } from "react-icons/bi";
import { AiOutlinePieChart } from "react-icons/ai";
import { PiCoffee } from "react-icons/pi";
import { HiOutlineLogout } from "react-icons/hi";
import { FiMenu, FiX } from "react-icons/fi";
+
const SIDEBAR = {
- logo: LogoDM,
navigation: [
{
id: 'dashboard',
@@ -21,6 +23,12 @@ const SIDEBAR = {
icon: PiCoffee,
label: 'مدیریت کافه ها',
},
+ {
+ id: 'users-management',
+ path: '/users-management',
+ icon: PiCoffee,
+ label: 'مدیریت کاربران',
+ },
{
id: 'stats',
path: '/stats',
@@ -33,7 +41,7 @@ const SIDEBAR = {
label: 'خروج',
},
styles: {
- activeColor: '#7F4629',
+ activeColor: 'primary',
inactiveColor: '#402E32',
borderColor: '#D9CAB3',
padding: 'p-2.5',
@@ -45,6 +53,20 @@ const SIDEBAR = {
export default function Sidebar({ className, isOpen, setIsOpen }) {
const location = useLocation();
const navigate = useNavigate();
+ const [currentLogo, setCurrentLogo] = useState(localStorage.getItem('theme') === 'light' ? LogoDM : LogoLM);
+
+ useEffect(() => {
+ const observer = new MutationObserver(() => {
+ setCurrentLogo(localStorage.getItem('theme') === 'light' ? LogoDM : LogoLM);
+ });
+
+ observer.observe(document.documentElement, {
+ attributes: true,
+ attributeFilter: ['class']
+ });
+
+ return () => observer.disconnect();
+ }, []);
const isActive = (path) => location.pathname === path;
@@ -73,25 +95,22 @@ export default function Sidebar({ className, isOpen, setIsOpen }) {
key={item.id}
to={item.path}
onClick={closeSidebar}
- className={`group flex items-center ${SIDEBAR.styles.gap} ${SIDEBAR.styles.rounded} ${SIDEBAR.styles.padding} transition-all duration-200 ${
- active
- ? `bg-[${SIDEBAR.styles.activeColor}] shadow-md`
- : `hover:bg-[${SIDEBAR.styles.activeColor}]`
- }`}
+ className={`group flex items-center ${SIDEBAR.styles.gap} ${SIDEBAR.styles.rounded} ${SIDEBAR.styles.padding} transition-all duration-200 ${active
+ ? `bg-primary shadow-md`
+ : `hover:bg-primary hover:text-text2`
+ }`}
>
+ 
- 
+ 
+
+