Theenoro
/
wochenbericht-manager
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

2.4 

Speicherversion auf 2. Unfertige UIs hinzugefügt. Wird nächste Woche nach gepusht. SQL geupdatet.
environments/production/deployments/15
Theenoro 2019-09-01 19:33:40 +02:00
parent 61aa2131a9
commit 72a9f6c0eb
21 changed files with 1561 additions and 970 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

130
.gitignore vendored
View File

@ -1,64 +1,66 @@
# Logs
logs
*.log
npm-debug.log*
# Runtime data
pids
*.pid
*.seed
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov
# Coverage directory used by tools like istanbul
coverage
# nyc test coverage
.nyc_output
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
.grunt
# node-waf configuration
.lock-wscript
# Compiled binary addons (http://nodejs.org/api/addons.html)
#build/Release
release-builds
# Dependency directories
node_modules
jspm_packages
# Optional npm cache directory
.npm
# Optional REPL history
.node_repl_history
dist/app*
dist/make*
# See https://help.github.com/ignore-files/ for more about ignoring files.
# dependencies
/node_modules
node_modules
# testing
/coverage
# production
/build
build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*
build/
# Logs
logs
*.log
npm-debug.log*
# Runtime data
pids
*.pid
*.seed
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov
# Coverage directory used by tools like istanbul
coverage
# nyc test coverage
.nyc_output
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
.grunt
# node-waf configuration
.lock-wscript
# Compiled binary addons (http://nodejs.org/api/addons.html)
#build/Release
release-builds
# Dependency directories
node_modules
jspm_packages
# Optional npm cache directory
.npm
# Optional REPL history
.node_repl_history
dist/app*
dist/make*
# See https://help.github.com/ignore-files/ for more about ignoring files.
# dependencies
/node_modules
node_modules
# testing
/coverage
# production
/build
build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*
build/
.vscode/

36
public/main.css
View File

@ -948,3 +948,39 @@ button.success:hover {
#settings-frame .form-group input {
width: 100%;
}
#tasks-frame {
display: flex;
}
#tasks-frame #tasks {
width: 25em;
}
#tasks-frame #dates {
width: 8em;
}
#tasks-frame #info {
width: 100%;
}
#notes-frame {
min-height: 100vh;
display: flex;
}
#notes-frame #notes-list {
width: 200px;
border-right: 1px solid #454545;
}
#notes-frame #notes-list .note.heigh {
border-color: #DD0000;
}
#notes-frame #notes-list .note.normal {
border-color: #DDDD00;
}
#notes-frame #notes-list .note.low {
border-color: #00DD55;
}
#notes-frame #notes-edit {
padding: 10px;
}
#notes-frame #notes-edit textarea {
width: calc(100vw - 450px);
height: 300px;
}

30
public/manifest.json
View File

@ -1,15 +1,15 @@
{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
"src": "favicon.ico",
"sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon"
}
],
"start_url": "./index.html",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}
{
"short_name": "WBM",
"name": "Wochenbericht Manager",
"icons": [
{
"src": "favicon.ico",
"sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon"
}
],
"start_url": "./index.html",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}

10
src/jsx/static/debug.jsx
View File

@ -1,6 +1,6 @@
export class Log{
static debug(txt){
//console.debug('%cDEBUG: '+txt, 'background: #222; color: #bada55');
}
export class Log{
static debug(txt){
// console.debug('%cDEBUG: '+txt, 'background: #222; color: #bada55');
}
}

75
src/jsx/static/migration-sc/0-1.jsx 100644
View File

@ -0,0 +1,75 @@
import {DB} from './../storage'
export class Mig_0_1{
constructor(){
var res = DB.cdb.exec("SELECT * FROM settings WHERE ke='version'");
if(res.length == 0){
console.log("UPDATE STORAGE")
this.mig_tasks();
}
}
mig_tasks(){
// TODO: MIGRATION TOOL FOR SAVE VERSION 1
DB.cdb.exec("CREATE TABLE IF NOT EXISTS days_have_tasks(day_id INTEGER ,task_id INTEGER);");
var res = DB.cdb.exec("SELECT * FROM days")[0].values;
console.log(res)
if(res.length>0){
for(var i = 0;i<res.length;i++){
// 5 = taskList
//console.log(res[i][5])
var tasks_for_day = res[i][5].split(',');
// 0 = Tag ID
var day_id = res[i][0];
for(var j = 0;j<tasks_for_day.length;j++){
console.log(tasks_for_day[j])
var sql2 = "INSERT INTO days_have_tasks VALUES ( "+day_id+","+tasks_for_day[j]+");";
//console.log(sql2)
DB.cdb.exec(sql2);
}
}
}
this.deleteOldTaskColumn();
}
deleteOldTaskColumn(){
//var sql = `ALTER TABLE "days" DROP COLUMN "taskList";`
var sql = `
PRAGMA foreign_keys=off;
BEGIN TRANSACTION;
CREATE TABLE IF NOT EXISTS new_days(
id INTEGER PRIMARY KEY AUTOINCREMENT,
date DATETIME ,
startTime DATETIME ,
breakTime INTEGER ,
endTime DATETIME
);
INSERT INTO new_days(id,date,startTime,breakTime,endTime)
SELECT id,date,startTime,breakTime,endTime
FROM days;
DROP TABLE days;
ALTER TABLE new_days RENAME TO days;
COMMIT;
PRAGMA foreign_keys=on;
`
DB.cdb.exec(sql);
this.addNotesTable();
}
addNotesTable(){
var sql = `CREATE TABLE notes (
id INTEGER PRIMARY KEY AUTOINCREMENT,
date DATETIME ,
title TEXT,
text TEXT,
priority TEXT
);`
DB.cdb.exec(sql);
this.updateVersion();
}
updateVersion(){
var sql = `INSERT INTO settings (ke,val) VALUES ("version","2")`
DB.cdb.exec(sql);
}
}

8
src/jsx/static/migration.jsx 100644
View File

@ -0,0 +1,8 @@
export class Migration {
constructor() {
}
}

639
src/jsx/static/storage.jsx
View File

@ -1,243 +1,398 @@
import {Log} from './debug';
const SQL = require('sql.js')
export class DB{
static cdb;
static loaded = false;
static loadedCB = [];
static newDB(){
Log.debug('create new database');
DB.cdb = new SQL.Database();
DB.cdb.exec(
`CREATE TABLE settings (
id INTEGER PRIMARY KEY AUTOINCREMENT,
ke TEXT not null,
val TEXT not null
);
CREATE TABLE days (
id INTEGER PRIMARY KEY AUTOINCREMENT,
date DATETIME ,
startTime DATETIME ,
breakTime INTEGER ,
endTime DATETIME ,
taskList TEXT
);
CREATE TABLE tasks (
id INTEGER PRIMARY KEY AUTOINCREMENT,
taskName TEXT not NULL
);
INSERT INTO settings (ke,val)
VALUES ('name','Max');
INSERT INTO settings (ke,val)
VALUES ('start','2018-08-01');
`)
DB.loaded = true;
DB.__load()
DB.storeLocalStorage()
}
static storeLocalStorage(){
var data = DB.cdb.export();
var buffer = new Buffer(data);
var blob = new Blob([buffer]);
var reader = new FileReader();
reader.onload = function() {
localStorage.setItem('storage',reader.result)
}
reader.readAsBinaryString(blob);
}
static loadLocalStorage(){
var i, l, d, array;
array = new Uint8Array(localStorage.getItem('storage'));
for (var i = 0; i < l; i++){
array[i] = d.charCodeAt(i);
}
DB.loadDB(array);
DB.loaded = true;
DB.__load()
}
/**
*
* @param {type:Uint8Array} file Uint8Array
*/
static loadDB(file){
Log.debug('load database');
DB.cdb = new SQL.Database(file);
DB.storeLocalStorage()
DB.loaded = true;
DB.__load()
return "";
}
static __load(){
Log.debug('DB onload EVENT');
for(var l in DB.loadedCB){
DB.loadedCB[l]();
}
}
static onLoad(cb){
Log.debug('added DB onload EVENT');
DB.loadedCB.push(cb);
}
/**
*
*/
static exportDB(){
Log.debug('export database');
var data = DB.cdb.export();
var buffer = new Buffer(data);
console.log(buffer);
var blob = new Blob([buffer],{type:'application/x-sqlite3'});
console.log(blob);
console.log(window.URL.createObjectURL(blob));
var link = document.createElement('a');
link.href = window.URL.createObjectURL(blob);
var fileName = "wbm.sqlite";
link.download = fileName;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
window.URL.revokeObjectURL(link);
}
/**
*
* @param {*} date
*/
static loadDate(date){
//var re = DB.cdb.exec("SELECT * FROM INFORMATION_SCHEMA.TABLES WHERE TABLE_TYPE='BASE TABLE'");
//console.log(re)
console.log(date)
Log.debug('load from date:'+date.getTime())
var sql = `SELECT * FROM days WHERE date=:date;`;
var stmt = DB.cdb.prepare(sql);
var res = stmt.getAsObject({":date":date.getTime()})
stmt.free();
Log.debug(JSON.stringify(res));
if(Object.keys(res).length === 0){
return {breakTime: 0, date: null,startTime:null, endTime: null, taskList:[]}
}else{
var tasks = res.taskList.split(',');
sql = `SELECT * FROM tasks WHERE id=:id`;
for ( var task in tasks){
stmt = DB.cdb.prepare(sql);
tasks[task] = stmt.getAsObject({":id":tasks[task]}).taskName;
stmt.free();
}
res.taskList = tasks;
return res;
}
}
static saveDate(args){
Log.debug('save date');
Log.debug(JSON.stringify(args))
var sql;
var stmt;
var res;
var tasks = args.taskList;
var taskss = []
console.log(tasks);
for(var t in tasks){
if(typeof tasks[t] === 'undefined'){
continue;
}
tasks[t] = tasks[t].trim();
sql = `SELECT * FROM tasks WHERE taskName=:task`;
stmt = DB.cdb.prepare(sql);
res = stmt.getAsObject({':task':tasks[t]});
stmt.free();
console.log(res);
if(Object.keys(res).length === 0){
sql = `INSERT INTO tasks(taskName) VALUES(:task);`;
stmt = DB.cdb.prepare(sql);
res = stmt.getAsObject(
{
":task":tasks[t]
}
)
stmt.free()
sql = `SELECT * FROM tasks WHERE taskName=:task`;
stmt = DB.cdb.prepare(sql);
res = stmt.getAsObject({':task':tasks[t]});
stmt.free();
console.log(res);
}
taskss[t]= res.id;
}
sql = `SELECT * FROM days WHERE date=:date;`;
stmt = DB.cdb.prepare(sql);
console.log(args);
res = stmt.getAsObject({":date":args.date})
stmt.free()
if(Object.keys(res).length === 0){
Log.debug('added new entry');
Log.debug(JSON.stringify(args))
sql = `INSERT INTO days(date,startTime,breakTime,endTime,taskList) VALUES(:date,:startTime,:breakTime,:endTime,:taskList);`;
stmt = DB.cdb.prepare(sql);
res = stmt.getAsObject(
{
":date":args.date,
":startTime":args.startTime,
":breakTime":args.breakTime,
":endTime":args.endTime,
":taskList":taskss.join()
}
)
stmt.free()
}else{
Log.debug('update entry');
Log.debug(JSON.stringify(args))
sql = `UPDATE days SET startTime=:startTime,breakTime=:breakTime,endTime=:endTime,taskList=:taskList WHERE date=:date;`;
stmt = DB.cdb.prepare(sql);
res = stmt.getAsObject(
{
":date":args.date,
":startTime":args.startTime,
":breakTime":args.breakTime,
":endTime":args.endTime,
":taskList":taskss.join()
}
)
Log.debug(res);
stmt.free()
}
}
static handleTasks(){
}
static loadSettings(key){
var sql = `SELECT * FROM settings WHERE ke=:key`;
var stmt = DB.cdb.prepare(sql);
var res = stmt.getAsObject({':key':key});
stmt.free();
return res;
}
/**
*
* @param {*} obj name: Name , start: Date ( 2018-08-01 )
*/
static saveSettings(obj){
var sql = `UPDATE settings SET val=:name WHERE ke="name"`;
var stmt = DB.cdb.prepare(sql);
stmt.getAsObject({':name':obj.name});
stmt.free();
sql = `UPDATE settings SET val=:start WHERE ke="start"`;
stmt = DB.cdb.prepare(sql);
stmt.getAsObject({':start':obj.start});
stmt.free();
return "";
}
import {Log} from './debug';
const SQL = require('sql.js')
export class DB{
static cdb;
static loaded = false;
static loadedCB = [];
static newDB(){
Log.debug('create new database');
DB.cdb = new SQL.Database();
DB.cdb.exec(
`CREATE TABLE settings (
id INTEGER PRIMARY KEY AUTOINCREMENT,
ke TEXT not null,
val TEXT not null
);
CREATE TABLE days (
id INTEGER PRIMARY KEY AUTOINCREMENT,
date DATETIME ,
startTime DATETIME ,
breakTime INTEGER ,
endTime DATETIME
);
CREATE TABLE tasks (
id INTEGER PRIMARY KEY AUTOINCREMENT,
taskName TEXT not NULL
);
CREATE TABLE IF NOT EXISTS days_have_tasks(day_id INTEGER ,task_id INTEGER);
CREATE TABLE notes (
id INTEGER PRIMARY KEY AUTOINCREMENT,
date DATETIME ,
title TEXT,
text TEXT,
priority TEXT
);
INSERT INTO settings (ke,val)
VALUES ('name','Max');
INSERT INTO settings (ke,val)
VALUES ('start','2018-08-01');
INSERT INTO settings (ke,val)
VALUES ('version','2');
`)
DB.loaded = true;
DB.__load()
DB.storeLocalStorage()
}
static storeLocalStorage(){
var data = DB.cdb.export();
var buffer = new Buffer(data);
var blob = new Blob([buffer]);
var reader = new FileReader();
reader.onload = function() {
localStorage.setItem('storage',reader.result)
}
reader.readAsBinaryString(blob);
}
static loadLocalStorage(){
var i, l, d, array;
array = new Uint8Array(localStorage.getItem('storage'));
for (var i = 0; i < l; i++){
array[i] = d.charCodeAt(i);
}
DB.loadDB(array);
DB.loaded = true;
DB.__load()
}
/**
*
* @param {type:Uint8Array} file Uint8Array
*/
static loadDB(file){
Log.debug('load database');
DB.cdb = new SQL.Database(file);
DB.storeLocalStorage()
DB.loaded = true;
DB.__load()
return "";
}
static __load(){
Log.debug('DB onload EVENT');
for(var l in DB.loadedCB){
DB.loadedCB[l]();
}
}
static onLoad(cb){
Log.debug('added DB onload EVENT');
DB.loadedCB.push(cb);
}
/**
*
*/
static exportDB(){
Log.debug('export database');
var data = DB.cdb.export();
var buffer = new Buffer(data);
//console.log(buffer);
var blob = new Blob([buffer],{type:'application/x-sqlite3'});
//console.log(blob);
//console.log(window.URL.createObjectURL(blob));
var link = document.createElement('a');
link.href = window.URL.createObjectURL(blob);
var fileName = "wbm.sqlite";
link.download = fileName;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
window.URL.revokeObjectURL(link);
}
/**
*
* @param {*} date
*/
static loadDate(date){
//var re = DB.cdb.exec("SELECT * FROM INFORMATION_SCHEMA.TABLES WHERE TABLE_TYPE='BASE TABLE'");
//console.log(re)
Log.debug('load from date:'+date.getTime())
// get date
var sql = `SELECT * FROM days WHERE date=:date;`;
var stmt = DB.cdb.prepare(sql);
var res = stmt.getAsObject({":date":date.getTime()})
// clear statement memory
stmt.free();
Log.debug(JSON.stringify(res));
if(Object.keys(res).length === 0){
return {breakTime: 0, date: null,startTime:null, endTime: null, taskList:[]}
}else{
var sql2 = `SELECT * FROM days_have_tasks WHERE day_id=:id`
var stmt2 = DB.cdb.prepare(sql2);
var tasks = [];
tasks.push(stmt2.getAsObject({":id":res.id}).task_id);
while (stmt2.step()) tasks.push(stmt2.get()[1]);
stmt2.free();
//return {breakTime: 0, date: null,startTime:null, endTime: null, taskList:[]}
//return 0;
//var tasks = resu.taskList.split(',');
sql = `SELECT * FROM tasks WHERE id=:id`;
for ( var task in tasks){
stmt = DB.cdb.prepare(sql);
tasks[task] = stmt.getAsObject({":id":tasks[task]}).taskName;
stmt.free();
}
res.taskList = tasks;
return res;
}
}
static saveDate(args){
Log.debug('save date');
Log.debug(JSON.stringify(args))
var sql;
var stmt;
var res;
var tasks = args.taskList;
var taskss = []
//console.log(tasks);
for(var t in tasks){
if(typeof tasks[t] === 'undefined'){
continue;
}
tasks[t] = tasks[t].trim();
/**
* @INFO: search for TASK name
*/
sql = `SELECT * FROM tasks WHERE taskName=:task`;
stmt = DB.cdb.prepare(sql);
res = stmt.getAsObject({':task':tasks[t]});
stmt.free();
//console.log(res);
/**
* @INFO: if task is not found add it as new task
* into the tasks table and research the taskname again
*/
if(Object.keys(res).length === 0){
sql = `INSERT INTO tasks(taskName) VALUES(:task);`;
stmt = DB.cdb.prepare(sql);
res = stmt.getAsObject(
{
":task":tasks[t]
}
)
stmt.free()
sql = `SELECT * FROM tasks WHERE taskName=:task`;
stmt = DB.cdb.prepare(sql);
res = stmt.getAsObject({':task':tasks[t]});
stmt.free();
console.log(res);
}
/**
* @INFO: store the task id in taskss[t]
*
*/
taskss[t]= res.id;
}
/**
* @INFO: get the choosen date
*/
sql = `SELECT * FROM days WHERE date=:date;`;
stmt = DB.cdb.prepare(sql);
console.log(args);
res = stmt.getAsObject({":date":args.date})
stmt.free()
/**
* @INFO: CHECK IF DATE EXISTS
*/
if(Object.keys(res).length === 0){
/**
* @TODO: rework if date not exists
*/
Log.debug('added new entry');
Log.debug(JSON.stringify(args))
sql = `INSERT INTO days(date,startTime,breakTime,endTime) VALUES(:date,:startTime,:breakTime,:endTime);`;
stmt = DB.cdb.prepare(sql);
res = stmt.getAsObject(
{
":date":args.date,
":startTime":args.startTime,
":breakTime":args.breakTime,
":endTime":args.endTime
/*":taskList":taskss.join()*/
}
)
stmt.free()
sql = `SELECT * FROM days WHERE date=:date;`;
stmt = DB.cdb.prepare(sql);
res = stmt.getAsObject({
":date":args.date
});
/* DAY ID */
var d_id = res.id;
/**
* @INFO:
* for each day insert into days_have_tasks the tasks and the day id
*/
for(var i = 0;i<taskss.length;i++){
sql = `INSERT INTO days_have_tasks(day_id,task_id) VALUES(:did,:task);`;
stmt = DB.cdb.prepare(sql);
res = stmt.getAsObject(
{
":did":d_id,
":task":taskss[i]
}
)
stmt.free()
}
}else{
/**
* @INFO: get DATE ID
* @TODO: rewrite it as a external method
*/
sql = `SELECT * FROM days WHERE date=:date;`
stmt = DB.cdb.prepare(sql);
var id = stmt.getAsObject({":date":args.date}).id;
stmt.free()
sql = `SELECT * FROM days_have_tasks WHERE day_id=:id`
stmt = DB.cdb.prepare(sql);
var day_tasks = stmt.getAsObject({":id":id});
var old_tasks = [];
// load all old tasks in array
old_tasks.push(day_tasks.task_id)
while (stmt.step()) old_tasks.push(stmt.get()[1]);
stmt.free();
for(var x = 0;x<old_tasks.length;x++){
var t = taskss.indexOf(old_tasks[x])
if(t===-1){
sql = `DELETE FROM days_have_tasks WHERE day_id=:id AND task_id=:t_id;`
stmt = DB.cdb.prepare(sql);
stmt.getAsObject({":id":id,":t_id":old_tasks[x]});
}
}
/**
* @INFO
* ALL USED TASKS @var - taskss
*
* SELECT
*/
for(var i = 0;i<taskss.length;i++){
sql = `SELECT * FROM days_have_tasks WHERE day_id=:id AND task_id=:tid;`
stmt = DB.cdb.prepare(sql);
var tid = taskss[i];
var res = stmt.getAsObject({":id":id,":tid":tid});
stmt.free()
/**
* ADD TASK TO DAY
*/
if(typeof res.day_id == "undefined"){
var taskID = taskss[i];
/**
* @INFO: relate day_id and task_id in days_have_tasks
*/
sql = `INSERT INTO days_have_tasks(day_id,task_id) VALUES(:did,:task);`;
stmt = DB.cdb.prepare(sql);
res = stmt.getAsObject(
{
":did":id,
":task":taskID
}
)
stmt.free()
}
}
/** DELETE NOT USED TASKS */
/** @TODO: DELETE NOT USED TASKS FOR DAY */
/*
sql = `SELECT * FROM days_have_tasks WHERE day_id=:id AND task_id NOT IN :tid;`
stmt = DB.cdb.prepare(sql);
var tid = taskss[i];
var res = stmt.getAsObject({":id":id,":tid":"\"("+taskss.join('","')+")\""});
console.log(res);
stmt.free()
*/
/** */
Log.debug('update entry');
Log.debug(JSON.stringify(args))
sql = `UPDATE days SET startTime=:startTime,breakTime=:breakTime,endTime=:endTime,taskList=:taskList WHERE date=:date;`;
stmt = DB.cdb.prepare(sql);
res = stmt.getAsObject(
{
":date":args.date,
":startTime":args.startTime,
":breakTime":args.breakTime,
":endTime":args.endTime,
":taskList":taskss.join()
}
)
Log.debug(res);
stmt.free()
}
}
static handleTasks(){
}
static loadSettings(key){
var sql = `SELECT * FROM settings WHERE ke=:key`;
var stmt = DB.cdb.prepare(sql);
var res = stmt.getAsObject({':key':key});
stmt.free();
return res;
}
/**
*
* @param {*} obj name: Name , start: Date ( 2018-08-01 )
*/
static saveSettings(obj){
var sql = `UPDATE settings SET val=:name WHERE ke="name"`;
var stmt = DB.cdb.prepare(sql);
stmt.getAsObject({':name':obj.name});
stmt.free();
sql = `UPDATE settings SET val=:start WHERE ke="start"`;
stmt = DB.cdb.prepare(sql);
stmt.getAsObject({':start':obj.start});
stmt.free();
return "";
}
/**
* RES MAPPING
*/
static resMap(res){
}
}

456
src/jsx/ui/calender.jsx
View File

@ -1,228 +1,228 @@
import React from 'react';
import InfiniteCalendar from 'react-infinite-calendar';
import {DB} from '../static/storage'
import { Log } from '../static/debug';
import {Notify} from '../static/notify';
import { Tasks } from './calender/tasks';
//import 'react-infinite-calendar/styles.css'; // only needs to be imported once
//const { ipcRenderer} = require('electron');
const moment = require('moment');
var me = null;
/*
#2C3A47;
@background-2:#596571;
*/
const cal_theme = {
accentColor: '#34495e',
floatingNav: {
background: '#34495e',
chevron: '#ffb142',
color: '#FFF',
},
headerColor: '#34495e',
selectionColor: '#34495e',
textColor: {
active: '#FFF',
default: '#333',
},
todayColor: '#ffb142',
weekdayColor: '#FFF',
}
var ct = ()=>{}
export class Calender extends React.Component {
constructor(props) {
super(props);
// Render the Calendar
this.cal_date = new Date();
this.state = {
breakTime: 0,
date:new Date(),
endTime:null,
startTime:null,
taskList:[]
}
this.startTimeChange = this.startTimeChange.bind(this);
this.endTimeChange = this.endTimeChange.bind(this);
this.breakTimeChange = this.breakTimeChange.bind(this);
this.taskListChange = this.taskListChange.bind(this);
this.getDate = this.getDate.bind(this)
this.save = this.save.bind(this);
this.entryChange = this.entryChange.bind(this);
this.addTask = this.addTask.bind(this);
this.delTask = this.delTask.bind(this);
me = this;
this.today = new Date();
this.lastWeek = new Date(this.today.getFullYear(), this.today.getMonth(), this.today.getDate() - 7);
this.worktime = 0;
/*
@TODO LOAD CURRENT DATE
ipcRenderer.on('loadDate-reply', (event, arg) => {
//console.log(arg) // prints "pong"
this.setState(
arg.data
)
if(arg.data.date === null){
this.setState({date:this.cal_date});
}
if(arg.data.startTime === null){
this.setState({startTime:this.cal_date});
}
if(arg.data.endTime === null){
this.setState({endTime:this.cal_date});
}
})
*/
}
componentWillUnmount(){
Log.debug("unload Calender")
}
getDate(date){
// set selected date
me.cal_date = date;
var res = DB.loadDate(date)
Log.debug('LOAD RES')
console.log(res)
if(res.date === null){
res.date=this.cal_date;
}
if(res.startTime === null){
res.startTime=moment(this.cal_date).unix()*1000;
}
if(res.endTime === null){
res.endTime=moment(this.cal_date).unix()*1000;
}
this.setState(
res
)
}
startTimeChange(e){
//this.setState({startTime: e.target.value});
var hm = e.target.value.split(':');
this.setState({startTime: moment(this.state.date).set({hour:hm[0],minute:hm[1]}).unix()*1000});
}
endTimeChange(e){
////console.log(e.target.value)
var hm = e.target.value.split(':');
////console.log(moment(this.state.date).set({hour:hm[0],minute:hm[1]}).format('HH:mm:ss'))
this.setState({endTime: moment(this.state.date).set({hour:hm[0],minute:hm[1]}).unix()*1000 });
}
breakTimeChange(e){
this.setState({breakTime: e.target.value});
}
taskListChange(e){
this.setState({taskList: e.target.value.split(',')});
}
save(){
//console.log("Speichern")
Log.debug(JSON.stringify(this.state))
Log.debug(JSON.stringify({
breakTime: this.state.breakTime,
date:moment(this.state.date).unix()*1000,
endTime:this.state.endTime,
startTime:this.state.startTime,
taskList:this.state.taskList
}))
DB.saveDate(
{
breakTime: this.state.breakTime,
date:moment(this.state.date).unix()*1000,
endTime:this.state.endTime,
startTime:this.state.startTime,
taskList:this.state.taskList
}
);
Notify.emit({title:"",body:"Eintrag gespeichert.",type:"success"});
//ipcRenderer.send('saveDate',s)
}
entryChange(e){
console.log(e.target.attributes.getNamedItem("data-key").value+" "+e.target.value);
var tmp = this.state.taskList
tmp[e.target.attributes.getNamedItem("data-key").value] = e.target.value
this.setState({taskList: tmp});
}
addTask(){
var tmp = this.state.taskList;
tmp.push("");
this.setState({taskList: tmp})
}
delTask(e){
var tmp = this.state.taskList;
tmp.splice(e.target.attributes.getNamedItem("data-key").value,1);
this.setState({taskList: tmp});
}
render() {
var wk = 0;
if(this.state.endTime !== null){
try{
wk = moment.duration(moment(this.state.endTime).diff(moment(this.state.startTime).subtract(-this.state.breakTime,'minutes')));
//console.log('XD ',wk)
wk = moment.utc(wk._milliseconds).format('HH:mm')
}catch(e){
//console.log(e)
}
}else{
}
console.log(moment(this.state.date).diff(moment(DB.loadSettings('start').val),'week'));
////console.log(moment(this.state.endTime).format('HH:mm:ss'))
var loc = {blank: 'Datum auswählen...', headerFormat: 'ddd, MMM Do', todayLabel: { long: 'Heute', }, locale: require('date-fns/locale/de'), weekdays: ['So', 'Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa'], weekStartsOn: 1 }
return ( <div id="editor-frame">
<div id="calender">
<InfiniteCalendar selected = { this.today } theme={cal_theme} locale = { loc } onSelect={this.getDate}/>
</div >
<div id="mask">
<div className="header"></div>
<div className="inputGroup">
<div className="input">
<label>Arbeitszeit :</label><input type="text" disable="true" value={wk}/>
</div>
<div className="input">
<label>Anfangszeit:</label><input type="time" value={moment(this.state.startTime).format('HH:mm')} onChange={this.startTimeChange}/>
</div>
<div className="input">
<label>Feierabend :</label><input type="time" value={moment(this.state.endTime).format('HH:mm')} onChange={this.endTimeChange}/>
</div>
<div className="input">
<label>Pause :</label><input type="number" min="0" value={this.state.breakTime} onChange={this.breakTimeChange}/>
</div>
<div className="input">
<label>Tätigkeiten</label>
<label></label><br/><textarea className="hidden" value={this.state.taskList} onChange={this.taskListChange}>
</textarea>
<div id="entrys">
{this.state.taskList.map((item, i) => (
<div className="entry-input" key={i}>
<input type="text" value={item} data-key={i} onChange={this.entryChange}/><button data-key={i} onClick={this.delTask}><i class="fas fa-trash"></i></button>
</div>)
)}
</div>
<button onClick={this.addTask}><i class="fas fa-plus"></i></button>
</div>
<div className="input">
<label></label><button className="btn success" onClick={this.save}>Speichern</button>
</div>
</div>
</div>
</div> );
}
}
import React from 'react';
import InfiniteCalendar from 'react-infinite-calendar';
import {DB} from '../static/storage'
import { Log } from '../static/debug';
import {Notify} from '../static/notify';
import { Tasks } from './calender/tasks';
//import 'react-infinite-calendar/styles.css'; // only needs to be imported once
//const { ipcRenderer} = require('electron');
const moment = require('moment');
var me = null;
/*
#2C3A47;
@background-2:#596571;
*/
const cal_theme = {
accentColor: '#34495e',
floatingNav: {
background: '#34495e',
chevron: '#ffb142',
color: '#FFF',
},
headerColor: '#34495e',
selectionColor: '#34495e',
textColor: {
active: '#FFF',
default: '#333',
},
todayColor: '#ffb142',
weekdayColor: '#FFF',
}
var ct = ()=>{}
export class Calender extends React.Component {
constructor(props) {
super(props);
// Render the Calendar
this.cal_date = new Date();
this.state = {
breakTime: 0,
date:new Date(),
endTime:null,
startTime:null,
taskList:[]
}
this.startTimeChange = this.startTimeChange.bind(this);
this.endTimeChange = this.endTimeChange.bind(this);
this.breakTimeChange = this.breakTimeChange.bind(this);
this.taskListChange = this.taskListChange.bind(this);
this.getDate = this.getDate.bind(this)
this.save = this.save.bind(this);
this.entryChange = this.entryChange.bind(this);
this.addTask = this.addTask.bind(this);
this.delTask = this.delTask.bind(this);
me = this;
this.today = new Date();
this.lastWeek = new Date(this.today.getFullYear(), this.today.getMonth(), this.today.getDate() - 7);
this.worktime = 0;
/*
@TODO LOAD CURRENT DATE
ipcRenderer.on('loadDate-reply', (event, arg) => {
//console.log(arg) // prints "pong"
this.setState(
arg.data
)
if(arg.data.date === null){
this.setState({date:this.cal_date});
}
if(arg.data.startTime === null){
this.setState({startTime:this.cal_date});
}
if(arg.data.endTime === null){
this.setState({endTime:this.cal_date});
}
})
*/
}
componentWillUnmount(){
Log.debug("unload Calender")
}
getDate(date){
// set selected date
me.cal_date = date;
var res = DB.loadDate(date)
Log.debug('LOAD RES')
Log.debug(JSON.stringify(res))
if(res.date === null){
res.date=this.cal_date;
}
if(res.startTime === null){
res.startTime=moment(this.cal_date).unix()*1000;
}
if(res.endTime === null){
res.endTime=moment(this.cal_date).unix()*1000;
}
this.setState(
res
)
}
startTimeChange(e){
//this.setState({startTime: e.target.value});
var hm = e.target.value.split(':');
this.setState({startTime: moment(this.state.date).set({hour:hm[0],minute:hm[1]}).unix()*1000});
}
endTimeChange(e){
////console.log(e.target.value)
var hm = e.target.value.split(':');
////console.log(moment(this.state.date).set({hour:hm[0],minute:hm[1]}).format('HH:mm:ss'))
this.setState({endTime: moment(this.state.date).set({hour:hm[0],minute:hm[1]}).unix()*1000 });
}
breakTimeChange(e){
this.setState({breakTime: e.target.value});
}
taskListChange(e){
this.setState({taskList: e.target.value.split(',')});
}
save(){
//console.log("Speichern")
Log.debug(JSON.stringify(this.state))
Log.debug(JSON.stringify({
breakTime: this.state.breakTime,
date:moment(this.state.date).unix()*1000,
endTime:this.state.endTime,
startTime:this.state.startTime,
taskList:this.state.taskList
}))
DB.saveDate(
{
breakTime: this.state.breakTime,
date:moment(this.state.date).unix()*1000,
endTime:this.state.endTime,
startTime:this.state.startTime,
taskList:this.state.taskList
}
);
Notify.emit({title:"",body:"Eintrag gespeichert.",type:"success"});
//ipcRenderer.send('saveDate',s)
}
entryChange(e){
//console.log(e.target.attributes.getNamedItem("data-key").value+" "+e.target.value);
var tmp = this.state.taskList
tmp[e.target.attributes.getNamedItem("data-key").value] = e.target.value
this.setState({taskList: tmp});
}
addTask(){
var tmp = this.state.taskList;
tmp.push("");
this.setState({taskList: tmp})
}
delTask(e){
var tmp = this.state.taskList;
tmp.splice(e.target.attributes.getNamedItem("data-key").value,1);
this.setState({taskList: tmp});
}
render() {
var wk = 0;
if(this.state.endTime !== null){
try{
wk = moment.duration(moment(this.state.endTime).diff(moment(this.state.startTime).subtract(-this.state.breakTime,'minutes')));
//console.log('XD ',wk)
wk = moment.utc(wk._milliseconds).format('HH:mm')
}catch(e){
//console.log(e)
}
}else{
}
//console.log(moment(this.state.date).diff(moment(DB.loadSettings('start').val),'week'));
////console.log(moment(this.state.endTime).format('HH:mm:ss'))
var loc = {blank: 'Datum auswählen...', headerFormat: 'ddd, MMM Do', todayLabel: { long: 'Heute', }, locale: require('date-fns/locale/de'), weekdays: ['So', 'Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa'], weekStartsOn: 1 }
return ( <div id="editor-frame">
<div id="calender">
<InfiniteCalendar selected = { this.today } theme={cal_theme} locale = { loc } onSelect={this.getDate}/>
</div >
<div id="mask">
<div className="header"></div>
<div className="inputGroup">
<div className="input">
<label>Arbeitszeit :</label><input type="text" disable="true" value={wk}/>
</div>
<div className="input">
<label>Anfangszeit:</label><input type="time" value={moment(this.state.startTime).format('HH:mm')} onChange={this.startTimeChange}/>
</div>
<div className="input">
<label>Feierabend :</label><input type="time" value={moment(this.state.endTime).format('HH:mm')} onChange={this.endTimeChange}/>
</div>
<div className="input">
<label>Pause :</label><input type="number" min="0" value={this.state.breakTime} onChange={this.breakTimeChange}/>
</div>
<div className="input">
<label>Tätigkeiten</label>
<label></label><br/><textarea className="hidden" value={this.state.taskList} onChange={this.taskListChange}>
</textarea>
<div id="entrys">
{this.state.taskList.map((item, i) => (
<div className="entry-input" key={i}>
<input type="text" value={item} data-key={i} onChange={this.entryChange}/><button data-key={i} onClick={this.delTask}><i class="fas fa-trash"></i></button>
</div>)
)}
</div>
<button onClick={this.addTask}><i class="fas fa-plus"></i></button>
</div>
<div className="input">
<label></label><button className="btn success" onClick={this.save}>Speichern</button>
</div>
</div>
</div>
</div> );
}
}

0
src/jsx/ui/components/modal.jsx 100644
View File

253
src/jsx/ui/fileLoader.jsx
View File

@ -1,122 +1,133 @@