Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Issue with all day events when using Resources #727

Closed
DarylBuckle opened this issue Feb 14, 2018 · 5 comments
Closed

Issue with all day events when using Resources #727

DarylBuckle opened this issue Feb 14, 2018 · 5 comments

Comments

@DarylBuckle
Copy link

DarylBuckle commented Feb 14, 2018

Current Behaviour

All day events for a Resource span every resource in Week and Day view.

Example code

import React from 'react';
import BigCalendar from 'react-big-calendar';
import moment from 'moment';

BigCalendar.setLocalizer(BigCalendar.momentLocalizer(moment))

let resources = [
    {
        resourceId: 1,
        resourceTitle: 'Dave',
    },
    {
        resourceId: 2,
        resourceTitle: 'Steve',
    },
    {
        resourceId: 3,
        resourceTitle: 'Barry',
    },
    {
        resourceId: 4,
        resourceTitle: 'Gary',
    },
]
let events = [
  {
    id: 0,
    title: 'Board meeting',
    start: new Date(2018, 0, 29, 9, 0, 0),
    end: new Date(2018, 0, 29, 13, 0, 0),
    resourceId: 1,
    color:"#000000"
  },
  {
    id: 1,
    title: 'MS training',
    start: new Date(2018, 0, 29, 14, 0, 0),
    end: new Date(2018, 0, 29, 16, 30, 0),
    resourceId: 2,
    color:"#EEEEEE"
  },
  {
    id: 2,
    title: 'Team lead meeting',
    start: new Date(2018, 0, 29, 8, 30, 0),
    end: new Date(2018, 0, 29, 12, 30, 0),
    resourceId: 3,
    color:"#0f61a1",
    allDay:true,
  },
  {
    id: 11,
    title: 'Birthday Party',
    start: new Date(2018, 0, 30, 7, 0, 0),
    end: new Date(2018, 0, 30, 10, 30, 0),
    resourceId: 4,
    color:"#4A10F6",
    allDay:true,
  },
];

class Calendar extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
    }
  }

  render() {
    return (
        <BigCalendar
            events={events}
            defaultDate={new Date(2018, 0, 29)}
            step={60}
            culture={"en-GB"}
            resources={resources}
            resourceIdAccessor="resourceId"
            resourceTitleAccessor="resourceTitle"
        />
    );
  }
}

export default (Calendar);

Screenshot below of the output below.

image

Expected behavior

In this case, the events "Team Lead meeting" and "Birthday Party" should only show for Barry and Gary respectively in the all day row, instead of appearing for every resource on that day. I'm guessing that all day events haven't been handled for resources yet.

P.S Loving this component by the way, fits my requirements almost perfectly. Keep up the good work!

@brandon-lind
Copy link

Is there an expected fix for this? We're running into this issue as well.

@sators
Copy link

sators commented Mar 22, 2018

+1

@mikeyc7m
Copy link

mikeyc7m commented Apr 17, 2018

+1
relates to #423

@mikeyc7m
Copy link

bump?

@arecvlohe
Copy link
Collaborator

This looks to be implemented in #423.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants