378 lines
13 KiB
JavaScript
378 lines
13 KiB
JavaScript
import React from 'react';
|
|
import {DB} from '../static/storage';
|
|
//import 'react-infinite-calendar/styles.css'; // only needs to be imported once
|
|
|
|
const moment = require('moment');
|
|
|
|
const shuffle = function(array) {
|
|
for (var i = array.length - 1; i > 0; i--) {
|
|
var j = Math.floor(Math.random() * (i + 1));
|
|
var temp = array[i];
|
|
array[i] = array[j];
|
|
array[j] = temp;
|
|
}
|
|
return array;
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
const cal_theme = {
|
|
accentColor: '#706fd3',
|
|
floatingNav: {
|
|
background: '#004F5B',
|
|
chevron: '#ffb142',
|
|
color: '#FFF',
|
|
},
|
|
headerColor: '#004F5B',
|
|
selectionColor: '#706fd3',
|
|
textColor: {
|
|
active: '#FFF',
|
|
default: '#333',
|
|
},
|
|
todayColor: '#ffb142',
|
|
weekdayColor: '#004F5B',
|
|
}
|
|
var isoDays = [
|
|
"mo", "tu", "we", "th", "fr", "sa", "su"
|
|
]
|
|
|
|
export class Generator extends React.Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = {
|
|
start: Date(),
|
|
stop: Date(),
|
|
weeks: 0,
|
|
tasks: "",
|
|
activeDays: {
|
|
mo: false,
|
|
tu: false,
|
|
we: false,
|
|
th: false,
|
|
fr: false,
|
|
sa: false,
|
|
su: false
|
|
},
|
|
tasksD: {
|
|
mo: "",
|
|
tu: "",
|
|
we: "",
|
|
th: "",
|
|
fr: "",
|
|
sa: "",
|
|
su: ""
|
|
},
|
|
times: {
|
|
mo: {
|
|
start: "08:30",
|
|
end: "17:30",
|
|
break: 30
|
|
},
|
|
tu: {
|
|
start: "08:30",
|
|
end: "17:30",
|
|
break: 30
|
|
},
|
|
we: {
|
|
start: "08:30",
|
|
end: "17:30",
|
|
break: 30
|
|
},
|
|
th: {
|
|
start: "08:30",
|
|
end: "17:30",
|
|
break: 30
|
|
},
|
|
fr: {
|
|
start: "08:30",
|
|
end: "15:00",
|
|
break: 30
|
|
},
|
|
sa: {
|
|
start: 0,
|
|
end: 0,
|
|
break: 0
|
|
},
|
|
su: {
|
|
start: 0,
|
|
end: 0,
|
|
break: 0
|
|
}
|
|
},
|
|
taskListGen: []
|
|
}
|
|
this.handleChangeStart = this.handleChangeStart.bind(this);
|
|
this.handleChangeEnd = this.handleChangeEnd.bind(this);
|
|
this.handleChangeTasks = this.handleChangeTasks.bind(this);
|
|
this.generate = this.generate.bind(this);
|
|
this.handleMo = this.handleMo.bind(this);
|
|
|
|
this.handleChangeDayStart = this.handleChangeDayStart.bind(this);
|
|
this.handleChangeDayEnd = this.handleChangeDayEnd.bind(this);
|
|
this.handleChangeDayBreak = this.handleChangeDayBreak.bind(this);
|
|
/*ipcRenderer.send('loadTasks', {});
|
|
ipcRenderer.once('loadedTasks', (event, args) => {
|
|
console.log(args)
|
|
})*/
|
|
}
|
|
handleChangeStart(e) {
|
|
this.setState({
|
|
start: e.target.value
|
|
})
|
|
}
|
|
handleChangeEnd(e) {
|
|
this.setState({
|
|
stop: e.target.value
|
|
})
|
|
}
|
|
displayWeeks() {
|
|
moment(this.state.start).diff(moment(this.state.end));
|
|
}
|
|
handleChangeTasks(e) {
|
|
this.setState({
|
|
tasks: e.target.value
|
|
});
|
|
var taskList = e.target.value.split(/\r?\n/);
|
|
for (var i = 0; i < taskList.length; i++) {
|
|
if (taskList[i] === "" || typeof taskList[i].split(',')[1] === 'undefined' || taskList[i].split(',')[1] === "") {
|
|
taskList.splice(i, 1);
|
|
} else {
|
|
taskList[i] = taskList[i].split(',');
|
|
taskList[i] = {
|
|
id: taskList[i][0],
|
|
weight: taskList[i][1]
|
|
};
|
|
}
|
|
}
|
|
console.log(taskList)
|
|
|
|
// random
|
|
this.setState({
|
|
taskListGen: taskList
|
|
})
|
|
}
|
|
|
|
/**
|
|
*
|
|
* @param {*} e Button Event
|
|
*/
|
|
generate(e) {
|
|
console.log(this.state)
|
|
//console.log(this)
|
|
var me = this;
|
|
var diff = moment.duration(moment(me.state.start).diff(moment(this.state.stop)));
|
|
var diffInDays = (-diff.asDays()) + 1;
|
|
//console.log(diffInDays)
|
|
var taskList= JSON.parse(JSON.stringify({'data':this.state.taskListGen})).data;
|
|
console.log(taskList);
|
|
var m = false;
|
|
for(var t in taskList){
|
|
var y = taskList[t].id.charAt(0);
|
|
if(y === '+'){
|
|
m = true;
|
|
taskList[t] = {do:'+',task:taskList[t].id.substring(1)}
|
|
}else if(y === '-'){
|
|
m = true;
|
|
taskList[t] = {do:'-',task:taskList[t].id.substring(1)}
|
|
}
|
|
}
|
|
if(m === false){
|
|
var today = moment(me.state.start);
|
|
var tage = [];
|
|
for(var d=0;d<diffInDays;d++)
|
|
{
|
|
var day = moment(today).add(d,'days');
|
|
var isod = moment(day).isoWeekday() - 1;
|
|
if (this.state.activeDays[isoDays[isod]] === "on") {
|
|
var tmp_list = shuffle(taskList)
|
|
var tasks = [];
|
|
for( var i=0;i<tmp_list.length; i++)
|
|
{
|
|
var z = Math.ceil(Math.random()*100)
|
|
var nw = 100 - tmp_list[i].weight
|
|
if(z>nw)
|
|
{
|
|
tasks.push(tmp_list[i].id);
|
|
}
|
|
}
|
|
tage.push({day:day,tasks:tasks})
|
|
DB.saveDate(
|
|
{
|
|
breakTime: this.state.times[isoDays[isod]].break,
|
|
date:day.unix()*1000,
|
|
endTime:moment(day).set({ hour: this.state.times[isoDays[isod]].end.split(':')[0], minute: this.state.times[isoDays[isod]].end.split(':')[1] }).unix()*1000,
|
|
startTime:moment(day).set({ hour: this.state.times[isoDays[isod]].start.split(':')[0], minute: this.state.times[isoDays[isod]].start.split(':')[1]}).unix()*1000,
|
|
taskList:tasks
|
|
}
|
|
);
|
|
}
|
|
}
|
|
}else{
|
|
var today = moment(me.state.start);
|
|
var tage = [];
|
|
for(var d=0;d<diffInDays;d++)
|
|
{
|
|
var day = moment(today).add(d,'days');
|
|
var isod = moment(day).isoWeekday() - 1;
|
|
if (this.state.activeDays[isoDays[isod]] === "on") {
|
|
console.log(new Date(day.unix()*1000));
|
|
var d = DB.loadDate(new Date(day.unix()*1000));
|
|
var tasks = d.tasks;
|
|
|
|
for(var t in taskList){
|
|
if(taskList[t].do === '+'){
|
|
tasks.push(taskList[t].task);
|
|
}else if(taskList[t].do === '-'){
|
|
for(var a in tasks){
|
|
if(tasks[a] === taskList[t].task){
|
|
tasks.splice(a,1);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
tage.push({day:day,tasks:tasks})
|
|
DB.saveDate(
|
|
{
|
|
breakTime: this.state.times[isoDays[isod]].break,
|
|
date:new Date(d.date),
|
|
endTime:d.endTime,
|
|
startTime:d.startTime,
|
|
taskList:tasks
|
|
}
|
|
);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
handleMo(e) {
|
|
//console.log(e.target.id);
|
|
var d = this.state.activeDays;
|
|
d[e.target.id.split('-')[1]] = e.target.value;
|
|
this.setState({
|
|
activeDays: d
|
|
});
|
|
}
|
|
handleChangeTasksPerDay(e) {
|
|
this.setState({
|
|
tasksPerDay: e.target.value
|
|
});
|
|
var tasksPerDayList = e.target.value.split(/\r?\n/);
|
|
for (var i = 0; i < tasksPerDayList.length; i++) {
|
|
if (tasksPerDayList[i] === "" || typeof tasksPerDayList[i].split(',')[1] === 'undefined' || tasksPerDayList[i].split(',')[1] === "") {
|
|
tasksPerDayList.splice(i, 1);
|
|
} else {
|
|
tasksPerDayList[i] = tasksPerDayList[i].split(',');
|
|
tasksPerDayList[i] = {
|
|
id: tasksPerDayList[i][0],
|
|
weight: tasksPerDayList[i][1]
|
|
};
|
|
}
|
|
}
|
|
this.taskPerDay = tasksPerDayList;
|
|
}
|
|
handleChangeTasksDmin(e) {
|
|
|
|
}
|
|
|
|
handleChangeDayStart(e) {
|
|
var d = this.state.times;
|
|
d[e.target.id.split('-')[1]].start = e.target.value;
|
|
this.setState({
|
|
times: d
|
|
});
|
|
}
|
|
handleChangeDayEnd(e) {
|
|
var d = this.state.times;
|
|
d[e.target.id.split('-')[1]].end = e.target.value;
|
|
this.setState({
|
|
times: d
|
|
});
|
|
}
|
|
handleChangeDayBreak(e) {
|
|
var d = this.state.times;
|
|
d[e.target.id.split('-')[1]].break = e.target.value;
|
|
this.setState({
|
|
times: d
|
|
});
|
|
}
|
|
render() {
|
|
return (
|
|
<div id="generator-frame">
|
|
<div className="header">
|
|
Generator
|
|
</div>
|
|
<button onClick={this.generate}>Generate</button>
|
|
Von: <input type="date" value={this.state.start} onChange={this.handleChangeStart} />
|
|
Bis: <input type="date" value={this.state.stop} onChange={this.handleChangeEnd} />
|
|
Wochen: <input type="text" disable="true" value={-(moment(this.state.start).diff(moment(this.state.end), 'week'))} />
|
|
<hr />
|
|
Tätigkeiten:<br />
|
|
<textarea value={this.state.tasks} onChange={this.handleChangeTasks} placeholder="Support,50"></textarea><br />
|
|
Tätigkeiten pro Tag: <br />
|
|
<hr />
|
|
<input type="checkbox" id="day-mo" defaultChecked={this.state.activeDays.mo} onChange={this.handleMo} /> Montag
|
|
<input type="checkbox" id="day-tu" defaultChecked={this.state.activeDays.tu} onChange={this.handleMo} /> Dienstag
|
|
<input type="checkbox" id="day-we" defaultChecked={this.state.activeDays.we} onChange={this.handleMo} /> Mittwoch
|
|
<input type="checkbox" id="day-th" defaultChecked={this.state.activeDays.th} onChange={this.handleMo} /> Donnerstag
|
|
<input type="checkbox" id="day-fr" defaultChecked={this.state.activeDays.fr} onChange={this.handleMo} /> Freitag
|
|
<input type="checkbox" id="day-sa" defaultChecked={this.state.activeDays.sa} onChange={this.handleMo} /> Samstag
|
|
<input type="checkbox" id="day-su" defaultChecked={this.state.activeDays.su} onChange={this.handleMo} /> Sonntag
|
|
|
|
<hr/>
|
|
<table border="1">
|
|
<tbody>
|
|
<tr>
|
|
<th>Tag</th><th>Start</th><th>Pause</th><th>Feierabend</th>
|
|
</tr>
|
|
<tr>
|
|
<td>Montag</td>
|
|
<td><input id="dts-mo" value={this.state.times.mo.start} onChange={this.handleChangeDayStart} type="time" /></td>
|
|
<td><input id="dtb-mo" value={this.state.times.mo.break} onChange={this.handleChangeDayBreak} type="number" /></td>
|
|
<td><input id="dte-mo" value={this.state.times.mo.end} onChange={this.handleChangeDayEnd} type="time" /></td>
|
|
</tr>
|
|
<tr>
|
|
<td>Dienstag</td>
|
|
<td><input id="dts-tu" value={this.state.times.tu.start} onChange={this.handleChangeDayStart} type="time" /></td>
|
|
<td><input id="dtb-tu" value={this.state.times.tu.break} onChange={this.handleChangeDayBreak} type="number" /></td>
|
|
<td><input id="dte-tu" value={this.state.times.tu.end} onChange={this.handleChangeDayEnd} type="time" /></td>
|
|
</tr>
|
|
<tr>
|
|
<td>Mittwoch</td>
|
|
<td><input id="dts-we" value={this.state.times.we.start} onChange={this.handleChangeDayStart} type="time" /></td>
|
|
<td><input id="dtb-we" value={this.state.times.we.break} onChange={this.handleChangeDayBreak} type="number" /></td>
|
|
<td><input id="dte-we" value={this.state.times.we.end} onChange={this.handleChangeDayEnd} type="time" /></td>
|
|
</tr>
|
|
<tr>
|
|
<td>Donnerstag</td>
|
|
<td><input id="dts-th" value={this.state.times.th.start} onChange={this.handleChangeDayStart} type="time" /></td>
|
|
<td><input id="dtb-th" value={this.state.times.th.break} onChange={this.handleChangeDayBreak} type="number" /></td>
|
|
<td><input id="dte-th" value={this.state.times.th.end} onChange={this.handleChangeDayEnd} type="time" /></td>
|
|
</tr>
|
|
<tr>
|
|
<td>Freitag</td>
|
|
<td><input id="dts-fr" value={this.state.times.fr.start} onChange={this.handleChangeDayStart} type="time" /></td>
|
|
<td><input id="dtb-fr" value={this.state.times.fr.break} onChange={this.handleChangeDayBreak} type="number" /></td>
|
|
<td><input id="dte-fr" value={this.state.times.fr.end} onChange={this.handleChangeDayEnd} type="time" /></td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
Samstag
|
|
</td>
|
|
<td><input id="dts-sa" value={this.state.times.sa.start} onChange={this.handleChangeDayStart} type="time" /></td>
|
|
<td><input id="dtb-sa" value={this.state.times.sa.break} onChange={this.handleChangeDayBreak} type="number" /></td>
|
|
<td><input id="dte-sa" value={this.state.times.sa.end} onChange={this.handleChangeDayEnd} type="time" /></td>
|
|
</tr>
|
|
<tr>
|
|
<td>Sonntag</td>
|
|
<td><input id="dts-su" value={this.state.times.su.start} onChange={this.handleChangeDayStart} type="time" /></td>
|
|
<td><input id="dtb-su" value={this.state.times.su.break} onChange={this.handleChangeDayBreak} type="number" /></td>
|
|
<td><input id="dte-su" value={this.state.times.su.end} onChange={this.handleChangeDayEnd} type="time" /></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>);
|
|
}
|
|
}
|