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

convert date picker to persian mode

Browse Source
This commit is contained in:
Amin Ghasempoor
2023-07-10 16:24:50 +03:30
parent f93040c32f
commit 362bf43bee
3 changed files with 15 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
package-lock.json generated
View File

@@ -15,6 +15,7 @@
"@mui/material": "^5.12.0",
"@mui/x-date-pickers": "^6.9.2",
"axios": "^1.4.0",
"date-fns-jalali": "^2.13.0-0",
"dayjs": "^1.11.9",
"eslint": "8.36.0",
"formik": "^2.2.9",
@@ -1732,6 +1733,11 @@
"integrity": "sha512-sdQSFB7+llfUcQHUQO3+B8ERRj0Oa4w9POWMI/puGtuf7gFywGmkaLCElnudfTiKZV+NvHqL0ifzdrI8Ro7ESA==",
"dev": true
},
"node_modules/date-fns-jalali": {
"version": "2.13.0-0",
"resolved": "https://registry.npmjs.org/date-fns-jalali/-/date-fns-jalali-2.13.0-0.tgz",
"integrity": "sha512-yjlI9O18Z6ryGNagryrLO8OQ+3rishM3+A0UOX2UX10cWMn2NTlQcQ+ywTEJvF5IJz0FwX/slt2nCcpyQ/c8gw=="
},
"node_modules/dayjs": {
"version": "1.11.9",
"resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.9.tgz",
@@ -6135,6 +6141,11 @@
"integrity": "sha512-sdQSFB7+llfUcQHUQO3+B8ERRj0Oa4w9POWMI/puGtuf7gFywGmkaLCElnudfTiKZV+NvHqL0ifzdrI8Ro7ESA==",
"dev": true
},
"date-fns-jalali": {
"version": "2.13.0-0",
"resolved": "https://registry.npmjs.org/date-fns-jalali/-/date-fns-jalali-2.13.0-0.tgz",
"integrity": "sha512-yjlI9O18Z6ryGNagryrLO8OQ+3rishM3+A0UOX2UX10cWMn2NTlQcQ+ywTEJvF5IJz0FwX/slt2nCcpyQ/c8gw=="
},
"dayjs": {
"version": "1.11.9",
"resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.9.tgz",

1
package.json
View File

@@ -16,6 +16,7 @@
"@mui/material": "^5.12.0",
"@mui/x-date-pickers": "^6.9.2",
"axios": "^1.4.0",
"date-fns-jalali": "^2.13.0-0",
"dayjs": "^1.11.9",
"eslint": "8.36.0",
"formik": "^2.2.9",

7
src/core/components/MuiDatePicker.jsx
View File

@@ -1,5 +1,5 @@
import { LocalizationProvider, DatePicker } from "@mui/x-date-pickers";
import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
import { AdapterDateFnsJalali } from "@mui/x-date-pickers/AdapterDateFnsJalali";
import moment from "moment/moment";
import { useTranslations } from "next-intl";
@@ -12,15 +12,14 @@ export default function MuiDatePicker({
const t = useTranslations();
const handleDateChange = (date) => {
const selectedDate = moment(date).locale("en").format("YYYY-MM-DD");
const selectedDate = moment(date).locale("fa"); // should add .format() at the end to format the data
setFieldValue(selectType, selectedDate);
};
return (
<LocalizationProvider dateAdapter={AdapterDayjs}>
<LocalizationProvider dateAdapter={AdapterDateFnsJalali}>
<DatePicker
sx={{ width: "100%" }}
format="YYYY-MM-DD"
label={t("MuiDatePicker.date_picker_birthday")}
slotProps={{
textField: {