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

TF-4 user management edit form

Browse Source
This commit is contained in:
Amin Ghasempoor
2023-09-10 15:08:41 +03:30
parent 77644bbf5f
commit ae8e2a3378
6 changed files with 143 additions and 160 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -278,6 +278,7 @@
"created_at": "تاریخ درخواست",
"updated_at": "تاریخ بروزرسانی",
"navgan_id": "کد ناوگان",
"type_name": "نوع کاربر",
"vehicle_type": "نوع ماشین",
"state_name": "وضعیت درخواست"
},
@@ -318,8 +319,8 @@
"description_error": "وارد کردن توضیحات الزامی است!"
},
"UpdateDialog": {
"update": "تغییر وضعیت درخواست",
"update-tooltip": "بروزرسانی",
"update": "ویرایش",
"update-tooltip": "ویرایش",
"button-cancel": "بستن",
"refahi": "رفاهی",
"navgan": "ناوگان",
@@ -327,7 +328,7 @@
"national_id": "کد ملی",
"type_id": "نوع کاربر",
"navgan_id": "کد ناوگان",
"button-update": "بروزرسانی"
"button-update": "ویرایش"
},
"UploadSystem": {
"upload_file": "فایل خود را بارگذاری کنید",
@@ -344,6 +345,7 @@
"DeleteDialog": {
"delete": "حذف",
"button-cancel": "انصراف",
"typography": "آیا از حدف این مورد اطمینان دارید ؟",
"button-delete": "حذف کردن"
},
"AddDialog": {

6
src/components/dashboard/user-management/Form/AddForm.jsx
View File

@@ -147,11 +147,11 @@ const AddForm = ({mutate, fetchUrl}) => {
formik.touched.type_id &&
Boolean(formik.errors.type_id)
}
onBlur={formik.handleBlur("type_id")}
>
<InputLabel>{t("AddDialog.type_id")}</InputLabel>
<Select
name="type_id"
onBlur={formik.handleBlur("type_id")}
label={t("AddDialog.type_id")}
value={formik.values.type_id}
onChange={formik.handleChange}
@@ -161,10 +161,10 @@ const AddForm = ({mutate, fetchUrl}) => {
sx={{mt: 1}}
>
<MenuItem value={1}>
{t("AddDialog.refahi")}
{t("AddDialog.navgan")}
</MenuItem>
<MenuItem value={2}>
{t("AddDialog.navgan")}
{t("AddDialog.refahi")}
</MenuItem>
</Select>
<FormHelperText>

15
src/components/dashboard/user-management/Form/DeleteForm.jsx
View File

@@ -1,6 +1,15 @@
import {useTranslations} from "next-intl";
import {useState} from "react";
import {Button, Dialog, DialogActions, DialogTitle, IconButton, Tooltip} from "@mui/material";
import {
Button,
Dialog,
DialogActions,
DialogContent,
DialogTitle,
IconButton,
Tooltip,
Typography
} from "@mui/material";
import DeleteIcon from '@mui/icons-material/Delete';
import {DELETE_USER_MANAGEMENT} from "@/core/data/apiRoutes";
import useRequest from "@/lib/app/hooks/useRequest";
@@ -12,7 +21,6 @@ const DeleteForm = ({rowId, fetchUrl, mutate}) => {
const [isSubmitting, setIsSubmitting] = useState(false)
const requestServer = useRequest({auth: true})
const {update_notification} = useNotification()
const handleSubmit = () => {
setIsSubmitting(true)
requestServer(`${DELETE_USER_MANAGEMENT}/${rowId}`, 'delete').then((response) => {
@@ -39,6 +47,9 @@ const DeleteForm = ({rowId, fetchUrl, mutate}) => {
<Dialog fullWidth open={openConfirmDialog}
PaperProps={{sx: {boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}}>
<DialogTitle>{t("DeleteDialog.delete")}</DialogTitle>
<DialogContent>
<Typography>{t("DeleteDialog.typography")}</Typography>
</DialogContent>
<DialogActions>
<Button onClick={() => setOpenConfirmDialog(false)} variant="outlined" color="secondary"
disabled={isSubmitting} autoFocus>

260
src/components/dashboard/user-management/Form/UpdateForm.jsx
View File

@@ -17,31 +17,23 @@ import {
Tooltip
} from "@mui/material";
import {useFormik} from "formik";
import UpdateIcon from '@mui/icons-material/Update';
import BorderColorIcon from '@mui/icons-material/BorderColor';
import {UPDATE_USER_MANAGEMENT} from "@/core/data/apiRoutes";
import useRequest from "@/lib/app/hooks/useRequest";
import useNotification from "@/lib/app/hooks/useNotification";
import * as Yup from "yup";
const UpdateForm = ({rowId, fetchUrl, mutate}) => {
const UpdateForm = ({row, fetchUrl, mutate}) => {
const t = useTranslations();
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
const requestServer = useRequest({auth: true})
const {update_notification} = useNotification()
const validationSchema = Yup.object().shape({
phone_number: Yup.mixed().test(
"is-number",
`${t("AddDialog.phone_number_number")}`,
(value) => !isNaN(value)
).test("positive", `${t("AddDialog.phone_number_positive")}`, (value) => value >= 0)
phone_number: Yup.mixed().test("is-number", `${t("AddDialog.phone_number_number")}`, (value) => !isNaN(value)).test("positive", `${t("AddDialog.phone_number_positive")}`, (value) => value >= 0)
.test("max", `${t("AddDialog.phone_number_max")}`, (value) => value.length <= 11)
.required(t("AddDialog.phone_number_error")),
national_id: Yup.mixed().test(
"is-number",
`${t("AddDialog.national_id_number")}`,
(value) => !isNaN(value)
).test("positive", `${t("AddDialog.national_id_positive")}`, (value) => value >= 0)
national_id: Yup.mixed().test("is-number", `${t("AddDialog.national_id_number")}`, (value) => !isNaN(value)).test("positive", `${t("AddDialog.national_id_positive")}`, (value) => value >= 0)
.test("max", `${t("AddDialog.national_id_max")}`, (value) => value.length <= 10)
.required(t("AddDialog.national_id_error")),
type_id: Yup.number().required(t("AddDialog.type_id_error")),
@@ -50,18 +42,17 @@ const UpdateForm = ({rowId, fetchUrl, mutate}) => {
const formik = useFormik({
initialValues: {
phone_number: "",
national_id: "",
type_id: "",
navgan_id: "",
}, validationSchema,
onSubmit: (values, {setSubmitting}) => {
phone_number: row.getValue("phone_number"),
national_id: row.getValue("national_id"),
type_id: row.original.type_id,
navgan_id: row.getValue("navgan_id"),
}, validationSchema, onSubmit: (values, {setSubmitting}) => {
const formData = new FormData();
formData.append("phone_number", values.phone_number);
formData.append("national_id", values.national_id);
formData.append("type_id", values.type_id);
formData.append("navgan_id", values.navgan_id);
requestServer(`${UPDATE_USER_MANAGEMENT}/${rowId}`, 'post', {
requestServer(`${UPDATE_USER_MANAGEMENT}/${row.getValue("id")}`, 'post', {
data: formData,
}).then((response) => {
mutate(fetchUrl)
@@ -73,132 +64,111 @@ const UpdateForm = ({rowId, fetchUrl, mutate}) => {
},
});
return (
<>
<Tooltip title={t("UpdateDialog.update-tooltip")}>
<IconButton
color="primary"
onClick={() => {
setOpenConfirmDialog(true)
}}
>
<UpdateIcon/>
</IconButton>
</Tooltip>
<Dialog fullWidth open={openConfirmDialog}
PaperProps={{sx: {boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}}>
<DialogTitle>{t("UpdateDialog.update")}</DialogTitle>
<DialogContent>
<Stack spacing={2}>
<Stack>
<TextField
name="phone_number"
rows={8}
label={t("UpdateDialog.phone_number")}
value={formik.values.phone_number}
onChange={(event) => {
if (event.target.value.length <= 11) return formik.handleChange(event)
}}
fullWidth
variant="outlined"
onBlur={formik.handleBlur("phone_number")}
error={
formik.touched.phone_number &&
Boolean(formik.errors.phone_number)
}
helperText={
formik.touched.phone_number && formik.errors.phone_number
}
sx={{mt: 1}}
/>
</Stack>
<Stack>
<TextField
name="national_id"
rows={8}
label={t("UpdateDialog.national_id")}
value={formik.values.national_id}
onChange={(event) => {
if (event.target.value.length <= 10) return formik.handleChange(event)
}}
fullWidth
variant="outlined"
onBlur={formik.handleBlur("national_id")}
error={
formik.touched.national_id &&
Boolean(formik.errors.national_id)
}
helperText={
formik.touched.national_id && formik.errors.national_id
}
sx={{mt: 1}}
/>
</Stack>
<Stack>
<FormControl
error={
formik.touched.type_id &&
Boolean(formik.errors.type_id)
}
onBlur={formik.handleBlur("type_id")}
>
<InputLabel>{t("UpdateDialog.type_id")}</InputLabel>
<Select
name="type_id"
label={t("UpdateDialog.type_id")}
value={formik.values.type_id}
onChange={formik.handleChange}
fullWidth
variant="outlined"
sx={{mt: 1}}
>
<MenuItem value={1}>
{t("UpdateDialog.refahi")}
</MenuItem>
<MenuItem value={2}>
{t("UpdateDialog.navgan")}
</MenuItem>
</Select>
<FormHelperText>
{formik.touched.type_id && formik.errors.type_id}
</FormHelperText>
</FormControl>
</Stack>
<Stack>
<TextField
name="navgan_id"
rows={8}
label={t("UpdateDialog.navgan_id")}
value={formik.values.navgan_id}
onChange={formik.handleChange}
fullWidth
variant="outlined"
onBlur={formik.handleBlur("navgan_id")}
error={
formik.touched.navgan_id &&
Boolean(formik.errors.navgan_id)
}
helperText={
formik.touched.navgan_id && formik.errors.navgan_id
}
sx={{mt: 1}}
/>
</Stack>
return (<>
<Tooltip title={t("UpdateDialog.update-tooltip")}>
<IconButton
color="primary"
onClick={() => {
setOpenConfirmDialog(true)
}}
>
<BorderColorIcon/>
</IconButton>
</Tooltip>
<Dialog fullWidth open={openConfirmDialog}
PaperProps={{sx: {boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}}>
<DialogTitle>{t("UpdateDialog.update")}</DialogTitle>
<DialogContent>
<Stack spacing={2}>
<Stack>
<TextField
name="phone_number"
rows={8}
label={t("UpdateDialog.phone_number")}
value={formik.values.phone_number}
onChange={(event) => {
if (event.target.value.length <= 11) return formik.handleChange(event)
}}
fullWidth
variant="outlined"
onBlur={formik.handleBlur("phone_number")}
error={formik.touched.phone_number && Boolean(formik.errors.phone_number)}
helperText={formik.touched.phone_number && formik.errors.phone_number}
sx={{mt: 1}}
/>
</Stack>
</DialogContent>
<DialogActions>
<Button onClick={() => setOpenConfirmDialog(false)} variant="outlined" color="secondary"
disabled={formik.isSubmitting} autoFocus>
{t("UpdateDialog.button-cancel")}
</Button>
<Button onClick={formik.handleSubmit} variant="contained" color="primary"
disabled={formik.isSubmitting}>
{t("UpdateDialog.button-update")}
</Button>
</DialogActions>
</Dialog>
</>
);
<Stack>
<TextField
name="national_id"
rows={8}
label={t("UpdateDialog.national_id")}
value={formik.values.national_id}
onChange={(event) => {
if (event.target.value.length <= 10) return formik.handleChange(event)
}}
fullWidth
variant="outlined"
onBlur={formik.handleBlur("national_id")}
error={formik.touched.national_id && Boolean(formik.errors.national_id)}
helperText={formik.touched.national_id && formik.errors.national_id}
sx={{mt: 1}}
/>
</Stack>
<Stack>
<FormControl
error={formik.touched.type_id && Boolean(formik.errors.type_id)}
>
<InputLabel>{t("UpdateDialog.type_id")}</InputLabel>
<Select
name="type_id"
label={t("UpdateDialog.type_id")}
value={formik.values.type_id}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
fullWidth
variant="outlined"
sx={{mt: 1}}
>
<MenuItem value={1}>
{t("UpdateDialog.navgan")}
</MenuItem>
<MenuItem value={2}>
{t("UpdateDialog.refahi")}
</MenuItem>
</Select>
<FormHelperText>
{formik.touched.type_id && formik.errors.type_id}
</FormHelperText>
</FormControl>
</Stack>
<Stack>
<TextField
name="navgan_id"
rows={8}
label={t("UpdateDialog.navgan_id")}
value={formik.values.navgan_id}
onChange={formik.handleChange}
fullWidth
variant="outlined"
onBlur={formik.handleBlur("navgan_id")}
error={formik.touched.navgan_id && Boolean(formik.errors.navgan_id)}
helperText={formik.touched.navgan_id && formik.errors.navgan_id}
sx={{mt: 1}}
/>
</Stack>
</Stack>
</DialogContent>
<DialogActions>
<Button onClick={() => setOpenConfirmDialog(false)} variant="outlined" color="secondary"
disabled={formik.isSubmitting} autoFocus>
{t("UpdateDialog.button-cancel")}
</Button>
<Button onClick={formik.handleSubmit} variant="contained" color="primary"
disabled={formik.isSubmitting}>
{t("UpdateDialog.button-update")}
</Button>
</DialogActions>
</Dialog>
</>);
};
export default UpdateForm;

2
src/components/dashboard/user-management/TableRowActions.jsx
View File

@@ -7,7 +7,7 @@ const TableRowActions = ({row, mutate, fetchUrl}) => {
return (
<Box sx={{display: "flex", flexWrap: "nowrap", gap: "8px"}}>
<UpdateForm
rowId={row.getValue("id")}
row={row}
mutate={mutate}
fetchUrl={fetchUrl}
/>

12
src/components/dashboard/user-management/index.jsx
View File

@@ -34,9 +34,9 @@ function DashboardUserManagementComponent() {
),
},
{
accessorFn: (row) => row.name,
id: "name",
header: t("UserManagement.name"),
accessorFn: (row) => row.navgan_id,
id: "navgan_id",
header: t("UserManagement.navgan_id"),
enableColumnFilter: true,
datatype: "text",
filterFn: "contains",
@@ -114,9 +114,9 @@ function DashboardUserManagementComponent() {
),
},
{
accessorFn: (row) => row.state_name,
id: "state_id",
header: t("UserManagement.state_name"),
accessorFn: (row) => row.type_name,
id: "type_name",
header: t("UserManagement.type_name"),
enableColumnFilter: false,
datatype: "numeric",
Cell: ({renderedCellValue}) => (