2.3 - added notification center, added event on save/generate on calender, generator and settings
parent
251b33fb53
commit
9296cbf1bc
|
@ -3,6 +3,24 @@ select {
|
||||||
height: 34px;
|
height: 34px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
#notify-center {
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
background-color: #FFF;
|
||||||
|
}
|
||||||
|
#notify-center .notification {
|
||||||
|
width: 200px;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
margin: 5px;
|
||||||
|
padding: 5px;
|
||||||
|
border: 1px solid #454545;
|
||||||
|
box-shadow: 1px 2px 3px rgba(69, 69, 69, 0.34901961);
|
||||||
|
}
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Exo';
|
font-family: 'Exo';
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
|
|
File diff suppressed because it is too large
Load Diff
|
@ -1,6 +1,6 @@
|
||||||
|
|
||||||
export class Log{
|
export class Log{
|
||||||
static debug(txt){
|
static debug(txt){
|
||||||
console.debug('%cDEBUG: '+txt, 'background: #222; color: #bada55');
|
//console.debug('%cDEBUG: '+txt, 'background: #222; color: #bada55');
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -0,0 +1,19 @@
|
||||||
|
import { Log } from "./debug";
|
||||||
|
|
||||||
|
export class Notify{
|
||||||
|
static onEventsArray = [];
|
||||||
|
static on(func){
|
||||||
|
Notify.onEventsArray.push(func);
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
*
|
||||||
|
* @param {*} data {title:"",body:"",type:""}
|
||||||
|
*/
|
||||||
|
static emit(data){
|
||||||
|
Log.debug('Notify emit');
|
||||||
|
for(var f in Notify.onEventsArray){
|
||||||
|
Log.debug(Notify.onEventsArray[f]);
|
||||||
|
Notify.onEventsArray[f](data);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -2,6 +2,8 @@ import React from 'react';
|
||||||
import InfiniteCalendar from 'react-infinite-calendar';
|
import InfiniteCalendar from 'react-infinite-calendar';
|
||||||
import {DB} from '../static/storage'
|
import {DB} from '../static/storage'
|
||||||
import { Log } from '../static/debug';
|
import { Log } from '../static/debug';
|
||||||
|
|
||||||
|
import {Notify} from '../static/notify';
|
||||||
//import 'react-infinite-calendar/styles.css'; // only needs to be imported once
|
//import 'react-infinite-calendar/styles.css'; // only needs to be imported once
|
||||||
|
|
||||||
//const { ipcRenderer} = require('electron');
|
//const { ipcRenderer} = require('electron');
|
||||||
|
@ -139,6 +141,7 @@ export class Calender extends React.Component {
|
||||||
taskList:this.state.taskList
|
taskList:this.state.taskList
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
Notify.emit({title:"",body:"Eintrag gespeichert.",type:"success"});
|
||||||
//ipcRenderer.send('saveDate',s)
|
//ipcRenderer.send('saveDate',s)
|
||||||
}
|
}
|
||||||
render() {
|
render() {
|
||||||
|
|
|
@ -6,6 +6,7 @@ export class Templates{
|
||||||
header:"",
|
header:"",
|
||||||
wochenbericht:"",
|
wochenbericht:"",
|
||||||
wochenbericht_2:"",
|
wochenbericht_2:"",
|
||||||
|
wochenbericht_2_wo_time:"",
|
||||||
monatsbericht:"",
|
monatsbericht:"",
|
||||||
arbeitszeiten:"",
|
arbeitszeiten:"",
|
||||||
footer:""
|
footer:""
|
||||||
|
@ -37,6 +38,14 @@ export class Templates{
|
||||||
.catch ((error) => {
|
.catch ((error) => {
|
||||||
console.log(error);
|
console.log(error);
|
||||||
})
|
})
|
||||||
|
axios.get('/templates/wochenbericht_2_wo_time.ptt')
|
||||||
|
.then ((result) => {
|
||||||
|
|
||||||
|
Templates.template.wochenbericht_2_wo_time = result.data;
|
||||||
|
})
|
||||||
|
.catch ((error) => {
|
||||||
|
console.log(error);
|
||||||
|
})
|
||||||
|
|
||||||
axios.get('/templates/monatsbericht.ptt')
|
axios.get('/templates/monatsbericht.ptt')
|
||||||
.then ((result) => {
|
.then ((result) => {
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import {DB} from '../static/storage';
|
import {DB} from '../static/storage';
|
||||||
|
import { Notify } from '../static/notify';
|
||||||
//import 'react-infinite-calendar/styles.css'; // only needs to be imported once
|
//import 'react-infinite-calendar/styles.css'; // only needs to be imported once
|
||||||
|
|
||||||
const moment = require('moment');
|
const moment = require('moment');
|
||||||
|
@ -245,6 +246,7 @@ export class Generator extends React.Component {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Notify.emit({title:"",body:"Einträge generiert.",type:"success"});
|
||||||
}
|
}
|
||||||
handleMo(e) {
|
handleMo(e) {
|
||||||
//console.log(e.target.id);
|
//console.log(e.target.id);
|
||||||
|
|
|
@ -7,14 +7,23 @@ import {Print} from './print';
|
||||||
import {Settings} from './settings';
|
import {Settings} from './settings';
|
||||||
|
|
||||||
import {DB} from './../static/storage'
|
import {DB} from './../static/storage'
|
||||||
|
import { Notify } from '../static/notify';
|
||||||
|
|
||||||
export class Nav extends React.Component {
|
export class Nav extends React.Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
this.state = {
|
this.state = {
|
||||||
tab:(<Home/>)
|
tab:(<Home/>),
|
||||||
|
notify:(<span></span>)
|
||||||
}
|
}
|
||||||
this.handleExportFile = this.handleExportFile.bind(this);
|
this.handleExportFile = this.handleExportFile.bind(this);
|
||||||
|
var me = this;
|
||||||
|
Notify.on((data)=>{
|
||||||
|
me.setState({notify:me.notify(data)});
|
||||||
|
setTimeout(function(){
|
||||||
|
me.setState({notify:(<span></span>)});
|
||||||
|
},3000)
|
||||||
|
});
|
||||||
}
|
}
|
||||||
handleExportFile(){
|
handleExportFile(){
|
||||||
/**
|
/**
|
||||||
|
@ -28,6 +37,14 @@ export class Nav extends React.Component {
|
||||||
* CREATE FILE
|
* CREATE FILE
|
||||||
*/
|
*/
|
||||||
}
|
}
|
||||||
|
notify(data){
|
||||||
|
return(
|
||||||
|
<div className="notification success">
|
||||||
|
<div className="title">{data.title}</div>
|
||||||
|
<div className="body">{data.body}</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
render() {
|
render() {
|
||||||
/*<button onClick={this.handleCreateFile}>Erstellen </button>*/
|
/*<button onClick={this.handleCreateFile}>Erstellen </button>*/
|
||||||
return (
|
return (
|
||||||
|
@ -49,6 +66,9 @@ export class Nav extends React.Component {
|
||||||
<div id="content">
|
<div id="content">
|
||||||
{this.state.tab}
|
{this.state.tab}
|
||||||
</div>
|
</div>
|
||||||
|
<div id="notify-center">
|
||||||
|
{this.state.notify}
|
||||||
|
</div>
|
||||||
</div>);
|
</div>);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -83,6 +83,7 @@ export class Print extends React.Component {
|
||||||
<div>Vorlage: <select value={this.state.choosenTemplate} onChange={this.handleChangeTemplate}>
|
<div>Vorlage: <select value={this.state.choosenTemplate} onChange={this.handleChangeTemplate}>
|
||||||
<option selected value="wochenbericht">Wochenbericht 1</option>
|
<option selected value="wochenbericht">Wochenbericht 1</option>
|
||||||
<option value="wochenbericht_2">Wochenbericht 2</option>
|
<option value="wochenbericht_2">Wochenbericht 2</option>
|
||||||
|
<option value="wochenbericht_2_wo_time">Wochenbericht 2 - ohne Zeiten</option>
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
<div><button onClick={this.preview}>Vorschau</button><button onClick={this.print}>Drucken</button></div>
|
<div><button onClick={this.preview}>Vorschau</button><button onClick={this.print}>Drucken</button></div>
|
||||||
|
|
|
@ -29,6 +29,7 @@ export class Settings extends React.Component {
|
||||||
}
|
}
|
||||||
save(){
|
save(){
|
||||||
DB.saveSettings(this.state);
|
DB.saveSettings(this.state);
|
||||||
|
Notify.emit({title:"",body:"Einstellungen gespeichert.",type:"success"});
|
||||||
}
|
}
|
||||||
render() {
|
render() {
|
||||||
console.log(this.state)
|
console.log(this.state)
|
||||||
|
|
|
@ -4,7 +4,7 @@
|
||||||
|
|
||||||
|
|
||||||
@import './form_elements.less';
|
@import './form_elements.less';
|
||||||
|
@import './notify.less';
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Exo';
|
font-family: 'Exo';
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
|
|
|
@ -0,0 +1,18 @@
|
||||||
|
#notify-center{
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
background-color:#FFF;
|
||||||
|
.notification{
|
||||||
|
width: 200px;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
margin: 5px;
|
||||||
|
padding: 5px;
|
||||||
|
border: 1px solid #454545;
|
||||||
|
box-shadow: 1px 2px 3px rgba(69, 69, 69, 0.34901960784313724);
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue