Compare commits
9 Commits
Author | SHA1 | Date | |
---|---|---|---|
784fe9ca74 | |||
83efcdd2b8 | |||
f2d585ed36 | |||
9517687902 | |||
b5d3a72733 | |||
08baae7b9c | |||
c949f1b968 | |||
249d44d5fc | |||
de02e015e8 |
@ -6,8 +6,8 @@ on:
|
|||||||
- '**'
|
- '**'
|
||||||
|
|
||||||
env:
|
env:
|
||||||
IMAGE: registry.gitlab.com/hosttoday/ht-docker-node:npmci
|
IMAGE: code.foss.global/hosttoday/ht-docker-node:npmci
|
||||||
NPMCI_COMPUTED_REPOURL: https://${{gitea.repository_owner}}:${{secrets.GITEA_TOKEN}}@gitea.lossless.digital/${{gitea.repository}}.git
|
NPMCI_COMPUTED_REPOURL: https://${{gitea.repository_owner}}:${{secrets.GITEA_TOKEN}}@/${{gitea.repository}}.git
|
||||||
NPMCI_TOKEN_NPM: ${{secrets.NPMCI_TOKEN_NPM}}
|
NPMCI_TOKEN_NPM: ${{secrets.NPMCI_TOKEN_NPM}}
|
||||||
NPMCI_TOKEN_NPM2: ${{secrets.NPMCI_TOKEN_NPM2}}
|
NPMCI_TOKEN_NPM2: ${{secrets.NPMCI_TOKEN_NPM2}}
|
||||||
NPMCI_GIT_GITHUBTOKEN: ${{secrets.NPMCI_GIT_GITHUBTOKEN}}
|
NPMCI_GIT_GITHUBTOKEN: ${{secrets.NPMCI_GIT_GITHUBTOKEN}}
|
||||||
@ -26,7 +26,7 @@ jobs:
|
|||||||
- name: Install pnpm and npmci
|
- name: Install pnpm and npmci
|
||||||
run: |
|
run: |
|
||||||
pnpm install -g pnpm
|
pnpm install -g pnpm
|
||||||
pnpm install -g @shipzone/npmci
|
pnpm install -g @ship.zone/npmci
|
||||||
|
|
||||||
- name: Run npm prepare
|
- name: Run npm prepare
|
||||||
run: npmci npm prepare
|
run: npmci npm prepare
|
||||||
|
@ -6,8 +6,8 @@ on:
|
|||||||
- '*'
|
- '*'
|
||||||
|
|
||||||
env:
|
env:
|
||||||
IMAGE: registry.gitlab.com/hosttoday/ht-docker-node:npmci
|
IMAGE: code.foss.global/hosttoday/ht-docker-node:npmci
|
||||||
NPMCI_COMPUTED_REPOURL: https://${{gitea.repository_owner}}:${{secrets.GITEA_TOKEN}}@gitea.lossless.digital/${{gitea.repository}}.git
|
NPMCI_COMPUTED_REPOURL: https://${{gitea.repository_owner}}:${{secrets.GITEA_TOKEN}}@/${{gitea.repository}}.git
|
||||||
NPMCI_TOKEN_NPM: ${{secrets.NPMCI_TOKEN_NPM}}
|
NPMCI_TOKEN_NPM: ${{secrets.NPMCI_TOKEN_NPM}}
|
||||||
NPMCI_TOKEN_NPM2: ${{secrets.NPMCI_TOKEN_NPM2}}
|
NPMCI_TOKEN_NPM2: ${{secrets.NPMCI_TOKEN_NPM2}}
|
||||||
NPMCI_GIT_GITHUBTOKEN: ${{secrets.NPMCI_GIT_GITHUBTOKEN}}
|
NPMCI_GIT_GITHUBTOKEN: ${{secrets.NPMCI_GIT_GITHUBTOKEN}}
|
||||||
@ -26,7 +26,7 @@ jobs:
|
|||||||
- name: Prepare
|
- name: Prepare
|
||||||
run: |
|
run: |
|
||||||
pnpm install -g pnpm
|
pnpm install -g pnpm
|
||||||
pnpm install -g @shipzone/npmci
|
pnpm install -g @ship.zone/npmci
|
||||||
npmci npm prepare
|
npmci npm prepare
|
||||||
|
|
||||||
- name: Audit production dependencies
|
- name: Audit production dependencies
|
||||||
@ -54,7 +54,7 @@ jobs:
|
|||||||
- name: Prepare
|
- name: Prepare
|
||||||
run: |
|
run: |
|
||||||
pnpm install -g pnpm
|
pnpm install -g pnpm
|
||||||
pnpm install -g @shipzone/npmci
|
pnpm install -g @ship.zone/npmci
|
||||||
npmci npm prepare
|
npmci npm prepare
|
||||||
|
|
||||||
- name: Test stable
|
- name: Test stable
|
||||||
@ -82,7 +82,7 @@ jobs:
|
|||||||
- name: Prepare
|
- name: Prepare
|
||||||
run: |
|
run: |
|
||||||
pnpm install -g pnpm
|
pnpm install -g pnpm
|
||||||
pnpm install -g @shipzone/npmci
|
pnpm install -g @ship.zone/npmci
|
||||||
npmci npm prepare
|
npmci npm prepare
|
||||||
|
|
||||||
- name: Release
|
- name: Release
|
||||||
@ -104,7 +104,7 @@ jobs:
|
|||||||
- name: Prepare
|
- name: Prepare
|
||||||
run: |
|
run: |
|
||||||
pnpm install -g pnpm
|
pnpm install -g pnpm
|
||||||
pnpm install -g @shipzone/npmci
|
pnpm install -g @ship.zone/npmci
|
||||||
npmci npm prepare
|
npmci npm prepare
|
||||||
|
|
||||||
- name: Code quality
|
- name: Code quality
|
||||||
|
1
.gitignore
vendored
1
.gitignore
vendored
@ -3,7 +3,6 @@
|
|||||||
# artifacts
|
# artifacts
|
||||||
coverage/
|
coverage/
|
||||||
public/
|
public/
|
||||||
pages/
|
|
||||||
|
|
||||||
# installs
|
# installs
|
||||||
node_modules/
|
node_modules/
|
||||||
|
2
.npmrc
2
.npmrc
@ -1 +1 @@
|
|||||||
registry=https://verdaccio.nevermind.cloud/
|
registry=https://registry.npmjs.org/
|
||||||
|
25
changelog.md
25
changelog.md
@ -1,5 +1,30 @@
|
|||||||
# Changelog
|
# Changelog
|
||||||
|
|
||||||
|
## 2024-12-05 - 1.6.0 - feat(documentSettings + translations + vat in itemLines)
|
||||||
|
Updated dependencies in package.json
|
||||||
|
|
||||||
|
- Updated @types/node to version ^22.10.1
|
||||||
|
- Updated qrcode package to version ^1.5.4
|
||||||
|
|
||||||
|
## 2024-12-02 - 1.5.3 - fix(elements)
|
||||||
|
Update viewer attributes and fix font integration
|
||||||
|
|
||||||
|
- Updated viewer.ts to add missing property decorators for letterData and documentSettings.
|
||||||
|
- Fixed font loading by correcting URLs in index.html.
|
||||||
|
- Set demoDocumentSettings default header and footer to false.
|
||||||
|
|
||||||
|
## 2024-12-02 - 1.5.2 - fix(workflow)
|
||||||
|
Corrected Docker image references and package scope in YAML workflows for compatibility.
|
||||||
|
|
||||||
|
- Updated Docker image reference from GitLab to code.foss.global for npmci UI workflows.
|
||||||
|
- Fixed npm package scope for `@shipzone/npmci` in YAML workflows.
|
||||||
|
- Minor formatting corrections for better code readability.
|
||||||
|
|
||||||
|
## 2024-12-02 - 1.5.1 - fix(package)
|
||||||
|
Fix duplicate node export in package.json
|
||||||
|
|
||||||
|
- Resolved a duplication issue with the './node' export in package.json exports field.
|
||||||
|
|
||||||
## 2024-12-02 - 1.5.0 - feat(core)
|
## 2024-12-02 - 1.5.0 - feat(core)
|
||||||
Refactor project structure for better modularity and code organization
|
Refactor project structure for better modularity and code organization
|
||||||
|
|
||||||
|
@ -1,6 +1,3 @@
|
|||||||
<!--gitzone element-->
|
|
||||||
<!-- made by Task Venture Capital GmbH -->
|
|
||||||
<!-- checkout https://maintainedby.lossless.com for awesome OpenSource projects -->
|
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<!--Lets set some basic meta tags-->
|
<!--Lets set some basic meta tags-->
|
||||||
|
11
package.json
11
package.json
@ -1,12 +1,13 @@
|
|||||||
{
|
{
|
||||||
"name": "@design.estate/dees-document",
|
"name": "@design.estate/dees-document",
|
||||||
"version": "1.5.0",
|
"version": "1.6.0",
|
||||||
"private": false,
|
"private": false,
|
||||||
"description": "A sophisticated framework for dynamically generating and rendering business documents like invoices with modern web technologies, featuring PDF creation, templating, and automation.",
|
"description": "A sophisticated framework for dynamically generating and rendering business documents like invoices with modern web technologies, featuring PDF creation, templating, and automation.",
|
||||||
"main": "dist_ts_web/index.js",
|
"main": "dist_ts_web/index.js",
|
||||||
"typings": "dist_ts_web/index.d.ts",
|
"typings": "dist_ts_web/index.d.ts",
|
||||||
"exports": {
|
"exports": {
|
||||||
".": "./dist_ts/index.js",
|
".": "./dist_ts/index.js",
|
||||||
|
"./node": "./dist_ts/index.js",
|
||||||
"./web": "./dist_ts_web/index.js",
|
"./web": "./dist_ts_web/index.js",
|
||||||
"./shared": "./dist_ts_shared/index.js",
|
"./shared": "./dist_ts_shared/index.js",
|
||||||
"./interfaces": "./dist_ts_shared/interfaces/index.js"
|
"./interfaces": "./dist_ts_shared/interfaces/index.js"
|
||||||
@ -38,7 +39,7 @@
|
|||||||
"@git.zone/tsbuild": "^2.2.0",
|
"@git.zone/tsbuild": "^2.2.0",
|
||||||
"@git.zone/tsbundle": "^2.1.0",
|
"@git.zone/tsbundle": "^2.1.0",
|
||||||
"@git.zone/tstest": "^1.0.90",
|
"@git.zone/tstest": "^1.0.90",
|
||||||
"@git.zone/tswatch": "^2.0.25",
|
"@git.zone/tswatch": "^2.0.34",
|
||||||
"@push.rocks/projectinfo": "^5.0.2",
|
"@push.rocks/projectinfo": "^5.0.2",
|
||||||
"@push.rocks/tapbundle": "^5.5.3"
|
"@push.rocks/tapbundle": "^5.5.3"
|
||||||
},
|
},
|
||||||
@ -60,12 +61,12 @@
|
|||||||
"type": "module",
|
"type": "module",
|
||||||
"repository": {
|
"repository": {
|
||||||
"type": "git",
|
"type": "git",
|
||||||
"url": "git+https://gitlab.com/designestate/private/dedocument-catalog.git"
|
"url": "git+https://code.foss.global/designestate/private/dedocument-catalog.git"
|
||||||
},
|
},
|
||||||
"bugs": {
|
"bugs": {
|
||||||
"url": "https://gitlab.com/designestate/private/dedocument-catalog/issues"
|
"url": "https://code.foss.global/designestate/private/dedocument-catalog/issues"
|
||||||
},
|
},
|
||||||
"homepage": "https://gitlab.com/designestate/private/dedocument-catalog#readme",
|
"homepage": "https://code.foss.global/designestate/private/dedocument-catalog#readme",
|
||||||
"keywords": [
|
"keywords": [
|
||||||
"document generation",
|
"document generation",
|
||||||
"invoice automation",
|
"invoice automation",
|
||||||
|
13
pnpm-lock.yaml
generated
13
pnpm-lock.yaml
generated
@ -58,8 +58,8 @@ importers:
|
|||||||
specifier: ^1.0.90
|
specifier: ^1.0.90
|
||||||
version: 1.0.90(@aws-sdk/client-sso-oidc@3.699.0(@aws-sdk/client-sts@3.699.0))(@aws-sdk/credential-providers@3.699.0(@aws-sdk/client-sso-oidc@3.699.0(@aws-sdk/client-sts@3.699.0)))(socks@2.8.3)
|
version: 1.0.90(@aws-sdk/client-sso-oidc@3.699.0(@aws-sdk/client-sts@3.699.0))(@aws-sdk/credential-providers@3.699.0(@aws-sdk/client-sso-oidc@3.699.0(@aws-sdk/client-sts@3.699.0)))(socks@2.8.3)
|
||||||
'@git.zone/tswatch':
|
'@git.zone/tswatch':
|
||||||
specifier: ^2.0.25
|
specifier: ^2.0.34
|
||||||
version: 2.0.25
|
version: 2.0.34
|
||||||
'@push.rocks/projectinfo':
|
'@push.rocks/projectinfo':
|
||||||
specifier: ^5.0.2
|
specifier: ^5.0.2
|
||||||
version: 5.0.2
|
version: 5.0.2
|
||||||
@ -607,8 +607,8 @@ packages:
|
|||||||
resolution: {integrity: sha512-McytXK46GiReEps7wHWW6zOHYCFF4sywjj6auHjhGqzOogA2Wju1YtZRL+o+OAUb61kQxNFRras6Xg/4Zth0Bw==}
|
resolution: {integrity: sha512-McytXK46GiReEps7wHWW6zOHYCFF4sywjj6auHjhGqzOogA2Wju1YtZRL+o+OAUb61kQxNFRras6Xg/4Zth0Bw==}
|
||||||
hasBin: true
|
hasBin: true
|
||||||
|
|
||||||
'@git.zone/tswatch@2.0.25':
|
'@git.zone/tswatch@2.0.34':
|
||||||
resolution: {integrity: sha512-2A2TzJhw5AHI2BUOEjtZJzNgmRDMKZc4+p+yCdgj3mYcD7l1XeM6HTTcyRTxGDrDXggVIWN1O+UxU6ftHg94ag==}
|
resolution: {integrity: sha512-nwrJffX3aAf8DOfbWPXErskn4RTdQVaE4WLnV8QEU2WdNehI3KQCdVPYHcskl7eqatjbZdQEck39DItmNacGxw==}
|
||||||
hasBin: true
|
hasBin: true
|
||||||
|
|
||||||
'@hapi/bourne@3.0.0':
|
'@hapi/bourne@3.0.0':
|
||||||
@ -5070,7 +5070,7 @@ snapshots:
|
|||||||
- supports-color
|
- supports-color
|
||||||
- utf-8-validate
|
- utf-8-validate
|
||||||
|
|
||||||
'@git.zone/tswatch@2.0.25':
|
'@git.zone/tswatch@2.0.34':
|
||||||
dependencies:
|
dependencies:
|
||||||
'@api.global/typedserver': 3.0.51
|
'@api.global/typedserver': 3.0.51
|
||||||
'@git.zone/tsbundle': 2.1.0
|
'@git.zone/tsbundle': 2.1.0
|
||||||
@ -5080,12 +5080,15 @@ snapshots:
|
|||||||
'@push.rocks/smartchok': 1.0.34
|
'@push.rocks/smartchok': 1.0.34
|
||||||
'@push.rocks/smartcli': 4.0.11
|
'@push.rocks/smartcli': 4.0.11
|
||||||
'@push.rocks/smartdelay': 3.0.5
|
'@push.rocks/smartdelay': 3.0.5
|
||||||
|
'@push.rocks/smartfile': 11.0.21
|
||||||
'@push.rocks/smartlog': 3.0.7
|
'@push.rocks/smartlog': 3.0.7
|
||||||
'@push.rocks/smartlog-destination-local': 9.0.2
|
'@push.rocks/smartlog-destination-local': 9.0.2
|
||||||
'@push.rocks/smartshell': 3.0.6
|
'@push.rocks/smartshell': 3.0.6
|
||||||
'@push.rocks/taskbuffer': 3.1.7
|
'@push.rocks/taskbuffer': 3.1.7
|
||||||
transitivePeerDependencies:
|
transitivePeerDependencies:
|
||||||
|
- bufferutil
|
||||||
- supports-color
|
- supports-color
|
||||||
|
- utf-8-validate
|
||||||
|
|
||||||
'@hapi/bourne@3.0.0': {}
|
'@hapi/bourne@3.0.0': {}
|
||||||
|
|
||||||
|
54
readme.md
54
readme.md
@ -47,48 +47,48 @@ import { ILetter } from '@design.estate/dees-document';
|
|||||||
|
|
||||||
const invoiceTemplate: ILetter = {
|
const invoiceTemplate: ILetter = {
|
||||||
from: {
|
from: {
|
||||||
name: "Your Company Name",
|
name: 'Your Company Name',
|
||||||
address: {
|
address: {
|
||||||
streetName: "Your Street",
|
streetName: 'Your Street',
|
||||||
houseNumber: "123",
|
houseNumber: '123',
|
||||||
city: "Your City",
|
city: 'Your City',
|
||||||
country: "Your Country",
|
country: 'Your Country',
|
||||||
postalCode: "12345",
|
postalCode: '12345',
|
||||||
},
|
},
|
||||||
email: "your-email@example.com",
|
email: 'your-email@example.com',
|
||||||
phone: "123-456-7890",
|
phone: '123-456-7890',
|
||||||
},
|
},
|
||||||
to: {
|
to: {
|
||||||
name: "Recipient Company Name",
|
name: 'Recipient Company Name',
|
||||||
address: {
|
address: {
|
||||||
streetName: "Recipient Street",
|
streetName: 'Recipient Street',
|
||||||
houseNumber: "456",
|
houseNumber: '456',
|
||||||
city: "Recipient City",
|
city: 'Recipient City',
|
||||||
country: "Recipient Country",
|
country: 'Recipient Country',
|
||||||
postalCode: "67890",
|
postalCode: '67890',
|
||||||
},
|
},
|
||||||
email: "recipient-email@example.com",
|
email: 'recipient-email@example.com',
|
||||||
phone: "098-765-4321",
|
phone: '098-765-4321',
|
||||||
},
|
},
|
||||||
content: {
|
content: {
|
||||||
invoiceData: {
|
invoiceData: {
|
||||||
items: [
|
items: [
|
||||||
{
|
{
|
||||||
name: "Service or Product Name",
|
name: 'Service or Product Name',
|
||||||
unitQuantity: 2,
|
unitQuantity: 2,
|
||||||
unitNetPrice: 100.00,
|
unitNetPrice: 100.0,
|
||||||
unitType: 'service',
|
unitType: 'service',
|
||||||
vatPercentage: 19,
|
vatPercentage: 19,
|
||||||
currency: 'EUR',
|
currency: 'EUR',
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
subject: "Invoice for Services Rendered",
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
subject: 'Invoice for Services Rendered',
|
||||||
date: new Date().getTime(),
|
date: new Date().getTime(),
|
||||||
versionInfo: {
|
versionInfo: {
|
||||||
type: "final",
|
type: 'final',
|
||||||
version: "1.0.0"
|
version: '1.0.0',
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
```
|
```
|
||||||
@ -133,22 +133,28 @@ This script encompasses initializing services and generating a PDF in a streamli
|
|||||||
`@design.estate/dees-document` provides several advanced functionalities, enabling rich document creation:
|
`@design.estate/dees-document` provides several advanced functionalities, enabling rich document creation:
|
||||||
|
|
||||||
1. **Custom Templates & Styling**
|
1. **Custom Templates & Styling**
|
||||||
|
|
||||||
- Customize the styling through CSS or using inline styles in TypeScript.
|
- Customize the styling through CSS or using inline styles in TypeScript.
|
||||||
- Templates can be adjusted to present different document types (e.g., contracts, reports).
|
- Templates can be adjusted to present different document types (e.g., contracts, reports).
|
||||||
|
|
||||||
2. **Modular Components and Reuse**
|
2. **Modular Components and Reuse**
|
||||||
|
|
||||||
- Utilize modular components to create reusable parts across different documents, enhancing maintainability and reducing redundancy.
|
- Utilize modular components to create reusable parts across different documents, enhancing maintainability and reducing redundancy.
|
||||||
|
|
||||||
3. **Interactive Documents**
|
3. **Interactive Documents**
|
||||||
|
|
||||||
- Integrate interactivities like forms, buttons, and interactive charts within your documents.
|
- Integrate interactivities like forms, buttons, and interactive charts within your documents.
|
||||||
|
|
||||||
4. **Localization Support**
|
4. **Localization Support**
|
||||||
|
|
||||||
- Documents can be localized to support multiple languages, enhancing accessibility and usability.
|
- Documents can be localized to support multiple languages, enhancing accessibility and usability.
|
||||||
|
|
||||||
5. **Responsive and Adaptive Designs**
|
5. **Responsive and Adaptive Designs**
|
||||||
|
|
||||||
- Create documents that adjust layout dynamically depending on print or digital medium, maintaining consistency across platforms.
|
- Create documents that adjust layout dynamically depending on print or digital medium, maintaining consistency across platforms.
|
||||||
|
|
||||||
6. **Security Features**
|
6. **Security Features**
|
||||||
|
|
||||||
- Apply digital signatures and encrypt sensitive documents to ensure secure and authentic document distribution.
|
- Apply digital signatures and encrypt sensitive documents to ensure secure and authentic document distribution.
|
||||||
|
|
||||||
7. **Complex Business Logic**
|
7. **Complex Business Logic**
|
||||||
|
@ -2,8 +2,4 @@ import * as tsclass from '@tsclass/tsclass';
|
|||||||
import * as smartfile from '@push.rocks/smartfile';
|
import * as smartfile from '@push.rocks/smartfile';
|
||||||
import * as path from 'path';
|
import * as path from 'path';
|
||||||
|
|
||||||
export {
|
export { tsclass, smartfile, path };
|
||||||
tsclass,
|
|
||||||
smartfile,
|
|
||||||
path,
|
|
||||||
}
|
|
||||||
|
@ -113,7 +113,7 @@ tap.test('should create an invoice', async () => {
|
|||||||
const pdfResult = await testPdfServiceInstance.createPdfFromLetterObject(optionsArg);
|
const pdfResult = await testPdfServiceInstance.createPdfFromLetterObject(optionsArg);
|
||||||
await plugins.smartfile.memory.toFs(
|
await plugins.smartfile.memory.toFs(
|
||||||
Buffer.from(pdfResult.buffer),
|
Buffer.from(pdfResult.buffer),
|
||||||
plugins.path.join(paths.nogitDir, `test-${counter++}.pdf`)
|
plugins.path.join(paths.nogitDir, `test-${counter++}.pdf`),
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
await saveResult({
|
await saveResult({
|
||||||
|
@ -3,6 +3,6 @@
|
|||||||
*/
|
*/
|
||||||
export const commitinfo = {
|
export const commitinfo = {
|
||||||
name: '@design.estate/dees-document',
|
name: '@design.estate/dees-document',
|
||||||
version: '1.5.0',
|
version: '1.6.0',
|
||||||
description: 'A sophisticated framework for dynamically generating and rendering business documents like invoices with modern web technologies, featuring PDF creation, templating, and automation.'
|
description: 'A sophisticated framework for dynamically generating and rendering business documents like invoices with modern web technologies, featuring PDF creation, templating, and automation.'
|
||||||
}
|
}
|
||||||
|
@ -1,9 +1,7 @@
|
|||||||
import * as plugins from './plugins.js';
|
import * as plugins from './plugins.js';
|
||||||
import * as helpers from './helpers.js';
|
import * as helpers from './helpers.js';
|
||||||
|
|
||||||
export interface IPdfServiceConstructorOptions {
|
export interface IPdfServiceConstructorOptions {}
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* a pdf service for generating pdfs
|
* a pdf service for generating pdfs
|
||||||
@ -44,8 +42,8 @@ export class PdfService {
|
|||||||
* creates an letter
|
* creates an letter
|
||||||
*/
|
*/
|
||||||
public async createPdfFromLetterObject(optionsArg: {
|
public async createPdfFromLetterObject(optionsArg: {
|
||||||
letterData: plugins.tsclass.business.ILetter,
|
letterData: plugins.tsclass.business.ILetter;
|
||||||
documentSettings: plugins.shared.interfaces.IDocumentSettings
|
documentSettings: plugins.shared.interfaces.IDocumentSettings;
|
||||||
}) {
|
}) {
|
||||||
const html = `
|
const html = `
|
||||||
<script type="module">
|
<script type="module">
|
||||||
|
@ -3,4 +3,4 @@ import * as paths from './paths.js';
|
|||||||
|
|
||||||
export const getBundleAsString = async () => {
|
export const getBundleAsString = async () => {
|
||||||
return plugins.smartfile.fs.toStringSync(paths.bundleFile);
|
return plugins.smartfile.fs.toStringSync(paths.bundleFile);
|
||||||
}
|
};
|
||||||
|
@ -1,6 +1,9 @@
|
|||||||
import * as plugins from './plugins.js';
|
import * as plugins from './plugins.js';
|
||||||
|
|
||||||
export const packageDir = plugins.path.join(plugins.smartpath.get.dirnameFromImportMetaUrl(import.meta.url), '../');
|
export const packageDir = plugins.path.join(
|
||||||
|
plugins.smartpath.get.dirnameFromImportMetaUrl(import.meta.url),
|
||||||
|
'../',
|
||||||
|
);
|
||||||
|
|
||||||
export const nogitDir = plugins.path.join(packageDir, '.nogit/');
|
export const nogitDir = plugins.path.join(packageDir, '.nogit/');
|
||||||
plugins.smartfile.fs.ensureDirSync(nogitDir);
|
plugins.smartfile.fs.ensureDirSync(nogitDir);
|
||||||
|
@ -1,9 +1,7 @@
|
|||||||
// node native
|
// node native
|
||||||
import * as path from 'path';
|
import * as path from 'path';
|
||||||
|
|
||||||
export {
|
export { path };
|
||||||
path
|
|
||||||
}
|
|
||||||
|
|
||||||
// dees-document scope
|
// dees-document scope
|
||||||
import * as shared from '../dist_ts_shared/index.js';
|
import * as shared from '../dist_ts_shared/index.js';
|
||||||
@ -16,16 +14,9 @@ import * as smartjson from '@push.rocks/smartjson';
|
|||||||
import * as smartpath from '@push.rocks/smartpath';
|
import * as smartpath from '@push.rocks/smartpath';
|
||||||
import * as smartpdf from '@push.rocks/smartpdf';
|
import * as smartpdf from '@push.rocks/smartpdf';
|
||||||
|
|
||||||
export {
|
export { smartfile, smartpath, smartjson, smartpdf };
|
||||||
smartfile,
|
|
||||||
smartpath,
|
|
||||||
smartjson,
|
|
||||||
smartpdf,
|
|
||||||
}
|
|
||||||
|
|
||||||
// @tsclass scope
|
// @tsclass scope
|
||||||
import * as tsclass from '@tsclass/tsclass';
|
import * as tsclass from '@tsclass/tsclass';
|
||||||
|
|
||||||
export {
|
export { tsclass };
|
||||||
tsclass,
|
|
||||||
}
|
|
||||||
|
@ -5,4 +5,5 @@ export interface IDocumentSettings {
|
|||||||
enableDefaultHeader?: boolean;
|
enableDefaultHeader?: boolean;
|
||||||
enableDefaultFooter?: boolean;
|
enableDefaultFooter?: boolean;
|
||||||
languageCode?: translation.TLanguageCode;
|
languageCode?: translation.TLanguageCode;
|
||||||
|
vatGroupPositions?: boolean;
|
||||||
}
|
}
|
@ -1,2 +1 @@
|
|||||||
export * from './document.js';
|
export * from './document.js';
|
||||||
export * from './translation.js';
|
|
||||||
|
@ -1,19 +0,0 @@
|
|||||||
export interface IDeDocumentTranslations {
|
|
||||||
address: string;
|
|
||||||
bankConnection: string;
|
|
||||||
contactInfo: string;
|
|
||||||
description: string;
|
|
||||||
invoice: string;
|
|
||||||
itemPos: string;
|
|
||||||
quantity: string;
|
|
||||||
registrationInfo: string;
|
|
||||||
reverseVatNote: string;
|
|
||||||
totalNetPrice: string;
|
|
||||||
unitNetPrice: string;
|
|
||||||
unitType: string;
|
|
||||||
yourCustomerId: string;
|
|
||||||
yourVatId: string;
|
|
||||||
continuesOnPage: string;
|
|
||||||
finalPageStatement: string;
|
|
||||||
page: string;
|
|
||||||
}
|
|
@ -1,10 +1,7 @@
|
|||||||
import * as interfaces from './interfaces/index.js';
|
import * as interfaces from './interfaces/index.js';
|
||||||
|
|
||||||
type TTranslationImplementation = {
|
// Define English translations without enforcing TTranslationImplementation yet
|
||||||
[key in keyof interfaces.IDeDocumentTranslations]: string;
|
export const EN_translations = {
|
||||||
}
|
|
||||||
|
|
||||||
export const EN_translations: TTranslationImplementation = {
|
|
||||||
address: 'Address',
|
address: 'Address',
|
||||||
bankConnection: 'Bank Connection',
|
bankConnection: 'Bank Connection',
|
||||||
contactInfo: 'Contact Info',
|
contactInfo: 'Contact Info',
|
||||||
@ -22,8 +19,17 @@ export const EN_translations: TTranslationImplementation = {
|
|||||||
continuesOnPage: 'Continues on page',
|
continuesOnPage: 'Continues on page',
|
||||||
finalPageStatement: 'This is the final page of this document.',
|
finalPageStatement: 'This is the final page of this document.',
|
||||||
page: 'Page',
|
page: 'Page',
|
||||||
|
} as const;
|
||||||
|
|
||||||
|
// Infer keys of EN_translations
|
||||||
|
export type TTranslationKey = keyof typeof EN_translations;
|
||||||
|
|
||||||
|
// Define the type for all translations based on EN_translations keys
|
||||||
|
export type TTranslationImplementation = {
|
||||||
|
[key in TTranslationKey]: string;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Define German translations
|
||||||
export const DE_translations: TTranslationImplementation = {
|
export const DE_translations: TTranslationImplementation = {
|
||||||
address: 'Adresse',
|
address: 'Adresse',
|
||||||
bankConnection: 'Bankverbindung',
|
bankConnection: 'Bankverbindung',
|
||||||
@ -33,9 +39,10 @@ export const DE_translations: TTranslationImplementation = {
|
|||||||
itemPos: 'Pos.',
|
itemPos: 'Pos.',
|
||||||
quantity: 'Anzahl',
|
quantity: 'Anzahl',
|
||||||
registrationInfo: 'HRA/HRB Info',
|
registrationInfo: 'HRA/HRB Info',
|
||||||
reverseVatNote: 'Umkehr der Umsatzsteuerpflicht: Der Rechnungsempfänger ist für die korrekte Abrechnung der Umsatzsteuer zuständig.',
|
reverseVatNote:
|
||||||
totalNetPrice: 'Nettopreis Summe',
|
'Umkehr der Umsatzsteuerpflicht: Der Rechnungsempfänger ist für die korrekte Abrechnung der Umsatzsteuer zuständig.',
|
||||||
unitNetPrice: 'Nettopreis',
|
totalNetPrice: 'Summe netto',
|
||||||
|
unitNetPrice: 'Einheit netto',
|
||||||
unitType: 'Einheit',
|
unitType: 'Einheit',
|
||||||
yourCustomerId: 'Ihre Kundennummer:',
|
yourCustomerId: 'Ihre Kundennummer:',
|
||||||
yourVatId: 'Ihre Umsatzsteuer-ID:',
|
yourVatId: 'Ihre Umsatzsteuer-ID:',
|
||||||
@ -44,6 +51,7 @@ export const DE_translations: TTranslationImplementation = {
|
|||||||
page: 'Seite',
|
page: 'Seite',
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Define Spanish translations
|
||||||
export const ES_translations: TTranslationImplementation = {
|
export const ES_translations: TTranslationImplementation = {
|
||||||
address: 'Dirección',
|
address: 'Dirección',
|
||||||
bankConnection: 'Conexión bancaria',
|
bankConnection: 'Conexión bancaria',
|
||||||
@ -64,6 +72,7 @@ export const ES_translations: TTranslationImplementation = {
|
|||||||
page: 'Página',
|
page: 'Página',
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Define French translations
|
||||||
export const FR_translations: TTranslationImplementation = {
|
export const FR_translations: TTranslationImplementation = {
|
||||||
address: 'Adresse',
|
address: 'Adresse',
|
||||||
bankConnection: 'Coordonnées bancaires',
|
bankConnection: 'Coordonnées bancaires',
|
||||||
@ -72,11 +81,12 @@ export const FR_translations: TTranslationImplementation = {
|
|||||||
invoice: 'Facture',
|
invoice: 'Facture',
|
||||||
itemPos: 'Position',
|
itemPos: 'Position',
|
||||||
quantity: 'Quantité',
|
quantity: 'Quantité',
|
||||||
registrationInfo: 'Informations d\'enregistrement',
|
registrationInfo: "Informations d'enregistrement",
|
||||||
reverseVatNote: 'La TVA s\'applique selon le mécanisme d\'autoliquidation et est à payer par le client.',
|
reverseVatNote:
|
||||||
|
"La TVA s'applique selon le mécanisme d'autoliquidation et est à payer par le client.",
|
||||||
totalNetPrice: 'Prix net total',
|
totalNetPrice: 'Prix net total',
|
||||||
unitNetPrice: 'Prix unitaire net',
|
unitNetPrice: 'Prix unitaire net',
|
||||||
unitType: 'Type d\'unité',
|
unitType: "Type d'unité",
|
||||||
yourCustomerId: 'Votre numéro de client :',
|
yourCustomerId: 'Votre numéro de client :',
|
||||||
yourVatId: 'Votre numéro de TVA :',
|
yourVatId: 'Votre numéro de TVA :',
|
||||||
continuesOnPage: 'Continue sur la page',
|
continuesOnPage: 'Continue sur la page',
|
||||||
@ -84,6 +94,7 @@ export const FR_translations: TTranslationImplementation = {
|
|||||||
page: 'Page',
|
page: 'Page',
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Define Italian translations
|
||||||
export const IT_translations: TTranslationImplementation = {
|
export const IT_translations: TTranslationImplementation = {
|
||||||
address: 'Indirizzo',
|
address: 'Indirizzo',
|
||||||
bankConnection: 'Coordinate bancarie',
|
bankConnection: 'Coordinate bancarie',
|
||||||
@ -93,7 +104,7 @@ export const IT_translations: TTranslationImplementation = {
|
|||||||
itemPos: 'Pos.',
|
itemPos: 'Pos.',
|
||||||
quantity: 'Quantità',
|
quantity: 'Quantità',
|
||||||
registrationInfo: 'Informazioni di registrazione',
|
registrationInfo: 'Informazioni di registrazione',
|
||||||
reverseVatNote: 'L\'IVA è applicata con inversione contabile ed è a carico del cliente.',
|
reverseVatNote: "L'IVA è applicata con inversione contabile ed è a carico del cliente.",
|
||||||
totalNetPrice: 'Prezzo netto totale',
|
totalNetPrice: 'Prezzo netto totale',
|
||||||
unitNetPrice: 'Prezzo netto unitario',
|
unitNetPrice: 'Prezzo netto unitario',
|
||||||
unitType: 'Tipo di unità',
|
unitType: 'Tipo di unità',
|
||||||
@ -104,21 +115,24 @@ export const IT_translations: TTranslationImplementation = {
|
|||||||
page: 'Pagina',
|
page: 'Pagina',
|
||||||
};
|
};
|
||||||
|
|
||||||
export const languageCodeMap = {
|
// Language Code Map
|
||||||
'DE': DE_translations,
|
export const languageCodeMap: Record<string, TTranslationImplementation> = {
|
||||||
'EN': EN_translations,
|
EN: EN_translations,
|
||||||
'ES': ES_translations,
|
DE: DE_translations,
|
||||||
'FR': FR_translations,
|
ES: ES_translations,
|
||||||
'IT': IT_translations,
|
FR: FR_translations,
|
||||||
|
IT: IT_translations,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Language Code Type
|
||||||
export type TLanguageCode = keyof typeof languageCodeMap;
|
export type TLanguageCode = keyof typeof languageCodeMap;
|
||||||
|
|
||||||
export const translate = (languageCode: TLanguageCode, key: string, defaultValue: string) => {
|
// Translate Function
|
||||||
|
export const translate = (
|
||||||
|
languageCode: TLanguageCode,
|
||||||
|
key: TTranslationKey,
|
||||||
|
defaultValue: string
|
||||||
|
): string => {
|
||||||
const translations = languageCodeMap[languageCode] || EN_translations;
|
const translations = languageCodeMap[languageCode] || EN_translations;
|
||||||
if (translations && translations[key]) {
|
return translations[key] || defaultValue;
|
||||||
return translations[key];
|
|
||||||
} else {
|
|
||||||
return defaultValue;
|
|
||||||
}
|
|
||||||
};
|
};
|
@ -3,6 +3,6 @@
|
|||||||
*/
|
*/
|
||||||
export const commitinfo = {
|
export const commitinfo = {
|
||||||
name: '@design.estate/dees-document',
|
name: '@design.estate/dees-document',
|
||||||
version: '1.5.0',
|
version: '1.6.0',
|
||||||
description: 'A sophisticated framework for dynamically generating and rendering business documents like invoices with modern web technologies, featuring PDF creation, templating, and automation.'
|
description: 'A sophisticated framework for dynamically generating and rendering business documents like invoices with modern web technologies, featuring PDF creation, templating, and automation.'
|
||||||
}
|
}
|
||||||
|
@ -59,6 +59,7 @@ export class DeContentInvoice extends DeesElement {
|
|||||||
css`
|
css`
|
||||||
:host {
|
:host {
|
||||||
color: #333;
|
color: #333;
|
||||||
|
font-family: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
.trimmedContent {
|
.trimmedContent {
|
||||||
@ -204,7 +205,7 @@ export class DeContentInvoice extends DeesElement {
|
|||||||
<style>
|
<style>
|
||||||
.grid {
|
.grid {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: 40px auto 80px 80px 90px 90px;
|
grid-template-columns: 40px auto 60px 60px 84px 84px 46px;
|
||||||
}
|
}
|
||||||
.topLine {
|
.topLine {
|
||||||
margin-top: 5px;
|
margin-top: 5px;
|
||||||
@ -214,6 +215,12 @@ export class DeContentInvoice extends DeesElement {
|
|||||||
.lineItem {
|
.lineItem {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
|
font-family: 'Dees Code', monospace;
|
||||||
|
border-right: 1px dashed #ccc;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lineItem.rightAlign {
|
||||||
|
text-align: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
.invoiceLine {
|
.invoiceLine {
|
||||||
@ -224,6 +231,7 @@ export class DeContentInvoice extends DeesElement {
|
|||||||
margin-top: 5px;
|
margin-top: 5px;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
padding-left: 50%;
|
padding-left: 50%;
|
||||||
|
font-family: 'Dees Code', monospace;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sums .sumline {
|
.sums .sumline {
|
||||||
@ -279,26 +287,30 @@ export class DeContentInvoice extends DeesElement {
|
|||||||
</style>
|
</style>
|
||||||
<div>We hereby invoice products and services provided to you by Lossless GmbH:</div>
|
<div>We hereby invoice products and services provided to you by Lossless GmbH:</div>
|
||||||
<div class="grid topLine dataHeader">
|
<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, '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, 'unitType', 'Unit Type')}</div>
|
||||||
<div class="lineItem">${plugins.shared.translation.translate(this.documentSettings.languageCode, 'unitNetPrice', 'Unit Net Price')}</div>
|
<div class="lineItem rightAlign">${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, 'totalNetPrice', 'Total Net Price')}</div>
|
||||||
|
<div class="lineItem rightAlign">${plugins.shared.translation.translate(this.documentSettings.languageCode, 'vatShort', 'VAT')}</div>
|
||||||
</div>
|
</div>
|
||||||
${(() => {
|
${(() => {
|
||||||
let counter = 1;
|
let counter = 1;
|
||||||
return this.letterData?.content.invoiceData?.items?.map(
|
return this.letterData?.content.invoiceData?.items?.map(
|
||||||
(invoiceItem) => html`
|
(invoiceItem) => html`
|
||||||
<div class="grid invoiceLine needsDataHeader">
|
<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.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.unitType}</div>
|
||||||
<div class="lineItem">${invoiceItem.unitNetPrice} ${this.letterData?.content.invoiceData.currency}</div>
|
<div class="lineItem rightAlign">${invoiceItem.unitNetPrice} ${this.letterData?.content.invoiceData.currency}</div>
|
||||||
<div class="lineItem">
|
<div class="lineItem rightAlign">
|
||||||
${invoiceItem.unitQuantity * invoiceItem.unitNetPrice} ${this.letterData?.content.invoiceData.currency}
|
${invoiceItem.unitQuantity * invoiceItem.unitNetPrice} ${this.letterData?.content.invoiceData.currency}
|
||||||
</div>
|
</div>
|
||||||
|
<div class="lineItem rightAlign">
|
||||||
|
${invoiceItem.vatPercentage}%
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
`
|
`
|
||||||
);
|
);
|
||||||
@ -317,8 +329,10 @@ export class DeContentInvoice extends DeesElement {
|
|||||||
return html`
|
return html`
|
||||||
<div class="sumline">
|
<div class="sumline">
|
||||||
<div class="label">
|
<div class="label">
|
||||||
Vat ${vatGroupArg.vatPercentage}%<br />
|
Vat ${vatGroupArg.vatPercentage}%
|
||||||
<span style="font-weight: normal">(on item positions: ${itemNumbers})</span>
|
${this.documentSettings.vatGroupPositions ? html`
|
||||||
|
<br /><span style="font-weight: normal">(on item positions: ${itemNumbers})</span>
|
||||||
|
` : html``}
|
||||||
</div>
|
</div>
|
||||||
<div class="value">${vatGroupArg.vatAmountSum} EUR</div>
|
<div class="value">${vatGroupArg.vatAmountSum} EUR</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -16,6 +16,8 @@ export const defaultDocumentSettings: plugins.shared.interfaces.IDocumentSetting
|
|||||||
enableTopDraftText: true,
|
enableTopDraftText: true,
|
||||||
enableDefaultHeader: true,
|
enableDefaultHeader: true,
|
||||||
enableDefaultFooter: true,
|
enableDefaultFooter: true,
|
||||||
|
languageCode: 'EN',
|
||||||
|
vatGroupPositions: true,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
@ -97,6 +99,7 @@ export class DeDocument extends DeesElement {
|
|||||||
color: #333;
|
color: #333;
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
font-family: 'Dees Sans', sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
.betweenPagesSpacer {
|
.betweenPagesSpacer {
|
||||||
@ -112,6 +115,12 @@ export class DeDocument extends DeesElement {
|
|||||||
}
|
}
|
||||||
|
|
||||||
public async firstUpdated(_changedProperties: Map<string | number | symbol, unknown>) {
|
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) => {
|
const resizeObserver = new ResizeObserver((entries) => {
|
||||||
for (const entry of entries) {
|
for (const entry of entries) {
|
||||||
const width = entry.contentRect.width;
|
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 latestRenderedLetterData: plugins.tsclass.business.ILetter = null;
|
||||||
|
|
||||||
|
|
||||||
public async renderDocument() {
|
public async renderDocument() {
|
||||||
|
|
||||||
|
this.latestDocumentSettings = this.documentSettings;
|
||||||
|
this.latestRenderedLetterData = this.letterData;
|
||||||
|
|
||||||
|
console.log(`rendering with settings:`);
|
||||||
|
console.log(this.latestDocumentSettings);
|
||||||
|
|
||||||
const domtools = await this.domtoolsPromise;
|
const domtools = await this.domtoolsPromise;
|
||||||
|
|
||||||
|
|
||||||
const documentBuildContainer = document.createElement('div');
|
const documentBuildContainer = document.createElement('div');
|
||||||
document.body.appendChild(documentBuildContainer);
|
document.body.appendChild(documentBuildContainer);
|
||||||
|
|
||||||
@ -199,13 +214,13 @@ export class DeDocument extends DeesElement {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.adjustDePageScaling();
|
this.adjustDePageScaling();
|
||||||
this.latestRenderedLetterData = this.letterData;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
async updated(changedProperties: Map<string | number | symbol, unknown>): Promise<void> {
|
async updated(changedProperties: Map<string | number | symbol, unknown>): Promise<void> {
|
||||||
super.updated(changedProperties);
|
super.updated(changedProperties);
|
||||||
const domtools = await this.domtoolsPromise;
|
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) {
|
if (!renderedDocIsUpToDate) {
|
||||||
this.renderDocument();
|
this.renderDocument();
|
||||||
}
|
}
|
||||||
|
@ -77,6 +77,7 @@ export class DePage extends DeesElement {
|
|||||||
css`
|
css`
|
||||||
:host {
|
:host {
|
||||||
display: block;
|
display: block;
|
||||||
|
font-family: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
#scaleWrapper {
|
#scaleWrapper {
|
||||||
|
@ -49,6 +49,7 @@ export class DePageContent extends DeesElement {
|
|||||||
css`
|
css`
|
||||||
:host {
|
:host {
|
||||||
color: #333;
|
color: #333;
|
||||||
|
font-family: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
import * as plugins from '../plugins.js';
|
import * as plugins from '../plugins.js';
|
||||||
|
|
||||||
import { DeesElement, css, cssManager, customElement, html } from '@design.estate/dees-element';
|
import { DeesElement, css, cssManager, customElement, html, property } from '@design.estate/dees-element';
|
||||||
import { demoFunc } from './viewer.demo.js';
|
import { demoFunc } from './viewer.demo.js';
|
||||||
|
|
||||||
declare global {
|
declare global {
|
||||||
@ -15,8 +15,16 @@ export class DeDocumentViewer extends DeesElement {
|
|||||||
public static demo = demoFunc;
|
public static demo = demoFunc;
|
||||||
|
|
||||||
// INSTANCE
|
// INSTANCE
|
||||||
|
@property({
|
||||||
|
type: Object,
|
||||||
|
reflect: true,
|
||||||
|
})
|
||||||
public letterData: plugins.tsclass.business.ILetter = null;
|
public letterData: plugins.tsclass.business.ILetter = null;
|
||||||
|
|
||||||
|
@property({
|
||||||
|
type: Object,
|
||||||
|
reflect: true,
|
||||||
|
})
|
||||||
public documentSettings: plugins.shared.interfaces.IDocumentSettings;
|
public documentSettings: plugins.shared.interfaces.IDocumentSettings;
|
||||||
|
|
||||||
public static styles = [
|
public static styles = [
|
||||||
|
2
ts_web/pages/index.ts
Normal file
2
ts_web/pages/index.ts
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
export * from './page1.js';
|
||||||
|
export * from './page2.js';
|
17
ts_web/pages/page1.ts
Normal file
17
ts_web/pages/page1.ts
Normal file
@ -0,0 +1,17 @@
|
|||||||
|
import * as plugins from '../plugins.js';
|
||||||
|
import { html } from '@design.estate/dees-element';
|
||||||
|
|
||||||
|
export const page1 = () => html`
|
||||||
|
<style>
|
||||||
|
dedocument-dedocument {
|
||||||
|
margin: 16px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<dedocument-dedocument .printMode=${false} letterData=${plugins.smartjson.stringifyBase64({
|
||||||
|
...plugins.shared.demoLetter,
|
||||||
|
from: {
|
||||||
|
...plugins.shared.demoLetter.from,
|
||||||
|
description: 'a string set via stringified JSON'
|
||||||
|
}
|
||||||
|
} as plugins.tsclass.business.ILetter)}> </dedocument-dedocument>
|
||||||
|
`;
|
18
ts_web/pages/page2.ts
Normal file
18
ts_web/pages/page2.ts
Normal file
@ -0,0 +1,18 @@
|
|||||||
|
import { html } from "@design.estate/dees-element";
|
||||||
|
|
||||||
|
export const page2 = () => html`
|
||||||
|
<style>
|
||||||
|
.demoPort {
|
||||||
|
margin: auto;
|
||||||
|
width: 400px;
|
||||||
|
}
|
||||||
|
dedocument-page {
|
||||||
|
margin-top: 16px;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<div class="demoPort">
|
||||||
|
<dedocument-page .format="${"a4"}" .viewWidth=${400}></dedocument-page>
|
||||||
|
<dedocument-page .format="${"a4"}" .viewWidth=${400}></dedocument-page>
|
||||||
|
</div>
|
||||||
|
`;
|
@ -6,7 +6,13 @@
|
|||||||
"module": "NodeNext",
|
"module": "NodeNext",
|
||||||
"moduleResolution": "NodeNext",
|
"moduleResolution": "NodeNext",
|
||||||
"esModuleInterop": true,
|
"esModuleInterop": true,
|
||||||
"verbatimModuleSyntax": true
|
"verbatimModuleSyntax": true,
|
||||||
|
"baseUrl": ".",
|
||||||
|
"paths": {
|
||||||
|
"undefined": [
|
||||||
|
"./ts_web/index.js"
|
||||||
|
]
|
||||||
|
}
|
||||||
},
|
},
|
||||||
"exclude": [
|
"exclude": [
|
||||||
"dist_*/**/*.d.ts"
|
"dist_*/**/*.d.ts"
|
||||||
|
Reference in New Issue
Block a user