StephenChou1017 / react-big-scheduler

A scheduler and resource planning component built for React and made for modern browsers (IE10+)
https://stephenchou1017.github.io/scheduler/#/
MIT License
746 stars 415 forks source link

[BUG] Changing Moment locale breaks things #176

Open dandanknight opened 4 years ago

dandanknight commented 4 years ago

I asked a separate question on how to change the first day of the week to Monday (who starts work on a Sunday right?), which I believe should be accomplished using moment.locale, although now i've set dow (moment Day of Week) to 1 (Monday) in react-big-scheduler, in the week view, the week still starts on Sunday, but now the weekend highlighting is offset and highlighting Sunday and Monday!

image

Also, when i change to another week, all days but Sunday disappear!

image

...any help would be much appreciated thanks.

usahai commented 3 years ago

Could use this feature! Thanks. As per the dev's example , it is possible to change the start day of the week to monday. However, after running the code in my local, it still shows up as Sunday - Saturday. Did anyone figure out why?

usahai commented 3 years ago

I figured it out! It can be done with this

    constructor(props) {
        super(props);

>>>>    moment.locale("us", {
>>>>        week: {
>>>>            dow: 1
>>>>        }
>>>>    });
        let schedulerData = new SchedulerData(
            "2017-12-18",
            ViewTypes.Week,
            false,
            false,
            {
                views: [{ viewName: "Week", viewType: ViewTypes.Week, showAgenda: false, isEventPerspective: false }],
                startResizable: false,
                endResizable: false,
                movable: false,
                creatable: false,
                calendarPopoverEnabled: false
            },
            {
>>>>            isNonWorkingTimeFunc: this.isNonWorkingTime
            }
        );
        schedulerData.localeMoment.locale("en");
        schedulerData.setResources(DemoData.resources);
        schedulerData.setEvents(DemoData.events);

        this.state = {
            viewModel: schedulerData
        };
    }

and the function to change the weekend to sat/sun is:

    isNonWorkingTime = (schedulerData, time) => {
        const { localeMoment } = schedulerData;
        if (schedulerData.viewType === ViewTypes.Day) {
            let hour = localeMoment(time).hour();
            if (hour < 9 || hour > 18) return true;
        } else {
            let dayOfWeek = localeMoment(time).weekday();
            if (dayOfWeek === 5 || dayOfWeek === 6) return true;
        }

        return false;
    };

Please let me know if it works for you!!

adityajploft commented 12 months ago

Not working

adityajploft commented 12 months ago

if any way to fixed let know me i try custom make a folder and try to implement but it is not working .