first commit

2026-05-23 13:22:10 +03:30
parent 5f9ee72174
commit 6591a52f27
52 changed files with 3937 additions and 133 deletions
--- a/ui/Test.tsx
+++ b/ui/Test.tsx
@@ -0,0 +1,83 @@
+import {
+  Box,
+  Card,
+  CardContent,
+  Typography,
+  Button,
+  Stack,
+} from "@mui/material";
+import VisibilityIcon from "@mui/icons-material/Visibility";
+import FileDownloadIcon from "@mui/icons-material/FileDownload";
+
+const DataCategories = () => {
+  // لیست کارت‌ها (میتوانید این را از دیتابیس بگیرید)
+  const categories = [
+    { id: 1, title: "آماركلي" },
+    { id: 2, title: "تیکت‌های در انتظار" },
+    { id: 3, title: "تيكت هاي بحراني" },
+    { id: 4, title: "گزارش‌های ماهانه" },
+    { id: 5, title: "گزارش‌های ماهانه" },
+    { id: 6, title: "گزارش‌های ماهانه" },
+    { id: 7, title: "گزارش‌های ماهانه" },
+    { id: 8, title: "گزارش‌های ماهانه" },
+    { id: 9, title: "گزارش‌های ماهانه" },
+    { id: 10, title: "گزارش‌های ماهانه" },
+    { id: 11, title: "گزارش‌های ماهانه" },
+    { id: 12, title: "گزارش‌های ماهانه" },
+    { id: 13, title: "گزارش‌های ماهانه" },
+  ];
+
+  return (
+    <Box
+      sx={{
+        display: "grid",
+        // ریسپانسیو بودن: در موبایل ۱ ستون، در تبلت ۲، در دسکتاپ ۴ ستون
+        gridTemplateColumns: {
+          xs: "1fr",
+          sm: "1fr 1fr",
+          md: "repeat(6, 1fr)",
+        },
+        gap: 3,
+      }}
+    >
+      {categories.map((item) => (
+        <Card
+          key={item.id}
+          sx={{
+            aspectRatio: "1/1", // مربع کردن کارت
+            display: "flex",
+            flexDirection: "column",
+            justifyContent: "space-between",
+            transition: "0.3s",
+            "&:hover": { boxShadow: 6, transform: "translateY(-5px)" },
+          }}
+        >
+          <CardContent>
+            <Typography variant="h6" align="center" gutterBottom>
+              {item.title}
+            </Typography>
+          </CardContent>
+
+          <Stack spacing={1} sx={{ p: 2 }}>
+            {/* <Button
+              variant="contained"
+              startIcon={<VisibilityIcon />}
+              fullWidth
+            >
+              مشاهده
+            </Button> */}
+            <Button
+              variant="outlined"
+              startIcon={<FileDownloadIcon />}
+              fullWidth
+            >
+              اکسل
+            </Button>
+          </Stack>
+        </Card>
+      ))}
+    </Box>
+  );
+};
+
+export default DataCategories;