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

admin setting with fake data create update

Browse Source
This commit is contained in:
AminGhasempoor
2024-01-20 13:58:14 +03:30
parent a45fbddc8d
commit 6f906c8a2a
10 changed files with 409 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -44,6 +44,7 @@
"dashboard": "داشبورد",
"reports": "گزارشات",
"passenger-office-chief": "اداره مسافر",
"admin-setting": "تنظیمات ",
"machinery-expert": "کارتابل کارشناسی",
"passenger-boss": "کارتابل کارگروه",
"transportation-assistant": "بررسی وام های تبصره 18",
@@ -121,6 +122,7 @@
"edit_profile": "ویرایش پروفایل",
"expert_management": "مدیریت کارشناسان",
"user_management_page": "مدیریت کاربر",
"admin_setting": "تنظیمات",
"loan_history": "کارتابل نظارت",
"total_number_loan_offers": "تعداد کل وام های پیشنهادی",
"total_amount_proposed_loan": "مبلغ کل وام های پیشنهادی",
@@ -147,6 +149,12 @@
"button_while_submit": "در حال ثبت",
"button_submit": "ثبت"
},
"AdminSetting": {
"id": "کد یکتا",
"edit": "ویرایش",
"name": "نام",
"value": "مقدار"
},
"UpdateProfile": {
"error_invalid_email": "ایمیل نامعتبر است",
"typography_edit_profile": "پروفایل",
@@ -481,8 +489,14 @@
"button-cancel": "بستن",
"refahi": "رفاهی",
"navgan": "ناوگان",
"setting_name": "نام",
"value": "مقدار",
"phone_number": "شماره تلفن",
"national_id": "کد ملی",
"name_string": "نام می بایست متن باشد",
"setting_name_error": "وارد کردن نام الزامیست",
"value_error": "وارد کردن مقدار الزامیست",
"value_string": "مقدار می بایست متن باشد",
"name": "نام انگلیسی",
"name_error": "وارد کردن نام انگلیسی الزامیست",
"name_fa": "نام فارسی",
@@ -576,6 +590,8 @@
},
"AddDialog": {
"add": "افزودن",
"setting_name": "نام",
"value": "مقدار",
"name": "نام انگلیسی",
"name_error": "وارد کردن نام انگلیسی الزامیست",
"name_fa": "نام فارسی",
@@ -594,6 +610,10 @@
"national_id_error": "وارد کردن کد ملی الزامیست",
"type_id_error": "وارد کردن نوع کاربر الزامیست",
"navgan_id_error": "وارد کردن کد ناوگان الزامیست",
"name_string": "نام می بایست متن باشد",
"setting_name_error": "وارد کردن نام الزامیست",
"value_error": "وارد کردن مقدار الزامیست",
"value_string": "مقدار می بایست متن باشد",
"refahi": "رفاهی",
"navgan": "ناوگان",
"type_id": "نوع کاربر",

88
src/components/dashboard/admin-setting/Form/CreateForm/CreateContent.jsx Normal file
View File

@@ -0,0 +1,88 @@
import {Button, DialogActions, DialogContent, Stack, TextField} from "@mui/material";
import {useTranslations} from "next-intl";
import useRequest from "@/lib/app/hooks/useRequest";
import * as Yup from "yup";
import {useFormik} from "formik";
import {ADD_USER_MANAGEMENT} from "@/core/data/apiRoutes";
const CreateContent = ({mutate, setOpenConfirmDialog}) => {
const t = useTranslations();
const requestServer = useRequest({auth: true})
const validationSchema = Yup.object().shape({
name: Yup.string("AddDialog.name_string")
.required(t("AddDialog.setting_name_error")),
value: Yup.string("AddDialog.value_string")
.required(t("AddDialog.value_error")),
});
const formik = useFormik({
initialValues: {
name: "",
value: "",
}, validationSchema, onSubmit: (values, {setSubmitting}) => {
const formData = new FormData();
formData.append("name", values.name);
formData.append("value", values.value);
requestServer(ADD_USER_MANAGEMENT, 'post', {
data: formData,
}).then((response) => {
setOpenConfirmDialog(false)
mutate()
update_notification()
}).catch(() => {
}).finally(() => {
setSubmitting(false);
});
},
});
return (
<>
<DialogContent>
<Stack spacing={2}>
<Stack>
<TextField
name="name"
rows={8}
label={t("AddDialog.setting_name")}
value={formik.values.name}
onChange={formik.handleChange}
fullWidth
variant="outlined"
onBlur={formik.handleBlur("name")}
error={formik.touched.name && Boolean(formik.errors.name)}
helperText={formik.touched.name && formik.errors.name}
sx={{mt: 1}}
/>
</Stack>
<Stack>
<TextField
name="value"
label={t("AddDialog.value")}
value={formik.values.value}
onChange={formik.handleChange}
fullWidth
variant="outlined"
onBlur={formik.handleBlur("value")}
error={formik.touched.value && Boolean(formik.errors.value)}
helperText={formik.touched.value && formik.errors.value}
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 || !formik.dirty || !formik.isValid}>
{t("AddDialog.button-add")}
</Button>
</DialogActions>
</>
)
}
export default CreateContent

35
src/components/dashboard/admin-setting/Form/CreateForm/index.jsx Normal file
View File

@@ -0,0 +1,35 @@
import {Button, Dialog, DialogTitle, Stack, Tooltip} from "@mui/material";
import DataSaverOnIcon from "@mui/icons-material/DataSaverOn";
import {useTranslations} from "next-intl";
import {useState} from "react";
import CreateContent from "@/components/dashboard/admin-setting/Form/CreateForm/CreateContent";
const CreateForm = ({mutate}) => {
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>
<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>
<CreateContent mutate={mutate} setOpenConfirmDialog={setOpenConfirmDialog}/>
</Dialog>
</Stack>
)
}
export default CreateForm

90
src/components/dashboard/admin-setting/Form/UpdateForm/UpdateContent.jsx Normal file
View File

@@ -0,0 +1,90 @@
import {UPDATE_USER_MANAGEMENT} from "@/core/data/apiRoutes";
import useNotification from "@/lib/app/hooks/useNotification";
import useRequest from "@/lib/app/hooks/useRequest";
import {Button, DialogActions, DialogContent, Stack, TextField} from "@mui/material"
import {useFormik} from "formik";
import {useTranslations} from "next-intl";
import * as Yup from "yup";
const UpdateContent = ({row, mutate, setOpenConfirmDialog}) => {
const t = useTranslations();
const requestServer = useRequest({auth: true})
const {update_notification} = useNotification()
const validationSchema = Yup.object().shape({
name: Yup.string("AddDialog.name_string")
.required(t("AddDialog.setting_name_error")),
value: Yup.string("AddDialog.value_string")
.required(t("AddDialog.value_error")),
});
const formik = useFormik({
initialValues: {
name: row.getValue("name"),
value: row.getValue("value"),
}, validationSchema, onSubmit: (values, {setSubmitting}) => {
const formData = new FormData();
formData.append("name", values.name);
formData.append("value", values.value);
requestServer(`${UPDATE_USER_MANAGEMENT}/${row.getValue("id")}`, 'post', {
data: formData,
}).then((response) => {
setOpenConfirmDialog(false)
mutate()
update_notification()
}).catch(() => {
}).finally(() => {
setSubmitting(false);
});
},
});
return (
<>
<DialogContent>
<Stack spacing={2}>
<Stack>
<TextField
name="name"
rows={8}
label={t("UpdateDialog.setting_name")}
value={formik.values.name}
onChange={formik.handleChange}
fullWidth
variant="outlined"
onBlur={formik.handleBlur("name")}
error={formik.touched.name && Boolean(formik.errors.name)}
helperText={formik.touched.name && formik.errors.name}
sx={{mt: 1}}
/>
</Stack>
<Stack>
<TextField
name="value"
rows={8}
label={t("UpdateDialog.value")}
value={formik.values.value}
onChange={formik.handleChange}
fullWidth
variant="outlined"
onBlur={formik.handleBlur("value")}
error={formik.touched.value && Boolean(formik.errors.value)}
helperText={formik.touched.value && formik.errors.value}
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 || !formik.dirty || !formik.isValid}>
{t("UpdateDialog.button-update")}
</Button>
</DialogActions>
</>
)
}
export default UpdateContent

30
src/components/dashboard/admin-setting/Form/UpdateForm/index.jsx Normal file
View File

@@ -0,0 +1,30 @@
import {Dialog, DialogTitle, IconButton, Tooltip} from "@mui/material"
import EditIcon from '@mui/icons-material/Edit';
import {useTranslations} from "next-intl";
import {useState} from "react";
import UpdateContent from "./UpdateContent";
const Update = ({row, mutate}) => {
const t = useTranslations();
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
return (
<>
<Tooltip title={t("UpdateDialog.update-tooltip")}>
<IconButton
color="primary"
onClick={() => {
setOpenConfirmDialog(true)
}}
>
<EditIcon/>
</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>
<UpdateContent row={row} mutate={mutate} setOpenConfirmDialog={setOpenConfirmDialog}/>
</Dialog>
</>
)
}
export default Update

15
src/components/dashboard/admin-setting/TableRowActions.jsx Normal file
View File

@@ -0,0 +1,15 @@
import {Box} from "@mui/material";
import Update from "src/components/dashboard/admin-setting/Form/UpdateForm";
const TableRow = ({row, mutate}) => {
return (
<Box sx={{display: "flex", flexWrap: "nowrap", gap: "8px"}}>
<Update
row={row}
mutate={mutate}
/>
</Box>
);
};
export default TableRow;

11
src/components/dashboard/admin-setting/TableToolbar.jsx Normal file
View File

@@ -0,0 +1,11 @@
import {useTranslations} from "next-intl";
import CreateForm from "@/components/dashboard/admin-setting/Form/CreateForm";
function TableToolbar({mutate}) {
const t = useTranslations();
return <CreateForm mutate={mutate}/>
}
export default TableToolbar;

88
src/components/dashboard/admin-setting/index.jsx Normal file
View File

@@ -0,0 +1,88 @@
import {Box, Typography} from "@mui/material";
import {useMemo} from "react";
import {GET_MACHINARY_OFFICE} from "@/core/data/apiRoutes";
import {useTranslations} from "next-intl";
import DataTable from "@/core/components/DataTable";
import TableRowActions from "@/components/dashboard/admin-setting/TableRowActions";
import TableToolbar from "@/components/dashboard/admin-setting/TableToolbar";
function DashboardAdminSettingComponent() {
const t = useTranslations();
const columns = useMemo(
() => [
{
accessorFn: (row) => row.id,
id: "id",
header: t("AdminSetting.id"),
enableColumnFilter: true,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["contains", "equals", "notEquals"],
Cell: ({renderedCellValue}) => (
<Typography variant="body2">{renderedCellValue}</Typography>
),
},
{
accessorFn: (row) => row.name,
id: "name",
header: t("AdminSetting.name"),
enableColumnFilter: true,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["contains", "equals", "notEquals"],
Cell: ({renderedCellValue}) => (
<Typography variant="body2">{renderedCellValue}</Typography>
),
},
{
accessorFn: (row) => row.value,
id: "value",
header: t("AdminSetting.value"),
enableColumnFilter: true,
datatype: "text",
filterFn: "equals",
columnFilterModeOptions: [
"equals",
"contains",
],
Cell: ({renderedCellValue}) => (
<Typography variant="body2">{renderedCellValue}</Typography>
),
},
],
[]
);
const data = [{
id: 1,
name: "amin",
value: "hi"
}]
return (
<Box sx={{px: 3}}>
<DataTable
data={data}
tableUrl={GET_MACHINARY_OFFICE}
columns={columns}
selectableRow={false}
enableCustomToolbar={true}
CustomToolbar={TableToolbar}
enableLastUpdate={true}
sorting={[{
id: 'name', desc: false
}]}
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>
);
}
export default DashboardAdminSettingComponent;

11
src/core/data/sidebarMenu.jsx
View File

@@ -15,6 +15,7 @@ import PersonIcon from '@mui/icons-material/Person';
import AccessibilityIcon from '@mui/icons-material/Accessibility';
import AssessmentIcon from '@mui/icons-material/Assessment';
import SecurityIcon from '@mui/icons-material/Security';
import SettingsIcon from '@mui/icons-material/Settings';
const sidebarMenu = [
[
@@ -197,6 +198,16 @@ const sidebarMenu = [
icon: <AccessibilityIcon sx={{width: 'inherit', height: 'inherit'}}/>,
selected: false,
permissions: ["manage_roles"],
},
{
key: "sidebar.admin-setting",
secondary: "secondary.admin-management",
name: "admin_setting",
type: "page",
route: "/dashboard/admin-setting",
icon: <SettingsIcon sx={{width: 'inherit', height: 'inherit'}}/>,
selected: false,
permissions: ["manage_roles"],
}
],
];

21
src/pages/dashboard/admin-setting/index.jsx Normal file
View File

@@ -0,0 +1,21 @@
import {parse} from "next-useragent";
import DashboardAdminSettingComponent from "@/components/dashboard/admin-setting";
export default function AdminSetting() {
return (
<DashboardAdminSettingComponent/>
);
}
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.admin_setting",
isBot,
locale,
layout: {name: 'DashboardLayout'}
},
};
}