From 5061c515252b0e7d0bec3f50816599c8ee23eeed Mon Sep 17 00:00:00 2001 From: AmirHossein Mahmoodi Date: Wed, 7 May 2025 09:05:21 +0330 Subject: [PATCH 1/8] change colors --- src/core/utils/theme.js | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/src/core/utils/theme.js b/src/core/utils/theme.js index 64f93f8..49bc95d 100644 --- a/src/core/utils/theme.js +++ b/src/core/utils/theme.js @@ -9,19 +9,21 @@ const theme = createTheme({ }, palette: { primary: { - main: "#0D47A1", - contrastText: "#fff", + main: "#1b4332", + contrastText: "#FFFFFF", + }, secondary: { - main: "#90A4AE", + main: "#1B4043", + contrastText: "#FFFFFF", }, }, components: { MuiBackdrop: { styleOverrides: { root: { - backdropFilter: "blur(2px)", - backgroundColor: "rgba(0, 0, 0, 0.5)", + backdropFilter: "blur(3px)", + backgroundColor: "rgba(0, 0, 0, 0.3)", }, }, }, From 9603d68e333762aab9d4c1b7cd78b44435eb1421 Mon Sep 17 00:00:00 2001 From: AmirHossein Mahmoodi Date: Wed, 7 May 2025 09:05:50 +0330 Subject: [PATCH 2/8] add change password --- .../Profile/ChangePassword/Form.jsx | 185 ++++++++++++++++++ .../Profile/ChangePassword/index.jsx | 45 +++++ .../components/Profile/ProfileActions.jsx | 5 +- src/core/utils/routes.js | 1 + 4 files changed, 234 insertions(+), 2 deletions(-) create mode 100644 src/core/components/Profile/ChangePassword/Form.jsx create mode 100644 src/core/components/Profile/ChangePassword/index.jsx diff --git a/src/core/components/Profile/ChangePassword/Form.jsx b/src/core/components/Profile/ChangePassword/Form.jsx new file mode 100644 index 0000000..01b7503 --- /dev/null +++ b/src/core/components/Profile/ChangePassword/Form.jsx @@ -0,0 +1,185 @@ +"use client"; + +import { + Chip, + Divider, + FormControl, + FormHelperText, + Grid, + IconButton, + InputAdornment, + InputLabel, + OutlinedInput, +} from "@mui/material"; +import StyledForm from "@/core/components/StyledForm"; +import { useForm } from "react-hook-form"; +import { CHANGE_USER_PASSWORD } from "@/core/utils/routes"; +import { object, string } from "yup"; +import { yupResolver } from "@hookform/resolvers/yup"; +import { useEffect, useState } from "react"; +import Visibility from "@mui/icons-material/Visibility"; +import VisibilityOff from "@mui/icons-material/VisibilityOff"; +import useRequest from "@/lib/hooks/useRequest"; + +const validationSchema = object({ + current_password: string().required("اجباری"), + new_password: string().required("اجباری"), + repeat_new_password: string() + .required("اجباری") + .test( + "password-match", + "رمز عبور جدید و تکرار آن باید یکسان باشند", + function (value) { + return this.parent.new_password === value; + }, + ), +}); + +const Form = ({ handleCloseForm, setLoading }) => { + const request = useRequest(); + const [showNewPassword, setShowNewPassword] = useState(); + const [showRepeatNewPassword, setShowRepeatNewPassword] = useState(); + + const defaultValues = { + current_password: "", + new_password: "", + repeat_new_password: "", + }; + + const { + register, + handleSubmit, + formState: { isSubmitting, errors }, + } = useForm({ defaultValues, resolver: yupResolver(validationSchema) }); + + useEffect(() => { + setLoading(isSubmitting); + }, [isSubmitting]); + + const onSubmit = async (data) => { + console.log(data); + + const formData = new FormData(); + formData.append("current_password", data.current_password); + formData.append("new_password", data.new_password); + try { + await request(CHANGE_USER_PASSWORD, "post", { data: formData }); + handleCloseForm(); + } catch (error) {} + }; + + return ( + <> + + + + + + + + رمز عبور فعلی + + + {errors.current_password + ? errors.current_password.message + : null} + + + + + + رمز عبور جدید + + setShowNewPassword(!showNewPassword)} + onMouseDown={(event) => event.preventDefault()} + edge="end" + > + {showNewPassword ? : } + + + } + /> + + {errors.new_password ? errors.new_password.message : null} + + + + + + + تکرار رمز عبور جدید + + + + setShowRepeatNewPassword(!showRepeatNewPassword) + } + onMouseDown={(event) => event.preventDefault()} + edge="end" + > + {showRepeatNewPassword ? ( + + ) : ( + + )} + + + } + /> + + {errors.repeat_new_password + ? errors.repeat_new_password.message + : null} + + + + + + + ); +}; +export default Form; diff --git a/src/core/components/Profile/ChangePassword/index.jsx b/src/core/components/Profile/ChangePassword/index.jsx new file mode 100644 index 0000000..366584b --- /dev/null +++ b/src/core/components/Profile/ChangePassword/index.jsx @@ -0,0 +1,45 @@ +"use client"; + +import { Button, Dialog, DialogActions, DialogContent } from "@mui/material"; +import SaveIcon from "@mui/icons-material/Save"; +import { useState } from "react"; +import Form from "./Form"; + +const ChangePassword = ({ open, setOpen }) => { + const [loading, setLoading] = useState(false); + + const handleCloseForm = () => { + setOpen(false); + }; + + return ( + + +
+ + + + + +
+ ); +}; +export default ChangePassword; diff --git a/src/core/components/Profile/ProfileActions.jsx b/src/core/components/Profile/ProfileActions.jsx index eeb500c..fde87b9 100644 --- a/src/core/components/Profile/ProfileActions.jsx +++ b/src/core/components/Profile/ProfileActions.jsx @@ -7,6 +7,7 @@ import PowerSettingsNewIcon from "@mui/icons-material/PowerSettingsNew"; import VpnKeyIcon from "@mui/icons-material/VpnKey"; import { Box, Divider, IconButton, Tooltip } from "@mui/material"; import { useState } from "react"; +import ChangePassword from "./ChangePassword"; const ProfileActions = () => { const { getUser, logout } = useAuth(); @@ -65,8 +66,8 @@ const ProfileActions = () => { - {/* - */} + {/* */} + ); }; diff --git a/src/core/utils/routes.js b/src/core/utils/routes.js index 37e72fe..577f689 100644 --- a/src/core/utils/routes.js +++ b/src/core/utils/routes.js @@ -1,6 +1,7 @@ const api = process.env.NEXT_PUBLIC_API_URL; export const GET_USER_ROUTE = api + "/profile/info"; +export const CHANGE_USER_PASSWORD = api + "/profile/change_password"; export const GET_USER_LOGIN_ROUTE = api + "/auth/login"; export const GET_USER_LOGOUT_ROUTE = api + "/auth/logout"; export const GET_PERMISSIONS_ROUTE = ""; From 883a68062f82c5a0b6f23d0e3c0b87d4192b0838 Mon Sep 17 00:00:00 2001 From: AmirHossein Mahmoodi Date: Wed, 7 May 2025 09:06:06 +0330 Subject: [PATCH 3/8] add telephone_id --- src/components/Login/Form/index.jsx | 84 +++++++++++++++++++++++++++-- 1 file changed, 79 insertions(+), 5 deletions(-) diff --git a/src/components/Login/Form/index.jsx b/src/components/Login/Form/index.jsx index 99ae58d..4cb925a 100644 --- a/src/components/Login/Form/index.jsx +++ b/src/components/Login/Form/index.jsx @@ -5,21 +5,39 @@ import { GET_USER_LOGIN_ROUTE } from "@/core/utils/routes"; import { useAuth } from "@/lib/contexts/auth"; import useRequest from "@/lib/hooks/useRequest"; import { yupResolver } from "@hookform/resolvers/yup"; -import { Button, Container, Stack, Typography } from "@mui/material"; +import { + Lock, + Person, + PhoneCallback, + Visibility, + VisibilityOff, +} from "@mui/icons-material"; +import { + Button, + Container, + IconButton, + InputAdornment, + Stack, + Typography, +} from "@mui/material"; +import { useState } from "react"; import { Controller, useForm } from "react-hook-form"; import { object, string } from "yup"; const LoginForm = () => { + const [showPassword, setShowPassword] = useState(false); const requestServer = useRequest(); const { getUser } = useAuth(); const defaultValues = { username: "", password: "", + telephone_id: "", }; const validationSchema = object({ username: string().required("لطفا نام کاربری را وارد کنید!"), password: string().required("لطفا رمز عبور را وارد کنید!"), + telephone_id: string().required("لطفا شماره تماس داخلی را وارد کنید!"), }); const { @@ -32,18 +50,19 @@ const LoginForm = () => { mode: "all", }); + const handleClickShowPassword = () => setShowPassword((show) => !show); + const onSubmit = async (data) => { try { const formData = new FormData(); formData.append("username", data.username); formData.append("password", data.password); + formData.append("telephone_id", data.telephone_id); await requestServer(GET_USER_LOGIN_ROUTE, "post", { data: formData, }); getUser(); - } catch (error) { - console.error("Login error:", error); - } + } catch (error) {} }; return ( @@ -82,6 +101,15 @@ const LoginForm = () => { {...field} label="نام کاربری" variant="outlined" + slotProps={{ + input: { + endAdornment: ( + + + + ), + }, + }} fullWidth error={!!error} helperText={!!error && error.message} @@ -98,7 +126,27 @@ const LoginForm = () => { {...field} label="رمزعبور" variant="outlined" - type="password" + type={showPassword ? "text" : "password"} + slotProps={{ + input: { + startAdornment: ( + + + {showPassword ? ( + + ) : ( + + )} + + + ), + endAdornment: ( + + + + ), + }, + }} fullWidth error={!!error} helperText={!!error && error.message} @@ -107,6 +155,32 @@ const LoginForm = () => { }} name={"password"} /> + { + return ( + + + + ), + }, + }} + fullWidth + error={!!error} + helperText={!!error && error.message} + /> + ); + }} + name={"telephone_id"} + />