feat(core): Enhanced document generation features and added translation capabilities
This commit is contained in:
213
readme.md
213
readme.md
@@ -1,26 +1,31 @@
|
||||
# @design.estate/dees-document
|
||||
a catalog for creating documents like invoices
|
||||
|
||||
A comprehensive solution for generating documents like invoices, integrating elements, templates, and services to streamline document creation.
|
||||
|
||||
## Install
|
||||
To install `@design.estate/dees-document`, run the following command in your project directory:
|
||||
|
||||
To add `@design.estate/dees-document` to your project, run the following command in your terminal:
|
||||
|
||||
```shell
|
||||
npm install @design.estate/dees-document --save
|
||||
```
|
||||
|
||||
This will add `@design.estate/dees-document` to your project's dependencies and ensure it's installed into your `node_modules` folder.
|
||||
This will install the package and add it to your project's dependencies, ensuring all required modules are available in your `node_modules` directory.
|
||||
|
||||
## Usage
|
||||
The `@design.estate/dees-document` package is a comprehensive toolkit for creating various types of documents, such as invoices, with ease. It leverages modern ECMAScript (ES) modules and TypeScript for a type-safe, developer-friendly experience. Below, you'll find detailed examples covering how to utilize the package to its full potential.
|
||||
|
||||
### Setting Up the Document Service
|
||||
Before diving into creating documents, you first need to set up the document service. This involves importing the necessary modules and initializing the service instance.
|
||||
The `@design.estate/dees-document` package provides a robust framework for creating documents including invoices, contracts, and various other business-related documents. It is built on modern web technologies including TypeScript and ES modules to ensure a type-safe and easy-to-integrate experience. Below, we will guide you through the comprehensive usage of this package, from setting up your environment to generating PDF documents.
|
||||
|
||||
### Getting Started
|
||||
|
||||
Before creating documents, initialize the document service which is central to this package. This is typically done at the beginning of your application.
|
||||
|
||||
```typescript
|
||||
import { PdfService, IPdfServiceConstructorOptions } from '@design.estate/dees-document';
|
||||
|
||||
async function setupPdfService() {
|
||||
const options: IPdfServiceConstructorOptions = {
|
||||
// Configuration options here
|
||||
// Add necessary configuration here
|
||||
};
|
||||
|
||||
const pdfService = await PdfService.createAndStart(options);
|
||||
@@ -29,100 +34,136 @@ async function setupPdfService() {
|
||||
}
|
||||
```
|
||||
|
||||
In the example above, we import `PdfService` from the package and use its `createAndStart` method to initialize it with optional configuration settings. Replace `// Configuration options here` with any specific options your project may require.
|
||||
This script initializes `PdfService`. Modify the options to tailor the service to your needs.
|
||||
|
||||
### Creating a Simple Invoice
|
||||
After setting up the document service, you can proceed to create documents such as invoices. Here, we'll demonstrate how to create a basic invoice.
|
||||
### Creating Documents
|
||||
|
||||
#### Define the Invoice Data Structure
|
||||
First, define the basic structure of your invoice. This involves specifying details like the sender, recipient, items, and more.
|
||||
With the PDF service ready, you can proceed to generate documents. The following section provides a detailed example of creating an invoice. This example is applicable to various document types with necessary adjustments.
|
||||
|
||||
```typescript
|
||||
import { ILetter } from '@design.estate/dees-document';
|
||||
#### Step-by-Step: Create an Invoice
|
||||
|
||||
const invoiceData: ILetter = {
|
||||
from: {
|
||||
name: "Your Company Name",
|
||||
address: {
|
||||
streetName: "Your Street",
|
||||
houseNumber: "123",
|
||||
city: "Your City",
|
||||
country: "Your Country",
|
||||
postalCode: "12345",
|
||||
},
|
||||
email: "your-email@example.com",
|
||||
phone: "123-456-7890",
|
||||
},
|
||||
to: {
|
||||
name: "Recipient Company Name",
|
||||
address: {
|
||||
streetName: "Recipient Street",
|
||||
houseNumber: "456",
|
||||
city: "Recipient City",
|
||||
country: "Recipient Country",
|
||||
postalCode: "67890",
|
||||
},
|
||||
email: "recipient-email@example.com",
|
||||
phone: "098-765-4321",
|
||||
},
|
||||
content: {
|
||||
invoiceData: {
|
||||
items: [
|
||||
{
|
||||
name: "Service or Product Name",
|
||||
unitQuantity: 2,
|
||||
unitNetPrice: 100.00,
|
||||
unitType: 'service',
|
||||
vatPercentage: 19,
|
||||
currency: 'EUR',
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
subject: "Invoice for Services Rendered",
|
||||
date: new Date().getTime(),
|
||||
versionInfo: {
|
||||
type: "final",
|
||||
version: "1.0.0"
|
||||
},
|
||||
};
|
||||
```
|
||||
1. **Define the Data Structure**: Describe the invoice details. This includes sender and recipient information, the items being invoiced, and more.
|
||||
|
||||
In this structure, `invoiceData` outlines essential details for an invoice document, using the `ILetter` interface. It includes information about both the sender (`from`) and the recipient (`to`), as well as the invoiced items under `content.invoiceData.items`.
|
||||
```typescript
|
||||
import { ILetter } from '@design.estate/dees-document';
|
||||
|
||||
#### Generate the Invoice PDF
|
||||
With the invoice data ready, you can now generate the PDF using the `PdfService` instance.
|
||||
const invoiceData: ILetter = {
|
||||
from: {
|
||||
name: "Your Company Name",
|
||||
address: {
|
||||
streetName: "Your Street",
|
||||
houseNumber: "123",
|
||||
city: "Your City",
|
||||
country: "Your Country",
|
||||
postalCode: "12345",
|
||||
},
|
||||
email: "your-email@example.com",
|
||||
phone: "123-456-7890",
|
||||
},
|
||||
to: {
|
||||
name: "Recipient Company Name",
|
||||
address: {
|
||||
streetName: "Recipient Street",
|
||||
houseNumber: "456",
|
||||
city: "Recipient City",
|
||||
country: "Recipient Country",
|
||||
postalCode: "67890",
|
||||
},
|
||||
email: "recipient-email@example.com",
|
||||
phone: "098-765-4321",
|
||||
},
|
||||
content: {
|
||||
invoiceData: {
|
||||
items: [
|
||||
{
|
||||
name: "Service or Product Name",
|
||||
unitQuantity: 2,
|
||||
unitNetPrice: 100.00,
|
||||
unitType: 'service',
|
||||
vatPercentage: 19,
|
||||
currency: 'EUR',
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
subject: "Invoice for Services Rendered",
|
||||
date: new Date().getTime(),
|
||||
versionInfo: {
|
||||
type: "final",
|
||||
version: "1.0.0"
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
```typescript
|
||||
async function generateInvoice(pdfService: PdfService, invoiceData: ILetter) {
|
||||
const pdfBuffer = await pdfService.createPdfFromLetterObject(invoiceData);
|
||||
console.log('Invoice PDF generated successfully.');
|
||||
Here, `ILetter` interface details all components of an invoice including sender (`from`) and recipient (`to`) information, as well as the invoiced items.
|
||||
|
||||
// Here, you can save the PDF to a file, send it over a network, etc.
|
||||
}
|
||||
```
|
||||
2. **Generate the PDF**: Transform the invoice details into a PDF.
|
||||
|
||||
The method `createPdfFromLetterObject` receives the invoice data and returns a `Buffer` containing the PDF. You can then save this PDF to the filesystem, send it over email, or perform any other required actions.
|
||||
```typescript
|
||||
async function generateInvoice(pdfService: PdfService, invoiceData: ILetter) {
|
||||
const pdfBuffer = await pdfService.createPdfFromLetterObject(invoiceData);
|
||||
console.log('Invoice PDF generated successfully.');
|
||||
|
||||
#### Complete Example Integration
|
||||
Combining everything, your complete script to set up the service, define invoice data, and generate a PDF invoice might look something like this:
|
||||
// Save the PDF, send it via email, etc.
|
||||
}
|
||||
```
|
||||
|
||||
```typescript
|
||||
async function main() {
|
||||
const pdfService = await setupPdfService();
|
||||
await generateInvoice(pdfService, invoiceData);
|
||||
}
|
||||
The function `createPdfFromLetterObject` returns a `Buffer` containing the generated PDF. From here, you can save this PDF to a file, send it to clients, or archive it.
|
||||
|
||||
main().then(() => console.log('Invoice generation process completed.'));
|
||||
```
|
||||
3. **Integrate It All**: Here's how everything ties together into a complete script for generating an invoice:
|
||||
|
||||
### Beyond Invoices
|
||||
The `@design.estate/dees-document` package is not limited to invoices alone. It's designed to handle a wide range of document types. The modular architecture allows for the customizable construction of documents, enabling you to tailor the output to meet precise requirements.
|
||||
```typescript
|
||||
async function main() {
|
||||
const pdfService = await setupPdfService();
|
||||
await generateInvoice(pdfService, invoiceData);
|
||||
}
|
||||
|
||||
For instance, you can create contracts, reports, and other document types using a similar approach—by defining the content structure and utilizing the PDF service to generate the document. The package's flexibility and extensibility make it an invaluable tool in any document generation workflow.
|
||||
main().then(() => console.log('Invoice generation process completed.'));
|
||||
```
|
||||
|
||||
### Advanced Usage
|
||||
For more advanced scenarios, such as custom styling, embedding images, and handling more complex document structures, refer to the package's documentation. It provides comprehensive details and examples to help you fully leverage the capabilities of `@design.estate/dees-document`.
|
||||
This script initiates the PDF service and generates the invoice PDF with the provided information.
|
||||
|
||||
### Advanced Document Features
|
||||
|
||||
The package is designed to create not only invoices but a wide range of document types. Leverage its modular architecture to build and customize documents to fit specific needs.
|
||||
|
||||
#### Advanced Scenarios
|
||||
|
||||
1. **Custom Styling**: Customize the appearance of elements within your documents, such as headers, footers, and more.
|
||||
|
||||
```typescript
|
||||
import { DeDocumentViewer } from '@design.estate/dees-element';
|
||||
|
||||
const customStyledViewer = new DeDocumentViewer();
|
||||
customStyledViewer.style.setProperty('--main-bg-color', 'lightblue');
|
||||
document.body.appendChild(customStyledViewer);
|
||||
```
|
||||
|
||||
Customize via CSS or dynamically through TypeScript where necessary.
|
||||
|
||||
2. **Interactive Document Elements**: Incorporate UI components like buttons, input fields, or visualizations tailored for your document needs.
|
||||
|
||||
3. **Multi-page Document Generation**: Handle overflow of content and automatic page generation while maintaining headers and footers.
|
||||
|
||||
```typescript
|
||||
pdfService.adjustDePageScaling();
|
||||
```
|
||||
|
||||
Toggle between print and digital formats and handle scaling.
|
||||
|
||||
4. **Embedding Images and Logos**: Add company logos, graphics, or auxiliary content to enhance document presentation.
|
||||
|
||||
### Additional Capabilities
|
||||
|
||||
Beyond these examples, delve deeper into advanced functionalities such as:
|
||||
|
||||
- **Document Management**: Manage multiple document templates, manage versions, and add annotations or notes.
|
||||
- **Dynamic Rendering**: Use templating for dynamic content rendering based on variable inputs.
|
||||
- **Responsive Design for Digital Documents**: Ensure documents are displayed correctly across devices.
|
||||
|
||||
### Concluding Remarks
|
||||
|
||||
The `@design.estate/dees-document` package is an essential tool in the modern document generation ecosystem. Its expansive capabilities, from basic invoices to complex document templates, make it a versatile solution for businesses of all scales. Implementing this service broadly simplifies document management workflows and enhances document presentation precision and quality. For further depth, consult the package's documentation or explore the examples included in the module.
|
||||
|
||||
## License and Legal Information
|
||||
|
||||
|
Reference in New Issue
Block a user