magento 2 custom calendar instead of core calendar

Question

I want to create jalaali calendar (persian calendar) instead of magento core calendar for admin and front pages .

for this purpose I've added these lines to my requirejs-config in my module :

   'map': {
       '*': {
          'mage/calendar' : 'MyNamespace_MyModule/js/persian_calendar',
         'Magento_Ui/js/form/element/date' : 'MyNamespace_MyModule/js/form/element/date_form'

        }
    }

persian date and gregorian date are completely different and they have different years , months and days name . I want to show persian date to user but save date as gregorian format to database .

for sending gregorian date to server I changed onShiftedValueChange function , I do this in my custom date_form :

onShiftedValueChange: function (shiftedValue) {
        var value,
            formattedValue,
            formattedValueUTC,
            momentValue;

        // this is very simple code that check if selected date is gregorian date or persian date  
        var englishYears = ["2018", "2019", "2020", "2021", "2022", "2023", "2024", "2025", "2026",
            "2027", "2028", "2029", "2030", "۲۰۱۸", "۲۰۱۹", "۲۰۲۰", "۲۰۲۱", "۲۰۲۲", "۲۰۲۳", "۲۰۲۴",
            "۲۰۲۵", "۲۰۲۶", "۲۰۲۷", "۲۰۲۸", "۲۰۲۹", "۲۰۳۰"];
        var englishDate = false;
        for (var i = 0; i < 26; i++) {
            if (shiftedValue.indexOf(englishYears[i]) > -1) {
                englishDate = true;
                break;
            }
        }

        if (shiftedValue) {

            // if selected date was persian,I converted it to equivalent gregorian format, for converting dates I used https://github.com/jalaali/moment-jalaali library 
            if (!englishDate) { 
                shiftedValue = jMoment.from(shiftedValue, 'fa', 'DD/MM/YYYY HH:mm').format(this.pickerDateTimeFormat);
            }

            // the rest codes are for magento itself
            momentValue = moment(shiftedValue, this.pickerDateTimeFormat);
            if (this.options.showsTime) {
                formattedValue = moment(momentValue).format(this.timezoneFormat);
                formattedValueUTC = moment.tz(formattedValue, this.storeTimeZone).tz('UTC');
                value = this.outputDateTimeToISO ?
                    formattedValueUTC.toISOString() :
                    formattedValueUTC.format(this.outputDateTimeFormat);
            } else {
                value = momentValue.format(this.outputDateFormat);
            }
        } else {
            value = '';
        }

        if (value !== this.value()) {
            this.value(value);
        }
    }

by these code equivalent gregorian date was sent to server correctly , but when I checking the value stored in database it's completely different and invalid , for example I sent this value : 4/14/2019 5:30 am , but magento convert it to : 0010-08-10 05:30:00 !!

I think maybe the format date in my custom date_form is different from format date in magento form php code , cause this problem , because when I changed this.outputDateTimeFormat parameter to for example : "YYYY/DD/MM HH:mm" , stored value was changed and it got valid format value ( for example : "2023-08-10 05:30:00" ) , but still it has different value from the value has sent and they aren't equivalent.

I don't know where magento check input date and change it to incorrect value .

Does anybody know where magento check date inputes and changing them ? Or Does anyone have a completely different idea for this purpose ?

Answer 1

Try this, it might work:

onShiftedValueChange: function (shiftedValue) {
            var value,
                formattedValue,
                formattedValueUTC,
                momentValue;

            // this is very simple code that check if selected date is gregorian date or persian date
            var englishYears = ["2018", "2019", "2020", "2021", "2022", "2023", "2024", "2025", "2026",
                "2027", "2028", "2029", "2030", "۲۰۱۸", "۲۰۱۹", "۲۰۲۰", "۲۰۲۱", "۲۰۲۲", "۲۰۲۳", "۲۰۲۴",
                "۲۰۲۵", "۲۰۲۶", "۲۰۲۷", "۲۰۲۸", "۲۰۲۹", "۲۰۳۰"];
            var englishDate = false;
            for (var i = 0; i < 26; i++) {
                if (shiftedValue.indexOf(englishYears[i]) > -1) {
                    englishDate = true;
                    break;
                }
            }

            if (shiftedValue) {

                // if selected date was persian,I converted it to equivalent gregorian format, for converting dates I used https://github.com/jalaali/moment-jalaali library
                if (!englishDate) {
                    shiftedValueNew = jMoment.from(shiftedValue, 'fa', 'DD/MM/YYYY HH:mm').format(this.pickerDateTimeFormat);
                }

                // the rest codes are for magento itself
                momentValue = moment(shiftedValueNew, this.pickerDateTimeFormat);
                if (this.options.showsTime) {
                    formattedValue = moment(momentValue).format(this.timezoneFormat);
                    formattedValueUTC = moment.tz(formattedValue, this.storeTimeZone).tz('UTC');
                    value = this.outputDateTimeToISO ?
                        formattedValueUTC.toISOString() :
                        formattedValueUTC.format(this.outputDateTimeFormat);
                } else {
                    value = momentValue.format(this.outputDateFormat);
                }
            } else {
                value = '';
            }

            if (value !== this.value()) {
                this.value(value);
            }
        }