design.estate/dees-document
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(core): Refactor project structure for better modularity and code organization

Browse Source
This commit is contained in:
Philipp Kunz
2024-12-02 16:04:58 +01:00
parent bab1ffc4b4
commit c9ad18538b
30 changed files with 100 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
ts_web/00_commitinfo_data.ts
View File

@ -3,6 +3,6 @@
*/
export const commitinfo = {
name: '@design.estate/dees-document',
version: '1.4.0',
version: '1.5.0',
description: 'A sophisticated framework for dynamically generating and rendering business documents like invoices with modern web technologies, featuring PDF creation, templating, and automation.'
}

18
ts_web/elements/contentinvoice.ts
View File

@ -15,8 +15,6 @@ import {
domtools,
} from '@design.estate/dees-element';
import * as plugins from '../plugins.js';
import * as shared from '../../ts/shared/index.js';
import * as interfaces from '../../ts/interfaces/index.js';
declare global {
@ -49,7 +47,7 @@ export class DeContentInvoice extends DeesElement {
type: Object,
reflect: true,
})
public documentSettings: interfaces.IDocumentSettings;
public documentSettings: plugins.shared.interfaces.IDocumentSettings;
constructor() {
super();
@ -281,12 +279,12 @@ export class DeContentInvoice extends DeesElement {
</style>
<div>We hereby invoice products and services provided to you by Lossless GmbH:</div>
<div class="grid topLine dataHeader">
<div class="lineItem">${shared.translation.translate(this.documentSettings.languageCode, 'itemPos', 'Item Pos.')}</div>
<div class="lineItem">${shared.translation.translate(this.documentSettings.languageCode, 'description', 'Description')}</div>
<div class="lineItem">${shared.translation.translate(this.documentSettings.languageCode, 'quantity', 'Quantity')}</div>
<div class="lineItem">${shared.translation.translate(this.documentSettings.languageCode, 'unitType', 'Unit Type')}</div>
<div class="lineItem">${shared.translation.translate(this.documentSettings.languageCode, 'unitNetPrice', 'Unit Net Price')}</div>
<div class="lineItem">${shared.translation.translate(this.documentSettings.languageCode, 'totalNetPrice', 'Total Net Price')}</div>
<div class="lineItem">${plugins.shared.translation.translate(this.documentSettings.languageCode, 'itemPos', 'Item Pos.')}</div>
<div class="lineItem">${plugins.shared.translation.translate(this.documentSettings.languageCode, 'description', 'Description')}</div>
<div class="lineItem">${plugins.shared.translation.translate(this.documentSettings.languageCode, 'quantity', 'Quantity')}</div>
<div class="lineItem">${plugins.shared.translation.translate(this.documentSettings.languageCode, 'unitType', 'Unit Type')}</div>
<div class="lineItem">${plugins.shared.translation.translate(this.documentSettings.languageCode, 'unitNetPrice', 'Unit Net Price')}</div>
<div class="lineItem">${plugins.shared.translation.translate(this.documentSettings.languageCode, 'totalNetPrice', 'Total Net Price')}</div>
</div>
${(() => {
let counter = 1;
@ -335,7 +333,7 @@ export class DeContentInvoice extends DeesElement {
${this.letterData?.content.invoiceData.reverseCharge
? html`
<div class="taxNote">
${shared.translation.translate(this.documentSettings.languageCode, 'reverseVatNote', 'VAT arises on a reverse charge basis and is payable by the customer.')}
${plugins.shared.translation.translate(this.documentSettings.languageCode, 'reverseVatNote', 'VAT arises on a reverse charge basis and is payable by the customer.')}
</div>
`
: ``}

5
ts_web/elements/document.demo.ts
View File

@ -1,6 +1,7 @@
import * as shared from '../../ts/shared/index.js';
import * as plugins from '../plugins.js';
import { html } from '@design.estate/dees-element';
export const demoFunc = () => html`
<dedocument-dedocument .format="${'a4'}" .letterData=${shared.demoLetter}></dedocument-dedocument>
<dedocument-dedocument .format="${'a4'}" .letterData=${plugins.shared.demoLetter}></dedocument-dedocument>
`;

7
ts_web/elements/document.ts
View File

@ -10,11 +10,9 @@ import {
unsafeCSS,
domtools,
} from '@design.estate/dees-element';
import * as interfaces from '../../ts/interfaces/index.js';
import * as plugins from '../plugins.js';
export const defaultDocumentSettings: interfaces.IDocumentSettings = {
export const defaultDocumentSettings: plugins.shared.interfaces.IDocumentSettings = {
enableTopDraftText: true,
enableDefaultHeader: true,
enableDefaultFooter: true,
@ -24,7 +22,6 @@ export const defaultDocumentSettings: interfaces.IDocumentSettings = {
import { DePage } from './page.js';
import { DeContentInvoice } from './contentinvoice.js';
import * as shared from '../../ts/shared/index.js';
import { demoFunc } from './document.demo.js';
declare global {
@ -85,7 +82,7 @@ export class DeDocument extends DeesElement {
}
},
})
public documentSettings: interfaces.IDocumentSettings = defaultDocumentSettings;
public documentSettings: plugins.shared.interfaces.IDocumentSettings = defaultDocumentSettings;
constructor() {
super();

2
ts_web/elements/index.ts
View File

@ -7,5 +7,3 @@ export * from './pagecontent.js';
export * from './pagefooter.js';
export * from './pageheader.js';
export * from './viewer.js';
export * from '../../ts/shared/index.js';

15
ts_web/elements/letterheader.ts
View File

@ -7,11 +7,10 @@ import {
css,
cssManager,
unsafeCSS,
domtools,
} from '@design.estate/dees-element';
import * as domtools from '@design.estate/dees-domtools';
import * as shared from '../../ts/shared/index.js';
import * as tsclass from '@tsclass/tsclass';
import * as plugins from '../plugins.js';
declare global {
interface HTMLElementTagNameMap {
@ -22,14 +21,14 @@ declare global {
@customElement('dedocument-letterheader')
export class DeLetterHeader extends DeesElement {
public static demo = () => html`
<dedocument-letterheader .format="${'a4'}" .letterData=${shared.demoLetter}></dedocument-letterheader>
<dedocument-letterheader .format="${'a4'}" .letterData=${plugins.shared.demoLetter}></dedocument-letterheader>
`;
@property({
type: Object,
reflect: true
})
public letterData: tsclass.business.ILetter;
public letterData: plugins.tsclass.business.ILetter;
@property({
type: Number,
@ -60,7 +59,7 @@ export class DeLetterHeader extends DeesElement {
display: block;
overflow: hidden;
top: 200px;
right: ${unsafeCSS(shared.rightMargin + 'px')};
right: ${unsafeCSS(plugins.shared.rightMargin + 'px')};
width: 200px;
text-align: right;
}
@ -74,14 +73,14 @@ export class DeLetterHeader extends DeesElement {
.date {
position: absolute;
top: 180px;
right: ${unsafeCSS(shared.rightMargin + 'px')};
right: ${unsafeCSS(plugins.shared.rightMargin + 'px')};
text-align: right;
}
.address {
position: absolute;
top: 180px;
left: ${unsafeCSS(shared.leftMargin + 'px')};
left: ${unsafeCSS(plugins.shared.leftMargin + 'px')};
}
.address .from {

12
ts_web/elements/page.ts
View File

@ -11,12 +11,10 @@ import {
domtools,
} from '@design.estate/dees-element';
import * as interfaces from '../../ts/interfaces/index.js';
import * as plugins from '../plugins.js';
import { defaultDocumentSettings } from './document.js';
import * as shared from '../../ts/shared/index.js';
declare global {
interface HTMLElementTagNameMap {
'dedocument-page': DePage;
@ -67,7 +65,7 @@ export class DePage extends DeesElement {
type: Object,
reflect: true,
})
public documentSettings: interfaces.IDocumentSettings = defaultDocumentSettings;
public documentSettings: plugins.shared.interfaces.IDocumentSettings = defaultDocumentSettings;
constructor() {
super();
@ -204,9 +202,9 @@ export class DePage extends DeesElement {
let scale = 1;
if (this.viewHeight) {
scale = this.viewHeight / shared.a4Height;
scale = this.viewHeight / plugins.shared.a4Height;
} else if (this.viewWidth) {
scale = this.viewWidth / shared.a4Width;
scale = this.viewWidth / plugins.shared.a4Width;
}
console.log(`new scale is ${scale}`);
scaleWrapper.style.transform = `scale(${scale})`;
@ -214,6 +212,6 @@ export class DePage extends DeesElement {
// Adjust the outer dimensions so they match the scaled content
// this.style.width = `${shared.a4Width * scale}px`;
this.style.height = `${shared.a4Height * scale}px`;
this.style.height = `${plugins.shared.a4Height * scale}px`;
}
}

6
ts_web/elements/pagecontainer.ts
View File

@ -10,7 +10,7 @@ import {
} from '@design.estate/dees-element';
import * as domtools from '@design.estate/dees-domtools';
import * as shared from '../../ts/shared/index.js';
import * as plugins from '../plugins.js';
declare global {
interface HTMLElementTagNameMap {
@ -47,8 +47,8 @@ export class DePageContainer extends DeesElement {
background: white;
color: #333;
padding: 0px;
width: ${unsafeCSS(shared.a4Width + 'px')};
height: ${unsafeCSS(shared.a4Height + 'px')};
width: ${unsafeCSS(plugins.shared.a4Width + 'px')};
height: ${unsafeCSS(plugins.shared.a4Height + 'px')};
position: relative;
border-radius: 3px;
overflow: hidden;

11
ts_web/elements/pagecontent.ts
View File

@ -7,11 +7,10 @@ import {
css,
cssManager,
unsafeCSS,
domtools,
} from '@design.estate/dees-element';
import * as domtools from '@design.estate/dees-domtools';
import * as shared from '../../ts/shared/index.js';
import * as tsclass from '@tsclass/tsclass';
import * as plugins from '../plugins.js';
declare global {
interface HTMLElementTagNameMap {
@ -28,7 +27,7 @@ export class DePageContent extends DeesElement {
@property({
type: Number,
})
public letterData: tsclass.business.ILetter;
public letterData: plugins.tsclass.business.ILetter;
@property({
type: Number,
@ -55,8 +54,8 @@ export class DePageContent extends DeesElement {
.content {
position: absolute;
left: ${unsafeCSS(shared.leftMargin + 'px')};
right: ${unsafeCSS(shared.rightMargin + 'px')};
left: ${unsafeCSS(plugins.shared.leftMargin + 'px')};
right: ${unsafeCSS(plugins.shared.rightMargin + 'px')};
bottom: 170px;
overflow: visible;
}

23
ts_web/elements/pagefooter.ts
View File

@ -10,10 +10,7 @@ import {
domtools,
} from '@design.estate/dees-element';
import * as interfaces from '../../ts/interfaces/index.js';
import * as shared from '../../ts/shared/index.js';
import * as tsclass from '@tsclass/tsclass';
import * as plugins from '../plugins.js';
declare global {
interface HTMLElementTagNameMap {
@ -30,13 +27,13 @@ export class DePageFooter extends DeesElement {
@property({
type: Object,
})
letterData: tsclass.business.ILetter;
letterData: plugins.tsclass.business.ILetter;
@property({
type: Object,
reflect: true,
})
documentSettings: interfaces.IDocumentSettings;
documentSettings: plugins.shared.interfaces.IDocumentSettings;
@property({
type: Number
@ -69,7 +66,7 @@ export class DePageFooter extends DeesElement {
right: 0px;
height: 130px;
content: '';
padding: 30px ${unsafeCSS(shared.rightMargin + 'px')} 10px ${unsafeCSS(shared.leftMargin + 'px')};
padding: 30px ${unsafeCSS(plugins.shared.rightMargin + 'px')} 10px ${unsafeCSS(plugins.shared.leftMargin + 'px')};
grid-template-columns: calc(100% / 4) calc(100% / 4) calc(100% / 4) calc(100% / 4);
grid-gap: 5px;
border-top: 2px solid #e4002b;
@ -78,7 +75,7 @@ export class DePageFooter extends DeesElement {
.bottomstripe .pageNumber {
position: absolute;
top: 0px;
right: ${unsafeCSS(shared.rightMargin + 'px')};
right: ${unsafeCSS(plugins.shared.rightMargin + 'px')};
background: #e4002b;
padding: 3px;
font-size: 9px;
@ -89,7 +86,7 @@ export class DePageFooter extends DeesElement {
.bottomstripe .documentTitle {
position: absolute;
top: -18px;
right: ${unsafeCSS(shared.rightMargin + 'px')};
right: ${unsafeCSS(plugins.shared.rightMargin + 'px')};
background: #dddddd;
padding: 3px;
font-size: 9px;
@ -104,26 +101,26 @@ export class DePageFooter extends DeesElement {
return html`
<div class="bottomstripe">
<div>
<strong>${shared.translation.translate(this.documentSettings.languageCode, 'address', 'Address')}:</strong><br />
<strong>${plugins.shared.translation.translate(this.documentSettings.languageCode, 'address', 'Address')}:</strong><br />
${this.letterData.from.name}<br />
${this.letterData.from.address.streetName} ${this.letterData.from.address.houseNumber}<br />
${this.letterData.from.address.postalCode} ${this.letterData.from.address.city}<br />
${this.letterData.from.address.country}
</div>
<div>
<strong>${shared.translation.translate(this.documentSettings.languageCode, 'registrationInfo', 'Registration Info')}:</strong><br />
<strong>${plugins.shared.translation.translate(this.documentSettings.languageCode, 'registrationInfo', 'Registration Info')}:</strong><br />
Amtsgericht Bremen<br />
<i>reg-#:</i> HRB 35230 HB<br />
<i>vat-id:</i> ${this.letterData.from.vatId}
</div>
<div>
<strong>${shared.translation.translate(this.documentSettings.languageCode, 'contactInfo', 'Contact Info')}:</strong><br />
<strong>${plugins.shared.translation.translate(this.documentSettings.languageCode, 'contactInfo', 'Contact Info')}:</strong><br />
<i>email:</i> ${this.letterData.from.email}<br />
<i>phone:</i> ${this.letterData.from.phone}<br />
<i>fax:</i> ${this.letterData.from.fax}
</div>
<div>
<strong>${shared.translation.translate(this.documentSettings.languageCode, 'bankConnection', 'Bank Connection')}:</strong><br />
<strong>${plugins.shared.translation.translate(this.documentSettings.languageCode, 'bankConnection', 'Bank Connection')}:</strong><br />
<i>beneficiary:</i> ${this.letterData?.from?.name}<br />
<i>institution:</i> ${this.letterData?.from?.sepaConnection?.institution}<br />
<i>iban:</i> ${this.letterData?.from?.sepaConnection?.iban}<br />

13
ts_web/elements/pageheader.ts
View File

@ -10,10 +10,7 @@ import {
domtools
} from '@design.estate/dees-element';
import * as interfaces from '../../ts/interfaces/index.js';
import * as shared from '../../ts/shared/index.js';
import * as tsclass from '@tsclass/tsclass';
import * as plugins from '../plugins.js';
declare global {
interface HTMLElementTagNameMap {
@ -30,13 +27,13 @@ export class DePageHeader extends DeesElement {
@property({
type: Object,
})
public letterData: tsclass.business.ILetter = null;
public letterData: plugins.tsclass.business.ILetter = null;
@property({
type: Object,
reflect: true,
})
documentSettings: interfaces.IDocumentSettings;
documentSettings: plugins.shared.interfaces.IDocumentSettings;
@property({
type: Number,
@ -76,7 +73,7 @@ export class DePageHeader extends DeesElement {
overflow: hidden;
top: 130px;
left: auto;
right: ${unsafeCSS(shared.rightMargin + 'px')};
right: ${unsafeCSS(plugins.shared.rightMargin + 'px')};
height: 20px;
line-height: 20px;
color: #333;
@ -87,7 +84,7 @@ export class DePageHeader extends DeesElement {
bottom: 10px;
height: 25px;
left: auto;
right: ${unsafeCSS(shared.rightMargin + 'px')};
right: ${unsafeCSS(plugins.shared.rightMargin + 'px')};
font-family: 'Courier New', Courier, monospace;
}
.topstripe .logo img {

4
ts_web/elements/viewer.demo.ts
View File

@ -1,6 +1,6 @@
import { html } from '@design.estate/dees-element';
import * as shared from '../../ts/shared/index.js';
import * as plugins from '../plugins.js';
export const demoFunc = () => html`
<dedocument-viewer .letterData=${shared.demoLetter} .documentSettings=${shared.demoDocumentSettings}></dedocument-viewer>
<dedocument-viewer .letterData=${plugins.shared.demoLetter} .documentSettings=${plugins.shared.demoDocumentSettings}></dedocument-viewer>
`;

3
ts_web/elements/viewer.ts
View File

@ -1,5 +1,4 @@
import * as plugins from '../plugins.js';
import * as interfaces from '../../ts/interfaces/index.js';
import { DeesElement, css, cssManager, customElement, html } from '@design.estate/dees-element';
import { demoFunc } from './viewer.demo.js';
@ -18,7 +17,7 @@ export class DeDocumentViewer extends DeesElement {
// INSTANCE
public letterData: plugins.tsclass.business.ILetter = null;
public documentSettings: interfaces.IDocumentSettings;
public documentSettings: plugins.shared.interfaces.IDocumentSettings;
public static styles = [
cssManager.defaultStyles,

5
ts_web/plugins.ts
View File

@ -1,3 +1,8 @@
// dees-document scope
import * as shared from '../dist_ts_shared/index.js';
export { shared };
// tsclass scope
import * as tsclass from '@tsclass/tsclass';

3
ts_web/tspublish.json Normal file
View File

@ -0,0 +1,3 @@
{
"order": 3
}