loan/user-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add register page and debuging login

Browse Source
This commit is contained in:
Mohammad Jalali
2023-07-10 17:13:57 +03:30
parent 5aeb3f0f64
commit 1c7ed780bf
8 changed files with 328 additions and 135 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
public/images/register.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

21
public/locales/fa/app.json
View File

@@ -5,6 +5,7 @@
"first_page": "خوش آمدید",
"login": "ورود",
"login_navy": "ورود اعضای ناوگان",
"register_navy": "ثبت نام اعضای ناوگان",
"login_welfare_services": "ورود اعضای خدمات رفاهی",
"user_welfare_services": "خدمات رفاهی",
"user_navy": "ناوگان",
@@ -34,10 +35,8 @@
"typography_routing_dashbaord_page": "داشبورد..."
},
"LoginPage": {
"text_field_user_name": "نام کاربری",
"text_field_enter_your_username": "نام کاربری خود را وارد کنید",
"text_field_password": "رمز عبور",
"text_field_enter_your_password": "رمز عبور خود را وارد کنید",
"text_field_phone_number": "شماره تلفن",
"text_field_enter_your_phone_number": "شماره تلفن خود را وارد کنید",
"button_submit": "ورود",
"link_routing_back_to": "بازگشت به",
"link_routing_previuos_page": "صفحه قبل",
@@ -45,7 +44,19 @@
"error_message_required": "اجباری!",
"button_make_account": "ایجاد حساب"
},
"dashboard": {
"Dashboard": {
"dashboard_page": "داشبورد"
},
"RegisterPage": {
"link_routing_back_to": "بازگشت به",
"link_routing_login_navy": "صفحه ورود",
"text_field_phone_number": "شماره تلفن",
"text_field_enter_your_phone_number": "شماره تلفن خود را وارد کنید",
"text_field_national_id": "کد ملی",
"text_field_enter_your_national_id": "کد ملی خود را وارد کنید",
"text_field_navgan_id": "شماره ناوگان",
"text_field_enter_your_navgan_id": "شماره ناوگان خود را وارد کنید",
"error_message_required": "اجباری!",
"button_request_verification": "دریافت کد یکبارمصرف"
}
}

56
src/components/first/index.jsx
View File

@@ -4,7 +4,7 @@ import StyledImage from "@/core/components/StyledImage";
import CenterLayout from "@/layouts/CenterLayout";
import FullPageLayout from "@/layouts/FullPageLayout";
import useUser from "@/lib/app/hooks/useUser";
import { Box, Button, Divider, Typography } from "@mui/material";
import { Box, Button, Grid, Typography } from "@mui/material";
import { useTranslations } from "next-intl";
const FirstComponent = () => {
@@ -34,28 +34,42 @@ const FirstComponent = () => {
{t("dashboard")}
</Button>
) : (
<Box sx={{ display: "flex" }}>
<Button
sx={{ mx: 2 }}
variant="contained"
component={NextLinkComposed}
to={{
pathname: "/login-navy",
<Box>
<Grid
container
rowSpacing={{ xs: 1, sm: 0 }}
sx={{
flexDirection: { xs: "column", sm: "row" },
alignItems: "center",
}}
>
{t("login_navy")}
</Button>
<Divider orientation="vertical" flexItem />
<Button
sx={{ mx: 2 }}
variant="contained"
component={NextLinkComposed}
to={{
pathname: "/login-welfare-services",
}}
>
{t("login_welfare_services")}
</Button>
<Grid item xs={12} sm={6} sx={{ px: { xs: 0, sm: 1 } }}>
<Button
sx={{ whiteSpace: "nowrap" }}
variant="contained"
size="large"
component={NextLinkComposed}
to={{
pathname: "/login-navy",
}}
>
{t("login_navy")}
</Button>
</Grid>
<Grid item xs={12} sm={6} sx={{ px: { xs: 0, sm: 1 } }}>
<Button
sx={{ whiteSpace: "nowrap" }}
variant="contained"
size="large"
component={NextLinkComposed}
to={{
pathname: "/login-welfare-services",
}}
>
{t("login_welfare_services")}
</Button>
</Grid>
</Grid>
</Box>
)}
</CenterLayout>

106
src/components/login-navy/index.jsx
View File

@@ -1,6 +1,5 @@
import LinkRouting from "@/core/components/LinkRouting";
// import Notifications from "@/core/components/notifications";
import PasswordField from "@/core/components/PasswordField";
import StyledForm from "@/core/components/StyledForm";
// import { GET_USER_TOKEN } from "@/core/data/apiRoutes";
import CenterLayout from "@/layouts/CenterLayout";
@@ -13,6 +12,7 @@ import {
Box,
Button,
Container,
Grid,
Paper,
Stack,
TextField,
@@ -35,27 +35,24 @@ const LoginComponent = () => {
const backUrlDecodedPath = searchParams.get("back_url");
// formik properties
// const handleSubmit = async (values, props) => {
// await axios
// .post(GET_USER_TOKEN, {
// username: values.username,
// password: values.password,
// })
// .then(function (response) {
// setToken(response.data.token);
// })
// .catch(function (error) {
// Notifications(directionApp, error.response, t);
// props.setSubmitting(false);
// });
// };
// const handleSubmit = async (values, props) => {
// await axios
// .post(GET_USER_TOKEN, {
// phone_number: values.phone_number,
// })
// .then(function (response) {
// setToken(response.data.token);
// })
// .catch(function (error) {
// Notifications(directionApp, error.response, t);
// props.setSubmitting(false);
// });
// };
const initialValues = {
username: "",
password: "",
phone_number: ""
};
const validationSchema = Yup.object().shape({
username: Yup.string().required(t("LoginPage.error_message_required")),
password: Yup.string().required(t("LoginPage.error_message_required")),
phone_number: Yup.string().required(t("LoginPage.error_message_required"))
});
return (
@@ -82,66 +79,57 @@ const LoginComponent = () => {
<Stack spacing={3} sx={{ p: 2 }}>
<Field
as={TextField}
name="username"
name="phone_number"
variant="outlined"
label={t("LoginPage.text_field_user_name")}
label={t("LoginPage.text_field_phone_number")}
placeholder={t(
"LoginPage.text_field_enter_your_username"
"LoginPage.text_field_enter_your_phone_number"
)}
type={"text"}
error={
props.touched.username && props.errors.username
props.touched.phone_number && props.errors.phone_number
? true
: false
}
fullWidth
helperText={
props.touched.username ? props.errors.username : null
props.touched.phone_number ? props.errors.phone_number : null
}
/>
<PasswordField
name="password"
label={t("LoginPage.text_field_password")}
error={
props.touched.password && props.errors.password
? true
: false
}
helperText={
props.touched.password ? props.errors.password : null
}
placeholder={t(
"LoginPage.text_field_enter_your_password"
)}
/>
<Box
<Grid
container
rowSpacing={{ xs: 1, sm: 0 }}
sx={{
display: "flex",
alignItems: "center",
justifyContent: "space-between",
flexDirection: { xs: "column-reverse", sm: "row" },
}}
>
<LinkRouting href={"/register-navy"}>
<Grid item xs={12} sm={6} sx={{ pr: { xs: 0, sm: 1 } }}>
<LinkRouting href={"/register-navy"}>
<Button
fullWidth
type="submit"
variant="outlined"
size="large"
endIcon={<PersonAddIcon />}
disabled={props.isSubmitting ? true : false}
>
{t("LoginPage.button_make_account")}
</Button>
</LinkRouting>
</Grid>
<Grid item xs={12} sm={6} sx={{ pl: { xs: 0, sm: 1 } }}>
<Button
fullWidth
type="submit"
variant="outlined"
size="small"
endIcon={<PersonAddIcon />}
variant="contained"
size="large"
endIcon={<LoginIcon />}
disabled={props.isSubmitting ? true : false}
>
{t("LoginPage.button_submit")}
</Button>
</LinkRouting>
{t("LoginPage.button_make_account")}
<Button
type="submit"
variant="contained"
size="medium"
endIcon={<LoginIcon />}
disabled={props.isSubmitting ? true : false}
>
{t("LoginPage.button_submit")}
</Button>
</Box>
</Grid>
</Grid>
</Stack>
</StyledForm>
</Stack>

82
src/components/login-welfare-services/index.jsx
View File

@@ -1,6 +1,5 @@
import LinkRouting from "@/core/components/LinkRouting";
// import Notifications from "@/core/components/notifications";
import PasswordField from "@/core/components/PasswordField";
import StyledForm from "@/core/components/StyledForm";
// import { GET_USER_TOKEN } from "@/core/data/apiRoutes";
import CenterLayout from "@/layouts/CenterLayout";
@@ -13,6 +12,7 @@ import {
Box,
Button,
Container,
Grid,
Paper,
Stack,
TextField,
@@ -38,8 +38,7 @@ const LoginComponent = () => {
// const handleSubmit = async (values, props) => {
// await axios
// .post(GET_USER_TOKEN, {
// username: values.username,
// password: values.password,
// phone_number: values.phone_number
// })
// .then(function (response) {
// setToken(response.data.token);
@@ -50,12 +49,10 @@ const LoginComponent = () => {
// });
// };
const initialValues = {
username: "",
password: "",
phone_number: ""
};
const validationSchema = Yup.object().shape({
username: Yup.string().required(t("LoginPage.error_message_required")),
password: Yup.string().required(t("LoginPage.error_message_required")),
phone_number: Yup.string().required(t("LoginPage.error_message_required"))
});
return (
@@ -82,66 +79,57 @@ const LoginComponent = () => {
<Stack spacing={3} sx={{ p: 2 }}>
<Field
as={TextField}
name="username"
name="phone_number"
variant="outlined"
label={t("LoginPage.text_field_user_name")}
label={t("LoginPage.text_field_phone_number")}
placeholder={t(
"LoginPage.text_field_enter_your_username"
"LoginPage.text_field_enter_your_phone_number"
)}
type={"text"}
error={
props.touched.username && props.errors.username
props.touched.phone_number && props.errors.phone_number
? true
: false
}
fullWidth
helperText={
props.touched.username ? props.errors.username : null
props.touched.phone_number ? props.errors.phone_number : null
}
/>
<PasswordField
name="password"
label={t("LoginPage.text_field_password")}
error={
props.touched.password && props.errors.password
? true
: false
}
helperText={
props.touched.password ? props.errors.password : null
}
placeholder={t(
"LoginPage.text_field_enter_your_password"
)}
/>
<Box
<Grid
container
rowSpacing={{ xs: 1, sm: 0 }}
sx={{
display: "flex",
alignItems: "center",
justifyContent: "space-between",
flexDirection: { xs: "column-reverse", sm: "row" },
}}
>
<LinkRouting href={"/register-welfare-services"}>
<Grid item xs={12} sm={6} sx={{ pr: { xs: 0, sm: 1 } }}>
<LinkRouting href={"/register-navy"}>
<Button
fullWidth
type="submit"
variant="outlined"
size="large"
endIcon={<PersonAddIcon />}
disabled={props.isSubmitting ? true : false}
>
{t("LoginPage.button_make_account")}
</Button>
</LinkRouting>
</Grid>
<Grid item xs={12} sm={6} sx={{ pl: { xs: 0, sm: 1 } }}>
<Button
fullWidth
type="submit"
variant="outlined"
size="small"
endIcon={<PersonAddIcon />}
variant="contained"
size="large"
endIcon={<LoginIcon />}
disabled={props.isSubmitting ? true : false}
>
{t("LoginPage.button_make_account")}
{t("LoginPage.button_submit")}
</Button>
</LinkRouting>
<Button
type="submit"
variant="contained"
size="medium"
endIcon={<LoginIcon />}
disabled={props.isSubmitting ? true : false}
>
{t("LoginPage.button_submit")}
</Button>
</Box>
</Grid>
</Grid>
</Stack>
</StyledForm>
</Stack>

191
src/components/register-navy/index.jsx
View File

@@ -0,0 +1,191 @@
import StyledForm from "@/core/components/StyledForm";
import {
Box,
Button,
Container,
Paper,
Stack,
Typography,
TextField,
} from "@mui/material";
import { Field, Formik } from "formik";
import Image from "next/image";
import FingerprintIcon from "@mui/icons-material/Fingerprint";
import FullPageLayout from "@/layouts/FullPageLayout";
import CenterLayout from "@/layouts/CenterLayout";
import { useTranslations } from "next-intl";
import * as Yup from "yup";
import LinkRouting from "@/core/components/LinkRouting";
import { useSearchParams } from "next/navigation";
import useDirection from "@/lib/app/hooks/useDirection";
import useUser from "@/lib/app/hooks/useUser";
// import { GET_USER_TOKEN } from "@/core/data/apiRoutes";
// import axios from "axios";
const RegisterNavyComponent = () => {
const t = useTranslations();
const { directionApp } = useDirection();
const { setToken } = useUser();
const searchParams = useSearchParams();
const backUrlDecodedPath = searchParams.get("back_url");
const initialValues = {
type_id: "1",
phone_number: "",
national_id: "",
navgan_id: "",
};
const validationSchema = Yup.object().shape({
phone_number: Yup.string().required(
t("RegisterPage.error_message_required")
),
national_id: Yup.string().required(
t("RegisterPage.error_message_required")
),
navgan_id: Yup.string().required(t("RegisterPage.error_message_required")),
});
// const handleSubmit = async (values, props) => {
// await axios
// .post(GET_USER_TOKEN, {
// type_id: values.type_id,
// national_id: values.national_id,
// navgan_id: values.navgan_id,
// phone_number: values.phone_number,
// })
// .then(function (response) {
// setToken(response.data.token);
// })
// .catch(function (error) {
// Notifications(directionApp, error.response, t);
// props.setSubmitting(false);
// });
// };
return (
<FullPageLayout sx={{ p: 1 }}>
<CenterLayout>
<Container maxWidth="sm">
<Paper elevation={0}>
<Formik
initialValues={initialValues}
// onSubmit={handleSubmit}
validationSchema={validationSchema}
>
{(props) => (
<Stack spacing={2} sx={{ p: 2 }}>
<Box
sx={{ position: "relative", width: "100%", height: 200 }}
>
<Image
fill
src="/images/register.svg"
alt={t("app_name")}
/>
</Box>
<Typography margin={2} variant="h4" textAlign="center">
{t("register_navy")}
</Typography>
<StyledForm sx={{ width: "100%" }}>
<Stack spacing={3} sx={{ p: 2 }}>
<Field
as={TextField}
name="phone_number"
variant="outlined"
label={t("RegisterPage.text_field_phone_number")}
placeholder={t(
"RegisterPage.text_field_enter_your_phone_number"
)}
type={"text"}
error={
props.touched.phone_number &&
props.errors.phone_number
? true
: false
}
fullWidth
helperText={
props.touched.phone_number
? props.errors.phone_number
: null
}
/>
<Field
as={TextField}
name="national_id"
variant="outlined"
label={t("RegisterPage.text_field_national_id")}
placeholder={t(
"RegisterPage.text_field_enter_your_national_id"
)}
type={"text"}
error={
props.touched.national_id && props.errors.national_id
? true
: false
}
fullWidth
helperText={
props.touched.national_id
? props.errors.national_id
: null
}
/>
<Field
as={TextField}
name="navgan_id"
variant="outlined"
label={t("RegisterPage.text_field_navgan_id")}
placeholder={t(
"RegisterPage.text_field_enter_your_navgan_id"
)}
type={"text"}
error={
props.touched.navgan_id && props.errors.navgan_id
? true
: false
}
fullWidth
helperText={
props.touched.navgan_id
? props.errors.navgan_id
: null
}
/>
<Button
fullWidth
type="submit"
variant="contained"
size="large"
endIcon={<FingerprintIcon />}
disabled={props.isSubmitting ? true : false}
>
{t("RegisterPage.button_request_verification")}
</Button>
</Stack>
</StyledForm>
</Stack>
)}
</Formik>
</Paper>
</Container>
</CenterLayout>
<Stack direction="row" alignItems="center" justifyContent="center">
<LinkRouting
sx={{ margin: 2 }}
href={
backUrlDecodedPath
? decodeURIComponent(backUrlDecodedPath)
: "/login-navy"
}
>
{t("RegisterPage.link_routing_back_to")}{" "}
{t("RegisterPage.link_routing_login_navy")}
</LinkRouting>
</Stack>
</FullPageLayout>
);
};
export default RegisterNavyComponent;

2
src/pages/dashboard/index.jsx
View File

@@ -6,7 +6,7 @@ import { parse } from "next-useragent";
export default function Dashboard() {
return (
<WithAuthMiddleware>
<TitlePage text="dashboard.dashboard_page" />
<TitlePage text="Dashboard.dashboard_page" />
<DashboardFirstComponent />
</WithAuthMiddleware>
);

4
src/pages/register-navy.jsx
View File

@@ -1,4 +1,4 @@
import RegisterComponent from "@/components/register-navy";
import RegisterNavyComponent from "@/components/register-navy";
import TitlePage from "@/core/components/TitlePage";
import WithoutAuthMiddleware from "@/middlewares/WithoutAuth";
import { parse } from "next-useragent";
@@ -11,7 +11,7 @@ export default function RegisterNavy() {
return (
<WithoutAuthMiddleware>
<TitlePage text="Titles.title_register_navy_page" />
<RegisterComponent />
<RegisterNavyComponent />
{directionApp === "rtl" ? <ToastContainer rtl /> : <ToastContainer ltr />}
</WithoutAuthMiddleware>
);