tomru/pdfer
1
0
Fork 0
mirror of https://github.com/tomru/pdfer.git synced 2026-03-03 06:27:19 +01:00
Code Issues Packages Projects Releases Wiki Activity

further work

Browse Source
This commit is contained in:
Thomas Ruoff
2017-02-19 23:27:53 +01:00
parent 6865a63832
commit da027191d6
8 changed files with 138 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@@ -31,6 +31,7 @@
"copy-webpack-plugin": "^4.0.1", "copy-webpack-plugin": "^4.0.1",
"eslint": "^3.15.0", "eslint": "^3.15.0",
"html-webpack-plugin": "^2.28.0", "html-webpack-plugin": "^2.28.0",
"styled-components": "^1.4.3",
"webpack": "^2.2.1", "webpack": "^2.2.1",
"webpack-dashboard": "^0.3.0", "webpack-dashboard": "^0.3.0",
"webpack-dev-server": "^2.3.0" "webpack-dev-server": "^2.3.0"

4
templates/brief.js
View File

@@ -4,7 +4,9 @@ function convertLineBreaks(string){
module.exports = (options) => { module.exports = (options) => {
var { console.log(options);
const {
template = 'brief-fam', template = 'brief-fam',
subject = 'Betreff', subject = 'Betreff',
yourRef = '', yourRef = '',

1
webapp/index.html
View File

@@ -4,6 +4,7 @@
<meta charset="utf-8"> <meta charset="utf-8">
<title>PDFer</title> <title>PDFer</title>
<meta name="application-name" content="PDFer"> <meta name="application-name" content="PDFer">
<link href="/styles.css" rel="stylesheet" type="text/css">
</head> </head>
<body> <body>
<div id="root"> <div id="root">

21
webapp/static/styles.css Normal file
View File

@@ -0,0 +1,21 @@
label,
label input,
label textarea {
display: block;
}
button {
margin-top: 12px;
}
.home {
display: flex;
}
.home > div {
padding: 12px;
}
embed {
flex: 1 100%;
}

0
webapp/styles/styles.css
View File

76
webapp/views/components/LetterOptions.js Normal file
View File

@@ -0,0 +1,76 @@
import { h } from 'preact';
import Input from './Input';
import TextAreaInput from './TextAreaInput';
export default function(props) {
return (
<div>
<TextAreaInput
name="address"
text="Adresse"
onchange={props.onChange}
value={props.address}
/>
<Input
name="subject"
text="Betreff"
onchange={props.onChange}
value={props.subject}
/>
<Input
name="yourRef"
text="Ihr Zeichen"
onchange={props.onChange}
value={props.yourRef}
/>
<Input
name="yourMail"
text="Ihr Schreiben vom"
onchange={props.onChange}
value={props.yourMail}
/>
<Input
name="customer"
text="Kundernummer"
onchange={props.onChange}
value={props.customer}
/>
<Input
name="invoice"
text="Rechnung"
onchange={props.onChange}
value={props.invoice}
/>
<Input
name="yourMail"
text="Ihr Schreiben vom"
onchange={props.onChange}
value={props.yourMail}
/>
<Input
name="date"
text="Datum"
onchange={props.onChange}
value={props.date}
/>
<Input
name="opening"
text="Anrede"
onchange={props.onChange}
value={props.opening}
/>
<TextAreaInput
name="body"
text="Brieftext"
onchange={props.onChange}
value={props.body}
/>
<Input
name="closing"
text="Grußformel"
onchange={props.onChange}
value={props.closing}
/>
</div>
);
};

18
webapp/views/components/Preview.js
View File

@@ -1,11 +1,25 @@
import { Component, h } from 'preact'; import { Component, h } from 'preact';
export default props => { export default props => {
if (props.pdfIsLoading) {
return (
<div>Lade...</div>
);
}
if (props.pdfError) {
return (
<div>{props.pdfError}</div>
);
}
if (!props.pdfUrl) { if (!props.pdfUrl) {
return ''; return (
<div>Knopf drücken dann gibts hier was zu sehen!</div>
);
} }
return ( return (
<embed src={props.pdfUrl} width="100%" height="100%"/> <embed src={props.pdfUrl} width="600px" height="1000px"/>
); );
}; };

37
webapp/views/pages/Home.js
View File

@@ -1,8 +1,7 @@
import { Component, h } from 'preact'; import { Component, h } from 'preact';
import PDF from 'react-pdf'; import PDF from 'react-pdf';
import Input from '../components/Input'; import LetterOptions from '../components/LetterOptions';
import TextAreaInput from '../components/TextAreaInput';
import Button from '../components/Button'; import Button from '../components/Button';
import Preview from '../components/Preview'; import Preview from '../components/Preview';
@@ -12,35 +11,39 @@ class Home extends Component {
render(props) { render(props) {
const component = this; const component = this;
return ( return (
<div> <div className="home">
<TextAreaInput <div>
name="address" <LetterOptions onChange={this._onChange.bind(this)} />
text="Adresse" <Button onClick={this._onGenerate.bind(this)} text="Generiere"/>
onchange={this._onChange.bind(this)} </div>
value={props.address} <div>
/> <Preview
<Input pdfUrl={this.state.pdfUrl}
name="subject" pdfIsLoading={this.state.pdfIsLoading}
text="Betreff" pdfError={this.state.pdfError}
onchange={this._onChange.bind(this)} />
value={props.subject} </div>
/>
<Button onClick={this._onGenerate.bind(this)} text="Generiere"/>
<Preview pdfUrl={this.state.pdfUrl} />
</div> </div>
); );
} }
_onGenerate() { _onGenerate() {
this.setState({
pdfIsLoading: true,
pdfError: null
})
generatePdf(this.state) generatePdf(this.state)
.then((data) => { .then((data) => {
const {id} = data; const {id} = data;
this.setState({ this.setState({
pdfIsLoading: false,
pdfUrl: `//localhost:5000/pdf/${id}` pdfUrl: `//localhost:5000/pdf/${id}`
}); });
}) })
.catch((error) => { .catch((error) => {
this.setState({ this.setState({
pdfIsLoading: false,
pdfError: error,
pdfUrl: null pdfUrl: null
}); });
}); });