add alert

src/components/dashboard/damages/operator/index.jsx

@@ -1,12 +1,35 @@
 "use client";
 import PageTitle from "@/core/components/PageTitle";
-import { Stack } from "@mui/material";
+import { Alert, AlertTitle, List, ListItem, Stack, Typography } from "@mui/material";
 import OperatorList from "./OperatorList";
+import { useState } from "react";
 
 const OperatorPage = () => {
+    const [open, setOpen] = useState(true);
     return (
         <Stack spacing={1}>
             <PageTitle title={"کارتابل عملیات خسارات وارده بر ابنیه فنی و تاسیسات راه"} />
+            {open && (
+                <Alert severity="warning" onClose={() => setOpen(false)}>
+                    <AlertTitle>اطلاعیه مهم – خسارات وارده بر ابنیه فنی و تاسیسات راه</AlertTitle>
+                    <Typography variant="body2" gutterBottom>
+                        کارشناسان محترم،
+                    </Typography>
+                    <Typography variant="body2" gutterBottom>
+                        چنانچه خساراتی که قبلاً ثبت کرده‌اید به مرحله صدور فاکتور رسیده و پس از آن متوجه اشکالی در ثبت
+                        آن‌ها شده‌اید (مانند اشتباه در مبلغ یا سایر اطلاعات)، لازم است:
+                    </Typography>
+                    <List dense sx={{ listStyleType: "decimal", pl: 3 }}>
+                        <ListItem sx={{ display: "list-item" }}>کد یکتای خسارت‌های مربوطه را استخراج نمایید.</ListItem>
+                        <ListItem sx={{ display: "list-item" }}>
+                            با پشتیبانی سامانه تماس بگیرید تا نسبت به حذف آن خسارات اقدام گردد.
+                        </ListItem>
+                    </List>
+                    <Typography variant="body2" fontWeight="bold">
+                        توجه: حذف خسارت‌های مشکل‌دار بسیار حائز اهمیت است و بر امتیاز استانی شما تأثیر مستقیم دارد.
+                    </Typography>
+                </Alert>
+            )}
             <OperatorList />
         </Stack>
     );