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

update

Browse Source
This commit is contained in:
Philipp Kunz
2024-12-05 01:33:16 +01:00
parent 9517687902
commit f2d585ed36
12 changed files with 97 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
ts_web/elements/contentinvoice.ts
View File

@ -59,6 +59,7 @@ export class DeContentInvoice extends DeesElement {
css`
:host {
color: #333;
font-family: inherit;
}
.trimmedContent {
@ -204,7 +205,7 @@ export class DeContentInvoice extends DeesElement {
<style>
.grid {
display: grid;
grid-template-columns: 40px auto 80px 80px 90px 90px;
grid-template-columns: 40px auto 60px 60px 84px 84px 46px;
}
.topLine {
margin-top: 5px;
@ -214,6 +215,12 @@ export class DeContentInvoice extends DeesElement {
.lineItem {
font-size: 12px;
padding: 5px;
font-family: 'Dees Code', monospace;
border-right: 1px dashed #ccc;
}
.lineItem.rightAlign {
text-align: right;
}
.invoiceLine {
@ -224,6 +231,7 @@ export class DeContentInvoice extends DeesElement {
margin-top: 5px;
font-size: 12px;
padding-left: 50%;
font-family: 'Dees Code', monospace;
}
.sums .sumline {
@ -279,26 +287,30 @@ 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">${plugins.shared.translation.translate(this.documentSettings.languageCode, 'itemPos', 'Item Pos.')}</div>
<div class="lineItem rightAlign">${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 rightAlign">${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 class="lineItem rightAlign">${plugins.shared.translation.translate(this.documentSettings.languageCode, 'unitNetPrice', 'Unit Net Price')}</div>
<div class="lineItem rightAlign">${plugins.shared.translation.translate(this.documentSettings.languageCode, 'totalNetPrice', 'Total Net Price')}</div>
<div class="lineItem rightAlign">${plugins.shared.translation.translate(this.documentSettings.languageCode, 'vatShort', 'VAT')}</div>
</div>
${(() => {
let counter = 1;
return this.letterData?.content.invoiceData?.items?.map(
(invoiceItem) => html`
<div class="grid invoiceLine needsDataHeader">
<div class="lineItem">${counter++}</div>
<div class="lineItem rightAlign">${counter++}</div>
<div class="lineItem">${invoiceItem.name}</div>
<div class="lineItem">${invoiceItem.unitQuantity}</div>
<div class="lineItem rightAlign">${invoiceItem.unitQuantity}</div>
<div class="lineItem">${invoiceItem.unitType}</div>
<div class="lineItem">${invoiceItem.unitNetPrice} ${this.letterData?.content.invoiceData.currency}</div>
<div class="lineItem">
<div class="lineItem rightAlign">${invoiceItem.unitNetPrice} ${this.letterData?.content.invoiceData.currency}</div>
<div class="lineItem rightAlign">
${invoiceItem.unitQuantity * invoiceItem.unitNetPrice} ${this.letterData?.content.invoiceData.currency}
</div>
<div class="lineItem rightAlign">
${invoiceItem.vatPercentage}%
</div>
</div>
`
);
@ -317,8 +329,10 @@ export class DeContentInvoice extends DeesElement {
return html`
<div class="sumline">
<div class="label">
Vat ${vatGroupArg.vatPercentage}%<br />
<span style="font-weight: normal">(on item positions: ${itemNumbers})</span>
Vat ${vatGroupArg.vatPercentage}%
${this.documentSettings.vatGroupPositions ? html`
<br /><span style="font-weight: normal">(on item positions: ${itemNumbers})</span>
` : html``}
</div>
<div class="value">${vatGroupArg.vatAmountSum} EUR</div>
</div>

23
ts_web/elements/document.ts
View File

@ -16,6 +16,8 @@ export const defaultDocumentSettings: plugins.shared.interfaces.IDocumentSetting
enableTopDraftText: true,
enableDefaultHeader: true,
enableDefaultFooter: true,
languageCode: 'EN',
vatGroupPositions: true,
};
@ -97,6 +99,7 @@ export class DeDocument extends DeesElement {
color: #333;
padding: 0px;
position: relative;
font-family: 'Dees Sans', sans-serif;
}
.betweenPagesSpacer {
@ -112,6 +115,12 @@ export class DeDocument extends DeesElement {
}
public async firstUpdated(_changedProperties: Map<string | number | symbol, unknown>) {
domtools.plugins.smartdelay.delayFor(0).then(() => {
this.documentSettings = {
...defaultDocumentSettings,
...this.documentSettings,
}
});
const resizeObserver = new ResizeObserver((entries) => {
for (const entry of entries) {
const width = entry.contentRect.width;
@ -126,13 +135,19 @@ export class DeDocument extends DeesElement {
})
}
public latestDocumentSettings: plugins.shared.interfaces.IDocumentSettings = null;
public latestRenderedLetterData: plugins.tsclass.business.ILetter = null;
public async renderDocument() {
const domtools = await this.domtoolsPromise;
this.latestDocumentSettings = this.documentSettings;
this.latestRenderedLetterData = this.letterData;
console.log(`rendering with settings:`);
console.log(this.latestDocumentSettings);
const domtools = await this.domtoolsPromise;
const documentBuildContainer = document.createElement('div');
document.body.appendChild(documentBuildContainer);
@ -199,13 +214,13 @@ export class DeDocument extends DeesElement {
}
}
this.adjustDePageScaling();
this.latestRenderedLetterData = this.letterData;
}
async updated(changedProperties: Map<string | number | symbol, unknown>): Promise<void> {
super.updated(changedProperties);
const domtools = await this.domtoolsPromise;
const renderedDocIsUpToDate = domtools.convenience.smartjson.deepEqualObjects(this.letterData, this.latestRenderedLetterData);
let renderedDocIsUpToDate = domtools.convenience.smartjson.deepEqualObjects(this.letterData, this.latestRenderedLetterData)
&& domtools.convenience.smartjson.deepEqualObjects(this.documentSettings, this.latestDocumentSettings);
if (!renderedDocIsUpToDate) {
this.renderDocument();
}

1
ts_web/elements/page.ts
View File

@ -77,6 +77,7 @@ export class DePage extends DeesElement {
css`
:host {
display: block;
font-family: inherit;
}
#scaleWrapper {

1
ts_web/elements/pagecontent.ts
View File

@ -49,6 +49,7 @@ export class DePageContent extends DeesElement {
css`
:host {
color: #333;
font-family: inherit;
}
.content {