first commit

ui/forms/LoginForm.tsx

@@ -0,0 +1,111 @@
+import React, { useState } from "react";
+import {
+  Box,
+  Paper,
+  TextField,
+  Typography,
+  Button,
+  Container,
+  Stack,
+} from "@mui/material";
+import { useApplicantLogin } from "@/hooks/auth.hook";
+import { toast } from "sonner";
+
+export default function LoginLayout() {
+  const [nationalId, setNationalId] = useState("");
+
+  const { mutateAsync, isPending } = useApplicantLogin();
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    try {
+      const { message } = await mutateAsync(nationalId);
+      toast.success(message);
+    } catch (error) {
+      toast.error("خطا رخ داده است");
+    }
+  };
+
+  return (
+    <Box sx={{ display: "flex", height: "100vh", width: "100%" }}>
+      {/* بخش فرم (سمت چپ) */}
+      <Box
+        sx={{
+          flex: 1,
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          backgroundColor: "#fff",
+        }}
+      >
+        <Container maxWidth="xs">
+          <Typography variant="h4" sx={{ fontWeight: 800, mb: 1 }}>
+            خوش آمدید
+          </Typography>
+          <Typography variant="body1" sx={{ color: "text.secondary", mb: 4 }}>
+            براي شروع و يا ادامه فرآيند ، كدملي خود را وارد كنيد
+          </Typography>
+
+          <form onSubmit={handleSubmit}>
+            <TextField
+              fullWidth
+              label="کد ملی"
+              value={nationalId}
+              onChange={(e) =>
+                setNationalId(e.target.value.replace(/[^0-9]/g, ""))
+              }
+              sx={{ mb: 3, textAlign: "center", fontSize: "1.5rem" }}
+            />
+            <Button
+              type="submit"
+              fullWidth
+              variant="contained"
+              size="large"
+              sx={{ py: 1.5, borderRadius: 2, fontSize: "1rem" }}
+            >
+              ورود به سامانه
+            </Button>
+          </form>
+        </Container>
+      </Box>
+
+      {/* بخش تصویری/رنگی (سمت راست) */}
+      <Box
+        sx={{
+          flex: 1,
+          display: { xs: "none", md: "flex" }, // در موبایل مخفی می‌شود
+          flexDirection: "column",
+          justifyContent: "center",
+          alignItems: "center",
+          background: "linear-gradient(135deg, #1e293b 0%, #334155 100%)",
+          color: "white",
+          p: 6,
+          textAlign: "center",
+        }}
+      >
+        {/* لوگو جایگزین */}
+        <Box
+          sx={{
+            width: 80,
+            height: 80,
+            bgcolor: "rgba(255,255,255,0.1)",
+            borderRadius: 4,
+            mb: 4,
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+          }}
+        >
+          <Typography variant="h3">لوگو</Typography>
+        </Box>
+
+        <Typography variant="h4" sx={{ fontWeight: "bold", mb: 2 }}>
+          سامانه جامع استخدامي
+        </Typography>
+        <Typography variant="body1" sx={{ opacity: 0.8, maxWidth: 400 }}>
+          با استفاده از این سامانه، اطلاعات شغلی و رزومه خود را به صورت یکپارچه
+          براي گروه ارسال کنید.
+        </Typography>
+      </Box>
+    </Box>
+  );
+}