Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
defaultDate={new Date(2015, 3, 1)}
localizer={localizer}
/>
);
const localizer = momentLocalizer(moment);
ReactDOM.render(, document.body);
}
// Drag and Drop Example Test
{
interface Props {
localizer: DateLocalizer;
}
const DragAndDropCalendar = withDragAndDrop(Calendar);
const DnD = ({ localizer }: Props) => (
true}
resizableAccessor={() => true}
GetEvents,
UpdateEvents,
GetEquipments,
UpdateEquipments,
GetPeople,
UpdatePeople
} from "../../../../helpers/db";
//Styles
import './styles/dragAndDrop/styles.css'
import './styles/less/styles.css'
import './styles/css/react-big-calendar.css'
BigCalendar.momentLocalizer(moment); // or globalizeLocalizer
const DragAndDropCalendar = withDragAndDrop(BigCalendar, {backend: false})
class Dnd extends Component {
constructor(props) {
super(props)
this.state = calendarInitialState
this.moveEvent = this.moveEvent.bind(this)
}
componentDidMount() {
const newEvents = []
const newEquipments = []
const newPeople = []
import React from 'react'
import events from '../src/events'
import BigCalendar from 'react-big-calendar'
import withDragAndDrop from 'react-big-calendar/lib/addons/dragAndDrop'
import 'react-big-calendar/lib/css/react-big-calendar.css';
import 'react-big-calendar/lib/addons/dragAndDrop/styles.less'
import moment from 'moment';
let allViews = Object.keys(BigCalendar.Views).map(k => BigCalendar.Views[k]);
moment.locale('en-GB');
const localizer = BigCalendar.momentLocalizer(moment);
const DragAndDropCalendar = withDragAndDrop(BigCalendar);
class CalendarPage extends React.Component {
constructor(...args) {
super(...args);
this.state = {
events: events,
};
this.moveEvent = this.moveEvent.bind(this);
this.newEvent = this.newEvent.bind(this)
}
moveEvent({ event, start, end, isAllDay: droppedOnAllDaySlot }) {
const { events } = this.state;
const idx = events.indexOf(event);
import React from 'react';
import BigCalendar from 'react-big-calendar';
import withDragAndDrop from 'react-big-calendar/lib/addons/dragAndDrop'
import moment from 'moment';
import {
Container
} from './../../components';
import events from './../../features/Calendar/events';
import { HeaderMain } from "./../../features/HeaderMain";
const DragAndDropCalendar = withDragAndDrop(BigCalendar)
const localizer = BigCalendar.momentLocalizer(moment)
export default class Calendar extends React.Component {
constructor(props) {
super(props)
this.state = {
events: events,
}
this.moveEvent = this.moveEvent.bind(this)
this.newEvent = this.newEvent.bind(this)
}
moveEvent({ event, start, end, isAllDay: droppedOnAllDaySlot }) {
const { events } = this.state
import React, { Component } from "react";
import Calendar from "react-big-calendar";
import moment from "moment";
import withDragAndDrop from "react-big-calendar/lib/addons/dragAndDrop";
import "./App.css";
import "react-big-calendar/lib/addons/dragAndDrop/styles.css";
import "react-big-calendar/lib/css/react-big-calendar.css";
const localizer = Calendar.momentLocalizer(moment);
const DnDCalendar = withDragAndDrop(Calendar);
class App extends Component {
state = {
events: [
{
start: new Date(),
end: new Date(moment().add(1, "days")),
title: "Some title"
}
]
};
onEventResize = (type, { event, start, end, allDay }) => {
this.setState(state => {
state.events[0].start = start;
state.events[0].end = end;
title: 'Birthday Party',
start: new Date(2018, 0, 30, 7, 0, 0),
end: new Date(2018, 0, 30, 10, 30, 0),
resourceId: 7,
},
]
const resourceMap = [
{ resourceId: 1, resourceTitle: 'Board room' },
{ resourceId: 2, resourceTitle: 'Training room' },
{ resourceId: 3, resourceTitle: 'Meeting room 1' },
{ resourceId: 4, resourceTitle: 'Meeting room 2' },
{ resourceId: 6, resourceTitle: 'Meeting room 2' },
{ resourceId: 7, resourceTitle: 'Meeting room 2' },
]
const DragAndDropCalendar = withDragAndDrop(BigCalendar)
const Dnd = ({
events = events,
resourceMap = resourceMap,
resizeEvent,
moveEvent,
newEvent,
lng = 'vi',
components = {
toolbar: CalendarToolbar
},
defaultDate=new Date(2018, 11, 19),
views=['day', 'work_week'],
min=moment('6:00', 'h:mm').toDate(),
max=moment('21:00', 'h:mm').toDate(),
}) => {
if (lng === 'vi') {
import LoadingContainer from '../../../components/design/loading-container';
import history from '../../../utilities/history';
import { fetchJsonGet, fetchJsonPost } from '../../../utilities/rest';
import EditModal from '../../page/edit/EditModal';
import {
dayStyle,
renderAgendaEvent,
renderDateHeader,
renderEvent,
renderMonthEvent,
} from './CalendarRendering';
import CalendarToolBar from './CalendarToolBar';
const localizer = momentLocalizer(moment);
const DragAndDropCalendar = withDragAndDrop(Calendar);
const convertJsonDates = e => Object.assign({}, e, {
start: new Date(e.start),
end: new Date(e.end),
});
class CalendarPanel extends React.Component {
static getDerivedStateFromProps({ location }, { prevLocation }) {
const newState = {
prevLocation: location,
};
if (
location.state !== prevLocation.state
&& location.state
import moment from 'moment';
require('moment-duration-format');
import HTML5Backend from 'react-dnd-html5-backend';
import { DragDropContext } from 'react-dnd';
import BigCalendar from 'react-big-calendar';
import withDragAndDrop from 'react-big-calendar/lib/addons/dragAndDrop';
import 'react-big-calendar/lib/css/react-big-calendar.css';
import 'react-big-calendar/lib/addons/dragAndDrop/styles.css';
BigCalendar.setLocalizer(
BigCalendar.momentLocalizer(moment)
);
const DragAndDropCalendar = withDragAndDrop(BigCalendar);
import CreateTimeEntryModal from '../TimeEntryModal/CreateTimeEntryModal';
import TimeEntryEvent from './TimeEntryEvent';
import WeekHeader from './WeekHeader';
import MonthDayCell from './MonthDayCell';
import { createTogglEntry } from '../../../../toggl/toggl.js';
import Toolbar from './Toolbar';
const CustomToolbar = ({events}) => props => (
);
const DynamicWeekHeader = ({events}) => props => (
);
import React from 'react';
import BigCalendar from 'react-big-calendar';
import withDragAndDrop from 'react-big-calendar/lib/addons/dragAndDrop'
import moment from 'moment';
import {
Container
} from './../../../components';
import { HeaderMain } from "../../components/HeaderMain";
import events from './events';
const DragAndDropCalendar = withDragAndDrop(BigCalendar)
const localizer = BigCalendar.momentLocalizer(moment)
export class Calendar extends React.Component {
constructor(props) {
super(props)
this.state = {
events: events,
}
this.moveEvent = this.moveEvent.bind(this)
this.newEvent = this.newEvent.bind(this)
}
moveEvent({ event, start, end, isAllDay: droppedOnAllDaySlot }) {
const { events } = this.state
import React from 'react'
import { Calendar } from 'react-big-calendar'
import withDragAndDrop from 'react-big-calendar/lib/addons/dragAndDrop'
import 'react-big-calendar/lib/addons/dragAndDrop/styles.scss'
const DragAndDropCalendar = withDragAndDrop(Calendar)
const 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,
},
{
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,
},