enable custom tollbar
This commit is contained in:
@@ -42,6 +42,7 @@
|
||||
"province-head-expert": "کارشناس ستادی",
|
||||
"change-password": "تغییر رمز عبور",
|
||||
"development-assistant": "معاون توسعه",
|
||||
"user-management": "مدیریت کاربر",
|
||||
"edit-profile": "ویرایش پروفایل"
|
||||
},
|
||||
"secondary": {
|
||||
@@ -95,6 +96,7 @@
|
||||
"development_assistant_page": "معاون توسعه",
|
||||
"inspector_expert_page": "بازدید کارشناس",
|
||||
"commercial_chief_page": "رئیس اداره بازرگانی",
|
||||
"user_management_page": "مدیریت کاربر",
|
||||
"edit_profile": "ویرایش پروفایل"
|
||||
},
|
||||
"MuiDatePicker": {
|
||||
@@ -268,6 +270,17 @@
|
||||
"vehicle_type": "نوع ماشین",
|
||||
"state_name": "وضعیت درخواست"
|
||||
},
|
||||
"UserManagement": {
|
||||
"name": "نام",
|
||||
"id": "کد یکتا",
|
||||
"national_id": "کد ملی",
|
||||
"phone_number": "موبایل",
|
||||
"created_at": "تاریخ درخواست",
|
||||
"updated_at": "تاریخ بروزرسانی",
|
||||
"navgan_id": "کد ناوگان",
|
||||
"vehicle_type": "نوع ماشین",
|
||||
"state_name": "وضعیت درخواست"
|
||||
},
|
||||
"ConfirmDialog": {
|
||||
"confirm": "تایید",
|
||||
"context": "آیا از تایید این آیتم اطمینان دارید؟",
|
||||
@@ -321,5 +334,25 @@
|
||||
"upload_file_format": "فرمت قابل قبول : png,jpg,pdf",
|
||||
"delete": "پاک کردن",
|
||||
"uploadfile_error": "حجم فایل بیشتر از 2 مگابایت می باشد"
|
||||
},
|
||||
"DeleteDialog": {
|
||||
"delete": "حذف",
|
||||
"button-cancel": "انصراف",
|
||||
"button-delete": "حذف کردن"
|
||||
},
|
||||
"AddDialog": {
|
||||
"add": "اضافه کردن",
|
||||
"phone_number": "شماره تلفن",
|
||||
"phone_number_positive": "شماره تلفن باید مثبت باشد",
|
||||
"phone_number_error": "وارد کردن شماره تلفن الزامیست",
|
||||
"type_id_error": "وارد کردن نوع کاربر الزامیست",
|
||||
"navgan_id_error": "وارد کردن کد ناوگان الزامیست",
|
||||
"national_id_error": "وارد کردن کد ملی الزامیست",
|
||||
"phone_number_number": "شماره تلفن باید شامل اعداد باشد",
|
||||
"national_id": "کد ملی",
|
||||
"type_id": "نوع کاربر",
|
||||
"navgan_id": "کد ناوگان",
|
||||
"button-cancel": "انصراف",
|
||||
"button-add": "اضافه کردن"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -131,7 +131,7 @@ function DashboardCommercialChiefComponent() {
|
||||
tableUrl={GET_COMMERCIAL_CHIEF}
|
||||
columns={columns}
|
||||
selectableRow={false}
|
||||
enableCustomToolbar={true}
|
||||
enableCustomToolbar={false}
|
||||
enableLastUpdate={true}
|
||||
enablePinning={true}
|
||||
enableDensityToggle={false}
|
||||
|
||||
@@ -132,7 +132,7 @@ function DashboardDevelopmentAssistantComponent() {
|
||||
tableUrl={GET_DEVELOPMENT_ASSISTANT}
|
||||
columns={columns}
|
||||
selectableRow={false}
|
||||
enableCustomToolbar={true}
|
||||
enableCustomToolbar={false}
|
||||
enableLastUpdate={true}
|
||||
enablePinning={true}
|
||||
enableDensityToggle={false}
|
||||
|
||||
@@ -131,7 +131,7 @@ function DashboardInspectorExpertComponent() {
|
||||
tableUrl={GET_INSPECTOR_EXPERT}
|
||||
columns={columns}
|
||||
selectableRow={false}
|
||||
enableCustomToolbar={true}
|
||||
enableCustomToolbar={false}
|
||||
enableLastUpdate={true}
|
||||
enablePinning={true}
|
||||
enableDensityToggle={false}
|
||||
|
||||
@@ -162,7 +162,7 @@ function DashboardMachinaryOfficeComponent() {
|
||||
tableUrl={GET_MACHINARY_OFFICE}
|
||||
columns={columns}
|
||||
selectableRow={false}
|
||||
enableCustomToolbar={true}
|
||||
enableCustomToolbar={false}
|
||||
enableLastUpdate={true}
|
||||
enablePinning={true}
|
||||
enableDensityToggle={false}
|
||||
|
||||
@@ -132,8 +132,7 @@ function DashboardNavganLoanManagementComponent() {
|
||||
tableUrl={GET_LOAN_MANAGEMENT_NAVGAN}
|
||||
columns={columns}
|
||||
selectableRow={false}
|
||||
enableCustomToolbar={true}
|
||||
// CustomToolbar={<TableToolbar />}
|
||||
enableCustomToolbar={false}
|
||||
enableLastUpdate={true}
|
||||
enablePinning={true}
|
||||
enableDensityToggle={false}
|
||||
|
||||
@@ -163,7 +163,7 @@ function DashboardNavganProvinceManagerComponent() {
|
||||
tableUrl={GET_NAVGAN_PROVINCE_MANAGER}
|
||||
columns={columns}
|
||||
selectableRow={false}
|
||||
enableCustomToolbar={true}
|
||||
enableCustomToolbar={false}
|
||||
enableLastUpdate={true}
|
||||
enablePinning={true}
|
||||
enableDensityToggle={false}
|
||||
|
||||
@@ -40,7 +40,7 @@ const Confirm = ({rowId, fetchUrl, mutate}) => {
|
||||
"is-number",
|
||||
`${t("ConfirmDialog.approved_amount_number")}`,
|
||||
(value) => !isNaN(value)
|
||||
).test("positive", `${t("ConfirmDialog.proposed_amount_positive")}`, (value) => value >= 0)
|
||||
).test("positive", `${t("ConfirmDialog.approved_amount_positive")}`, (value) => value >= 0)
|
||||
.required(t("ConfirmDialog.approved_amount_error"))
|
||||
});
|
||||
const formik = useFormik({
|
||||
|
||||
@@ -163,8 +163,7 @@ function DashboardPassengerOfficeComponent() {
|
||||
tableUrl={GET_PASSENGER_BOSS}
|
||||
columns={columns}
|
||||
selectableRow={false}
|
||||
enableCustomToolbar={true}
|
||||
// CustomToolbar={<TableToolbar />}
|
||||
enableCustomToolbar={false}
|
||||
enableLastUpdate={true}
|
||||
enablePinning={true}
|
||||
enableDensityToggle={false}
|
||||
|
||||
@@ -163,8 +163,7 @@ function DashboardPassengerOfficeComponent() {
|
||||
tableUrl={GET_PASSENGER_OFFICE}
|
||||
columns={columns}
|
||||
selectableRow={false}
|
||||
enableCustomToolbar={true}
|
||||
// CustomToolbar={<TableToolbar />}
|
||||
enableCustomToolbar={false}
|
||||
enableLastUpdate={true}
|
||||
enablePinning={true}
|
||||
enableDensityToggle={false}
|
||||
|
||||
@@ -132,7 +132,7 @@ function DashboardProvinceHeadExpertComponent() {
|
||||
tableUrl={GET_PROVINCE_HEAD_EXPERT}
|
||||
columns={columns}
|
||||
selectableRow={false}
|
||||
enableCustomToolbar={true}
|
||||
enableCustomToolbar={false}
|
||||
enableLastUpdate={true}
|
||||
enablePinning={true}
|
||||
enableDensityToggle={false}
|
||||
|
||||
@@ -132,8 +132,7 @@ function DashboardRefahiLoanManagementComponent() {
|
||||
tableUrl={GET_LOAN_MANAGEMENT_REFAHI}
|
||||
columns={columns}
|
||||
selectableRow={false}
|
||||
enableCustomToolbar={true}
|
||||
// CustomToolbar={<TableToolbar />}
|
||||
enableCustomToolbar={false}
|
||||
enableLastUpdate={true}
|
||||
enablePinning={true}
|
||||
enableDensityToggle={false}
|
||||
|
||||
@@ -132,8 +132,7 @@ function DashboardRefahiProvinceManagerComponent() {
|
||||
tableUrl={GET_REFAHI_PROVINCE_MANAGER}
|
||||
columns={columns}
|
||||
selectableRow={false}
|
||||
enableCustomToolbar={true}
|
||||
// CustomToolbar={<TableToolbar />}
|
||||
enableCustomToolbar={false}
|
||||
enableLastUpdate={true}
|
||||
enablePinning={true}
|
||||
enableDensityToggle={false}
|
||||
|
||||
@@ -163,7 +163,7 @@ function DashboardTransportationAssistanceComponent() {
|
||||
tableUrl={GET_TRANSPORTATION_ASSISTANCE}
|
||||
columns={columns}
|
||||
selectableRow={false}
|
||||
enableCustomToolbar={true}
|
||||
enableCustomToolbar={false}
|
||||
enableLastUpdate={true}
|
||||
enablePinning={true}
|
||||
enableDensityToggle={false}
|
||||
|
||||
190
src/components/dashboard/user-management/Form/AddForm.jsx
Normal file
190
src/components/dashboard/user-management/Form/AddForm.jsx
Normal file
@@ -0,0 +1,190 @@
|
||||
import {useTranslations} from "next-intl";
|
||||
import * as Yup from "yup";
|
||||
import {ADD_USER_MANAGEMENT} from "@/core/data/apiRoutes";
|
||||
import {useFormik} from "formik";
|
||||
import {Button, Dialog, DialogActions, DialogContent, DialogTitle, Stack, TextField} from "@mui/material";
|
||||
import useRequest from "@/lib/app/hooks/useRequest";
|
||||
|
||||
const AddForm = ({openConfirmDialog, setOpenConfirmDialog, mutate, fetchUrl}) => {
|
||||
const t = useTranslations();
|
||||
const requestServer = useRequest({auth: true})
|
||||
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)
|
||||
.required(t("AddDialog.phone_number_error")),
|
||||
type_id: Yup.number().required(t("AddDialog.type_id_error")),
|
||||
navgan_id: Yup.number().required(t("AddDialog.navgan_id_error")),
|
||||
national_id: Yup.number().required(t("AddDialog.national_id_error")),
|
||||
});
|
||||
|
||||
// const handleSubmit = async (values, {setSubmitting, resetForm}) => {
|
||||
// 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(ADD_USER_MANAGEMENT, 'post', {
|
||||
// data: formData,
|
||||
// }).then((response) => {
|
||||
// mutate(fetchUrl)
|
||||
// update_notification()
|
||||
// }).catch(() => {
|
||||
// }).finally(() => {
|
||||
// setSubmitting(false);
|
||||
// });
|
||||
// };
|
||||
// initialValues: {
|
||||
// phone_number: "",
|
||||
// national_id: "",
|
||||
// type_id: "",
|
||||
// navgan_id: ""
|
||||
// }
|
||||
const formik = useFormik({
|
||||
initialValues: {
|
||||
phone_number: "",
|
||||
national_id: "",
|
||||
type_id: "",
|
||||
navgan_id: "",
|
||||
}, validationSchema,
|
||||
onSubmit: (values, {setSubmitting}) => {
|
||||
console.log("hello")
|
||||
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(ADD_USER_MANAGEMENT, 'post', {
|
||||
data: formData,
|
||||
}).then((response) => {
|
||||
mutate(fetchUrl)
|
||||
update_notification()
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
setSubmitting(false);
|
||||
});
|
||||
},
|
||||
});
|
||||
const handlePhoneNumberChange = (event) => {
|
||||
formik.setFieldValue("phone_number", event.target.value)
|
||||
};
|
||||
const handleNationalIDChange = (event) => {
|
||||
formik.setFieldValue("national_id", event.target.value)
|
||||
};
|
||||
const handleTypeIDChange = (event) => {
|
||||
formik.setFieldValue("type_id", event.target.value)
|
||||
};
|
||||
const handleNavganIDChange = (event) => {
|
||||
formik.setFieldValue("navgan_id", event.target.value)
|
||||
};
|
||||
return (
|
||||
<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("AddDialog.add")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="phone_number"
|
||||
rows={8}
|
||||
label={t("AddDialog.phone_number")}
|
||||
type="text"
|
||||
inputProps={{
|
||||
inputMode: "number",
|
||||
min: 0,
|
||||
pattern: "[0-9]*",
|
||||
}}
|
||||
value={formik.values.phone_number}
|
||||
onChange={handlePhoneNumberChange}
|
||||
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("AddDialog.national_id")}
|
||||
value={formik.values.national_id}
|
||||
onChange={handleNationalIDChange}
|
||||
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>
|
||||
<TextField
|
||||
name="type_id"
|
||||
rows={8}
|
||||
label={t("AddDialog.type_id")}
|
||||
value={formik.values.type_id}
|
||||
onChange={handleTypeIDChange}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
onBlur={formik.handleBlur("type_id")}
|
||||
error={
|
||||
formik.touched.type_id &&
|
||||
Boolean(formik.errors.type_id)
|
||||
}
|
||||
helperText={
|
||||
formik.touched.type_id && formik.errors.type_id
|
||||
}
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="navgan_id"
|
||||
rows={8}
|
||||
label={t("AddDialog.navgan_id")}
|
||||
value={formik.values.navgan_id}
|
||||
onChange={handleNavganIDChange}
|
||||
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("AddDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary"
|
||||
disabled={formik.isSubmitting}>
|
||||
{t("AddDialog.button-add")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
);
|
||||
};
|
||||
export default AddForm;
|
||||
60
src/components/dashboard/user-management/Form/DeleteForm.jsx
Normal file
60
src/components/dashboard/user-management/Form/DeleteForm.jsx
Normal file
@@ -0,0 +1,60 @@
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useState} from "react";
|
||||
import {Button, Dialog, DialogActions, DialogTitle, IconButton, Tooltip} from "@mui/material";
|
||||
import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
|
||||
import {useFormik} from "formik";
|
||||
import {DELETE_USER_MANAGEMENT} from "@/core/data/apiRoutes";
|
||||
import useRequest from "@/lib/app/hooks/useRequest";
|
||||
import useNotification from "@/lib/app/hooks/useNotification";
|
||||
|
||||
|
||||
const DeleteForm = ({rowId, fetchUrl, mutate}) => {
|
||||
const t = useTranslations();
|
||||
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
|
||||
const requestServer = useRequest({auth: true})
|
||||
const {update_notification} = useNotification()
|
||||
|
||||
const formik = useFormik({
|
||||
onSubmit: (values, {setSubmitting}) => {
|
||||
|
||||
|
||||
requestServer(`${DELETE_USER_MANAGEMENT}/${rowId}`, 'post').then((response) => {
|
||||
mutate(fetchUrl)
|
||||
update_notification()
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
setSubmitting(false);
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
return (
|
||||
<>
|
||||
<Tooltip title={t("DeleteDialog.delete")}>
|
||||
<IconButton
|
||||
color="primary"
|
||||
onClick={() => {
|
||||
setOpenConfirmDialog(true)
|
||||
}}
|
||||
>
|
||||
<ThumbUpAltIcon/>
|
||||
</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("DeleteDialog.delete")}</DialogTitle>
|
||||
<DialogActions>
|
||||
<Button onClick={() => setOpenConfirmDialog(false)} variant="outlined" color="secondary"
|
||||
disabled={formik.isSubmitting} autoFocus>
|
||||
{t("DeleteDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary"
|
||||
disabled={formik.isSubmitting}>
|
||||
{t("DeleteDialog.button-delete")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default DeleteForm;
|
||||
151
src/components/dashboard/user-management/Form/UpdateForm.jsx
Normal file
151
src/components/dashboard/user-management/Form/UpdateForm.jsx
Normal file
@@ -0,0 +1,151 @@
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useState} from "react";
|
||||
import {
|
||||
Button,
|
||||
Dialog,
|
||||
DialogActions,
|
||||
DialogContent,
|
||||
DialogTitle,
|
||||
IconButton,
|
||||
Stack,
|
||||
TextField,
|
||||
Tooltip
|
||||
} from "@mui/material";
|
||||
import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
|
||||
import {useFormik} from "formik";
|
||||
import {UPDATE_USER_MANAGEMENT} from "@/core/data/apiRoutes";
|
||||
import useRequest from "@/lib/app/hooks/useRequest";
|
||||
import useNotification from "@/lib/app/hooks/useNotification";
|
||||
|
||||
|
||||
const UpdateForm = ({rowId, fetchUrl, mutate}) => {
|
||||
const t = useTranslations();
|
||||
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
|
||||
const requestServer = useRequest({auth: true})
|
||||
const {update_notification} = useNotification()
|
||||
|
||||
const formik = useFormik({
|
||||
initialValues: {
|
||||
phone_number: "",
|
||||
national_id: "",
|
||||
type_id: "",
|
||||
navgan_id: "",
|
||||
},
|
||||
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', {
|
||||
data: formData,
|
||||
}).then((response) => {
|
||||
mutate(fetchUrl)
|
||||
update_notification()
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
setSubmitting(false);
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
const handlePhoneNumberChange = (event) => {
|
||||
formik.setFieldValue("phone_number", event.target.value)
|
||||
};
|
||||
const handleNationalIDChange = (event) => {
|
||||
formik.setFieldValue("national_id", event.target.value)
|
||||
};
|
||||
const handleTypeIDChange = (event) => {
|
||||
formik.setFieldValue("type_id", event.target.value)
|
||||
};
|
||||
const handleNavganIDChange = (event) => {
|
||||
formik.setFieldValue("navgan_id", event.target.value)
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Tooltip title={t("ConfirmDialog.confirm")}>
|
||||
<IconButton
|
||||
color="primary"
|
||||
onClick={() => {
|
||||
setOpenConfirmDialog(true)
|
||||
}}
|
||||
>
|
||||
<ThumbUpAltIcon/>
|
||||
</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("ConfirmDialog.confirm")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="phone_number"
|
||||
multiline
|
||||
rows={8}
|
||||
label={t("ConfirmDialog.phone_number")}
|
||||
value={formik.values.phone_number}
|
||||
onChange={handlePhoneNumberChange}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="national_id"
|
||||
multiline
|
||||
rows={8}
|
||||
label={t("ConfirmDialog.national_id")}
|
||||
value={formik.values.national_id}
|
||||
onChange={handleNationalIDChange}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="type_id"
|
||||
multiline
|
||||
rows={8}
|
||||
label={t("ConfirmDialog.type_id")}
|
||||
value={formik.values.type_id}
|
||||
onChange={handleTypeIDChange}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="navgan_id"
|
||||
multiline
|
||||
rows={8}
|
||||
label={t("ConfirmDialog.navgan_id")}
|
||||
value={formik.values.navgan_id}
|
||||
onChange={handleNavganIDChange}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={() => setOpenConfirmDialog(false)} variant="outlined" color="secondary"
|
||||
disabled={formik.isSubmitting} autoFocus>
|
||||
{t("ConfirmDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary"
|
||||
disabled={formik.isSubmitting}>
|
||||
{t("ConfirmDialog.button-confirm")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default UpdateForm;
|
||||
23
src/components/dashboard/user-management/TableRowActions.jsx
Normal file
23
src/components/dashboard/user-management/TableRowActions.jsx
Normal file
@@ -0,0 +1,23 @@
|
||||
import {Box} from "@mui/material";
|
||||
import DeleteForm from "./Form/DeleteForm"
|
||||
import UpdateForm from "./Form/UpdateForm"
|
||||
|
||||
const TableRowActions = ({row, mutate, fetchUrl}) => {
|
||||
|
||||
return (
|
||||
<Box sx={{display: "flex", flexWrap: "nowrap", gap: "8px"}}>
|
||||
<UpdateForm
|
||||
rowId={row.getValue("id")}
|
||||
mutate={mutate}
|
||||
fetchUrl={fetchUrl}
|
||||
/>
|
||||
<DeleteForm
|
||||
rowId={row.getValue("id")}
|
||||
fetchUrl={fetchUrl}
|
||||
mutate={mutate}
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
export default TableRowActions;
|
||||
32
src/components/dashboard/user-management/TableToolbar.jsx
Normal file
32
src/components/dashboard/user-management/TableToolbar.jsx
Normal file
@@ -0,0 +1,32 @@
|
||||
import DataSaverOnIcon from "@mui/icons-material/DataSaverOn";
|
||||
import {Button, Stack, Tooltip} from "@mui/material";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useState} from "react";
|
||||
import AddForm from "./Form/AddForm";
|
||||
|
||||
function TableToolbar({mutate, fetchUrl}) {
|
||||
const t = useTranslations();
|
||||
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
|
||||
return (
|
||||
<Stack direction={"row"} spacing={2}>
|
||||
<Tooltip title={t("AddDialog.add")} arrow placement="right">
|
||||
<Button
|
||||
color="primary"
|
||||
variant="contained"
|
||||
size="small"
|
||||
sx={{textTransform: "unset", alignSelf: "center"}}
|
||||
startIcon={<DataSaverOnIcon/>}
|
||||
onClick={() => {
|
||||
setOpenConfirmDialog(true)
|
||||
}}
|
||||
>
|
||||
{t("AddDialog.add")}
|
||||
</Button>
|
||||
</Tooltip>
|
||||
<AddForm mutate={mutate} fetchUrl={fetchUrl} setOpenConfirmDialog={setOpenConfirmDialog}
|
||||
openConfirmDialog={openConfirmDialog}/>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default TableToolbar;
|
||||
155
src/components/dashboard/user-management/index.jsx
Normal file
155
src/components/dashboard/user-management/index.jsx
Normal file
@@ -0,0 +1,155 @@
|
||||
import DashboardLayouts from "@/layouts/dashboardLayouts";
|
||||
import {Box, Typography} from "@mui/material";
|
||||
import {useMemo} from "react";
|
||||
import {GET_USER_MANAGEMENT} from "@/core/data/apiRoutes";
|
||||
import {useTranslations} from "next-intl";
|
||||
import DataTable from "@/core/components/DataTable";
|
||||
import moment from "jalali-moment";
|
||||
import MuiDatePicker from "@/core/components/MuiDatePicker";
|
||||
import TableToolbar from "@/components/dashboard/user-management/TableToolbar";
|
||||
import TableRowActions from "./TableRowActions"
|
||||
|
||||
function DashboardUserManagementComponent() {
|
||||
const t = useTranslations();
|
||||
|
||||
const columns = useMemo(
|
||||
() => [
|
||||
{
|
||||
accessorFn: (row) => row.id,
|
||||
id: "id",
|
||||
header: t("UserManagement.id"),
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterFn: "equals",
|
||||
columnFilterModeOptions: [
|
||||
"equals",
|
||||
"notEquals",
|
||||
"contains",
|
||||
"lessThan",
|
||||
"greaterThan",
|
||||
"between",
|
||||
],
|
||||
Cell: ({renderedCellValue}) => (
|
||||
<Typography variant="body2">{renderedCellValue}</Typography>
|
||||
),
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => row.name,
|
||||
id: "name",
|
||||
header: t("UserManagement.name"),
|
||||
enableColumnFilter: true,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["contains", "equals", "notEquals"],
|
||||
Cell: ({renderedCellValue}) => (
|
||||
<Typography variant="body2">{renderedCellValue}</Typography>
|
||||
),
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => row.national_id,
|
||||
id: "national_id",
|
||||
header: t("UserManagement.national_id"),
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterFn: "equals",
|
||||
columnFilterModeOptions: [
|
||||
"equals",
|
||||
"notEquals",
|
||||
"contains",
|
||||
"lessThan",
|
||||
"greaterThan",
|
||||
"between",
|
||||
],
|
||||
Cell: ({renderedCellValue}) => (
|
||||
<Typography variant="body2">{renderedCellValue}</Typography>
|
||||
),
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => row.phone_number,
|
||||
id: "phone_number",
|
||||
header: t("UserManagement.phone_number"),
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterFn: "equals",
|
||||
columnFilterModeOptions: [
|
||||
"equals",
|
||||
"notEquals",
|
||||
"contains",
|
||||
"lessThan",
|
||||
"greaterThan",
|
||||
"between",
|
||||
],
|
||||
Cell: ({renderedCellValue}) => (
|
||||
<Typography variant="body2">{renderedCellValue}</Typography>
|
||||
),
|
||||
},
|
||||
{
|
||||
accessorFn: (row) =>
|
||||
moment(row.created_at).locale("fa").format("HH:mm | yyyy/MM/DD"),
|
||||
id: "created_at",
|
||||
header: t("UserManagement.created_at"),
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterFn: "lessThan",
|
||||
columnFilterModeOptions: ["lessThan", "greaterThan"],
|
||||
Cell: ({renderedCellValue}) => {
|
||||
return <Typography variant="body2">{renderedCellValue}</Typography>;
|
||||
},
|
||||
Header: ({column}) => <>{column.columnDef.header}</>,
|
||||
Filter: ({column}) => {
|
||||
return (
|
||||
<MuiDatePicker column={column}/>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
accessorFn: (row) =>
|
||||
moment(row.updated_at).locale("fa").format("HH:mm | yyyy/MM/DD"),
|
||||
id: "updated_at",
|
||||
header: t("UserManagement.updated_at"),
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
Cell: ({renderedCellValue}) => (
|
||||
<Typography variant="body2">{renderedCellValue}</Typography>
|
||||
),
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => row.state_name,
|
||||
id: "state_id",
|
||||
header: t("UserManagement.state_name"),
|
||||
enableColumnFilter: false,
|
||||
datatype: "numeric",
|
||||
Cell: ({renderedCellValue}) => (
|
||||
<Typography variant="body2">{renderedCellValue}</Typography>
|
||||
),
|
||||
},
|
||||
],
|
||||
[]
|
||||
);
|
||||
return (
|
||||
<DashboardLayouts>
|
||||
<Box sx={{px: 3}}>
|
||||
<DataTable
|
||||
tableUrl={GET_USER_MANAGEMENT}
|
||||
columns={columns}
|
||||
selectableRow={false}
|
||||
enableCustomToolbar={true}
|
||||
CustomToolbar={TableToolbar}
|
||||
enableLastUpdate={true}
|
||||
enablePinning={true}
|
||||
enableDensityToggle={false}
|
||||
initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large)
|
||||
enableColumnFilters={true}
|
||||
enableHiding={true}
|
||||
enableFullScreenToggle={false}
|
||||
enableGlobalFilter={false}
|
||||
enableColumnResizing={false} // if you want true this you should change renderRowActions props ** see https://www.material-react-table.com/docs/guides/row-actions
|
||||
enableRowActions={true}
|
||||
TableRowAction={TableRowActions}
|
||||
/>
|
||||
</Box>
|
||||
</DashboardLayouts>
|
||||
);
|
||||
}
|
||||
|
||||
export default DashboardUserManagementComponent;
|
||||
@@ -134,7 +134,7 @@ function DataTable(props) {
|
||||
renderTopToolbarCustomActions={({table}) => (
|
||||
<>
|
||||
{props.enableCustomToolbar /* send condition */
|
||||
? props.CustomToolbar /* send component */
|
||||
? <props.CustomToolbar fetchUrl={fetchUrl} mutate={mutate}/> /* send component */
|
||||
: ""}
|
||||
</>
|
||||
)}
|
||||
|
||||
@@ -150,3 +150,14 @@ export const UPDATE_LOAN_MANAGEMENT_NAVGAN =
|
||||
export const GET_LOAN_STATE_NAVGAN =
|
||||
BASE_URL + "/dashboard/loan_states/navgan"
|
||||
//loan management navgan
|
||||
|
||||
//user management
|
||||
export const GET_USER_MANAGEMENT =
|
||||
BASE_URL + "/dashboard/user_management/show"
|
||||
export const ADD_USER_MANAGEMENT =
|
||||
BASE_URL + "/dashboard/user_management/store"
|
||||
export const UPDATE_USER_MANAGEMENT =
|
||||
BASE_URL + "/dashboard/user_management/update"
|
||||
export const DELETE_USER_MANAGEMENT =
|
||||
BASE_URL + "/dashboard/user_management/delete"
|
||||
//user management
|
||||
|
||||
@@ -136,6 +136,15 @@ const sidebarMenu = [
|
||||
selected: false,
|
||||
permission: "manage_navgan_loan",
|
||||
},
|
||||
{
|
||||
key: "sidebar.user-management",
|
||||
name: "user_management",
|
||||
type: "page",
|
||||
route: "/dashboard/user-management",
|
||||
icon: <PaidIcon/>,
|
||||
selected: false,
|
||||
permission: "user_management",
|
||||
},
|
||||
],
|
||||
];
|
||||
|
||||
|
||||
26
src/pages/dashboard/user-management/index.jsx
Normal file
26
src/pages/dashboard/user-management/index.jsx
Normal file
@@ -0,0 +1,26 @@
|
||||
import RolePermissionMiddleware from "@/middlewares/RolePermission";
|
||||
import WithAuthMiddleware from "@/middlewares/WithAuth";
|
||||
import {parse} from "next-useragent";
|
||||
import DashboardUserManagementComponent from "@/components/dashboard/user-management";
|
||||
|
||||
const requiredPermissions = ["manage_refahi_loan"];
|
||||
export default function UserManagement() {
|
||||
return (
|
||||
<WithAuthMiddleware>
|
||||
<RolePermissionMiddleware requiredPermissions={requiredPermissions}>
|
||||
<DashboardUserManagementComponent/>
|
||||
</RolePermissionMiddleware>
|
||||
</WithAuthMiddleware>
|
||||
);
|
||||
}
|
||||
|
||||
export async function getServerSideProps({req, locale}) {
|
||||
const {isBot} = parse(req.headers["user-agent"]);
|
||||
return {
|
||||
props: {
|
||||
messages: (await import(`&/locales/${locale}/app.json`)).default,
|
||||
title: "Dashboard.user_management_page",
|
||||
isBot,
|
||||
},
|
||||
};
|
||||
}
|
||||
Reference in New Issue
Block a user