debug getting cities make a role hook and debug getting data from row in update

This commit is contained in:
2023-09-13 15:48:11 +03:30
parent 2b5a440ef6
commit 123eb18a81
4 changed files with 74 additions and 49 deletions

View File

@@ -357,6 +357,8 @@
"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": "خطا در دریافت شهر ها",

View File

@@ -20,29 +20,15 @@ import {useEffect, useState} from "react";
import {CREATE_EXPERT_MANAGEMENT, GET_CITY_LIST, GET_ROLE_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";
const CreateContent = ({setOpenCreateDialog, mutate, fetchUrl}) => {
const t = useTranslations();
const requestServer = useRequest()
const [cityList, setCityList] = useState([]);
const [roleList, setRoleList] = useState([]);
const [cityTextField, setCityTextField] = useState(t("ExpertMangement.text_field_please_select_province"));
const {provinceList, isLoadingProvinceList, errorProvinceList} = useProvince();
useEffect(() => {
requestServer(GET_ROLE_LIST, "get", {auth: true, notification: false})
.then(({data}) => {
const result = data.data;
const formattedData = result.map((role, index) => ({
id: index,
name: role.name,
name_fa: role.name_fa,
value: role.id,
}));
setRoleList(formattedData);
}).catch(() => {
});
}, []);
const {roleList, isLoadingRoleList, errorRoleList} = useRole();
function getCities(province_id) {
formik.setFieldTouched("city_id", false, false);
@@ -336,11 +322,21 @@ const CreateContent = ({setOpenCreateDialog, mutate, fetchUrl}) => {
fullWidth
variant="outlined"
>
{roleList.map((item) => (
<MenuItem key={item.value} value={item.value}>
{item.name_fa}
{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 : ""}

View File

@@ -20,6 +20,7 @@ import {GET_CITY_LIST, GET_PROVINCE_LIST, GET_ROLE_LIST, UPDATE_EXPERT_MANAGEMEN
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}) => {
@@ -27,28 +28,14 @@ const UpdateContent = ({row, fetchUrl, mutate, setOpenUpdateDialog}) => {
const requestServer = useRequest();
// const [provinceList, setProvinceList] = useState([]);
const [cityList, setCityList] = useState([]);
const [roleList, setRoleList] = useState([]);
const [citiesExist, setCitiesExist] = useState(false);
const [cityTextField, setCityTextField] = useState(t("ExpertMangement.text_field_please_select_province"));
const {provinceList, isLoadingProvinceList, errorProvinceList} = useProvince();
useEffect(() => {
requestServer(GET_ROLE_LIST, "get", {auth: true, notification: false})
.then(({data}) => {
const result = data.data;
const formattedData = result.map((role, index) => ({
id: index,
name: role.name,
name_fa: role.name_fa,
value: role.id,
}));
setRoleList(formattedData);
}).catch(() => {
});
}, []);
const {roleList, isLoadingRoleList, errorRoleList} = useRole();
function getCities(province_id) {
formik.setFieldTouched("city_id", false, false);
// formik.setFieldValue("city_id", "")
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}) => {
@@ -58,6 +45,7 @@ const UpdateContent = ({row, fetchUrl, mutate, setOpenUpdateDialog}) => {
name: city.name,
value: city.id,
}));
setCitiesExist(true);
setCityList(formattedData);
setCityTextField(t("ExpertMangement.text_field_city_id"))
}).catch(() => {
@@ -65,7 +53,6 @@ const UpdateContent = ({row, fetchUrl, mutate, setOpenUpdateDialog}) => {
});
}
const validationSchema = Yup.object().shape({
name: Yup.string().required(t("ExpertMangement.error_message_name")),
username: Yup.string().required(t("ExpertMangement.error_message_username")),
@@ -113,6 +100,10 @@ const UpdateContent = ({row, fetchUrl, mutate, setOpenUpdateDialog}) => {
},
});
useEffect(() => {
getCities(formik.values.province_id);
}, [formik.values.province_id]);
return (
<>
<DialogContent>
@@ -227,11 +218,8 @@ const UpdateContent = ({row, fetchUrl, mutate, setOpenUpdateDialog}) => {
<Select
name="province_id"
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)
}}
value={provinceList ? formik.values.province_id : ""}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
fullWidth
variant="outlined"
@@ -268,7 +256,7 @@ const UpdateContent = ({row, fetchUrl, mutate, setOpenUpdateDialog}) => {
<Select
name="city_id"
label={t("ExpertMangement.text_field_city_id")}
value={formik.values.city_id}
value={cityList.length ? formik.values.city_id : ""}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
fullWidth
@@ -312,17 +300,27 @@ const UpdateContent = ({row, fetchUrl, mutate, setOpenUpdateDialog}) => {
<Select
name="role_id"
label={t("ExpertMangement.text_field_role_id")}
value={formik.values.role_id}
value={roleList ? 1 : ""}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
fullWidth
variant="outlined"
>
{roleList.map((item) => (
<MenuItem key={item.value} value={item.value}>
{item.name_fa}
{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 : ""}

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;