Merge branch 'feature/TF-84_implemention_expert_management' into 'develop'
TF-84 implemention of expert management See merge request witel-front-end/loan-facilities/expert!84
This commit is contained in:
AmirHossein Mahmoodi
@@ -47,6 +47,7 @@
|
||||
"province-head-expert": "کارشناس ستادی",
|
||||
"change-password": "تغییر رمز عبور",
|
||||
"development-assistant": "معاون توسعه",
|
||||
"expert-management": "مدیریت کارشناسان",
|
||||
"user-management": "مدیریت کاربر",
|
||||
"edit-profile": "ویرایش پروفایل"
|
||||
},
|
||||
@@ -102,8 +103,9 @@
|
||||
"development_assistant_page": "معاون توسعه",
|
||||
"inspector_expert_page": "بازدید کارشناس",
|
||||
"commercial_chief_page": "رئیس اداره بازرگانی",
|
||||
"user_management_page": "مدیریت کاربر",
|
||||
"edit_profile": "ویرایش پروفایل"
|
||||
"edit_profile": "ویرایش پروفایل",
|
||||
"expert_management": "مدیریت کارشناسان",
|
||||
"user_management_page": "مدیریت کاربر"
|
||||
},
|
||||
"MuiDatePicker": {
|
||||
"date_picker_birthday": "تاریخ"
|
||||
@@ -350,6 +352,68 @@
|
||||
"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": "انصراف",
|
||||
|
||||
@@ -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(
|
||||
/^(?=.*[0-9])(?=.*[A-Za-z!@#$%^&*])[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;
|
||||
@@ -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;
|
||||
@@ -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(
|
||||
/^(?=.*[0-9])(?=.*[A-Za-z!@#$%^&*])[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;
|
||||
@@ -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;
|
||||
@@ -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;
|
||||
@@ -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;
|
||||
@@ -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;
|
||||
@@ -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;
|
||||
13
src/components/dashboard/expert-management/TableToolbar.jsx
Normal file
13
src/components/dashboard/expert-management/TableToolbar.jsx
Normal 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;
|
||||
191
src/components/dashboard/expert-management/index.jsx
Normal file
191
src/components/dashboard/expert-management/index.jsx
Normal file
@@ -0,0 +1,191 @@
|
||||
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}
|
||||
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;
|
||||
@@ -177,6 +177,7 @@ function DashboardPassengerOfficeComponent() {
|
||||
enableGlobalFilter={false}
|
||||
enableColumnResizing={false} // if you want true this you shold change renderRowActions props ** see https://www.material-react-table.com/docs/guides/row-actions
|
||||
enableRowActions={true}
|
||||
renderMainAction={TableToolbar}
|
||||
TableRowAction={TableRowActions}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
@@ -151,6 +151,28 @@ 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"
|
||||
|
||||
@@ -10,6 +10,7 @@ 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';
|
||||
|
||||
const sidebarMenu = [
|
||||
@@ -137,6 +138,15 @@ 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",
|
||||
|
||||
29
src/lib/app/hooks/useProvince.jsx
Normal file
29
src/lib/app/hooks/useProvince.jsx
Normal 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;
|
||||
29
src/lib/app/hooks/useRole.jsx
Normal file
29
src/lib/app/hooks/useRole.jsx
Normal 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;
|
||||
26
src/pages/dashboard/expert-management/index.jsx
Normal file
26
src/pages/dashboard/expert-management/index.jsx
Normal file
@@ -0,0 +1,26 @@
|
||||
import RolePermissionMiddleware from "@/middlewares/RolePermission";
|
||||
import WithAuthMiddleware from "@/middlewares/WithAuth";
|
||||
import {parse} from "next-useragent";
|
||||
import 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,
|
||||
},
|
||||
};
|
||||
}
|
||||
Reference in New Issue
Block a user