Commit f6f31b12 authored by Jiawen Lyu's avatar Jiawen Lyu

change event color depending on login (static)

parent 7f0bff54
......@@ -10,19 +10,29 @@ const data = [
start_date: "2020-06-10 6:00",
end_date: "2020-06-10 8:00",
text: "C SR03",
id: 1
id: 1,
login: "jiawen"
},
{
start_date: "2020-06-10 6:00",
end_date: "2020-06-10 8:00",
text: "C SR03",
id: 4,
login: "linh"
},
{
start_date: "2020-06-10 8:15",
end_date: "2020-06-10 10:15",
text: "TD SR03",
id: 2
id: 2,
login: "jiawen"
},
{
start_date: "2020-06-13 10:00",
end_date: "2020-06-13 18:00",
text: "Event 2",
id: 3
id: 3,
login: "jiawen"
},
];
......@@ -88,7 +98,7 @@ class App extends Component {
}
render() {
const { currentTimeFormatState, messages, error, isLoaded, uvs } = this.state;
const data = extractUvDateInfo(uvs)
// const data = extractUvDateInfo(uvs)
if (error) {
return <div>Erreur : {error.message}</div>;
} else if (!isLoaded) {
......
import React, { Component } from 'react';
import 'dhtmlx-scheduler';
import 'dhtmlx-scheduler/codebase/dhtmlxscheduler_material.css';
const scheduler = window.scheduler;
const changeColorForEachStudent = events => events.map(event => {
if (event.login === "jiawen") {
event.color = "green"
scheduler.updateEvent(event.id)
}
})
export default class Scheduler extends Component {
initSchedulerEvents() {
if (scheduler._$initialized) {
return;
}
const onDataUpdated = this.props.onDataUpdated;
scheduler.attachEvent('onEventAdded', (id, ev) => {
if (onDataUpdated) {
onDataUpdated('create', ev, id);
}
});
scheduler.attachEvent('onEventChanged', (id, ev) => {
if (onDataUpdated) {
onDataUpdated('update', ev, id);
}
});
scheduler.attachEvent('onEventDeleted', (id, ev) => {
if (onDataUpdated) {
onDataUpdated('delete', ev, id);
......@@ -32,6 +38,7 @@ export default class Scheduler extends Component {
scheduler._$initialized = true;
}
componentDidMount() {
scheduler.skin = 'material';
scheduler.config.header = [
......@@ -45,23 +52,24 @@ export default class Scheduler extends Component {
];
scheduler.config.hour_date = '%g:%i %A';
scheduler.xy.scale_width = 70;
this.initSchedulerEvents();
const { events } = this.props;
scheduler.init(this.schedulerContainer, new Date(2020, 5, 10));
scheduler.clearAll();
scheduler.parse(events);
changeColorForEachStudent(events)
}
shouldComponentUpdate(nextProps) {
return this.props.timeFormatState !== nextProps.timeFormatState;
}
componentDidUpdate() {
scheduler.render();
}
setTimeFormat(state) {
scheduler.config.hour_date = state ? '%H:%i' : '%g:%i %A';
scheduler.templates.hour_scale = scheduler.date.date_to_str(scheduler.config.hour_date);
......@@ -72,8 +80,8 @@ export default class Scheduler extends Component {
this.setTimeFormat(timeFormatState);
return (
<div
ref={ (input) => { this.schedulerContainer = input } }
style={ { width: '100%', height: '100%' } }
ref={(input) => { this.schedulerContainer = input }}
style={{ width: '100%', height: '100%' }}
></div>
);
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment