Merge branch 'release/v1.7.5'

This commit is contained in:
AmirHossein Mahmoodi
2023-09-19 10:24:35 +03:30
54 changed files with 2915 additions and 169 deletions

View File

@@ -1,5 +1,5 @@
NEXT_PUBLIC_API_NAME = "Loan Facilities Dashboard"
NEXT_PUBLIC_API_VERSION = "1.7.0"
NEXT_PUBLIC_API_VERSION = "1.7.5"
NEXT_PUBLIC_DEFAULT_LANGUAGE = "fa"
NEXT_PUBLIC_DEFAULT_DIRECTION = "rtl"

View File

@@ -1,6 +1,6 @@
{
"name": "dashboard",
"version": "0.1.0",
"name": "LoanFacilitiesDashboard",
"version": "1.7.5",
"private": true,
"scripts": {
"dev": "next dev",

View File

@@ -11,6 +11,7 @@
"date_picker_label": "فیلتر بر اساس تاریخ",
"lessThan": "کوچکتر از",
"greaterThan": "بزرگتر از",
"equals": "برابر",
"between": "میان",
"online_message": "شما به اینترنت وصل هستید",
"offline_message": "اتصال شما به اینترنت قطع شده است",
@@ -18,8 +19,12 @@
"open_profile": "پروفایل",
"edit_profile": " پروفایل",
"change_password": "تغییر رمز عبور",
"equals": "برابر",
"logout": "خروج"
},
"Select": {
"menu_item": "نوع کاربر را وارد کنید"
},
"Titles": {
"title_login_page": "صفحه ورود",
"title_login_expert_page": "ورود کارشناس",
@@ -42,6 +47,9 @@
"province-head-expert": "کارشناس ستادی",
"change-password": "تغییر رمز عبور",
"development-assistant": "معاون توسعه",
"expert-management": "مدیریت کارشناسان",
"user-management": "مدیریت کاربر",
"role-management": "مدیریت نقش ها",
"edit-profile": "ویرایش پروفایل"
},
"secondary": {
@@ -72,7 +80,8 @@
"link_routing_back_to": "بازگشت به",
"link_routing_previuos_page": "صفحه قبل",
"link_routing_main_page": "صفحه اصلی",
"error_message_required": "اجباری!"
"error_message_username": "وارد کردن نام کاربری الزامیست",
"error_message_password": "وارد کردن رمز عبور الزامیست"
},
"ErrorPage": {
"custom_404": "صفحه مورد نظر یافت نشد | 404",
@@ -95,7 +104,10 @@
"development_assistant_page": "معاون توسعه",
"inspector_expert_page": "بازدید کارشناس",
"commercial_chief_page": "رئیس اداره بازرگانی",
"edit_profile": "ویرایش پروفایل"
"role_management_page": "مدیریت نقش ها",
"edit_profile": "ویرایش پروفایل",
"expert_management": "مدیریت کارشناسان",
"user_management_page": "مدیریت کاربر"
},
"MuiDatePicker": {
"date_picker_birthday": "تاریخ"
@@ -105,7 +117,9 @@
"label_current_password": "رمز عبور فعلی",
"label_new_password": "رمز عبور جدید",
"label_confirm_password": "تکرار رمز عبور جدید",
"error_message_required": "اجباری !",
"error_message_current_password": "وارد کردن رمز عبور فعلی الزامیست",
"error_message_new_password": "وارد کردن رمز عبور جدید الزامیست",
"error_message_confirm_password": "وارد کردن تکرار رمز عبور الزامیست",
"error_message_password_length": "رمز عبور باید حداقل 8 کاراکتر باشد.",
"error_message_password_match": "پسورد ها یکسان هستند",
"error_message_password_not_match": "پسورد و تکرار رمز عبور باید یکسان باشد"
@@ -268,6 +282,25 @@
"vehicle_type": "نوع ماشین",
"state_name": "وضعیت درخواست"
},
"UserManagement": {
"name": "نام",
"id": "کد یکتا",
"national_id": "کد ملی",
"phone_number": "موبایل",
"created_at": "تاریخ درخواست",
"updated_at": "تاریخ بروزرسانی",
"navgan_id": "کد ناوگان",
"type_name": "نوع کاربر",
"vehicle_type": "نوع ماشین",
"state_name": "وضعیت درخواست"
},
"RoleManagement": {
"id": "کد یکتا",
"name_fa": "نام فارسی ",
"name": "نام انگلیسی",
"created_at": "تاریخ درخواست",
"updated_at": "تاریخ بروزرسانی"
},
"ConfirmDialog": {
"confirm": "تایید",
"context": "آیا از تایید این آیتم اطمینان دارید؟",
@@ -305,14 +338,26 @@
"description_error": "وارد کردن توضیحات الزامی است!"
},
"UpdateDialog": {
"update": "تغییر وضعیت درخواست",
"update-tooltip": "بروزرسانی",
"button-cancel": "بستن",
"button-update": "بروزرسانی",
"update": "ویرایش",
"description": "توضیحات خود را وارد نمائید",
"description_error": "وارد کردن توضیحات الزامی است!",
"next-state-id": "وضعیت بعدی",
"next-state-id-error": "وارد کردن وضعیت بعدی الزامی است!"
"next-state-id": "وضعیت",
"next-state-id-error": "وارد کردن وضعیت الزامیست",
"update-tooltip": "ویرایش",
"button-cancel": "بستن",
"refahi": "رفاهی",
"navgan": "ناوگان",
"phone_number": "شماره تلفن",
"national_id": "کد ملی",
"name": "نام انگلیسی",
"name_error": "وارد کردن نام انگلیسی الزامیست",
"name_fa": "نام فارسی",
"name_fa_error": "وارد کردن نام فارسی الزامیست",
"permission": "دسترسی",
"permission_min_error": "حداقل باید یک دسترسی انتخاب شود",
"type_id": "نوع کاربر",
"navgan_id": "کد ناوگان",
"button-update": "ویرایش"
},
"UploadSystem": {
"upload_file": "فایل خود را بارگذاری کنید",
@@ -320,6 +365,105 @@
"upload_file_unit": "حداکثر 2Mb",
"upload_file_format": "فرمت قابل قبول : png,jpg,pdf",
"delete": "پاک کردن",
"phone_number": "شماره تلفن",
"national_id": "کد ملی",
"navgan_id": "کد ناوگان",
"type_id": "نوع کاربر",
"uploadfile_error": "حجم فایل بیشتر از 2 مگابایت می باشد"
},
"ExpertMangement": {
"id": "کد یکتا",
"name": "نام",
"username": "نام کاربری",
"email": "پست الکترونیک",
"phone_number": "شماره همراه",
"national_id": "کد ملی",
"position": "سمت",
"province_name": "استان",
"city_name": "شهر",
"role_name": "نقش",
"updated_at": "آخرین بروزرسانی",
"button_while_submiting": "درحال افزودن کارشناس",
"button_submit": "افزودن کارشناس",
"button_close": "بستن",
"button_delete": "حذف",
"add": "افزودن کارشناس",
"button-cancel": "بستن",
"button-confirm": "ثبت",
"create": "افزودن کارشناس",
"update": "ویرایش کارشناس",
"change_password": "تغییر رمز عبور",
"text_field_name": "نام",
"text_field_username": "نام کاربری",
"text_field_email": "پست الکترونیک",
"text_field_phone_number": "شماره همراه",
"text_field_national_id": "کد ملی",
"text_field_password": "رمز عبور",
"text_field_position": "سمت",
"text_field_province_id": "استان",
"text_field_city_id": "شهر",
"text_field_role_id": "نقش",
"text_field_loading_provinces_list": "درحال دریافت شهر ها",
"text_field_error_fetching_provinces": "خطا در دریافت شهر ها",
"text_field_loading_roles_list": "درحال دریافت نقش ها",
"text_field_error_fetching_roles": "خطا در دریافت نقش ها",
"text_field_please_select_province": "ابتدا استان خود را انتخاب کنید",
"text_field_loading_cities_list": "درحال دریافت شهر ها",
"text_field_error_fetching_cities": "خطا در دریافت شهر ها",
"text_field_new_password": "رمز عبور جدید",
"error_message_name": "نام خود را وارد کنید",
"error_message_username": "نام کاربری خود را وارد کنید",
"error_message_email": "پست الکترونیک خود را وارد کنید",
"error_message_phone_number": "شماره همراه خود را وارد کنید",
"error_message_national_id": "کد ملی خود را وارد کنید",
"error_message_password": "رمز عبور خود را وارد کنید",
"error_message_password_regex": "رمز عبور باید حداقل 8 کاراکتر و متشکل از عدد، حرف یا سمبل باشد",
"error_message_position": "سمت خود را وارد کنید",
"error_message_province_id": "استان خود را وارد کنید",
"error_message_city_id": "شهر خود را وارد کنید",
"error_message_role_id": "نقش خود را وارد کنید",
"error_message_new_password": "رمز عبور جدید را وارد کنید",
"error_message_new_password_regex": "رمز عبور باید حداقل 8 کاراکتر و متشکل از عدد، حرف یا سمبل باشد",
"personal_info": "مشخصات کارشناس",
"user_info": "اطلاعات کاربری",
"rest_info": "اطلاعات تکمیلی",
"delete_tooltip": "حذف",
"update_tooltip": "ویرایش کارشناس",
"change_password_tooltip": "تغییر رمز عبور",
"delete_expert": "حذف کارشناس",
"are_you_sure_text": "آیا از انجام این عملیات اطمینان دارید؟"
},
"DeleteDialog": {
"delete": "حذف",
"button-cancel": "انصراف",
"typography": "آیا از حدف این مورد اطمینان دارید ؟",
"button-delete": "حذف کردن"
},
"AddDialog": {
"add": "افزودن کاربر جدید",
"name": "نام انگلیسی",
"name_error": "وارد کردن نام انگلیسی الزامیست",
"name_fa": "نام فارسی",
"name_fa_error": "وارد کردن نام فارسی الزامیست",
"permission": "دسترسی",
"permission_min_error": "حداقل باید یک دسترسی انتخاب شود",
"phone_number": "شماره تلفن",
"phone_number_positive": "شماره تلفن باید مثبت باشد",
"phone_number_error": "وارد کردن شماره تلفن الزامیست",
"phone_number_number": "شماره تلفن باید شامل اعداد باشد",
"phone_number_max": "شماره تلفن باید شامل 11 رقم باشد",
"national_id_positive": "کد ملی باید مثبت باشد",
"national_id_number": "کد ملی باید شامل اعداد باشد",
"national_id_max": "کد ملی باید شامل 10 رقم باشد",
"national_id": "کد ملی",
"national_id_error": "وارد کردن کد ملی الزامیست",
"type_id_error": "وارد کردن نوع کاربر الزامیست",
"navgan_id_error": "وارد کردن کد ناوگان الزامیست",
"refahi": "رفاهی",
"navgan": "ناوگان",
"type_id": "نوع کاربر",
"navgan_id": "کد ناوگان",
"button-cancel": "انصراف",
"button-add": "ثبت"
}
}

View File

@@ -35,13 +35,16 @@ const DashboardChangePasswordComponent = () => {
};
const validationSchema = Yup.object().shape({
current_password: Yup.string().required(
t("ChangePassword.error_message_required")
t("ChangePassword.error_message_current_password")
),
new_password: Yup.string()
.min(8, t("ChangePassword.error_message_password_length"))
.required(t("ChangePassword.error_message_required")),
.required(t("ExpertMangement.error_message_new_password"))
.matches(
/^(?=.*[a-zA-Z])(?=.*\d).{8,}$/,
t("ExpertMangement.error_message_new_password_regex")
),
new_password_confirmation: Yup.string()
.required(t("ChangePassword.error_message_required"))
.required(t("ChangePassword.error_message_confirm_password"))
.test(
t("ChangePassword.error_message_password_match"),
t("ChangePassword.error_message_password_not_match"),

View File

@@ -131,8 +131,11 @@ function DashboardCommercialChiefComponent() {
tableUrl={GET_COMMERCIAL_CHIEF}
columns={columns}
selectableRow={false}
enableCustomToolbar={true}
enableCustomToolbar={false}
enableLastUpdate={true}
sorting={[{
id: 'id', desc: false
}]}
enablePinning={true}
enableDensityToggle={false}
initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large)

View File

@@ -132,10 +132,13 @@ function DashboardDevelopmentAssistantComponent() {
tableUrl={GET_DEVELOPMENT_ASSISTANT}
columns={columns}
selectableRow={false}
enableCustomToolbar={true}
enableCustomToolbar={false}
enableLastUpdate={true}
enablePinning={true}
enableDensityToggle={false}
sorting={[{
id: 'id', desc: false
}]}
initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large)
enableColumnFilters={true}
enableHiding={true}

View File

@@ -0,0 +1,91 @@
import {useTranslations} from "next-intl";
import {Button, DialogActions, DialogContent, IconButton, InputAdornment, TextField} from "@mui/material";
import {CHANGE_PASSWORD_EXPERT_MANAGEMENT} from "@/core/data/apiRoutes";
import {useFormik} from "formik";
import * as Yup from "yup";
import {Visibility, VisibilityOff} from "@mui/icons-material";
import {useState} from "react";
import useRequest from "@/lib/app/hooks/useRequest";
const ChnagePasswordContent = ({rowId, fetchUrl, mutate, setOpenChangePasswordDialog}) => {
const t = useTranslations();
const requestServer = useRequest();
const [showPassword, setShowPassword] = useState(false);
const handleClickShowPassword = () => {
setShowPassword(!showPassword);
};
const validationSchema = Yup.object().shape({
new_password: Yup.string()
.required(t("ExpertMangement.error_message_new_password"))
.matches(
/^(?=.*[a-zA-Z])(?=.*\d).{8,}$/,
t("ExpertMangement.error_message_new_password_regex")
),
});
const formik = useFormik({
initialValues: {
new_password: "",
},
validationSchema,
onSubmit: (values, {setSubmitting}) => {
const formData = new FormData();
formData.append("new_password", values.new_password);
requestServer(`${CHANGE_PASSWORD_EXPERT_MANAGEMENT}/${rowId}`, 'post', {
auth: true,
data: formData
})
.then((response) => {
mutate(fetchUrl)
}).catch(() => {
}).finally(() => {
setSubmitting(false);
});
},
});
return (
<>
<DialogContent>
<TextField
name="new_password"
label={t("ExpertMangement.text_field_new_password")}
variant="outlined"
margin="normal"
size="small"
value={formik.values.new_password}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
error={formik.touched.new_password && !!formik.errors.new_password}
helperText={formik.touched.new_password && formik.errors.new_password ? formik.errors.new_password : null}
type={showPassword ? "text" : "password"}
InputProps={{
endAdornment: (
<InputAdornment position="end">
<IconButton onClick={handleClickShowPassword}>
{showPassword ? <Visibility/> : <VisibilityOff/>}
</IconButton>
</InputAdornment>
),
}}
sx={{width: "100%"}}
/>
</DialogContent>
<DialogActions>
<Button onClick={() => setOpenChangePasswordDialog(false)} variant="outlined" color="secondary"
disabled={formik.isSubmitting} autoFocus>
{t("ExpertMangement.button-cancel")}
</Button>
<Button onClick={formik.handleSubmit} variant="contained" color="primary"
disabled={formik.isSubmitting}>
{t("ExpertMangement.button-confirm")}
</Button>
</DialogActions>
</>
);
};
export default ChnagePasswordContent;

View File

@@ -0,0 +1,33 @@
import {useTranslations} from "next-intl";
import {Dialog, DialogTitle, IconButton, Tooltip} from "@mui/material";
import KeyIcon from '@mui/icons-material/Key';
import {useState} from "react";
import ChangePasswordContent from "./ChangePasswordContent";
const ChangePassword = ({rowId, fetchUrl, mutate}) => {
const t = useTranslations();
const [openChnagePasswordDialog, setOpenChangePasswordDialog] = useState(false);
return (
<>
<Tooltip title={t("ExpertMangement.change_password_tooltip")}>
<IconButton
color="primary"
onClick={() => {
setOpenChangePasswordDialog(true)
}}
>
<KeyIcon/>
</IconButton>
</Tooltip>
<Dialog fullWidth maxWidth={'xs'} open={openChnagePasswordDialog}
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("ExpertMangement.change_password")}</DialogTitle>
<ChangePasswordContent rowId={rowId} mutate={mutate} fetchUrl={fetchUrl}
setOpenChangePasswordDialog={setOpenChangePasswordDialog}/>
</Dialog>
</>
);
};
export default ChangePassword;

View File

@@ -0,0 +1,385 @@
import {
Box,
Button,
Chip,
DialogActions,
DialogContent,
Divider,
FormControl,
FormHelperText,
Grid,
IconButton,
InputAdornment,
InputLabel,
MenuItem,
Select,
TextField,
} from "@mui/material";
import {useFormik} from "formik";
import {useTranslations} from "next-intl";
import * as Yup from "yup";
import {useState} from "react";
import {CREATE_EXPERT_MANAGEMENT, GET_CITY_LIST} from "@/core/data/apiRoutes";
import useRequest from "@/lib/app/hooks/useRequest";
import useProvince from "@/lib/app/hooks/useProvince";
import useRole from "@/lib/app/hooks/useRole";
import {Visibility, VisibilityOff} from "@mui/icons-material";
const CreateContent = ({setOpenCreateDialog, mutate, fetchUrl}) => {
const t = useTranslations();
const requestServer = useRequest()
const [cityList, setCityList] = useState([]);
const [cityTextField, setCityTextField] = useState(t("ExpertMangement.text_field_please_select_province"));
const {provinceList, isLoadingProvinceList, errorProvinceList} = useProvince();
const {roleList, isLoadingRoleList, errorRoleList} = useRole();
const [showPassword, setShowPassword] = useState(false);
const handleClickShowPassword = () => {
setShowPassword(!showPassword);
};
function getCities(province_id) {
formik.setFieldTouched("city_id", false, false);
formik.setFieldValue("city_id", "")
setCityTextField(t("ExpertMangement.text_field_loading_cities_list"))
requestServer(`${GET_CITY_LIST}?province_id=${province_id}`, "get", {auth: true, notification: false})
.then(({data}) => {
const result = data.data;
const formattedData = result.map((city, index) => ({
id: index,
name: city.name,
value: city.id,
}));
setCityList(formattedData);
setCityTextField(t("ExpertMangement.text_field_city_id"))
}).catch(() => {
setCityTextField(t("ExpertMangement.text_field_error_fetching_cities"))
});
}
const validationSchema = Yup.object().shape({
name: Yup.string().required(t("ExpertMangement.error_message_name")),
username: Yup.string().required(t("ExpertMangement.error_message_username")),
email: Yup.string().required(t("ExpertMangement.error_message_email")),
phone_number: Yup.string().required(t("ExpertMangement.error_message_phone_number")),
national_id: Yup.string().required(t("ExpertMangement.error_message_national_id")),
password: Yup.string()
.required(t("ExpertMangement.error_message_password"))
.matches(
/^(?=.*[a-zA-Z])(?=.*\d).{8,}$/,
t("ExpertMangement.error_message_password_regex")
),
position: Yup.string().required(t("ExpertMangement.error_message_position")),
province_id: Yup.string().required(t("ExpertMangement.error_message_province_id")),
city_id: Yup.string().required(t("ExpertMangement.error_message_city_id")),
role_id: Yup.string().required(t("ExpertMangement.error_message_role_id"))
});
const formik = useFormik({
initialValues: {
name: "",
username: "",
email: "",
phone_number: "",
national_id: "",
password: "",
position: "",
province_id: "",
city_id: "",
role_id: ""
},
validationSchema,
onSubmit: (values, {setSubmitting}) => {
const formData = new FormData();
formData.append("name", values.name);
formData.append("national_id", values.national_id);
formData.append("phone_number", values.phone_number);
formData.append("email", values.email);
formData.append("username", values.username);
formData.append("password", values.password);
formData.append("province_id", values.province_id);
formData.append("city_id", values.city_id);
formData.append("position", values.position);
formData.append("role_id", values.role_id);
requestServer(`${CREATE_EXPERT_MANAGEMENT}`, 'post', {auth: true, data: formData})
.then((response) => {
mutate(fetchUrl)
setOpenCreateDialog(false)
}).catch(() => {
}).finally(() => {
setSubmitting(false);
});
},
});
return (
<>
<DialogContent>
<Box sx={{my: 1}}>
<Divider>
<Chip
label={t("ExpertMangement.personal_info")}
/>
</Divider>
</Box>
<Grid container justifyContent="space-around" spacing={2} sx={{pb: 2}}>
<Grid item xs={12} sm={6} md={4} lg={3}>
<TextField
name="name"
label={t("ExpertMangement.text_field_name")}
variant="outlined"
margin="normal"
size="small"
value={formik.values.name}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
error={formik.touched.name && !!formik.errors.name}
helperText={formik.touched.name && formik.errors.name ? formik.errors.name : null}
sx={{width: "100%"}}
/>
</Grid>
<Grid item xs={12} sm={6} md={4} lg={3}>
<TextField
name="national_id"
label={t("ExpertMangement.text_field_national_id")}
variant="outlined"
margin="normal"
size="small"
value={formik.values.national_id}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
error={formik.touched.national_id && !!formik.errors.national_id}
helperText={formik.touched.national_id && formik.errors.national_id ? formik.errors.national_id : null}
sx={{width: "100%"}}
/>
</Grid>
<Grid item xs={12} sm={6} md={4} lg={3}>
<TextField
name="phone_number"
label={t("ExpertMangement.text_field_phone_number")}
variant="outlined"
margin="normal"
size="small"
value={formik.values.phone_number}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
error={formik.touched.phone_number && !!formik.errors.phone_number}
helperText={formik.touched.phone_number && formik.errors.phone_number ? formik.errors.phone_number : null}
sx={{width: "100%"}}
/>
</Grid>
<Grid item xs={12} sm={6} md={4} lg={3}>
<TextField
name="email"
label={t("ExpertMangement.text_field_email")}
variant="outlined"
margin="normal"
size="small"
value={formik.values.email}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
error={formik.touched.email && !!formik.errors.email}
helperText={formik.touched.email && formik.errors.email ? formik.errors.email : null}
sx={{width: "100%"}}
/>
</Grid>
</Grid>
<Box sx={{my: 1}}>
<Divider>
<Chip
label={t("ExpertMangement.user_info")}
/>
</Divider>
</Box>
<Grid container justifyContent="space-around" spacing={2} sx={{pb: 2}}>
<Grid item xs={12} sm={6}>
<TextField
name="username"
label={t("ExpertMangement.text_field_username")}
variant="outlined"
margin="normal"
size="small"
value={formik.values.username}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
error={formik.touched.username && !!formik.errors.username}
helperText={formik.touched.username && formik.errors.username ? formik.errors.username : null}
sx={{width: "100%"}}
/>
</Grid>
<Grid item xs={12} sm={6}>
<TextField
name="password"
label={t("ExpertMangement.text_field_password")}
variant="outlined"
margin="normal"
size="small"
value={formik.values.password}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
error={formik.touched.password && !!formik.errors.password}
helperText={formik.touched.password && formik.errors.password ? formik.errors.password : null}
type={showPassword ? "text" : "password"}
InputProps={{
endAdornment: (
<InputAdornment position="end">
<IconButton onClick={handleClickShowPassword}>
{showPassword ? <Visibility/> : <VisibilityOff/>}
</IconButton>
</InputAdornment>
),
}}
sx={{width: "100%"}}
/>
</Grid>
</Grid>
<Box sx={{my: 1}}>
<Divider>
<Chip
label={t("ExpertMangement.rest_info")}
/>
</Divider>
</Box>
<Grid container justifyContent="space-around" spacing={2} sx={{pb: 2}}>
<Grid item xs={12} sm={6}>
<FormControl
error={formik.touched.province_id && !!formik.errors.province_id}
sx={{width: "100%", mt: 2}}
size="small"
>
<InputLabel>{t("ExpertMangement.text_field_province_id")}</InputLabel>
<Select
name="province_id"
disabled={isLoadingProvinceList || errorProvinceList}
label={t("ExpertMangement.text_field_province_id")}
value={formik.values.province_id}
onChange={(e) => {
formik.setFieldValue("province_id", e.target.value);
getCities(e.target.value)
}}
onBlur={formik.handleBlur}
fullWidth
variant="outlined"
>
{isLoadingProvinceList ? (
<MenuItem>
{t("ExpertMangement.text_field_loading_provinces_list")}
</MenuItem>
) : errorProvinceList ? (
<MenuItem>
{t("ExpertMangement.text_field_error_fetching_provinces")}
</MenuItem>
) : (
provinceList.map((item) => (
<MenuItem key={item.id} value={item.id}>
{item.name}
</MenuItem>
))
)}
</Select>
<FormHelperText>
{formik.touched.province_id && formik.errors.province_id ? formik.errors.province_id : ""}
</FormHelperText>
</FormControl>
</Grid>
<Grid item xs={12} sm={6}>
<FormControl
disabled={cityList.length === 0 ? true : false}
error={formik.touched.city_id && !!formik.errors.city_id}
sx={{width: "100%", mt: 2}}
size="small"
>
<InputLabel>{cityTextField}</InputLabel>
<Select
name="city_id"
label={t("ExpertMangement.text_field_city_id")}
value={formik.values.city_id}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
fullWidth
variant="outlined"
>
{cityList.map((item) => (
<MenuItem key={item.value} value={item.value}>
{item.name}
</MenuItem>
))}
</Select>
<FormHelperText>
{formik.touched.city_id && formik.errors.city_id ? formik.errors.city_id : ""}
</FormHelperText>
</FormControl>
</Grid>
</Grid>
<Grid container justifyContent="space-around" spacing={2} sx={{pb: 2}}>
<Grid item xs={12} sm={6}>
<TextField
name="position"
label={t("ExpertMangement.text_field_position")}
variant="outlined"
margin="normal"
size="small"
value={formik.values.position}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
error={formik.touched.position && !!formik.errors.position}
helperText={formik.touched.position && formik.errors.position ? formik.errors.position : null}
sx={{width: "100%"}}
/>
</Grid>
<Grid item xs={12} sm={6}>
<FormControl
error={formik.touched.role_id && !!formik.errors.role_id}
sx={{width: "100%", mt: 2}}
size="small"
>
<InputLabel>{t("ExpertMangement.text_field_role_id")}</InputLabel>
<Select
name="role_id"
label={t("ExpertMangement.text_field_role_id")}
value={formik.values.role_id}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
fullWidth
variant="outlined"
>
{isLoadingRoleList ? (
<MenuItem>
{t("ExpertMangement.text_field_loading_roles_list")}
</MenuItem>
) : errorRoleList ? (
<MenuItem>
{t("ExpertMangement.text_field_error_fetching_roles")}
</MenuItem>
) : (
roleList.map((item) => (
<MenuItem key={item.id} value={item.id}>
{item.name_fa}
</MenuItem>
))
)}
</Select>
<FormHelperText>
{formik.touched.role_id && formik.errors.role_id ? formik.errors.role_id : ""}
</FormHelperText>
</FormControl>
</Grid>
</Grid>
</DialogContent>
<DialogActions>
<Button onClick={() => setOpenCreateDialog(false)} variant="outlined" color="secondary"
disabled={formik.isSubmitting} autoFocus>
{t("ExpertMangement.button-cancel")}
</Button>
<Button onClick={formik.handleSubmit} variant="contained" color="primary"
disabled={formik.isSubmitting}>
{t("ExpertMangement.button-confirm")}
</Button>
</DialogActions>
</>
);
};
export default CreateContent;

View File

@@ -0,0 +1,39 @@
import {Button, Dialog, DialogTitle, Stack, Tooltip,} from "@mui/material";
import {useTranslations} from "next-intl";
import DataSaverOnIcon from "@mui/icons-material/DataSaverOn";
import {useState} from "react";
import CreateContent from "./CreateContent";
const Create = ({mutate, fetchUrl}) => {
const t = useTranslations();
const [openCreateDialog, setOpenCreateDialog] = useState(false);
return (
<>
<Stack direction={"row"} spacing={2}>
<Tooltip title={t("ExpertMangement.add")} arrow placement="right">
<Button
color="primary"
variant="contained"
size="small"
sx={{textTransform: "unset", alignSelf: "center"}}
startIcon={<DataSaverOnIcon/>}
onClick={() => {
setOpenCreateDialog(true)
}}
>
{t("ExpertMangement.add")}
</Button>
</Tooltip>
</Stack>
<Dialog fullWidth maxWidth={'lg'} open={openCreateDialog}
TransitionProps={{unmountOnExit: true}}
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("ExpertMangement.create")}</DialogTitle>
<CreateContent setOpenCreateDialog={setOpenCreateDialog} mutate={mutate} fetchUrl={fetchUrl}/>
</Dialog>
</>
);
};
export default Create;

View File

@@ -0,0 +1,73 @@
import {
Button,
Dialog,
DialogActions,
DialogContent,
DialogContentText,
DialogTitle,
IconButton,
Tooltip
} from "@mui/material";
import DeleteIcon from '@mui/icons-material/Delete';
import {useState} from "react";
import {DELETE_EXPERT_MANAGEMENT} from "@/core/data/apiRoutes";
import useRequest from "@/lib/app/hooks/useRequest";
import {useTranslations} from "next-intl";
const Delete = ({rowId, fetchUrl, mutate}) => {
const t = useTranslations();
const requestServer = useRequest({auth: true});
const [openDeleteDialog, setOpenDeleteDialog] = useState(false);
const [isSubmitting, setIsSubmitting] = useState(false);
const handleDelete = () => {
setIsSubmitting(true)
requestServer(`${DELETE_EXPERT_MANAGEMENT}/${rowId}`, 'post')
.then((response) => {
mutate(fetchUrl)
})
.catch(() => {
})
.finally(() => {
setIsSubmitting(false)
setOpenDeleteDialog(false);
});
};
return (
<>
<Tooltip title={t("ExpertMangement.delete_tooltip")}>
<IconButton
color="primary"
onClick={() => {
setOpenDeleteDialog(true);
}}
>
<DeleteIcon/>
</IconButton>
</Tooltip>
<Dialog
open={openDeleteDialog}
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("ExpertMangement.delete_expert")}</DialogTitle>
<DialogContent>
<DialogContentText>{t("ExpertMangement.are_you_sure_text")}</DialogContentText>
</DialogContent>
<DialogActions>
<Button onClick={() => setOpenDeleteDialog(false)} color="secondary" autoFocus>
{t("ExpertMangement.button_close")}
</Button>
<Button onClick={handleDelete} variant="contained" color="primary" disabled={isSubmitting}>
{t("ExpertMangement.button_delete")}
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default Delete;

View File

@@ -0,0 +1,342 @@
import {useTranslations} from "next-intl";
import {
Box,
Button,
Chip,
DialogActions,
DialogContent,
Divider,
FormControl,
FormHelperText,
Grid,
InputLabel,
MenuItem,
Select,
TextField
} from "@mui/material";
import {useEffect, useState} from "react";
import {useFormik} from "formik";
import {GET_CITY_LIST, UPDATE_EXPERT_MANAGEMENT} from "@/core/data/apiRoutes";
import * as Yup from "yup";
import useRequest from "@/lib/app/hooks/useRequest";
import useProvince from "@/lib/app/hooks/useProvince";
import useRole from "@/lib/app/hooks/useRole";
const UpdateContent = ({row, fetchUrl, mutate, setOpenUpdateDialog}) => {
const t = useTranslations();
const requestServer = useRequest();
const [cityList, setCityList] = useState([]);
const [citiesExist, setCitiesExist] = useState(false);
const [cityTextField, setCityTextField] = useState(t("ExpertMangement.text_field_please_select_province"));
const {provinceList, isLoadingProvinceList, errorProvinceList} = useProvince();
const {roleList, isLoadingRoleList, errorRoleList} = useRole();
function getCities(province_id) {
formik.setFieldTouched("city_id", false, false);
citiesExist && formik.setFieldValue("city_id", "")
setCityTextField(t("ExpertMangement.text_field_loading_cities_list"))
requestServer(`${GET_CITY_LIST}?province_id=${province_id}`, "get", {auth: true, notification: false})
.then(({data}) => {
const result = data.data;
const formattedData = result.map((city, index) => ({
id: index,
name: city.name,
value: city.id,
}));
setCitiesExist(true);
setCityList(formattedData);
setCityTextField(t("ExpertMangement.text_field_city_id"))
}).catch(() => {
setCityTextField(t("ExpertMangement.text_field_error_fetching_cities"))
});
}
const validationSchema = Yup.object().shape({
name: Yup.string().required(t("ExpertMangement.error_message_name")),
username: Yup.string().required(t("ExpertMangement.error_message_username")),
email: Yup.string().required(t("ExpertMangement.error_message_email")),
phone_number: Yup.string().required(t("ExpertMangement.error_message_phone_number")),
national_id: Yup.string().required(t("ExpertMangement.error_message_national_id")),
position: Yup.string().required(t("ExpertMangement.error_message_position")),
province_id: Yup.string().required(t("ExpertMangement.error_message_province_id")),
city_id: Yup.string().required(t("ExpertMangement.error_message_city_id")),
role_id: Yup.string().required(t("ExpertMangement.error_message_role_id"))
});
const formik = useFormik({
initialValues: {
name: row.original.name,
username: row.original.username,
email: row.original.email,
phone_number: row.original.phone_number,
national_id: row.original.national_id,
position: row.original.position,
province_id: row.original.province_id,
city_id: row.original.city_id,
role_id: row.original.roles[0].id
},
validationSchema,
onSubmit: (values, {setSubmitting}) => {
const formData = new FormData();
formData.append("name", values.name);
formData.append("national_id", values.national_id);
formData.append("phone_number", values.phone_number);
formData.append("email", values.email);
formData.append("username", values.username);
formData.append("province_id", values.province_id);
formData.append("city_id", values.city_id);
formData.append("position", values.position);
formData.append("role_id", values.role_id);
requestServer(`${UPDATE_EXPERT_MANAGEMENT}/${row.original.id}`, 'post', {auth: true, data: formData})
.then((response) => {
mutate(fetchUrl)
}).catch(() => {
}).finally(() => {
setSubmitting(false);
});
},
});
useEffect(() => {
getCities(formik.values.province_id);
}, [formik.values.province_id]);
return (
<>
<DialogContent>
<Box sx={{my: 1}}>
<Divider>
<Chip
label={t("ExpertMangement.personal_info")}
/>
</Divider>
</Box>
<Grid container justifyContent="space-around" spacing={2} sx={{pb: 2}}>
<Grid item xs={12} sm={6} md={4} lg={3}>
<TextField
name="name"
label={t("ExpertMangement.text_field_name")}
variant="outlined"
margin="normal"
size="small"
value={formik.values.name}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
error={formik.touched.name && !!formik.errors.name}
helperText={formik.touched.name && formik.errors.name ? formik.errors.name : null}
sx={{width: "100%"}}
/>
</Grid>
<Grid item xs={12} sm={6} md={4} lg={3}>
<TextField
name="national_id"
label={t("ExpertMangement.text_field_national_id")}
variant="outlined"
margin="normal"
size="small"
value={formik.values.national_id}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
error={formik.touched.national_id && !!formik.errors.national_id}
helperText={formik.touched.national_id && formik.errors.national_id ? formik.errors.national_id : null}
sx={{width: "100%"}}
/>
</Grid>
<Grid item xs={12} sm={6} md={4} lg={3}>
<TextField
name="phone_number"
label={t("ExpertMangement.text_field_phone_number")}
variant="outlined"
margin="normal"
size="small"
value={formik.values.phone_number}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
error={formik.touched.phone_number && !!formik.errors.phone_number}
helperText={formik.touched.phone_number && formik.errors.phone_number ? formik.errors.phone_number : null}
sx={{width: "100%"}}
/>
</Grid>
<Grid item xs={12} sm={6} md={4} lg={3}>
<TextField
name="email"
label={t("ExpertMangement.text_field_email")}
variant="outlined"
margin="normal"
size="small"
value={formik.values.email}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
error={formik.touched.email && !!formik.errors.email}
helperText={formik.touched.email && formik.errors.email ? formik.errors.email : null}
sx={{width: "100%"}}
/>
</Grid>
</Grid>
<Box sx={{my: 1}}>
<Divider>
<Chip
label={t("ExpertMangement.user_info")}
/>
</Divider>
</Box>
<Grid container justifyContent="space-around" spacing={2} sx={{pb: 2}}>
<Grid item xs={12} sm={6}>
<TextField
name="username"
label={t("ExpertMangement.text_field_username")}
variant="outlined"
margin="normal"
size="small"
value={formik.values.username}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
error={formik.touched.username && !!formik.errors.username}
helperText={formik.touched.username && formik.errors.username ? formik.errors.username : null}
sx={{width: "100%"}}
/>
</Grid>
</Grid>
<Box sx={{my: 1}}>
<Divider>
<Chip
label={t("ExpertMangement.rest_info")}
/>
</Divider>
</Box>
<Grid container justifyContent="space-around" spacing={2} sx={{pb: 2}}>
<Grid item xs={12} sm={6}>
<FormControl
error={formik.touched.province_id && !!formik.errors.province_id}
sx={{width: "100%", mt: 2}}
size="small"
>
<InputLabel>{t("ExpertMangement.text_field_province_id")}</InputLabel>
<Select
name="province_id"
label={t("ExpertMangement.text_field_province_id")}
value={provinceList ? formik.values.province_id : ""}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
fullWidth
variant="outlined"
>
{isLoadingProvinceList ? (
<MenuItem>
{t("ExpertMangement.text_field_loading_provinces_list")}
</MenuItem>
) : errorProvinceList ? (
<MenuItem>
{t("ExpertMangement.text_field_error_fetching_provinces")}
</MenuItem>
) : (
provinceList.map((item) => (
<MenuItem key={item.id} value={item.id}>
{item.name}
</MenuItem>
))
)}
</Select>
<FormHelperText>
{formik.touched.province_id && formik.errors.province_id ? formik.errors.province_id : ""}
</FormHelperText>
</FormControl>
</Grid>
<Grid item xs={12} sm={6}>
<FormControl
disabled={cityList.length === 0}
error={formik.touched.city_id && !!formik.errors.city_id}
sx={{width: "100%", mt: 2}}
size="small"
>
<InputLabel>{cityTextField}</InputLabel>
<Select
name="city_id"
label={t("ExpertMangement.text_field_city_id")}
value={cityList.length ? formik.values.city_id : ""}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
fullWidth
variant="outlined"
>
{cityList.map((item) => (
<MenuItem key={item.value} value={item.value}>
{item.name}
</MenuItem>
))}
</Select>
<FormHelperText>
{formik.touched.city_id && formik.errors.city_id ? formik.errors.city_id : ""}
</FormHelperText>
</FormControl>
</Grid>
</Grid>
<Grid container justifyContent="space-around" spacing={2} sx={{pb: 2}}>
<Grid item xs={12} sm={6}>
<TextField
name="position"
label={t("ExpertMangement.text_field_position")}
variant="outlined"
margin="normal"
size="small"
value={formik.values.position}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
error={formik.touched.position && !!formik.errors.position}
helperText={formik.touched.position && formik.errors.position ? formik.errors.position : null}
sx={{width: "100%"}}
/>
</Grid>
<Grid item xs={12} sm={6}>
<FormControl
error={formik.touched.role_id && !!formik.errors.role_id}
sx={{width: "100%", mt: 2}}
size="small"
>
<InputLabel>{t("ExpertMangement.text_field_role_id")}</InputLabel>
<Select
name="role_id"
label={t("ExpertMangement.text_field_role_id")}
value={roleList ? formik.values.role_id : ""}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
fullWidth
variant="outlined"
>
{isLoadingRoleList ? (
<MenuItem>
{t("ExpertMangement.text_field_loading_roles_list")}
</MenuItem>
) : errorRoleList ? (
<MenuItem>
{t("ExpertMangement.text_field_error_fetching_roles")}
</MenuItem>
) : (
roleList.map((item) => (
<MenuItem key={item.id} value={item.id}>
{item.name_fa}
</MenuItem>
))
)}
</Select>
<FormHelperText>
{formik.touched.role_id && formik.errors.role_id ? formik.errors.role_id : ""}
</FormHelperText>
</FormControl>
</Grid>
</Grid>
</DialogContent>
<DialogActions>
<Button onClick={() => setOpenUpdateDialog(false)} variant="outlined" color="secondary"
disabled={formik.isSubmitting} autoFocus>
{t("ExpertMangement.button-cancel")}
</Button>
<Button onClick={formik.handleSubmit} variant="contained" color="primary"
disabled={formik.isSubmitting}>
{t("ExpertMangement.button-confirm")}
</Button>
</DialogActions>
</>
);
};
export default UpdateContent;

View File

@@ -0,0 +1,32 @@
import {useTranslations} from "next-intl";
import {Dialog, DialogTitle, IconButton, Tooltip} from "@mui/material";
import EditIcon from '@mui/icons-material/Edit';
import {useState} from "react";
import UpdateContent from "./UpdateContent";
const Update = ({row, fetchUrl, mutate}) => {
const t = useTranslations();
const [openUpdateDialog, setOpenUpdateDialog] = useState(false);
return (
<>
<Tooltip title={t("ExpertMangement.update_tooltip")}>
<IconButton
color="primary"
onClick={() => {
setOpenUpdateDialog(true)
}}
>
<EditIcon/>
</IconButton>
</Tooltip>
<Dialog fullWidth maxWidth={'lg'} open={openUpdateDialog}
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("ExpertMangement.update")}</DialogTitle>
<UpdateContent row={row} mutate={mutate} fetchUrl={fetchUrl} setOpenUpdateDialog={setOpenUpdateDialog}/>
</Dialog>
</>
);
};
export default Update;

View File

@@ -0,0 +1,29 @@
import {Box} from "@mui/material";
import Update from "./Form/UpdateForm"
import Delete from "./Form/DeleteForm";
import ChangePassword from "./Form/ChangePassword";
const TableRowActions = ({row, mutate, fetchUrl}) => {
return (
<Box sx={{display: "flex", flexWrap: "nowrap", gap: "8px"}}>
<Update
row={row}
mutate={mutate}
fetchUrl={fetchUrl}
/>
<ChangePassword
rowId={row.getValue("id")}
mutate={mutate}
fetchUrl={fetchUrl}
/>
<Delete
rowId={row.getValue("id")}
mutate={mutate}
fetchUrl={fetchUrl}
/>
</Box>
);
};
export default TableRowActions;

View File

@@ -0,0 +1,13 @@
import {useTranslations} from "next-intl";
import Create from "./Form/CreateForm";
function TableToolbar({mutate, fetchUrl}) {
const t = useTranslations();
return (
<>
<Create mutate={mutate} fetchUrl={fetchUrl}/>
</>
);
}
export default TableToolbar;

View File

@@ -0,0 +1,194 @@
import DashboardLayouts from "@/layouts/dashboardLayouts";
import {Box, Typography} from "@mui/material";
import {useMemo} from "react";
import {GET_EXPERT_MANAGEMENT} from "@/core/data/apiRoutes";
import {useTranslations} from "next-intl";
import TableRowActions from "./TableRowActions";
import DataTable from "@/core/components/DataTable";
import TableToolbar from "@/components/dashboard/expert-management/TableToolbar";
import moment from "jalali-moment";
import MuiDatePicker from "@/core/components/MuiDatePicker";
function DashboardExpertManagementComponent() {
const t = useTranslations();
const columns = useMemo(
() => [
{
accessorFn: (row) => row.id,
id: "id",
header: t("ExpertMangement.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("ExpertMangement.name"),
enableColumnFilter: true,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["contains", "equals", "notEquals"],
Cell: ({renderedCellValue}) => (
<Typography variant="body2">{renderedCellValue}</Typography>
),
},
{
accessorFn: (row) => row.username,
id: "username",
header: t("ExpertMangement.username"),
enableColumnFilter: true,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["contains", "equals", "notEquals"],
Cell: ({renderedCellValue}) => (
<Typography variant="body2">{renderedCellValue}</Typography>
),
},
{
accessorFn: (row) => row.email,
id: "email",
header: t("ExpertMangement.email"),
enableColumnFilter: true,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["contains", "equals", "notEquals"],
Cell: ({renderedCellValue}) => (
<Typography variant="body2">{renderedCellValue}</Typography>
),
},
{
accessorFn: (row) => row.phone_number,
id: "phone_number",
header: t("ExpertMangement.phone_number"),
enableColumnFilter: true,
datatype: "numeric",
filterFn: "equals",
columnFilterModeOptions: ["contains", "equals", "notEquals"],
Cell: ({renderedCellValue}) => (
<Typography variant="body2">{renderedCellValue}</Typography>
),
},
{
accessorFn: (row) => row.national_id,
id: "national_id",
header: t("ExpertMangement.national_id"),
enableColumnFilter: true,
datatype: "numeric",
filterFn: "equals",
columnFilterModeOptions: ["contains", "equals", "notEquals"],
Cell: ({renderedCellValue}) => (
<Typography variant="body2">{renderedCellValue}</Typography>
),
},
{
accessorFn: (row) => row.position,
id: "position",
header: t("ExpertMangement.position"),
enableColumnFilter: true,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["contains", "equals", "notEquals"],
Cell: ({renderedCellValue}) => (
<Typography variant="body2">{renderedCellValue}</Typography>
),
},
{
accessorFn: (row) => row.province_name,
id: "province_name",
header: t("ExpertMangement.province_name"),
enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["contains", "equals", "notEquals"],
Cell: ({renderedCellValue}) => (
<Typography variant="body2">{renderedCellValue}</Typography>
),
},
{
accessorFn: (row) => row.city_name,
id: "city_name",
header: t("ExpertMangement.city_name"),
enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["contains", "equals", "notEquals"],
Cell: ({renderedCellValue}) => (
<Typography variant="body2">{renderedCellValue}</Typography>
),
},
{
accessorFn: (row) => row.roles[0].name_fa,
id: "roles[0].name_fa",
header: t("ExpertMangement.role_name"),
enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["contains", "equals", "notEquals"],
Cell: ({renderedCellValue}) => (
<Typography variant="body2">{renderedCellValue}</Typography>
),
},
{
accessorFn: (row) =>
moment(row.updated_at).locale("fa").format("HH:mm | yyyy/MM/DD"),
id: "updated_at",
header: t("ExpertMangement.updated_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}/>
);
},
},
],
[]
);
return (
<DashboardLayouts>
<Box sx={{px: 3}}>
<DataTable
tableUrl={GET_EXPERT_MANAGEMENT}
columns={columns}
selectableRow={false}
CustomToolbar={TableToolbar}
sorting={[{
id: 'id', desc: true
}]}
enableCustomToolbar={true}
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 DashboardExpertManagementComponent;

View File

@@ -131,9 +131,12 @@ function DashboardInspectorExpertComponent() {
tableUrl={GET_INSPECTOR_EXPERT}
columns={columns}
selectableRow={false}
enableCustomToolbar={true}
enableCustomToolbar={false}
enableLastUpdate={true}
enablePinning={true}
sorting={[{
id: 'id', desc: false
}]}
enableDensityToggle={false}
initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large)
enableColumnFilters={true}

View File

@@ -14,7 +14,6 @@ import {
} from "@mui/material";
import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
import UploadSystem from "@/core/components/UploadSystem";
import useDirection from "@/lib/app/hooks/useDirection";
import {useFormik} from "formik";
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
import {CONFIRM_MACHINARY_OFFICE} from "@/core/data/apiRoutes";
@@ -26,7 +25,6 @@ import PriceField from "@/core/components/PriceField";
const Confirm = ({rowId, fetchUrl, mutate}) => {
const t = useTranslations();
const {directionApp} = useDirection();
const [selectedImage, setSelectedImage] = useState("");
const [fileType, setfileType] = useState(null);
const [fileName, setfileName] = useState(null);
@@ -113,7 +111,7 @@ const Confirm = ({rowId, fetchUrl, mutate}) => {
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 spacing={3}>
<Stack>
<TextField
name="description"

View File

@@ -162,8 +162,11 @@ function DashboardMachinaryOfficeComponent() {
tableUrl={GET_MACHINARY_OFFICE}
columns={columns}
selectableRow={false}
enableCustomToolbar={true}
enableCustomToolbar={false}
enableLastUpdate={true}
sorting={[{
id: 'id', desc: false
}]}
enablePinning={true}
enableDensityToggle={false}
initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large)

View File

@@ -132,9 +132,11 @@ function DashboardNavganLoanManagementComponent() {
tableUrl={GET_LOAN_MANAGEMENT_NAVGAN}
columns={columns}
selectableRow={false}
enableCustomToolbar={true}
// CustomToolbar={<TableToolbar />}
enableCustomToolbar={false}
enableLastUpdate={true}
sorting={[{
id: 'id', desc: false
}]}
enablePinning={true}
enableDensityToggle={false}
initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large)

View File

@@ -163,8 +163,11 @@ function DashboardNavganProvinceManagerComponent() {
tableUrl={GET_NAVGAN_PROVINCE_MANAGER}
columns={columns}
selectableRow={false}
enableCustomToolbar={true}
enableCustomToolbar={false}
enableLastUpdate={true}
sorting={[{
id: 'id', desc: false
}]}
enablePinning={true}
enableDensityToggle={false}
initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large)

View File

@@ -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({
@@ -113,7 +113,7 @@ const Confirm = ({rowId, fetchUrl, mutate}) => {
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 spacing={3}>
<Stack>
<TextField
name="description"

View File

@@ -163,9 +163,11 @@ function DashboardPassengerOfficeComponent() {
tableUrl={GET_PASSENGER_BOSS}
columns={columns}
selectableRow={false}
enableCustomToolbar={true}
// CustomToolbar={<TableToolbar />}
enableCustomToolbar={false}
enableLastUpdate={true}
sorting={[{
id: 'id', desc: false
}]}
enablePinning={true}
enableDensityToggle={false}
initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large)

View File

@@ -163,9 +163,11 @@ function DashboardPassengerOfficeComponent() {
tableUrl={GET_PASSENGER_OFFICE}
columns={columns}
selectableRow={false}
enableCustomToolbar={true}
// CustomToolbar={<TableToolbar />}
enableCustomToolbar={false}
enableLastUpdate={true}
sorting={[{
id: 'id', desc: false
}]}
enablePinning={true}
enableDensityToggle={false}
initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large)

View File

@@ -132,8 +132,11 @@ function DashboardProvinceHeadExpertComponent() {
tableUrl={GET_PROVINCE_HEAD_EXPERT}
columns={columns}
selectableRow={false}
enableCustomToolbar={true}
enableCustomToolbar={false}
enableLastUpdate={true}
sorting={[{
id: 'id', desc: false
}]}
enablePinning={true}
enableDensityToggle={false}
initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large)

View File

@@ -132,8 +132,10 @@ function DashboardRefahiLoanManagementComponent() {
tableUrl={GET_LOAN_MANAGEMENT_REFAHI}
columns={columns}
selectableRow={false}
enableCustomToolbar={true}
// CustomToolbar={<TableToolbar />}
enableCustomToolbar={false}
sorting={[{
id: 'id', desc: false
}]}
enableLastUpdate={true}
enablePinning={true}
enableDensityToggle={false}

View File

@@ -132,8 +132,10 @@ function DashboardRefahiProvinceManagerComponent() {
tableUrl={GET_REFAHI_PROVINCE_MANAGER}
columns={columns}
selectableRow={false}
enableCustomToolbar={true}
// CustomToolbar={<TableToolbar />}
enableCustomToolbar={false}
sorting={[{
id: 'id', desc: false
}]}
enableLastUpdate={true}
enablePinning={true}
enableDensityToggle={false}

View File

@@ -0,0 +1,137 @@
import {
Button,
Checkbox,
DialogActions,
DialogContent,
FormControl,
FormControlLabel,
FormHelperText,
FormLabel,
Grid,
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_ROLE_MANAGEMENT} from "@/core/data/apiRoutes";
import usePermissions from "@/lib/app/hooks/usePermissions";
const CreateContent = ({mutate, fetchUrl, setOpenConfirmDialog}) => {
const t = useTranslations();
const requestServer = useRequest({auth: true})
const {permissions_list} = usePermissions()
const validationSchema = Yup.object().shape({
name: Yup.string().required(t("AddDialog.name_error")),
name_fa: Yup.string().required(t("AddDialog.name_fa_error")),
permissions: Yup.array().min(1, t("AddDialog.permission_min_error")).required(t("AddDialog.permission")),
});
const formik = useFormik({
initialValues: {
name: "",
name_fa: "",
permissions: [],
}, validationSchema, onSubmit: (values, {setSubmitting}) => {
const formData = new FormData();
formData.append("name", values.name);
formData.append("name_fa", values.name_fa);
for (let i = 0; i < values.permissions.length; i++) {
formData.append(`permissions[${i}]`, values.permissions[i]);
}
requestServer(ADD_ROLE_MANAGEMENT, 'post', {
data: formData,
}).then((response) => {
setOpenConfirmDialog(false)
mutate(fetchUrl)
update_notification()
}).catch(() => {
}).finally(() => {
setSubmitting(false);
});
},
});
return (
<>
<DialogContent>
<Stack spacing={2}>
<Stack direction="row" spacing={2}>
<TextField
name="name"
label={t("AddDialog.name")}
type="text"
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}
/>
<TextField
name="name_fa"
label={t("AddDialog.name_fa")}
value={formik.values.name_fa}
onChange={formik.handleChange}
fullWidth
variant="outlined"
onBlur={formik.handleBlur("name_fa")}
error={formik.touched.name_fa && Boolean(formik.errors.name_fa)}
helperText={formik.touched.name_fa && formik.errors.name_fa}
/>
</Stack>
<Stack>
<FormLabel>{t("AddDialog.permission")}<br/>
<FormControl
name="permissions"
error={formik.touched.permissions && Boolean(formik.errors.permissions)}
onBlur={formik.handleBlur("permissions")}
sx={{mt: 2}}
>
<FormHelperText>{formik.touched.permissions && formik.errors.permissions}</FormHelperText>
<Grid container spacing={2}>
{permissions_list ? (
permissions_list.map((permission) => (
<Grid key={permission.id} item xs={6}>
<FormControlLabel
control={
<Checkbox
checked={formik.values.permissions.includes(permission.id)}
onChange={(e) => {
if (e.target.checked) {
formik.setFieldValue("permissions", [...formik.values.permissions, permission.id])
} else {
formik.setFieldValue("permissions", formik.values.permissions.filter((id) => id !== permission.id))
}
}}
/>
}
label={permission.name_fa}
/>
</Grid>
))
) : null}
</Grid>
</FormControl>
</FormLabel>
</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>
</>
)
}
export default CreateContent

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 "./CreateContent";
const CreateForm = ({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>
<Dialog maxWidth={"md"} 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} fetchUrl={fetchUrl} setOpenConfirmDialog={setOpenConfirmDialog}/>
</Dialog>
</Stack>
)
}
export default CreateForm

View File

@@ -0,0 +1,67 @@
import {useTranslations} from "next-intl";
import {useState} from "react";
import {
Button,
Dialog,
DialogActions,
DialogContent,
DialogTitle,
IconButton,
Tooltip,
Typography
} from "@mui/material";
import DeleteIcon from '@mui/icons-material/Delete';
import useRequest from "@/lib/app/hooks/useRequest";
import useNotification from "@/lib/app/hooks/useNotification";
import {DELETE_ROLE_MANAGEMENT} from "@/core/data/apiRoutes";
const DeleteForm = ({rowId, fetchUrl, mutate}) => {
const t = useTranslations();
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
const [isSubmitting, setIsSubmitting] = useState(false)
const requestServer = useRequest({auth: true})
const {update_notification} = useNotification()
const handleSubmit = () => {
setIsSubmitting(true)
requestServer(`${DELETE_ROLE_MANAGEMENT}/${rowId}`, 'delete').then((response) => {
mutate(fetchUrl)
update_notification()
}).catch(() => {
}).finally(() => {
setIsSubmitting(false)
});
}
return (
<>
<Tooltip title={t("DeleteDialog.delete")}>
<IconButton
color="primary"
onClick={() => {
setOpenConfirmDialog(true)
}}
>
<DeleteIcon/>
</IconButton>
</Tooltip>
<Dialog maxWidth="sm" 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>
{t("DeleteDialog.button-cancel")}
</Button>
<Button onClick={handleSubmit} variant="contained" color="primary"
disabled={isSubmitting}>
{t("DeleteDialog.button-delete")}
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default DeleteForm;

View File

@@ -0,0 +1,156 @@
import {useTranslations} from "next-intl";
import {useState} from "react";
import {
Button,
Checkbox,
Dialog,
DialogActions,
DialogContent,
DialogTitle,
FormControl,
FormControlLabel,
FormHelperText,
FormLabel,
Grid,
IconButton,
Stack,
TextField,
Tooltip
} from "@mui/material";
import {useFormik} from "formik";
import EditIcon from '@mui/icons-material/Edit';
import {UPDATE_ROLE_MANAGEMENT} from "@/core/data/apiRoutes";
import useRequest from "@/lib/app/hooks/useRequest";
import useNotification from "@/lib/app/hooks/useNotification";
import * as Yup from "yup";
import usePermissions from "@/lib/app/hooks/usePermissions";
const UpdateForm = ({row, fetchUrl, mutate}) => {
const t = useTranslations();
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
const requestServer = useRequest({auth: true})
const {update_notification} = useNotification()
const {permissions_list} = usePermissions()
const validationSchema = Yup.object().shape({
name: Yup.string().required(t("UpdateDialog.name_error")),
name_fa: Yup.string().required(t("UpdateDialog.name_fa_error")),
permissions: Yup.array().min(1, t("UpdateDialog.permission_min_error")).required(t("UpdateDialog.permission")),
});
const formik = useFormik({
initialValues: {
name: row.getValue("name"),
name_fa: row.getValue("name_fa"),
permissions: row.original.permissions.map((obj) => obj.id),
}, validationSchema, onSubmit: (values, {setSubmitting}) => {
const formData = new FormData();
formData.append("name", values.name);
formData.append("name_fa", values.name_fa);
for (let i = 0; i < values.permissions.length; i++) {
formData.append(`permissions[${i}]`, values.permissions[i]);
}
requestServer(`${UPDATE_ROLE_MANAGEMENT}/${row.getValue("id")}`, 'post', {
data: formData,
}).then((response) => {
mutate(fetchUrl)
update_notification()
}).catch(() => {
}).finally(() => {
setSubmitting(false);
});
},
});
return (<>
<Tooltip title={t("UpdateDialog.update-tooltip")}>
<IconButton
color="primary"
onClick={() => {
setOpenConfirmDialog(true)
}}
>
<EditIcon/>
</IconButton>
</Tooltip>
<Dialog maxWidth={"md"} 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 direction="row" spacing={2} sx={{mt: 1}}>
<TextField
name="name"
label={t("UpdateDialog.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}
/>
<TextField
name="name_fa"
label={t("UpdateDialog.name_fa")}
value={formik.values.name_fa}
onChange={formik.handleChange}
fullWidth
variant="outlined"
onBlur={formik.handleBlur("name_fa")}
error={formik.touched.name_fa && Boolean(formik.errors.name_fa)}
helperText={formik.touched.name_fa && formik.errors.name_fa}
/>
</Stack>
<Stack>
<FormLabel>{t("UpdateDialog.permission")}<br/>
<FormControl
name="permissions"
error={formik.touched.permissions && Boolean(formik.errors.permissions)}
onBlur={formik.handleBlur("permissions")}
sx={{mt: 2}}
>
<FormHelperText>{formik.touched.permissions && formik.errors.permissions}</FormHelperText>
<Grid container spacing={2}>
{permissions_list ? (
permissions_list.map((permission) => (
<Grid key={permission.id} item xs={6}>
<FormControlLabel
control={
<Checkbox
checked={formik.values.permissions.includes(permission.id)}
onChange={(e) => {
if (e.target.checked) {
formik.setFieldValue("permissions", [...formik.values.permissions, permission.id])
} else {
formik.setFieldValue("permissions", formik.values.permissions.filter((id) => id !== permission.id))
}
}}
/>
}
label={permission.name_fa}
/>
</Grid>
))
) : null}
</Grid>
</FormControl>
</FormLabel>
</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;

View 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
row={row}
mutate={mutate}
fetchUrl={fetchUrl}
/>
<DeleteForm
rowId={row.getValue("id")}
fetchUrl={fetchUrl}
mutate={mutate}
/>
</Box>
);
};
export default TableRowActions;

View File

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

View File

@@ -0,0 +1,96 @@
import DashboardLayouts from "@/layouts/dashboardLayouts";
import {Box, Typography} from "@mui/material";
import {useMemo} from "react";
import {GET_ROLE_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/role-management/TableToolbar";
import TableRowActions from "./TableRowActions"
function DashboardRoleManagementComponent() {
const t = useTranslations();
const columns = useMemo(() => [{
accessorFn: (row) => row.id,
id: "id",
sortDescFirst: true,
header: t("RoleManagement.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_fa,
id: "name_fa",
header: t("RoleManagement.name_fa"),
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("RoleManagement.name"),
enableColumnFilter: true,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["contains"],
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("RoleManagement.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("RoleManagement.updated_at"),
enableColumnFilter: false,
datatype: "numeric",
Cell: ({renderedCellValue}) => (<Typography variant="body2">{renderedCellValue}</Typography>),
}], []);
return (<DashboardLayouts>
<Box sx={{px: 3}}>
<DataTable
tableUrl={GET_ROLE_MANAGEMENT}
columns={columns}
selectableRow={false}
enableCustomToolbar={true}
CustomToolbar={TableToolbar}
enableLastUpdate={true}
enablePinning={true}
enableDensityToggle={false}
sorting={[{
id: 'id', desc: true
}]}
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 DashboardRoleManagementComponent;

View File

@@ -14,7 +14,6 @@ import {
} from "@mui/material";
import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
import UploadSystem from "@/core/components/UploadSystem";
import useDirection from "@/lib/app/hooks/useDirection";
import {useFormik} from "formik";
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
import {CONFIRM_TRANSPORTATION_ASSISTANCE} from "@/core/data/apiRoutes";
@@ -24,7 +23,6 @@ import useNotification from "@/lib/app/hooks/useNotification";
const Confirm = ({rowId, fetchUrl, mutate}) => {
const t = useTranslations();
const {directionApp} = useDirection();
const [selectedImage, setSelectedImage] = useState("");
const [fileType, setfileType] = useState(null);
const [fileName, setfileName] = useState(null);

View File

@@ -163,8 +163,11 @@ function DashboardTransportationAssistanceComponent() {
tableUrl={GET_TRANSPORTATION_ASSISTANCE}
columns={columns}
selectableRow={false}
enableCustomToolbar={true}
enableCustomToolbar={false}
enableLastUpdate={true}
sorting={[{
id: 'id', desc: false
}]}
enablePinning={true}
enableDensityToggle={false}
initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large)

View File

@@ -0,0 +1,163 @@
import {
Button,
DialogActions,
DialogContent,
FormControl,
FormHelperText,
InputLabel,
MenuItem,
Select,
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, fetchUrl, setOpenConfirmDialog}) => {
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)
.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)
.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")),
navgan_id: Yup.number().when('type_id', {
is: 1, // Condition: Check if type_id is equal to 1
then: (schema) => schema.required(t("AddDialog.navgan_id_error")),
otherwise: (schema) => schema, // No validation for navgan_id when type_id is not 1
})
});
const formik = useFormik({
initialValues: {
phone_number: "",
national_id: "",
type_id: "",
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);
if (formik.values.type_id === 1) formData.append("navgan_id", values.navgan_id);
requestServer(ADD_USER_MANAGEMENT, 'post', {
data: formData,
}).then((response) => {
setOpenConfirmDialog(false)
mutate(fetchUrl)
update_notification()
}).catch(() => {
}).finally(() => {
setSubmitting(false);
});
},
});
return (
<>
<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={(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("AddDialog.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("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}
fullWidth
variant="outlined"
sx={{mt: 1}}
>
<MenuItem value={1}>
{t("AddDialog.navgan")}
</MenuItem>
<MenuItem value={2}>
{t("AddDialog.refahi")}
</MenuItem>
</Select>
<FormHelperText>
{formik.touched.type_id && formik.errors.type_id}
</FormHelperText>
</FormControl>
</Stack>
<Stack>
{formik.values.type_id === 1 ? (<TextField
name="navgan_id"
rows={8}
label={t("AddDialog.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}}
/>) : null}
</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>
</>
)
}
export default CreateContent

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/user-management/Form/CreateForm/CreateContent";
const CreateForm = ({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>
<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} fetchUrl={fetchUrl} setOpenConfirmDialog={setOpenConfirmDialog}/>
</Dialog>
</Stack>
)
}
export default CreateForm

View File

@@ -0,0 +1,67 @@
import {useTranslations} from "next-intl";
import {useState} from "react";
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";
import useNotification from "@/lib/app/hooks/useNotification";
const DeleteForm = ({rowId, fetchUrl, mutate}) => {
const t = useTranslations();
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
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) => {
mutate(fetchUrl)
update_notification()
}).catch(() => {
}).finally(() => {
setIsSubmitting(false)
});
}
return (
<>
<Tooltip title={t("DeleteDialog.delete")}>
<IconButton
color="primary"
onClick={() => {
setOpenConfirmDialog(true)
}}
>
<DeleteIcon/>
</IconButton>
</Tooltip>
<Dialog maxWidth="sm" 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>
{t("DeleteDialog.button-cancel")}
</Button>
<Button onClick={handleSubmit} variant="contained" color="primary"
disabled={isSubmitting}>
{t("DeleteDialog.button-delete")}
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default DeleteForm;

View File

@@ -0,0 +1,178 @@
import {useTranslations} from "next-intl";
import {useState} from "react";
import {
Button,
Dialog,
DialogActions,
DialogContent,
DialogTitle,
FormControl,
FormHelperText,
IconButton,
InputLabel,
MenuItem,
Select,
Stack,
TextField,
Tooltip
} from "@mui/material";
import {useFormik} from "formik";
import EditIcon from '@mui/icons-material/Edit';
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 = ({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)
.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)
.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")),
navgan_id: Yup.number().when('type_id', {
is: 1, // Condition: Check if type_id is equal to 1
then: (schema) => schema.required(t("AddDialog.navgan_id_error")),
otherwise: (schema) => schema, // No validation for navgan_id when type_id is not 1
})
});
const formik = useFormik({
initialValues: {
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);
if (formik.values.type_id === 1) formData.append("navgan_id", values.navgan_id);
requestServer(`${UPDATE_USER_MANAGEMENT}/${row.getValue("id")}`, 'post', {
data: formData,
}).then((response) => {
mutate(fetchUrl)
update_notification()
}).catch(() => {
}).finally(() => {
setSubmitting(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>
<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)}
>
<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>
{formik.values.type_id === 1 ? (<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}}
/>) : null}
</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;

View 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
row={row}
mutate={mutate}
fetchUrl={fetchUrl}
/>
<DeleteForm
rowId={row.getValue("id")}
fetchUrl={fetchUrl}
mutate={mutate}
/>
</Box>
);
};
export default TableRowActions;

View File

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

View File

@@ -0,0 +1,143 @@
import DashboardLayouts from "@/layouts/dashboardLayouts";
import {Box, FormControl, FormHelperText, IconButton, MenuItem, Select, Stack, 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"
import ClearIcon from "@mui/icons-material/Clear";
function DashboardUserManagementComponent() {
const t = useTranslations();
const columns = useMemo(() => [{
accessorFn: (row) => row.id,
id: "id",
sortDescFirst: true,
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.navgan_id,
id: "navgan_id",
header: t("UserManagement.navgan_id"),
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.type_name,
id: "type_id",
header: t("UserManagement.type_name"),
enableColumnFilter: true,
datatype: "numeric",
filterFn: "equals",
columnFilterModeOptions: ["equals"],
Cell: ({renderedCellValue}) => (<Typography variant="body2">{renderedCellValue}</Typography>),
Header: ({column}) => <>{column.columnDef.header}</>,
Filter: ({column}) => {
return (<Stack direction="row" alignItems={'start'}>
<FormControl fullWidth>
<Select
variant={'standard'}
value={column.getFilterValue() ? column.getFilterValue() : 0}
onChange={(e) => column.setFilterValue(e.target.value)}
sx={{color: column.getFilterValue() ? 'black' : "rgba(0, 0, 0, 0.4)"}}
>
<MenuItem disabled value={0}>
{t("Select.menu_item")}
</MenuItem>
<MenuItem value={1}>{t("UpdateDialog.navgan")}</MenuItem>
<MenuItem value={2}>{t("UpdateDialog.refahi")}</MenuItem>
</Select>
<FormHelperText sx={{mx: 0}}>{t("filter_mode")}: {t(column.columnDef._filterFn)}</FormHelperText>
</FormControl>
<IconButton
size="small"
onClick={() => {
column.setFilterValue(null);
}}
sx={{
color: column.getFilterValue() ? "rgba(0, 0, 0, 0.54)" : "#bfbfbf"
}}
>
<ClearIcon/>
</IconButton>
</Stack>)
}
},], []);
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}
sorting={[{
id: 'id', desc: true
}]}
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;

View File

@@ -46,8 +46,8 @@ const LoginComponent = () => {
password: "",
};
const validationSchema = Yup.object().shape({
username: Yup.string().required(t("LoginPage.error_message_required")),
password: Yup.string().required(t("LoginPage.error_message_required")),
username: Yup.string().required(t("LoginPage.error_message_username")),
password: Yup.string().required(t("LoginPage.error_message_password")),
});
return (

View File

@@ -11,8 +11,7 @@ function DataTable(props) {
const requestServer = useRequest({auth: true})
const fetcher = (...args) => {
return requestServer(args, 'get', {
pending: false,
success: {notification: {show: false}}
pending: false, success: {notification: {show: false}}
}).then((response) => {
setRowCount(response.data.meta.totalRowCount);
return response.data.data;
@@ -22,14 +21,12 @@ function DataTable(props) {
const t = useTranslations();
const {languageApp, languageList} = useLanguage();
const [columnFilters, setColumnFilters] = useState([]);
const [sorting, setSorting] = useState([]);
const [sorting, setSorting] = useState(props.sorting || []);
const [pagination, setPagination] = useState({pageIndex: 0, pageSize: 10});
const [rowCount, setRowCount] = useState(0);
const [columnFilterFns, setColumnFilterFns] = useState(() => {
let output = {};
const list = props.columns.map((item) =>
item.enableColumnFilter ? {[item.id]: item.filterFn} : {[item.id]: ""}
);
const list = props.columns.map((item) => item.enableColumnFilter ? {[item.id]: item.filterFn} : {[item.id]: ""});
for (var key in list) {
var nestedObj = list[key];
for (var nestedKey in nestedObj) {
@@ -39,22 +36,13 @@ function DataTable(props) {
return output;
});
const [updateTime, setupdateTime] = useState(
moment().format("HH:mm | jYYYY/jM/jD")
);
const [updateTime, setupdateTime] = useState(moment().format("HH:mm | jYYYY/jM/jD"));
const tableLocalization = useMemo(
() =>
languageList.find((item) => item.key == languageApp).tableLocalization,
[languageApp, languageList]
);
const tableLocalization = useMemo(() => languageList.find((item) => item.key == languageApp).tableLocalization, [languageApp, languageList]);
const fetchUrl = useMemo(() => {
const url = new URL(props.tableUrl);
url.searchParams.set(
"start",
`${pagination.pageIndex * pagination.pageSize}`
);
url.searchParams.set("start", `${pagination.pageIndex * pagination.pageSize}`);
const filters = columnFilters.map((filter) => {
let datatype;
for (const i in props.columns) {
@@ -63,114 +51,84 @@ function DataTable(props) {
}
}
return {
...filter,
fn: columnFilterFns[filter.id],
datatype: datatype,
...filter, fn: columnFilterFns[filter.id], datatype: datatype,
};
});
url.searchParams.set("size", pagination.pageSize);
url.searchParams.set("filters", JSON.stringify(filters ?? []));
url.searchParams.set("sorting", JSON.stringify(sorting ?? []));
return url;
}, [
props.tableUrl,
columnFilters,
columnFilterFns,
pagination,
sorting,
props.columns,
]);
}, [props.tableUrl, columnFilters, columnFilterFns, pagination, sorting, props.columns,]);
const {data, isValidating, mutate} = useSWR(fetchUrl, fetcher, {
revalidateIfStale: false,
revalidateOnFocus: false,
revalidateOnReconnect: false
revalidateIfStale: false, revalidateOnFocus: false, revalidateOnReconnect: false
});
useEffect(() => {
setupdateTime(moment().format("HH:mm | jYYYY/jM/jD"));
}, [isValidating, languageApp]);
return (
<MaterialReactTable
localization={tableLocalization}
data={data ?? []}
manualFiltering
manualPagination
manualSorting
enableRowSelection={props.selectableRow} /* send condition */
enablePinning={props.enablePinning} /* send condition */
enableColumnFilters={props.enableColumnFilters} /* send condition */
enableDensityToggle={props.enableDensityToggle}
enableHiding={props.enableHiding} /* send condition */
enableFullScreenToggle={props.enableFullScreenToggle} /* send condition */
enableColumnResizing={props.enableColumnResizing}
muiTableHeadCellProps={{
sx: {
return (<MaterialReactTable
localization={tableLocalization}
data={data ?? []}
manualFiltering
manualPagination
manualSorting
enableRowSelection={props.selectableRow} /* send condition */
enablePinning={props.enablePinning} /* send condition */
enableColumnFilters={props.enableColumnFilters} /* send condition */
enableDensityToggle={props.enableDensityToggle}
enableHiding={props.enableHiding} /* send condition */
enableFullScreenToggle={props.enableFullScreenToggle} /* send condition */
enableColumnResizing={props.enableColumnResizing}
muiTableHeadCellProps={{
sx: {
color: "primary.main", borderLeft: "1px solid #e1e1e1", "&:first-of-type": {
borderLeft: "unset"
}, "& .Mui-TableHeadCell-Content": {justifyContent: "space-between"},
},
}}
muiTableBodyCellProps={{
sx: {
borderLeft: "1px solid #e1e1e1", "&:first-of-type": {
borderLeft: "unset"
}
},
}}
enableColumnFilterModes
muiTablePaperProps={{elevation: 0}}
rowCount={rowCount}
onColumnFilterFnsChange={setColumnFilterFns}
onColumnFiltersChange={setColumnFilters}
onPaginationChange={setPagination}
onSortingChange={setSorting}
positionToolbarAlertBanner="bottom"
renderTopToolbarCustomActions={({table}) => (<>
{props.enableCustomToolbar /* send condition */ ?
<props.CustomToolbar fetchUrl={fetchUrl} mutate={mutate}/> /* send component */ : ""}
</>)}
renderBottomToolbarCustomActions={({table}) => (<>
{props.enableLastUpdate /* send condition */ ? (<Typography
sx={{
color: "primary.main",
borderLeft: "1px solid #e1e1e1",
"&:first-of-type": {
borderLeft: "unset"
},
"& .Mui-TableHeadCell-Content": {justifyContent: "space-between"},
},
}}
muiTableBodyCellProps={{
sx: {
borderLeft: "1px solid #e1e1e1",
"&:first-of-type": {
borderLeft: "unset"
}
},
}}
enableColumnFilterModes
muiTablePaperProps={{elevation: 0}}
rowCount={rowCount}
onColumnFilterFnsChange={setColumnFilterFns}
onColumnFiltersChange={setColumnFilters}
onPaginationChange={setPagination}
onSortingChange={setSorting}
positionToolbarAlertBanner="bottom"
renderTopToolbarCustomActions={({table}) => (
<>
{props.enableCustomToolbar /* send condition */
? props.CustomToolbar /* send component */
: ""}
</>
)}
renderBottomToolbarCustomActions={({table}) => (
<>
{props.enableLastUpdate /* send condition */ ? (
<Typography
sx={{
color: "primary.main",
alignSelf: "center",
whiteSpace: "nowrap",
maxWidth: {xs: 100, sm: "100%"},
overflowX: "scroll",
}}
variant="caption"
>
{t("last_updated_at")}: {updateTime}
</Typography>
) : (
""
)}
</>
)}
state={{
isLoading: isValidating,
columnFilters,
columnFilterFns,
pagination,
sorting,
}}
positionActionsColumn={"last"}
enableRowActions={props.enableRowActions}
renderRowActions={({row}) => <props.TableRowAction fetchUrl={fetchUrl} mutate={mutate} row={row}/>}
{...props}
/>
);
alignSelf: "center",
whiteSpace: "nowrap",
maxWidth: {xs: 100, sm: "100%"},
overflowX: "scroll",
}}
variant="caption"
>
{t("last_updated_at")}: {updateTime}
</Typography>) : ("")}
</>)}
state={{
isLoading: isValidating, columnFilters, columnFilterFns, pagination, sorting,
}}
positionActionsColumn={"last"}
enableRowActions={props.enableRowActions}
renderRowActions={({row}) => <props.TableRowAction fetchUrl={fetchUrl} mutate={mutate} row={row}/>}
{...props}
/>);
}
export default DataTable;

View File

@@ -1,23 +1,23 @@
import {InputAdornment, TextField, Typography} from "@mui/material";
import {Stack, TextField, Typography} from "@mui/material";
import {useTranslations} from "next-intl";
const PriceField = (props) => {
const t = useTranslations();
return (
<TextField
InputProps={{
endAdornment: (
<InputAdornment position="end">
<Typography
sx={{margin: 1}}
component="span">{((props.value) / 10).toLocaleString()}</Typography>
<Typography component="span"
variant="caption">{t("ConfirmDialog.toman")}</Typography>
</InputAdornment>
),
}}
{...props}
/>
)
<Stack spacing={1}>
<Stack>
<TextField
{...props}
/>
</Stack>
<Stack direction="row" alignItems="center">
<Typography sx={{margin: 1}} component="span">
{((props.value) / 10).toLocaleString()}
</Typography>
<Typography component="span" variant="caption">
{t("ConfirmDialog.toman")}
</Typography>
</Stack>
</Stack>)
}
export default PriceField

View File

@@ -150,3 +150,50 @@ export const UPDATE_LOAN_MANAGEMENT_NAVGAN =
export const GET_LOAN_STATE_NAVGAN =
BASE_URL + "/dashboard/loan_states/navgan"
//loan management navgan
//expert management
export const GET_EXPERT_MANAGEMENT =
BASE_URL + "/dashboard/experts/show"
export const CREATE_EXPERT_MANAGEMENT =
BASE_URL + "/dashboard/experts/store"
export const UPDATE_EXPERT_MANAGEMENT =
BASE_URL + "/dashboard/experts/update"
export const DELETE_EXPERT_MANAGEMENT =
BASE_URL + "/dashboard/experts/delete"
export const CHANGE_PASSWORD_EXPERT_MANAGEMENT =
BASE_URL + "/dashboard/experts/change_password"
//expert management
// province/city list
export const GET_PROVINCE_LIST = BASE_URL + "/api/provinces";
export const GET_CITY_LIST = BASE_URL + "/api/cities";
// province/city list
// role list
export const GET_ROLE_LIST = BASE_URL + "/dashboard/roles/list";
// role list
//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
// role management
export const GET_ROLE_MANAGEMENT =
BASE_URL + "/dashboard/roles"
export const ADD_ROLE_MANAGEMENT =
BASE_URL + "/dashboard/roles/store"
export const UPDATE_ROLE_MANAGEMENT =
BASE_URL + "/dashboard/roles/update"
export const DELETE_ROLE_MANAGEMENT =
BASE_URL + "/dashboard/roles/delete"
export const GET_PERMISSIONS_LIST =
BASE_URL + "/dashboard/permissions/list"
//role management

View File

@@ -10,6 +10,9 @@ import GradingIcon from '@mui/icons-material/Grading';
import SupervisedUserCircleIcon from '@mui/icons-material/SupervisedUserCircle';
import Diversity3Icon from '@mui/icons-material/Diversity3';
import PaidIcon from '@mui/icons-material/Paid';
import ManageAccountsIcon from '@mui/icons-material/ManageAccounts';
import PersonIcon from '@mui/icons-material/Person';
import AccessibilityIcon from '@mui/icons-material/Accessibility';
const sidebarMenu = [
[
@@ -136,6 +139,33 @@ const sidebarMenu = [
selected: false,
permission: "manage_navgan_loan",
},
{
key: "sidebar.expert-management",
name: "expert_management",
type: "page",
route: "/dashboard/expert-management",
icon: <ManageAccountsIcon/>,
selected: false,
permission: "manage_navgan_loan",
},
{
key: "sidebar.user-management",
name: "user_management",
type: "page",
route: "/dashboard/user-management",
icon: <PersonIcon/>,
selected: false,
permission: "manage_users",
},
{
key: "sidebar.role-management",
name: "role_management",
type: "page",
route: "/dashboard/role-management",
icon: <AccessibilityIcon/>,
selected: false,
permission: "manage_roles",
},
],
];

View File

@@ -0,0 +1,25 @@
import useRequest from "@/lib/app/hooks/useRequest";
import useSWR from "swr";
import {GET_PERMISSIONS_LIST} from "@/core/data/apiRoutes";
const usePermissions = () => {
const requestServer = useRequest({auth: true, notification: false})
const fetcher = (...args) => {
return requestServer(args, 'get').then((response) => {
return response.data.data;
}).catch(() => {
})
};
const {data} = useSWR(GET_PERMISSIONS_LIST, fetcher, {
revalidateIfStale: false,
revalidateOnFocus: false,
revalidateOnReconnect: false
})
const permissions_list = data
//swr config
// render data
return {permissions_list}
}
export default usePermissions;

View File

@@ -0,0 +1,29 @@
import {GET_PROVINCE_LIST} from "@/core/data/apiRoutes";
import useRequest from "@/lib/app/hooks/useRequest";
import useSWR from "swr";
const useProvince = () => {
const requestServer = useRequest({auth: true, notification: false})
//swr config
const fetcher = (...args) => {
return requestServer(args, 'get').then(({data}) => {
return data;
}).catch(() => {
})
};
const {data, isLoading} = useSWR(GET_PROVINCE_LIST, fetcher, {
revalidateIfStale: false,
revalidateOnFocus: false,
revalidateOnReconnect: false
});
return {
provinceList: data,
isLoadingProvinceList: isLoading,
errorProvinceList: !data
}
};
export default useProvince;

View File

@@ -0,0 +1,29 @@
import {GET_ROLE_LIST} from "@/core/data/apiRoutes";
import useRequest from "@/lib/app/hooks/useRequest";
import useSWR from "swr";
const useRole = () => {
const requestServer = useRequest({auth: true, notification: false})
//swr config
const fetcher = (...args) => {
return requestServer(args, 'get').then(({data}) => {
return data.data;
}).catch(() => {
})
};
const {data, isLoading} = useSWR(GET_ROLE_LIST, fetcher, {
revalidateIfStale: false,
revalidateOnFocus: false,
revalidateOnReconnect: false
});
return {
roleList: data,
isLoadingRoleList: isLoading,
errorRoleList: !data
}
};
export default useRole;

View File

@@ -0,0 +1,26 @@
import RolePermissionMiddleware from "@/middlewares/RolePermission";
import WithAuthMiddleware from "@/middlewares/WithAuth";
import {parse} from "next-useragent";
import DashboardExpertManagementComponent from "@/components/dashboard/expert-management";
const requiredPermissions = ["manage_transportation_navgan"];
export default function ExpertManagement() {
return (
<WithAuthMiddleware>
<RolePermissionMiddleware requiredPermissions={requiredPermissions}>
<DashboardExpertManagementComponent/>
</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.expert_management",
isBot,
},
};
}

View File

@@ -0,0 +1,26 @@
import RolePermissionMiddleware from "@/middlewares/RolePermission";
import WithAuthMiddleware from "@/middlewares/WithAuth";
import {parse} from "next-useragent";
import DashboardRoleManagementComponent from "@/components/dashboard/role-management";
const requiredPermissions = ["manage_roles"];
export default function RoleManagement() {
return (
<WithAuthMiddleware>
<RolePermissionMiddleware requiredPermissions={requiredPermissions}>
<DashboardRoleManagementComponent/>
</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.role_management_page",
isBot,
},
};
}

View 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_users"];
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,
},
};
}