@dangl/angular-ava 1.5.2 → 1.5.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -39,12 +39,12 @@ var ModeViewType;
39
39
 
40
40
  // This file is automatically generated as part of the build process
41
41
  const version = {
42
- version: "1.5.2",
43
- commitInfo: "Branch.main.Sha.9409870245296585e7e7467c334a307fc866eb01",
44
- commitDate: "2026-05-05",
45
- commitHash: "9409870245296585e7e7467c334a307fc866eb01",
46
- informationalVersion: "1.5.2+Branch.main.Sha.9409870245296585e7e7467c334a307fc866eb01",
47
- buildDateUtc: new Date(Date.UTC(2026, 4, 5, 18, 4, 38))
42
+ version: "1.5.3",
43
+ commitInfo: "Branch.main.Sha.45aaeca06d0340fb59606dc44b2306ce92321d9b",
44
+ commitDate: "2026-05-31",
45
+ commitHash: "45aaeca06d0340fb59606dc44b2306ce92321d9b",
46
+ informationalVersion: "1.5.3+Branch.main.Sha.45aaeca06d0340fb59606dc44b2306ce92321d9b",
47
+ buildDateUtc: new Date(Date.UTC(2026, 4, 31, 13, 14, 41))
48
48
  };
49
49
 
50
50
  class TreeHoverTooltipService {
@@ -991,7 +991,16 @@ const DEFAULT_TEXT_WORD_INVOICE = {
991
991
  totalsTotalVatAmount: 'Total VAT Amount',
992
992
  totalsTotalGross: 'Total Gross',
993
993
  totalsAlreadyPaidTotal: 'Already Paid Total',
994
- totalsTotalToBePaid: 'Total to be Paid',
994
+ totalsTotalToBePaidMap: {
995
+ [InvoiceType.PartialInvoice]: 'Total to be Paid',
996
+ [InvoiceType.CommercialInvoice]: 'Total to be Paid',
997
+ [InvoiceType.CreditNote]: 'Total',
998
+ [InvoiceType.CorrectedInvoice]: 'Total',
999
+ [InvoiceType.SelfBilledInvoice]: 'Total to be Paid',
1000
+ [InvoiceType.PartialConstructionInvoice]: 'Total to be Paid',
1001
+ [InvoiceType.PartialFinalConstructionInvoice]: 'Total to be Paid',
1002
+ [InvoiceType.FinalConstructionInvoice]: 'Total to be Paid'
1003
+ },
995
1004
  instructionsTopic: 'Payment Instructions',
996
1005
  instructionsAccountIdentifier: 'Account Identifier',
997
1006
  instructionsAccountName: 'Account Name',
@@ -1079,7 +1088,16 @@ const germanTextsInvoice = {
1079
1088
  totalsTotalVatAmount: 'Summe Umsatzsteuer',
1080
1089
  totalsTotalGross: 'Gesamt Brutto',
1081
1090
  totalsAlreadyPaidTotal: 'Bereits bezahlt',
1082
- totalsTotalToBePaid: 'Gesamt zu zahlen',
1091
+ totalsTotalToBePaidMap: {
1092
+ [InvoiceType.PartialInvoice]: 'Gesamt zu zahlen',
1093
+ [InvoiceType.CommercialInvoice]: 'Gesamt zu zahlen',
1094
+ [InvoiceType.CreditNote]: 'Gesamt',
1095
+ [InvoiceType.CorrectedInvoice]: 'Gesamt',
1096
+ [InvoiceType.SelfBilledInvoice]: 'Gesamt zu zahlen',
1097
+ [InvoiceType.PartialConstructionInvoice]: 'Gesamt zu zahlen',
1098
+ [InvoiceType.PartialFinalConstructionInvoice]: 'Gesamt zu zahlen',
1099
+ [InvoiceType.FinalConstructionInvoice]: 'Gesamt zu zahlen'
1100
+ },
1083
1101
  instructionsTopic: 'Zahlungsanweisungen',
1084
1102
  instructionsAccountIdentifier: 'Kontonummer',
1085
1103
  instructionsAccountName: 'Kontoname',
@@ -3011,11 +3029,11 @@ class InvoiceLineItemAdditionalInfoComponent {
3011
3029
  this.textWords$ = this.configurationInvoiceService.getTextWordsFromConfig();
3012
3030
  }
3013
3031
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: InvoiceLineItemAdditionalInfoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
3014
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: InvoiceLineItemAdditionalInfoComponent, isStandalone: true, selector: "ava-invoice-line-item-additional-info", inputs: { lineItem: "lineItem" }, ngImport: i0, template: "@if (textWords$ | async; as textWords) {\n @if (lineItem) {\n @if (lineItem.allowances && lineItem.allowances.length) {\n <div>\n <h3>{{ textWords.lineItemAllowances }}</h3>\n <div class=\"allowances\">\n <p>\n <strong>{{ textWords.lineItemReason }}:</strong> {{ lineItem.allowances[0].reason }}\n </p>\n <p>\n <strong>{{ textWords.tableHeadNetAmount }}:</strong> {{ lineItem.allowances[0].netAmount }}\n </p>\n </div>\n </div>\n }\n @if (lineItem.charges && lineItem.charges.length) {\n <div>\n <h3>{{ textWords.lineItemCharges }}</h3>\n <div class=\"charges\">\n <p>\n <strong>{{ textWords.lineItemReason }}:</strong> {{ lineItem.charges[0].reason }}\n </p>\n <p>\n <strong>{{ textWords.tableHeadNetAmount }}:</strong> {{ lineItem.charges[0].netAmount }}\n </p>\n </div>\n </div>\n }\n }\n}\n", styles: [".allowances,.charges{display:flex;justify-content:space-between}h3{margin:0;font-weight:700}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
3032
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: InvoiceLineItemAdditionalInfoComponent, isStandalone: true, selector: "ava-invoice-line-item-additional-info", inputs: { lineItem: "lineItem" }, ngImport: i0, template: "@if (textWords$ | async; as textWords) {\n @if (lineItem) {\n @if (lineItem.allowances && lineItem.allowances.length) {\n <div>\n <h3>{{ textWords.lineItemAllowances }}</h3>\n <div class=\"allowances\">\n <p>\n <strong>{{ textWords.lineItemReason }}:</strong> {{ lineItem.allowances[0].reason }}\n </p>\n <p>\n <strong>{{ textWords.tableHeadNetAmount }}:</strong> {{ lineItem.allowances[0].netAmount }}\n </p>\n </div>\n </div>\n }\n @if (lineItem.charges && lineItem.charges.length) {\n <div>\n <h3>{{ textWords.lineItemCharges }}</h3>\n <div class=\"charges\">\n <p>\n <strong>{{ textWords.lineItemReason }}:</strong> {{ lineItem.charges[0].reason }}\n </p>\n <p>\n <strong>{{ textWords.tableHeadNetAmount }}:</strong> {{ lineItem.charges[0].netAmount }}\n </p>\n </div>\n </div>\n }\n\n @if (lineItem.lineItemPeriod?.start || lineItem.lineItemPeriod?.end) {\n <div>\n @if (lineItem.lineItemPeriod && (lineItem.lineItemPeriod.start || lineItem.lineItemPeriod.end)) {\n @if (lineItem.lineItemPeriod!.start && lineItem.lineItemPeriod!.end) {\n <p>\n <strong class=\"line-break-after\">{{ textWords.detailsInvoicePeriod }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (lineItem.lineItemPeriod!.start | date: 'dd.MM.yyyy')\n : (lineItem.lineItemPeriod!.start | date: 'dd/MM/yyyy')\n }}\n -\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (lineItem.lineItemPeriod!.end | date: 'dd.MM.yyyy')\n : (lineItem.lineItemPeriod!.end | date: 'dd/MM/yyyy')\n }}\n </span>\n </p>\n } @else {\n <div class=\"invoice-date\">\n <strong>{{ textWords.detailsInvoicePeriodSingle }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (lineItem.lineItemPeriod!.start || lineItem.lineItemPeriod!.end | date: 'dd.MM.yyyy')\n : (lineItem.lineItemPeriod!.start || lineItem.lineItemPeriod!.end | date: 'dd/MM/yyyy')\n }}</span\n >\n </div>\n }\n }\n </div>\n }\n }\n}\n", styles: [".allowances,.charges{display:flex;justify-content:space-between}h3{margin:0;font-weight:700}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
3015
3033
  }
3016
3034
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: InvoiceLineItemAdditionalInfoComponent, decorators: [{
3017
3035
  type: Component,
3018
- args: [{ selector: 'ava-invoice-line-item-additional-info', imports: [AsyncPipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (textWords$ | async; as textWords) {\n @if (lineItem) {\n @if (lineItem.allowances && lineItem.allowances.length) {\n <div>\n <h3>{{ textWords.lineItemAllowances }}</h3>\n <div class=\"allowances\">\n <p>\n <strong>{{ textWords.lineItemReason }}:</strong> {{ lineItem.allowances[0].reason }}\n </p>\n <p>\n <strong>{{ textWords.tableHeadNetAmount }}:</strong> {{ lineItem.allowances[0].netAmount }}\n </p>\n </div>\n </div>\n }\n @if (lineItem.charges && lineItem.charges.length) {\n <div>\n <h3>{{ textWords.lineItemCharges }}</h3>\n <div class=\"charges\">\n <p>\n <strong>{{ textWords.lineItemReason }}:</strong> {{ lineItem.charges[0].reason }}\n </p>\n <p>\n <strong>{{ textWords.tableHeadNetAmount }}:</strong> {{ lineItem.charges[0].netAmount }}\n </p>\n </div>\n </div>\n }\n }\n}\n", styles: [".allowances,.charges{display:flex;justify-content:space-between}h3{margin:0;font-weight:700}\n"] }]
3036
+ args: [{ selector: 'ava-invoice-line-item-additional-info', imports: [AsyncPipe, DatePipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (textWords$ | async; as textWords) {\n @if (lineItem) {\n @if (lineItem.allowances && lineItem.allowances.length) {\n <div>\n <h3>{{ textWords.lineItemAllowances }}</h3>\n <div class=\"allowances\">\n <p>\n <strong>{{ textWords.lineItemReason }}:</strong> {{ lineItem.allowances[0].reason }}\n </p>\n <p>\n <strong>{{ textWords.tableHeadNetAmount }}:</strong> {{ lineItem.allowances[0].netAmount }}\n </p>\n </div>\n </div>\n }\n @if (lineItem.charges && lineItem.charges.length) {\n <div>\n <h3>{{ textWords.lineItemCharges }}</h3>\n <div class=\"charges\">\n <p>\n <strong>{{ textWords.lineItemReason }}:</strong> {{ lineItem.charges[0].reason }}\n </p>\n <p>\n <strong>{{ textWords.tableHeadNetAmount }}:</strong> {{ lineItem.charges[0].netAmount }}\n </p>\n </div>\n </div>\n }\n\n @if (lineItem.lineItemPeriod?.start || lineItem.lineItemPeriod?.end) {\n <div>\n @if (lineItem.lineItemPeriod && (lineItem.lineItemPeriod.start || lineItem.lineItemPeriod.end)) {\n @if (lineItem.lineItemPeriod!.start && lineItem.lineItemPeriod!.end) {\n <p>\n <strong class=\"line-break-after\">{{ textWords.detailsInvoicePeriod }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (lineItem.lineItemPeriod!.start | date: 'dd.MM.yyyy')\n : (lineItem.lineItemPeriod!.start | date: 'dd/MM/yyyy')\n }}\n -\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (lineItem.lineItemPeriod!.end | date: 'dd.MM.yyyy')\n : (lineItem.lineItemPeriod!.end | date: 'dd/MM/yyyy')\n }}\n </span>\n </p>\n } @else {\n <div class=\"invoice-date\">\n <strong>{{ textWords.detailsInvoicePeriodSingle }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (lineItem.lineItemPeriod!.start || lineItem.lineItemPeriod!.end | date: 'dd.MM.yyyy')\n : (lineItem.lineItemPeriod!.start || lineItem.lineItemPeriod!.end | date: 'dd/MM/yyyy')\n }}</span\n >\n </div>\n }\n }\n </div>\n }\n }\n}\n", styles: [".allowances,.charges{display:flex;justify-content:space-between}h3{margin:0;font-weight:700}\n"] }]
3019
3037
  }], propDecorators: { lineItem: [{
3020
3038
  type: Input
3021
3039
  }] } });
@@ -3055,7 +3073,7 @@ class InvoiceLineItemsTableComponent {
3055
3073
  }, []);
3056
3074
  }
3057
3075
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: InvoiceLineItemsTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
3058
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: InvoiceLineItemsTableComponent, isStandalone: true, selector: "ava-invoice-line-items-table", inputs: { lineItems: { classPropertyName: "lineItems", publicName: "lineItems", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (textWords$ | async; as textWords) {\n @if ((colorSettings$ | async) || true; as colorSettings) {\n <table\n mat-table\n [dataSource]=\"flatLineItems\"\n multiTemplateDataRows\n class=\"mat-elevation-z8 invoice-table\"\n >\n <ng-container matColumnDef=\"number\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n #\n </th>\n <td\n mat-cell\n *matCellDef=\"let element; let i = dataIndex\"\n [class.children]=\"element.indentLevel\"\n >\n {{ element.identifier || element.objectIdentifier || i + 1 }}\n @if (element.indentLevel) {\n <div\n class=\"children-mark\"\n [style.width.px]=\"element.indentLevel * 8\"\n ></div>\n }\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"description\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadDescription }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n >\n {{ element.itemInformation?.description || element.itemInformation?.name }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"quantity\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadQuantity }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n >\n {{ element.quantity | numberPlus }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"unit\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadUnit }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n >\n {{ element.unitCode }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"netPrice\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadNetPrice }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n class=\"currency-table-cell\"\n >\n {{ element.priceDetails?.netPrice | currencyPlus }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"discount\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.lineItemDiscount }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n class=\"currency-table-cell\"\n >\n @if (element.priceDetails?.absoluteDiscountPerItem) {\n {{ element.priceDetails?.absoluteDiscountPerItem | currencyPlus }}\n }\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"netAmount\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadNetAmount }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n class=\"currency-table-cell\"\n >\n {{ element.netAmount | currencyPlus }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"vat\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.vat }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n class=\"currency-table-cell\"\n >\n @if (element && element.vatInformation && element.vatInformation.length > 0) {\n {{ element.vatInformation[0].vatRate | percentPlus: '1.0-2' }}\n }\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"expandedDetail\">\n <td\n mat-cell\n *matCellDef=\"let element\"\n [attr.colspan]=\"displayedColumns.length\"\n >\n <div [@detailExpand]=\"isRowExpanded(element) || (pdfViewEnabled$ | async) ? 'expanded' : 'collapsed'\">\n <ava-invoice-line-item-additional-info [lineItem]=\"element\"></ava-invoice-line-item-additional-info>\n </div>\n </td>\n </ng-container>\n\n <tr\n mat-header-row\n *matHeaderRowDef=\"displayedColumns\"\n ></tr>\n\n <tr\n mat-row\n *matRowDef=\"let row; columns: displayedColumns\"\n (click)=\"(row.allowances || row.charges) && toggleRow(row)\"\n [ngClass]=\"{\n expanding: !(pdfViewEnabled$ | async) && (row.allowances || row.charges),\n 'expanded-row': isRowExpanded(row) && colorSettings === true,\n 'expanded-row-pdf-view': (pdfViewEnabled$ | async) && !row.indentLevel,\n }\"\n [style.backgroundColor]=\"\n colorSettings === true ? null : isRowExpanded(row) ? 'color-mix(in srgb,' + colorSettings?.backgroundColor + ', white 70%)' : null\n \"\n ></tr>\n\n <tr\n mat-row\n *matRowDef=\"let row; columns: ['expandedDetail']\"\n class=\"detail-row\"\n ></tr>\n </table>\n }\n}\n", styles: ["@charset \"UTF-8\";.invoice-table{width:100%;border-collapse:collapse}.invoice-table th,.invoice-table td{text-align:left}.invoice-table tr td:first-child{padding-left:20px}.invoice-table th{background-color:var(--color-primary);font-weight:700;color:#fff}.currency-table-cell{text-align:right!important}.invoice-table tr.detail-row{height:0}tr{cursor:pointer;position:relative}tr:before{content:\"\\25bc\";position:absolute;font-size:20px;transition:transform .3s ease;top:calc(50% - 10px);color:var(--color-primary);z-index:210}tr:not(.expanding):before{opacity:0}tr:has(th):before,tr.detail-row:before,tr.expanded-row-pdf-view:before{visibility:hidden}tr.expanded-row:before{content:\"\\25b2\"}tr.expanded-row td{background-color:color-mix(in srgb,var(--color-primary),white 70%)}.children{position:relative}.children-mark{height:100%;background-color:#add8e6;position:absolute;left:0;top:0;z-index:200;opacity:.5}\n"], dependencies: [{ kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i1$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i1$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i1$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i1$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i1$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i1$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i1$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i1$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i1$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i1$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: InvoiceLineItemAdditionalInfoComponent, selector: "ava-invoice-line-item-additional-info", inputs: ["lineItem"] }, { kind: "pipe", type: PercentPlusPipe, name: "percentPlus" }, { kind: "pipe", type: CurrencyPlusPipe, name: "currencyPlus" }, { kind: "pipe", type: NumberPlusPipe, name: "numberPlus" }, { kind: "pipe", type: AsyncPipe, name: "async" }], animations: [
3076
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: InvoiceLineItemsTableComponent, isStandalone: true, selector: "ava-invoice-line-items-table", inputs: { lineItems: { classPropertyName: "lineItems", publicName: "lineItems", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (textWords$ | async; as textWords) {\n @if ((colorSettings$ | async) || true; as colorSettings) {\n <table\n mat-table\n [dataSource]=\"flatLineItems\"\n multiTemplateDataRows\n class=\"mat-elevation-z8 invoice-table\"\n >\n <ng-container matColumnDef=\"number\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n #\n </th>\n <td\n mat-cell\n *matCellDef=\"let element; let i = dataIndex\"\n [class.children]=\"element.indentLevel\"\n >\n {{ element.identifier || element.objectIdentifier || i + 1 }}\n @if (element.indentLevel) {\n <div\n class=\"children-mark\"\n [style.width.px]=\"element.indentLevel * 8\"\n ></div>\n }\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"description\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadDescription }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n >\n {{ element.itemInformation?.description || element.itemInformation?.name }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"quantity\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadQuantity }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n >\n {{ element.quantity | numberPlus }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"unit\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadUnit }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n >\n {{ element.unitCode }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"netPrice\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadNetPrice }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n class=\"currency-table-cell\"\n >\n {{ element.priceDetails?.netPrice | currencyPlus }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"discount\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.lineItemDiscount }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n class=\"currency-table-cell\"\n >\n @if (element.priceDetails?.absoluteDiscountPerItem) {\n {{ element.priceDetails?.absoluteDiscountPerItem | currencyPlus }}\n }\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"netAmount\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadNetAmount }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n class=\"currency-table-cell\"\n >\n {{ element.netAmount | currencyPlus }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"vat\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.vat }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n class=\"currency-table-cell\"\n >\n @if (element && element.vatInformation && element.vatInformation.length > 0) {\n {{ element.vatInformation[0].vatRate | percentPlus: '1.0-2' }}\n }\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"expandedDetail\">\n <td\n mat-cell\n *matCellDef=\"let element\"\n [attr.colspan]=\"displayedColumns.length\"\n >\n <div [@detailExpand]=\"isRowExpanded(element) || (pdfViewEnabled$ | async) ? 'expanded' : 'collapsed'\">\n <ava-invoice-line-item-additional-info [lineItem]=\"element\"></ava-invoice-line-item-additional-info>\n </div>\n </td>\n </ng-container>\n\n <tr\n mat-header-row\n *matHeaderRowDef=\"displayedColumns\"\n ></tr>\n\n <tr\n mat-row\n *matRowDef=\"let row; columns: displayedColumns\"\n (click)=\"(row.allowances || row.charges || row.lineItemPeriod) && toggleRow(row)\"\n [ngClass]=\"{\n expanding: !(pdfViewEnabled$ | async) && (row.allowances || row.charges || row.lineItemPeriod),\n 'expanded-row': isRowExpanded(row) && colorSettings === true,\n 'expanded-row-pdf-view': (pdfViewEnabled$ | async) && !row.indentLevel,\n }\"\n [style.backgroundColor]=\"\n colorSettings === true ? null : isRowExpanded(row) ? 'color-mix(in srgb,' + colorSettings?.backgroundColor + ', white 70%)' : null\n \"\n ></tr>\n\n <tr\n mat-row\n *matRowDef=\"let row; columns: ['expandedDetail']\"\n class=\"detail-row\"\n ></tr>\n </table>\n }\n}\n", styles: ["@charset \"UTF-8\";.invoice-table{width:100%;border-collapse:collapse}.invoice-table th,.invoice-table td{text-align:left}.invoice-table tr td:first-child{padding-left:20px}.invoice-table th{background-color:var(--color-primary);font-weight:700;color:#fff}.currency-table-cell{text-align:right!important}.invoice-table tr.detail-row{height:0}tr{cursor:pointer;position:relative}tr:before{content:\"\\25bc\";position:absolute;font-size:20px;transition:transform .3s ease;top:calc(50% - 10px);color:var(--color-primary);z-index:210}tr:not(.expanding):before{opacity:0}tr:has(th):before,tr.detail-row:before,tr.expanded-row-pdf-view:before{visibility:hidden}tr.expanded-row:before{content:\"\\25b2\"}tr.expanded-row td{background-color:color-mix(in srgb,var(--color-primary),white 70%)}.children{position:relative}.children-mark{height:100%;background-color:#add8e6;position:absolute;left:0;top:0;z-index:200;opacity:.5}\n"], dependencies: [{ kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i1$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i1$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i1$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i1$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i1$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i1$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i1$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i1$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i1$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i1$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: InvoiceLineItemAdditionalInfoComponent, selector: "ava-invoice-line-item-additional-info", inputs: ["lineItem"] }, { kind: "pipe", type: PercentPlusPipe, name: "percentPlus" }, { kind: "pipe", type: CurrencyPlusPipe, name: "currencyPlus" }, { kind: "pipe", type: NumberPlusPipe, name: "numberPlus" }, { kind: "pipe", type: AsyncPipe, name: "async" }], animations: [
3059
3077
  trigger('detailExpand', [
3060
3078
  state('collapsed,void', style({ height: '0px', minHeight: '0' })),
3061
3079
  state('expanded', style({ height: '*' })),
@@ -3080,7 +3098,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
3080
3098
  MatButtonModule,
3081
3099
  NgClass,
3082
3100
  InvoiceLineItemAdditionalInfoComponent
3083
- ], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (textWords$ | async; as textWords) {\n @if ((colorSettings$ | async) || true; as colorSettings) {\n <table\n mat-table\n [dataSource]=\"flatLineItems\"\n multiTemplateDataRows\n class=\"mat-elevation-z8 invoice-table\"\n >\n <ng-container matColumnDef=\"number\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n #\n </th>\n <td\n mat-cell\n *matCellDef=\"let element; let i = dataIndex\"\n [class.children]=\"element.indentLevel\"\n >\n {{ element.identifier || element.objectIdentifier || i + 1 }}\n @if (element.indentLevel) {\n <div\n class=\"children-mark\"\n [style.width.px]=\"element.indentLevel * 8\"\n ></div>\n }\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"description\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadDescription }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n >\n {{ element.itemInformation?.description || element.itemInformation?.name }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"quantity\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadQuantity }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n >\n {{ element.quantity | numberPlus }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"unit\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadUnit }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n >\n {{ element.unitCode }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"netPrice\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadNetPrice }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n class=\"currency-table-cell\"\n >\n {{ element.priceDetails?.netPrice | currencyPlus }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"discount\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.lineItemDiscount }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n class=\"currency-table-cell\"\n >\n @if (element.priceDetails?.absoluteDiscountPerItem) {\n {{ element.priceDetails?.absoluteDiscountPerItem | currencyPlus }}\n }\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"netAmount\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadNetAmount }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n class=\"currency-table-cell\"\n >\n {{ element.netAmount | currencyPlus }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"vat\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.vat }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n class=\"currency-table-cell\"\n >\n @if (element && element.vatInformation && element.vatInformation.length > 0) {\n {{ element.vatInformation[0].vatRate | percentPlus: '1.0-2' }}\n }\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"expandedDetail\">\n <td\n mat-cell\n *matCellDef=\"let element\"\n [attr.colspan]=\"displayedColumns.length\"\n >\n <div [@detailExpand]=\"isRowExpanded(element) || (pdfViewEnabled$ | async) ? 'expanded' : 'collapsed'\">\n <ava-invoice-line-item-additional-info [lineItem]=\"element\"></ava-invoice-line-item-additional-info>\n </div>\n </td>\n </ng-container>\n\n <tr\n mat-header-row\n *matHeaderRowDef=\"displayedColumns\"\n ></tr>\n\n <tr\n mat-row\n *matRowDef=\"let row; columns: displayedColumns\"\n (click)=\"(row.allowances || row.charges) && toggleRow(row)\"\n [ngClass]=\"{\n expanding: !(pdfViewEnabled$ | async) && (row.allowances || row.charges),\n 'expanded-row': isRowExpanded(row) && colorSettings === true,\n 'expanded-row-pdf-view': (pdfViewEnabled$ | async) && !row.indentLevel,\n }\"\n [style.backgroundColor]=\"\n colorSettings === true ? null : isRowExpanded(row) ? 'color-mix(in srgb,' + colorSettings?.backgroundColor + ', white 70%)' : null\n \"\n ></tr>\n\n <tr\n mat-row\n *matRowDef=\"let row; columns: ['expandedDetail']\"\n class=\"detail-row\"\n ></tr>\n </table>\n }\n}\n", styles: ["@charset \"UTF-8\";.invoice-table{width:100%;border-collapse:collapse}.invoice-table th,.invoice-table td{text-align:left}.invoice-table tr td:first-child{padding-left:20px}.invoice-table th{background-color:var(--color-primary);font-weight:700;color:#fff}.currency-table-cell{text-align:right!important}.invoice-table tr.detail-row{height:0}tr{cursor:pointer;position:relative}tr:before{content:\"\\25bc\";position:absolute;font-size:20px;transition:transform .3s ease;top:calc(50% - 10px);color:var(--color-primary);z-index:210}tr:not(.expanding):before{opacity:0}tr:has(th):before,tr.detail-row:before,tr.expanded-row-pdf-view:before{visibility:hidden}tr.expanded-row:before{content:\"\\25b2\"}tr.expanded-row td{background-color:color-mix(in srgb,var(--color-primary),white 70%)}.children{position:relative}.children-mark{height:100%;background-color:#add8e6;position:absolute;left:0;top:0;z-index:200;opacity:.5}\n"] }]
3101
+ ], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (textWords$ | async; as textWords) {\n @if ((colorSettings$ | async) || true; as colorSettings) {\n <table\n mat-table\n [dataSource]=\"flatLineItems\"\n multiTemplateDataRows\n class=\"mat-elevation-z8 invoice-table\"\n >\n <ng-container matColumnDef=\"number\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n #\n </th>\n <td\n mat-cell\n *matCellDef=\"let element; let i = dataIndex\"\n [class.children]=\"element.indentLevel\"\n >\n {{ element.identifier || element.objectIdentifier || i + 1 }}\n @if (element.indentLevel) {\n <div\n class=\"children-mark\"\n [style.width.px]=\"element.indentLevel * 8\"\n ></div>\n }\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"description\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadDescription }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n >\n {{ element.itemInformation?.description || element.itemInformation?.name }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"quantity\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadQuantity }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n >\n {{ element.quantity | numberPlus }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"unit\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadUnit }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n >\n {{ element.unitCode }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"netPrice\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadNetPrice }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n class=\"currency-table-cell\"\n >\n {{ element.priceDetails?.netPrice | currencyPlus }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"discount\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.lineItemDiscount }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n class=\"currency-table-cell\"\n >\n @if (element.priceDetails?.absoluteDiscountPerItem) {\n {{ element.priceDetails?.absoluteDiscountPerItem | currencyPlus }}\n }\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"netAmount\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.tableHeadNetAmount }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n class=\"currency-table-cell\"\n >\n {{ element.netAmount | currencyPlus }}\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"vat\">\n <th\n mat-header-cell\n *matHeaderCellDef\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.vat }}\n </th>\n <td\n mat-cell\n *matCellDef=\"let element\"\n class=\"currency-table-cell\"\n >\n @if (element && element.vatInformation && element.vatInformation.length > 0) {\n {{ element.vatInformation[0].vatRate | percentPlus: '1.0-2' }}\n }\n </td>\n </ng-container>\n\n <ng-container matColumnDef=\"expandedDetail\">\n <td\n mat-cell\n *matCellDef=\"let element\"\n [attr.colspan]=\"displayedColumns.length\"\n >\n <div [@detailExpand]=\"isRowExpanded(element) || (pdfViewEnabled$ | async) ? 'expanded' : 'collapsed'\">\n <ava-invoice-line-item-additional-info [lineItem]=\"element\"></ava-invoice-line-item-additional-info>\n </div>\n </td>\n </ng-container>\n\n <tr\n mat-header-row\n *matHeaderRowDef=\"displayedColumns\"\n ></tr>\n\n <tr\n mat-row\n *matRowDef=\"let row; columns: displayedColumns\"\n (click)=\"(row.allowances || row.charges || row.lineItemPeriod) && toggleRow(row)\"\n [ngClass]=\"{\n expanding: !(pdfViewEnabled$ | async) && (row.allowances || row.charges || row.lineItemPeriod),\n 'expanded-row': isRowExpanded(row) && colorSettings === true,\n 'expanded-row-pdf-view': (pdfViewEnabled$ | async) && !row.indentLevel,\n }\"\n [style.backgroundColor]=\"\n colorSettings === true ? null : isRowExpanded(row) ? 'color-mix(in srgb,' + colorSettings?.backgroundColor + ', white 70%)' : null\n \"\n ></tr>\n\n <tr\n mat-row\n *matRowDef=\"let row; columns: ['expandedDetail']\"\n class=\"detail-row\"\n ></tr>\n </table>\n }\n}\n", styles: ["@charset \"UTF-8\";.invoice-table{width:100%;border-collapse:collapse}.invoice-table th,.invoice-table td{text-align:left}.invoice-table tr td:first-child{padding-left:20px}.invoice-table th{background-color:var(--color-primary);font-weight:700;color:#fff}.currency-table-cell{text-align:right!important}.invoice-table tr.detail-row{height:0}tr{cursor:pointer;position:relative}tr:before{content:\"\\25bc\";position:absolute;font-size:20px;transition:transform .3s ease;top:calc(50% - 10px);color:var(--color-primary);z-index:210}tr:not(.expanding):before{opacity:0}tr:has(th):before,tr.detail-row:before,tr.expanded-row-pdf-view:before{visibility:hidden}tr.expanded-row:before{content:\"\\25b2\"}tr.expanded-row td{background-color:color-mix(in srgb,var(--color-primary),white 70%)}.children{position:relative}.children-mark{height:100%;background-color:#add8e6;position:absolute;left:0;top:0;z-index:200;opacity:.5}\n"] }]
3084
3102
  }], propDecorators: { lineItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "lineItems", required: false }] }] } });
3085
3103
 
3086
3104
  class OrganizationInfoComponent {
@@ -3144,7 +3162,7 @@ class InvoiceDisplayComponent {
3144
3162
  * You can supply a map of strings to be used for the text in the tree. This allows you to translate
3145
3163
  * the text in the tree to other languages.
3146
3164
  * {
3147
- * invoiceTitle: string;
3165
+ * invoiceTitle: InvoiceTitleMap;
3148
3166
  * vatId: string;
3149
3167
  * detailsInvoiceNumber: string;
3150
3168
  * detailsInvoiceDate: string;
@@ -3174,7 +3192,7 @@ class InvoiceDisplayComponent {
3174
3192
  * totalsTotalVatAmount: string;
3175
3193
  * totalsTotalGross: string;
3176
3194
  * totalsAlreadyPaidTotal: string;
3177
- * totalsTotalToBePaid: string;
3195
+ * totalsTotalToBePaidMap: InvoiceTotalsToBePaidMap;
3178
3196
  * instructionsTopic: string;
3179
3197
  * instructionsAccountIdentifier: string;
3180
3198
  * instructionsAccountName: string;
@@ -3210,6 +3228,7 @@ class InvoiceDisplayComponent {
3210
3228
  return { ...this.configurationInvoiceService.getCurrentInvoiceConfig(), ...this.config(), textWords: this.config()?.textWords };
3211
3229
  }, ...(ngDevMode ? [{ debugName: "linkedConfig" }] : []));
3212
3230
  this.invoiceTitle = signal('', ...(ngDevMode ? [{ debugName: "invoiceTitle" }] : []));
3231
+ this.totalsTotalToBePaidTitle = signal('', ...(ngDevMode ? [{ debugName: "totalsTotalToBePaidTitle" }] : []));
3213
3232
  this.destroyRef = inject(DestroyRef);
3214
3233
  effect(() => {
3215
3234
  if (this.invoice() === null) {
@@ -3228,6 +3247,7 @@ class InvoiceDisplayComponent {
3228
3247
  const invoiceType = this.invoice()?.invoiceType;
3229
3248
  if (invoiceType) {
3230
3249
  this.invoiceTitle.set(textWords.invoiceTitle[invoiceType]);
3250
+ this.totalsTotalToBePaidTitle.set(textWords.totalsTotalToBePaidMap[invoiceType]);
3231
3251
  }
3232
3252
  }
3233
3253
  });
@@ -3243,7 +3263,7 @@ class InvoiceDisplayComponent {
3243
3263
  useFactory: (configurationInvoiceService) => configurationInvoiceService.locale,
3244
3264
  deps: [ConfigurationInvoiceService]
3245
3265
  }
3246
- ], ngImport: i0, template: "@if (textWords$ | async; as textWords) {\n @if ((colorSettings$ | async) || true; as colorSettings) {\n @if (invoice() !== null) {\n <div class=\"invoice-container\">\n <!-- Seller and Buyer Information -->\n <h1 class=\"invoice-title\">{{ invoiceTitle() }}</h1>\n\n <header class=\"invoice-header\">\n <div class=\"buyer-info\">\n <ava-organization-info [organizationInfo]=\"invoice()?.buyer || null\">\n <h2\n class=\"header-title\"\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceBuyerTitle }}\n </h2>\n </ava-organization-info>\n </div>\n <div class=\"invoice-details\">\n @if (invoice()?.invoiceNumber) {\n <p>\n <strong>{{ textWords.detailsInvoiceNumber }}: </strong>\n <span>{{ invoice()?.invoiceNumber }}</span>\n </p>\n }\n @if (invoice()?.invoiceDate) {\n <div class=\"invoice-date\">\n <strong>{{ textWords.detailsInvoiceDate }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (invoice()?.invoiceDate | date: 'dd.MM.yyyy')\n : (invoice()?.invoiceDate | date: 'dd/MM/yyyy')\n }}</span\n >\n </div>\n }\n @if (invoice()?.paymentDueDate) {\n <div class=\"invoice-date\">\n <strong>{{ textWords.detailsPaymentDueDate }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (invoice()?.paymentDueDate | date: 'dd.MM.yyyy')\n : (invoice()?.paymentDueDate | date: 'dd/MM/yyyy')\n }}</span\n >\n </div>\n }\n @if (invoice()?.invoicePeriod && (invoice()?.invoicePeriod?.start || invoice()?.invoicePeriod?.end)) {\n @if (invoice()!.invoicePeriod!.start && invoice()!.invoicePeriod!.end) {\n <p>\n <strong class=\"line-break-after\">{{ textWords.detailsInvoicePeriod }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (invoice()!.invoicePeriod!.start | date: 'dd.MM.yyyy')\n : (invoice()!.invoicePeriod!.start | date: 'dd/MM/yyyy')\n }}\n -\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (invoice()!.invoicePeriod!.end | date: 'dd.MM.yyyy')\n : (invoice()!.invoicePeriod!.end | date: 'dd/MM/yyyy')\n }}\n </span>\n </p>\n } @else {\n <div class=\"invoice-date\">\n <strong>{{ textWords.detailsInvoicePeriodSingle }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? ((invoice()?.invoicePeriod)!.start || (invoice()?.invoicePeriod)!.end | date: 'dd.MM.yyyy')\n : ((invoice()?.invoicePeriod)!.start || (invoice()?.invoicePeriod)!.end | date: 'dd/MM/yyyy')\n }}</span\n >\n </div>\n }\n }\n @if (invoice()?.currencyCode) {\n <p>\n <strong>{{ textWords.detailsCurrencyCode }}: </strong>\n <span>{{ invoice()?.currencyCode }}</span>\n </p>\n }\n @if (invoice()?.paymentTerms) {\n <p>\n <strong class=\"line-break-after\">{{ textWords.detailsPaymentTerms }}: </strong>\n <span>{{ invoice()?.paymentTerms }}</span>\n </p>\n }\n </div>\n\n <div class=\"seller-tax-representive\">\n <ava-organization-info [organizationInfo]=\"invoice()?.sellerTaxRepresentative || null\">\n <h2\n class=\"header-title\"\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceSellerTaxRepresentativeTitle }}\n </h2>\n </ava-organization-info>\n </div>\n <div class=\"seller-info\">\n <ava-organization-info [organizationInfo]=\"invoice()?.seller || null\">\n <h2\n class=\"header-title\"\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceSellerTitle }}\n </h2>\n </ava-organization-info>\n </div>\n </header>\n <mat-divider></mat-divider>\n\n <ava-reference-and-delivery-information\n [deliveryInformation]=\"invoice()?.deliveryInformation || null\"\n [references]=\"invoice()?.references || null\"\n ></ava-reference-and-delivery-information>\n <ava-invoice-line-items-table [lineItems]=\"invoice()?.lineItems || []\"></ava-invoice-line-items-table>\n\n <div class=\"addition-info\">\n <section class=\"taxes-and-allowances\">\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.taxesHeading }}\n </h2>\n <table class=\"tax-report-table\">\n <thead>\n <tr>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.vat }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.totalsTotalNet }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.totalsTotalVatAmount }}\n </th>\n </tr>\n </thead>\n <tbody>\n @for (tax of invoice()?.vatBreakdown; track tax.taxRate) {\n @if (tax.vatExemptionReasonText || tax.vatExemptionReasonCode) {\n <tr>\n <td colspan=\"3\">\n <span>{{ tax.vatExemptionReasonText }} / {{ tax.vatExemptionReasonCode }}</span>\n </td>\n </tr>\n }\n\n <tr>\n <td class=\"currency-table-cell\">\n @if (tax.taxRate != null) {\n <span>{{ tax.taxRate | percentPlus: '1.0-2' }}</span>\n }\n </td>\n <td class=\"currency-table-cell\">\n @if (tax.netTaxableAmount != null) {\n <span>{{ tax.netTaxableAmount | currencyPlus }}</span>\n }\n </td>\n <td class=\"currency-table-cell\">\n @if (tax.vatAmount != null) {\n <span>{{ tax.vatAmount | currencyPlus }}</span>\n }\n </td>\n </tr>\n }\n </tbody>\n </table>\n\n @if (invoice()?.allowances && (invoice()?.allowances?.length || 0) > 0) {\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.invoiceAllowancesHeader }}\n </h2>\n\n <table class=\"tax-report-table\">\n <thead>\n <tr>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceAllowancesTableHeaderSum }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceAllowancesTableHeaderVatRate }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceAllowancesTableHeaderAllowance }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceAllowancesTableHeaderBase }}\n </th>\n </tr>\n </thead>\n <tbody>\n @for (allowance of invoice()?.allowances; track allowance) {\n <tr>\n <td colspan=\"4\">\n @if (allowance.reason && allowance.reasonCode) {\n <span>{{ allowance.reason }} / {{ allowance.reasonCode }}</span>\n }\n @if (allowance.reason && !allowance.reasonCode) {\n <span>{{ allowance.reason }}</span>\n }\n\n @if (!allowance.reason && allowance.reasonCode) {\n <span>{{ allowance.reasonCode }}</span>\n }\n </td>\n </tr>\n <tr>\n <td class=\"currency-table-cell\">\n <span>\n {{ allowance.netAmount | currencyPlus }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ allowance.vatRate | percentPlus: '1.0-2' }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ allowance.relativeAllowancePercentage | percentPlus: '1.0-2' }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ allowance.relativeAllowanceBaseAmount | currencyPlus }}\n </span>\n </td>\n </tr>\n }\n </tbody>\n </table>\n }\n\n @if (invoice()?.charges && (invoice()?.charges?.length || 0) > 0) {\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.invoiceChargesHeader }}\n </h2>\n\n <table class=\"tax-report-table\">\n <thead>\n <tr>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceChargesTableHeaderSum }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceChargesTableHeaderVatRate }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceChargesTableHeaderCharge }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceChargesTableHeaderBase }}\n </th>\n </tr>\n </thead>\n <tbody>\n @for (charge of invoice()?.charges; track charge) {\n <tr>\n <td colspan=\"4\">\n @if (charge.reason && charge.reasonCode) {\n <span>{{ charge.reason }} / {{ charge.reasonCode }}</span>\n }\n @if (charge.reason && !charge.reasonCode) {\n <span>{{ charge.reason }}</span>\n }\n\n @if (!charge.reason && charge.reasonCode) {\n <span>{{ charge.reasonCode }}</span>\n }\n </td>\n </tr>\n <tr>\n <td class=\"currency-table-cell\">\n <span>\n {{ charge.netAmount | currencyPlus }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ charge.vatRate | percentPlus: '1.0-2' }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ charge.relativeChargePercentage | percentPlus: '1.0-2' }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ charge.relativeChargeBaseAmount | currencyPlus }}\n </span>\n </td>\n </tr>\n }\n </tbody>\n </table>\n }\n </section>\n\n <section class=\"payment-instructions\">\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.instructionsTopic }}\n </h2>\n @if (invoice()?.paymentInstructions?.description) {\n <p>{{ invoice()?.paymentInstructions?.description }}</p>\n }\n @for (means of invoice()?.paymentInstructions?.paymentMeans; track means) {\n <div>\n @if (means.accountIdentifier) {\n <p>\n <strong>{{ textWords.instructionsAccountIdentifier }}: </strong>\n <br />\n <span>{{ means.accountIdentifier }}</span>\n </p>\n }\n @if (means.accountName) {\n <p>\n <strong>{{ textWords.instructionsAccountName }}: </strong>\n <br />\n <span>{{ means.accountName }}</span>\n </p>\n }\n @if (means.serviceProviderIdentifier) {\n <p>\n <strong>{{ textWords.instructionsServiceProviderIdentifier }}: </strong>\n <br />\n <span>{{ means.serviceProviderIdentifier }}</span>\n </p>\n }\n </div>\n }\n </section>\n\n <section class=\"invoice-totals\">\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.totalsTopic }}\n </h2>\n\n @if (invoice()?.totals?.totalNet != null) {\n <p>\n <strong>{{ textWords.totalsTotalNet }}: </strong>\n <br />\n <span>{{ invoice()?.totals?.totalNet | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalAllowances != null) {\n <p>\n <strong>{{ textWords.totalsTotalAllowances }}: </strong>\n <br />\n <span> {{ invoice()?.totals?.totalAllowances | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalCharges != null) {\n <p>\n <strong>{{ textWords.totalsTotalCharges }}: </strong>\n <br />\n <span> {{ invoice()?.totals?.totalCharges | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalAfterDeductions != null) {\n <p>\n <strong>{{ textWords.totalsTotalAfterDeductions }}: </strong>\n <br />\n <span>{{ invoice()?.totals?.totalAfterDeductions | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalVatAmount != null) {\n <p>\n <strong>{{ textWords.totalsTotalVatAmount }}: </strong>\n <br />\n <span>{{ invoice()?.totals?.totalVatAmount | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalGross != null) {\n <p>\n <strong>{{ textWords.totalsTotalGross }}: </strong>\n <br />\n <span> {{ invoice()?.totals?.totalGross | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.alreadyPaidTotal != null) {\n <p>\n <strong>{{ textWords.totalsAlreadyPaidTotal }}: </strong>\n <br />\n <span>{{ invoice()?.totals?.alreadyPaidTotal | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalToBePaid != null) {\n <p\n class=\"total\"\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n <strong>{{ textWords.totalsTotalToBePaid }}: </strong>\n <br />\n <strong> {{ invoice()?.totals?.totalToBePaid | currencyPlus }}</strong>\n </p>\n }\n </section>\n </div>\n @if (invoice()?.previousInvoices && invoice()?.previousInvoices?.length) {\n <section\n class=\"previous-invoices\"\n [style]=\"{\n justifyContent: (alignmentOptions$ | async)?.previousInvoiceAlignment || '',\n }\"\n >\n <div class=\"previous-invoices-wrapper\">\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.previousInvoicesTopic }}\n </h2>\n\n <table class=\"previous-invoices-table\">\n <thead>\n <tr>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.previousInvoiceNumber }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.previousInvoiceDate }}\n </th>\n </tr>\n </thead>\n <tbody>\n @for (prevInvoice of invoice()?.previousInvoices; track prevInvoice) {\n <tr>\n <td>\n {{ prevInvoice.invoiceNumber }}\n </td>\n <td>\n {{ prevInvoice.invoiceDate | date: 'shortDate' }}\n </td>\n </tr>\n }\n </tbody>\n </table>\n </div>\n </section>\n }\n\n @if (invoice()?.invoiceNotes?.length) {\n <section class=\"invoice-notes\">\n <h2>{{ textWords.notesTopic }}</h2>\n @for (note of invoice()?.invoiceNotes; track note) {\n <div>\n @if (note?.shortText) {\n <p>\n <strong>{{ note?.shortText }}</strong>\n </p>\n }\n @if (note?.longText) {\n <p>\n @for (line of note.longText! | lineSplit; track line; let isLast = $last) {\n {{ line }}\n\n @if (!isLast) {\n <br />\n }\n }\n </p>\n }\n </div>\n }\n </section>\n }\n @if (invoice()?.documents?.length) {\n <section class=\"invoice-attachments\">\n <ava-invoice-documents [documents]=\"invoice()?.documents || []\"></ava-invoice-documents>\n </section>\n }\n </div>\n } @else if (invoice() === null && (pdfViewEnabled$ | async)) {\n <div class=\"error-container\">\n <div class=\"error-message\">\n <mat-icon>error_outline</mat-icon>\n <h2>Oops! Something went wrong.</h2>\n <p>We couldn't retrieve the invoice data. Please try again later.</p>\n </div>\n </div>\n } @else {\n <div></div>\n }\n }\n}\n", styles: [".invoice-container{width:100%;max-width:800px;margin:auto;font-family:Arial,sans-serif;line-height:1.5}.invoice-header{display:flex;justify-content:space-between;margin-bottom:20px;gap:10px;font-size:calc(1em - 1pt)}.invoice-header .header{height:32px}.invoice-header .header-title{background:var(--color-primary);color:#fff;text-align:center}.seller-info,.buyer-info,.invoice-details .seller-tax-representive{width:25%}.seller-info,.payment-instructions,.invoice-totals{text-align:right}.currency-table-cell{text-align:right!important}.invoice-title{font-size:48px;margin:20px 0}.invoice-references,.invoice-totals,.payment-instructions,.invoice-notes,.taxes-and-allowances,.invoice-delivery,.invoice-details{margin:20px 0}.invoice-totals p,.payment-instructions p,.invoice-notes p{margin:5px 0}h2{font-size:18px;margin-bottom:10px}.addition-info{display:flex;justify-content:space-between;gap:10px}.total{background-color:var(--color-primary);color:#fff;padding:5px;border-radius:5px}th{color:#fff;text-wrap:nowrap}.invoice-attachments{padding-bottom:15px}.info-title{border-bottom:2px solid var(--color-primary);text-align:center}.previous-invoices{width:100%;display:flex}.previous-invoices-wrapper{width:400px}.tax-report-table,.previous-invoices-table{width:100%;border-collapse:collapse;margin-top:10px}.tax-report-table th,.previous-invoices-table th,.tax-report-table td,.previous-invoices-table td{padding:6px;text-align:center;border:1px solid #ddd}.tax-report-table th,.previous-invoices-table th{background-color:var(--color-primary);color:#fff;font-weight:700;border:1px solid #000}.tax-report-table td,.previous-invoices-table td{font-size:14px;color:#333;border:1px solid #000}.center{text-align:center!important}.error-container{display:flex;justify-content:center;align-items:center;height:100vh}.error-message{text-align:center;background-color:#fff3f3;border:1px solid #d32f2f;padding:20px;border-radius:8px;box-shadow:0 4px 6px #0000001a;color:#d32f2f;max-width:400px;width:100%}.error-message h2{font-size:1.5em;margin:0 0 10px;font-weight:700}.error-message p{font-size:1em;margin-top:0;color:#555}.invoice-date{margin-bottom:12px;display:flex;gap:5px}.line-break-after{display:block}\n"], dependencies: [{ kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i1$4.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: InvoiceDocumentsComponent, selector: "ava-invoice-documents", inputs: ["documents"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: InvoiceLineItemsTableComponent, selector: "ava-invoice-line-items-table", inputs: ["lineItems"] }, { kind: "component", type: ReferenceAndDeliveryInformationComponent, selector: "ava-reference-and-delivery-information", inputs: ["deliveryInformation", "references"] }, { kind: "component", type: OrganizationInfoComponent, selector: "ava-organization-info", inputs: ["organizationInfo"] }, { kind: "pipe", type: PercentPlusPipe, name: "percentPlus" }, { kind: "pipe", type: CurrencyPlusPipe, name: "currencyPlus" }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: LineSplitPipe, name: "lineSplit" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
3266
+ ], ngImport: i0, template: "@if (textWords$ | async; as textWords) {\n @if ((colorSettings$ | async) || true; as colorSettings) {\n @if (invoice() !== null) {\n <div class=\"invoice-container\">\n <!-- Seller and Buyer Information -->\n <h1 class=\"invoice-title\">{{ invoiceTitle() }}</h1>\n\n <header class=\"invoice-header\">\n <div class=\"buyer-info\">\n <ava-organization-info [organizationInfo]=\"invoice()?.buyer || null\">\n <h2\n class=\"header-title\"\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceBuyerTitle }}\n </h2>\n </ava-organization-info>\n </div>\n <div class=\"invoice-details\">\n @if (invoice()?.invoiceNumber) {\n <p>\n <strong>{{ textWords.detailsInvoiceNumber }}: </strong>\n <span>{{ invoice()?.invoiceNumber }}</span>\n </p>\n }\n @if (invoice()?.invoiceDate) {\n <div class=\"invoice-date\">\n <strong>{{ textWords.detailsInvoiceDate }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (invoice()?.invoiceDate | date: 'dd.MM.yyyy')\n : (invoice()?.invoiceDate | date: 'dd/MM/yyyy')\n }}</span\n >\n </div>\n }\n @if (invoice()?.paymentDueDate) {\n <div class=\"invoice-date\">\n <strong>{{ textWords.detailsPaymentDueDate }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (invoice()?.paymentDueDate | date: 'dd.MM.yyyy')\n : (invoice()?.paymentDueDate | date: 'dd/MM/yyyy')\n }}</span\n >\n </div>\n }\n @if (invoice()?.invoicePeriod && (invoice()?.invoicePeriod?.start || invoice()?.invoicePeriod?.end)) {\n @if (invoice()!.invoicePeriod!.start && invoice()!.invoicePeriod!.end) {\n <p>\n <strong class=\"line-break-after\">{{ textWords.detailsInvoicePeriod }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (invoice()!.invoicePeriod!.start | date: 'dd.MM.yyyy')\n : (invoice()!.invoicePeriod!.start | date: 'dd/MM/yyyy')\n }}\n -\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (invoice()!.invoicePeriod!.end | date: 'dd.MM.yyyy')\n : (invoice()!.invoicePeriod!.end | date: 'dd/MM/yyyy')\n }}\n </span>\n </p>\n } @else {\n <div class=\"invoice-date\">\n <strong>{{ textWords.detailsInvoicePeriodSingle }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? ((invoice()?.invoicePeriod)!.start || (invoice()?.invoicePeriod)!.end | date: 'dd.MM.yyyy')\n : ((invoice()?.invoicePeriod)!.start || (invoice()?.invoicePeriod)!.end | date: 'dd/MM/yyyy')\n }}</span\n >\n </div>\n }\n }\n @if (invoice()?.currencyCode) {\n <p>\n <strong>{{ textWords.detailsCurrencyCode }}: </strong>\n <span>{{ invoice()?.currencyCode }}</span>\n </p>\n }\n @if (invoice()?.paymentTerms) {\n <p>\n <strong class=\"line-break-after\">{{ textWords.detailsPaymentTerms }}: </strong>\n <span>{{ invoice()?.paymentTerms }}</span>\n </p>\n }\n </div>\n\n <div class=\"seller-tax-representive\">\n <ava-organization-info [organizationInfo]=\"invoice()?.sellerTaxRepresentative || null\">\n <h2\n class=\"header-title\"\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceSellerTaxRepresentativeTitle }}\n </h2>\n </ava-organization-info>\n </div>\n <div class=\"seller-info\">\n <ava-organization-info [organizationInfo]=\"invoice()?.seller || null\">\n <h2\n class=\"header-title\"\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceSellerTitle }}\n </h2>\n </ava-organization-info>\n </div>\n </header>\n <mat-divider></mat-divider>\n\n <ava-reference-and-delivery-information\n [deliveryInformation]=\"invoice()?.deliveryInformation || null\"\n [references]=\"invoice()?.references || null\"\n ></ava-reference-and-delivery-information>\n <ava-invoice-line-items-table [lineItems]=\"invoice()?.lineItems || []\"></ava-invoice-line-items-table>\n\n <div class=\"addition-info\">\n <section class=\"taxes-and-allowances\">\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.taxesHeading }}\n </h2>\n <table class=\"tax-report-table\">\n <thead>\n <tr>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.vat }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.totalsTotalNet }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.totalsTotalVatAmount }}\n </th>\n </tr>\n </thead>\n <tbody>\n @for (tax of invoice()?.vatBreakdown; track tax.taxRate) {\n @if (tax.vatExemptionReasonText || tax.vatExemptionReasonCode) {\n <tr>\n <td colspan=\"3\">\n <span>{{ tax.vatExemptionReasonText }} / {{ tax.vatExemptionReasonCode }}</span>\n </td>\n </tr>\n }\n\n <tr>\n <td class=\"currency-table-cell\">\n @if (tax.taxRate != null) {\n <span>{{ tax.taxRate | percentPlus: '1.0-2' }}</span>\n }\n </td>\n <td class=\"currency-table-cell\">\n @if (tax.netTaxableAmount != null) {\n <span>{{ tax.netTaxableAmount | currencyPlus }}</span>\n }\n </td>\n <td class=\"currency-table-cell\">\n @if (tax.vatAmount != null) {\n <span>{{ tax.vatAmount | currencyPlus }}</span>\n }\n </td>\n </tr>\n }\n </tbody>\n </table>\n\n @if (invoice()?.allowances && (invoice()?.allowances?.length || 0) > 0) {\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.invoiceAllowancesHeader }}\n </h2>\n\n <table class=\"tax-report-table\">\n <thead>\n <tr>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceAllowancesTableHeaderSum }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceAllowancesTableHeaderVatRate }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceAllowancesTableHeaderAllowance }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceAllowancesTableHeaderBase }}\n </th>\n </tr>\n </thead>\n <tbody>\n @for (allowance of invoice()?.allowances; track allowance) {\n <tr>\n <td colspan=\"4\">\n @if (allowance.reason && allowance.reasonCode) {\n <span>{{ allowance.reason }} / {{ allowance.reasonCode }}</span>\n }\n @if (allowance.reason && !allowance.reasonCode) {\n <span>{{ allowance.reason }}</span>\n }\n\n @if (!allowance.reason && allowance.reasonCode) {\n <span>{{ allowance.reasonCode }}</span>\n }\n </td>\n </tr>\n <tr>\n <td class=\"currency-table-cell\">\n <span>\n {{ allowance.netAmount | currencyPlus }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ allowance.vatRate | percentPlus: '1.0-2' }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ allowance.relativeAllowancePercentage | percentPlus: '1.0-2' }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ allowance.relativeAllowanceBaseAmount | currencyPlus }}\n </span>\n </td>\n </tr>\n }\n </tbody>\n </table>\n }\n\n @if (invoice()?.charges && (invoice()?.charges?.length || 0) > 0) {\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.invoiceChargesHeader }}\n </h2>\n\n <table class=\"tax-report-table\">\n <thead>\n <tr>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceChargesTableHeaderSum }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceChargesTableHeaderVatRate }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceChargesTableHeaderCharge }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceChargesTableHeaderBase }}\n </th>\n </tr>\n </thead>\n <tbody>\n @for (charge of invoice()?.charges; track charge) {\n <tr>\n <td colspan=\"4\">\n @if (charge.reason && charge.reasonCode) {\n <span>{{ charge.reason }} / {{ charge.reasonCode }}</span>\n }\n @if (charge.reason && !charge.reasonCode) {\n <span>{{ charge.reason }}</span>\n }\n\n @if (!charge.reason && charge.reasonCode) {\n <span>{{ charge.reasonCode }}</span>\n }\n </td>\n </tr>\n <tr>\n <td class=\"currency-table-cell\">\n <span>\n {{ charge.netAmount | currencyPlus }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ charge.vatRate | percentPlus: '1.0-2' }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ charge.relativeChargePercentage | percentPlus: '1.0-2' }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ charge.relativeChargeBaseAmount | currencyPlus }}\n </span>\n </td>\n </tr>\n }\n </tbody>\n </table>\n }\n </section>\n\n <section class=\"payment-instructions\">\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.instructionsTopic }}\n </h2>\n @if (invoice()?.paymentInstructions?.description) {\n <p>{{ invoice()?.paymentInstructions?.description }}</p>\n }\n @for (means of invoice()?.paymentInstructions?.paymentMeans; track means) {\n <div>\n @if (means.accountIdentifier) {\n <p>\n <strong>{{ textWords.instructionsAccountIdentifier }}: </strong>\n <br />\n <span>{{ means.accountIdentifier }}</span>\n </p>\n }\n @if (means.accountName) {\n <p>\n <strong>{{ textWords.instructionsAccountName }}: </strong>\n <br />\n <span>{{ means.accountName }}</span>\n </p>\n }\n @if (means.serviceProviderIdentifier) {\n <p>\n <strong>{{ textWords.instructionsServiceProviderIdentifier }}: </strong>\n <br />\n <span>{{ means.serviceProviderIdentifier }}</span>\n </p>\n }\n </div>\n }\n </section>\n\n <section class=\"invoice-totals\">\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.totalsTopic }}\n </h2>\n\n @if (invoice()?.totals?.totalNet != null) {\n <p>\n <strong>{{ textWords.totalsTotalNet }}: </strong>\n <br />\n <span>{{ invoice()?.totals?.totalNet | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalAllowances != null) {\n <p>\n <strong>{{ textWords.totalsTotalAllowances }}: </strong>\n <br />\n <span> {{ invoice()?.totals?.totalAllowances | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalCharges != null) {\n <p>\n <strong>{{ textWords.totalsTotalCharges }}: </strong>\n <br />\n <span> {{ invoice()?.totals?.totalCharges | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalAfterDeductions != null) {\n <p>\n <strong>{{ textWords.totalsTotalAfterDeductions }}: </strong>\n <br />\n <span>{{ invoice()?.totals?.totalAfterDeductions | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalVatAmount != null) {\n <p>\n <strong>{{ textWords.totalsTotalVatAmount }}: </strong>\n <br />\n <span>{{ invoice()?.totals?.totalVatAmount | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalGross != null) {\n <p>\n <strong>{{ textWords.totalsTotalGross }}: </strong>\n <br />\n <span> {{ invoice()?.totals?.totalGross | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.alreadyPaidTotal != null) {\n <p>\n <strong>{{ textWords.totalsAlreadyPaidTotal }}: </strong>\n <br />\n <span>{{ invoice()?.totals?.alreadyPaidTotal | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalToBePaid != null) {\n <p\n class=\"total\"\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n <strong>{{ totalsTotalToBePaidTitle() }}: </strong>\n <br />\n <strong> {{ invoice()?.totals?.totalToBePaid | currencyPlus }}</strong>\n </p>\n }\n </section>\n </div>\n @if (invoice()?.previousInvoices && invoice()?.previousInvoices?.length) {\n <section\n class=\"previous-invoices\"\n [style]=\"{\n justifyContent: (alignmentOptions$ | async)?.previousInvoiceAlignment || '',\n }\"\n >\n <div class=\"previous-invoices-wrapper\">\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.previousInvoicesTopic }}\n </h2>\n\n <table class=\"previous-invoices-table\">\n <thead>\n <tr>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.previousInvoiceNumber }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.previousInvoiceDate }}\n </th>\n </tr>\n </thead>\n <tbody>\n @for (prevInvoice of invoice()?.previousInvoices; track prevInvoice) {\n <tr>\n <td>\n {{ prevInvoice.invoiceNumber }}\n </td>\n <td>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (prevInvoice.invoiceDate | date: 'dd.MM.yyyy')\n : (prevInvoice.invoiceDate | date: 'dd/MM/yyyy')\n }}\n </td>\n </tr>\n }\n </tbody>\n </table>\n </div>\n </section>\n }\n\n @if (invoice()?.invoiceNotes?.length) {\n <section class=\"invoice-notes\">\n <h2>{{ textWords.notesTopic }}</h2>\n @for (note of invoice()?.invoiceNotes; track note) {\n <div>\n @if (note?.shortText) {\n <p>\n <strong>{{ note?.shortText }}</strong>\n </p>\n }\n @if (note?.longText) {\n <p>\n @for (line of note.longText! | lineSplit; track line; let isLast = $last) {\n {{ line }}\n\n @if (!isLast) {\n <br />\n }\n }\n </p>\n }\n </div>\n }\n </section>\n }\n @if (invoice()?.documents?.length) {\n <section class=\"invoice-attachments\">\n <ava-invoice-documents [documents]=\"invoice()?.documents || []\"></ava-invoice-documents>\n </section>\n }\n </div>\n } @else if (invoice() === null && (pdfViewEnabled$ | async)) {\n <div class=\"error-container\">\n <div class=\"error-message\">\n <mat-icon>error_outline</mat-icon>\n <h2>Oops! Something went wrong.</h2>\n <p>We couldn't retrieve the invoice data. Please try again later.</p>\n </div>\n </div>\n } @else {\n <div></div>\n }\n }\n}\n", styles: [".invoice-container{width:100%;max-width:800px;margin:auto;font-family:Arial,sans-serif;line-height:1.5}.invoice-header{display:flex;justify-content:space-between;margin-bottom:20px;gap:10px;font-size:calc(1em - 1pt)}.invoice-header .header{height:32px}.invoice-header .header-title{background:var(--color-primary);color:#fff;text-align:center}.seller-info,.buyer-info,.invoice-details .seller-tax-representive{width:25%}.seller-info,.payment-instructions,.invoice-totals{text-align:right}.currency-table-cell{text-align:right!important}.invoice-title{font-size:48px;margin:20px 0}.invoice-references,.invoice-totals,.payment-instructions,.invoice-notes,.taxes-and-allowances,.invoice-delivery,.invoice-details{margin:20px 0}.invoice-totals p,.payment-instructions p,.invoice-notes p{margin:5px 0}h2{font-size:18px;margin-bottom:10px}.addition-info{display:flex;justify-content:space-between;gap:10px}.total{background-color:var(--color-primary);color:#fff;padding:5px;border-radius:5px}th{color:#fff;text-wrap:nowrap}.invoice-attachments{padding-bottom:15px}.info-title{border-bottom:2px solid var(--color-primary);text-align:center}.previous-invoices{width:100%;display:flex}.previous-invoices-wrapper{width:400px}.tax-report-table,.previous-invoices-table{width:100%;border-collapse:collapse;margin-top:10px}.tax-report-table th,.previous-invoices-table th,.tax-report-table td,.previous-invoices-table td{padding:6px;text-align:center;border:1px solid #ddd}.tax-report-table th,.previous-invoices-table th{background-color:var(--color-primary);color:#fff;font-weight:700;border:1px solid #000}.tax-report-table td,.previous-invoices-table td{font-size:14px;color:#333;border:1px solid #000}.center{text-align:center!important}.error-container{display:flex;justify-content:center;align-items:center;height:100vh}.error-message{text-align:center;background-color:#fff3f3;border:1px solid #d32f2f;padding:20px;border-radius:8px;box-shadow:0 4px 6px #0000001a;color:#d32f2f;max-width:400px;width:100%}.error-message h2{font-size:1.5em;margin:0 0 10px;font-weight:700}.error-message p{font-size:1em;margin-top:0;color:#555}.invoice-date{margin-bottom:12px;display:flex;gap:5px}.line-break-after{display:block}\n"], dependencies: [{ kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i1$4.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: InvoiceDocumentsComponent, selector: "ava-invoice-documents", inputs: ["documents"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: InvoiceLineItemsTableComponent, selector: "ava-invoice-line-items-table", inputs: ["lineItems"] }, { kind: "component", type: ReferenceAndDeliveryInformationComponent, selector: "ava-reference-and-delivery-information", inputs: ["deliveryInformation", "references"] }, { kind: "component", type: OrganizationInfoComponent, selector: "ava-organization-info", inputs: ["organizationInfo"] }, { kind: "pipe", type: PercentPlusPipe, name: "percentPlus" }, { kind: "pipe", type: CurrencyPlusPipe, name: "currencyPlus" }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: LineSplitPipe, name: "lineSplit" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
3247
3267
  }
3248
3268
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: InvoiceDisplayComponent, decorators: [{
3249
3269
  type: Component,
@@ -3269,7 +3289,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
3269
3289
  useFactory: (configurationInvoiceService) => configurationInvoiceService.locale,
3270
3290
  deps: [ConfigurationInvoiceService]
3271
3291
  }
3272
- ], template: "@if (textWords$ | async; as textWords) {\n @if ((colorSettings$ | async) || true; as colorSettings) {\n @if (invoice() !== null) {\n <div class=\"invoice-container\">\n <!-- Seller and Buyer Information -->\n <h1 class=\"invoice-title\">{{ invoiceTitle() }}</h1>\n\n <header class=\"invoice-header\">\n <div class=\"buyer-info\">\n <ava-organization-info [organizationInfo]=\"invoice()?.buyer || null\">\n <h2\n class=\"header-title\"\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceBuyerTitle }}\n </h2>\n </ava-organization-info>\n </div>\n <div class=\"invoice-details\">\n @if (invoice()?.invoiceNumber) {\n <p>\n <strong>{{ textWords.detailsInvoiceNumber }}: </strong>\n <span>{{ invoice()?.invoiceNumber }}</span>\n </p>\n }\n @if (invoice()?.invoiceDate) {\n <div class=\"invoice-date\">\n <strong>{{ textWords.detailsInvoiceDate }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (invoice()?.invoiceDate | date: 'dd.MM.yyyy')\n : (invoice()?.invoiceDate | date: 'dd/MM/yyyy')\n }}</span\n >\n </div>\n }\n @if (invoice()?.paymentDueDate) {\n <div class=\"invoice-date\">\n <strong>{{ textWords.detailsPaymentDueDate }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (invoice()?.paymentDueDate | date: 'dd.MM.yyyy')\n : (invoice()?.paymentDueDate | date: 'dd/MM/yyyy')\n }}</span\n >\n </div>\n }\n @if (invoice()?.invoicePeriod && (invoice()?.invoicePeriod?.start || invoice()?.invoicePeriod?.end)) {\n @if (invoice()!.invoicePeriod!.start && invoice()!.invoicePeriod!.end) {\n <p>\n <strong class=\"line-break-after\">{{ textWords.detailsInvoicePeriod }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (invoice()!.invoicePeriod!.start | date: 'dd.MM.yyyy')\n : (invoice()!.invoicePeriod!.start | date: 'dd/MM/yyyy')\n }}\n -\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (invoice()!.invoicePeriod!.end | date: 'dd.MM.yyyy')\n : (invoice()!.invoicePeriod!.end | date: 'dd/MM/yyyy')\n }}\n </span>\n </p>\n } @else {\n <div class=\"invoice-date\">\n <strong>{{ textWords.detailsInvoicePeriodSingle }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? ((invoice()?.invoicePeriod)!.start || (invoice()?.invoicePeriod)!.end | date: 'dd.MM.yyyy')\n : ((invoice()?.invoicePeriod)!.start || (invoice()?.invoicePeriod)!.end | date: 'dd/MM/yyyy')\n }}</span\n >\n </div>\n }\n }\n @if (invoice()?.currencyCode) {\n <p>\n <strong>{{ textWords.detailsCurrencyCode }}: </strong>\n <span>{{ invoice()?.currencyCode }}</span>\n </p>\n }\n @if (invoice()?.paymentTerms) {\n <p>\n <strong class=\"line-break-after\">{{ textWords.detailsPaymentTerms }}: </strong>\n <span>{{ invoice()?.paymentTerms }}</span>\n </p>\n }\n </div>\n\n <div class=\"seller-tax-representive\">\n <ava-organization-info [organizationInfo]=\"invoice()?.sellerTaxRepresentative || null\">\n <h2\n class=\"header-title\"\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceSellerTaxRepresentativeTitle }}\n </h2>\n </ava-organization-info>\n </div>\n <div class=\"seller-info\">\n <ava-organization-info [organizationInfo]=\"invoice()?.seller || null\">\n <h2\n class=\"header-title\"\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceSellerTitle }}\n </h2>\n </ava-organization-info>\n </div>\n </header>\n <mat-divider></mat-divider>\n\n <ava-reference-and-delivery-information\n [deliveryInformation]=\"invoice()?.deliveryInformation || null\"\n [references]=\"invoice()?.references || null\"\n ></ava-reference-and-delivery-information>\n <ava-invoice-line-items-table [lineItems]=\"invoice()?.lineItems || []\"></ava-invoice-line-items-table>\n\n <div class=\"addition-info\">\n <section class=\"taxes-and-allowances\">\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.taxesHeading }}\n </h2>\n <table class=\"tax-report-table\">\n <thead>\n <tr>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.vat }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.totalsTotalNet }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.totalsTotalVatAmount }}\n </th>\n </tr>\n </thead>\n <tbody>\n @for (tax of invoice()?.vatBreakdown; track tax.taxRate) {\n @if (tax.vatExemptionReasonText || tax.vatExemptionReasonCode) {\n <tr>\n <td colspan=\"3\">\n <span>{{ tax.vatExemptionReasonText }} / {{ tax.vatExemptionReasonCode }}</span>\n </td>\n </tr>\n }\n\n <tr>\n <td class=\"currency-table-cell\">\n @if (tax.taxRate != null) {\n <span>{{ tax.taxRate | percentPlus: '1.0-2' }}</span>\n }\n </td>\n <td class=\"currency-table-cell\">\n @if (tax.netTaxableAmount != null) {\n <span>{{ tax.netTaxableAmount | currencyPlus }}</span>\n }\n </td>\n <td class=\"currency-table-cell\">\n @if (tax.vatAmount != null) {\n <span>{{ tax.vatAmount | currencyPlus }}</span>\n }\n </td>\n </tr>\n }\n </tbody>\n </table>\n\n @if (invoice()?.allowances && (invoice()?.allowances?.length || 0) > 0) {\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.invoiceAllowancesHeader }}\n </h2>\n\n <table class=\"tax-report-table\">\n <thead>\n <tr>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceAllowancesTableHeaderSum }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceAllowancesTableHeaderVatRate }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceAllowancesTableHeaderAllowance }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceAllowancesTableHeaderBase }}\n </th>\n </tr>\n </thead>\n <tbody>\n @for (allowance of invoice()?.allowances; track allowance) {\n <tr>\n <td colspan=\"4\">\n @if (allowance.reason && allowance.reasonCode) {\n <span>{{ allowance.reason }} / {{ allowance.reasonCode }}</span>\n }\n @if (allowance.reason && !allowance.reasonCode) {\n <span>{{ allowance.reason }}</span>\n }\n\n @if (!allowance.reason && allowance.reasonCode) {\n <span>{{ allowance.reasonCode }}</span>\n }\n </td>\n </tr>\n <tr>\n <td class=\"currency-table-cell\">\n <span>\n {{ allowance.netAmount | currencyPlus }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ allowance.vatRate | percentPlus: '1.0-2' }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ allowance.relativeAllowancePercentage | percentPlus: '1.0-2' }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ allowance.relativeAllowanceBaseAmount | currencyPlus }}\n </span>\n </td>\n </tr>\n }\n </tbody>\n </table>\n }\n\n @if (invoice()?.charges && (invoice()?.charges?.length || 0) > 0) {\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.invoiceChargesHeader }}\n </h2>\n\n <table class=\"tax-report-table\">\n <thead>\n <tr>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceChargesTableHeaderSum }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceChargesTableHeaderVatRate }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceChargesTableHeaderCharge }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceChargesTableHeaderBase }}\n </th>\n </tr>\n </thead>\n <tbody>\n @for (charge of invoice()?.charges; track charge) {\n <tr>\n <td colspan=\"4\">\n @if (charge.reason && charge.reasonCode) {\n <span>{{ charge.reason }} / {{ charge.reasonCode }}</span>\n }\n @if (charge.reason && !charge.reasonCode) {\n <span>{{ charge.reason }}</span>\n }\n\n @if (!charge.reason && charge.reasonCode) {\n <span>{{ charge.reasonCode }}</span>\n }\n </td>\n </tr>\n <tr>\n <td class=\"currency-table-cell\">\n <span>\n {{ charge.netAmount | currencyPlus }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ charge.vatRate | percentPlus: '1.0-2' }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ charge.relativeChargePercentage | percentPlus: '1.0-2' }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ charge.relativeChargeBaseAmount | currencyPlus }}\n </span>\n </td>\n </tr>\n }\n </tbody>\n </table>\n }\n </section>\n\n <section class=\"payment-instructions\">\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.instructionsTopic }}\n </h2>\n @if (invoice()?.paymentInstructions?.description) {\n <p>{{ invoice()?.paymentInstructions?.description }}</p>\n }\n @for (means of invoice()?.paymentInstructions?.paymentMeans; track means) {\n <div>\n @if (means.accountIdentifier) {\n <p>\n <strong>{{ textWords.instructionsAccountIdentifier }}: </strong>\n <br />\n <span>{{ means.accountIdentifier }}</span>\n </p>\n }\n @if (means.accountName) {\n <p>\n <strong>{{ textWords.instructionsAccountName }}: </strong>\n <br />\n <span>{{ means.accountName }}</span>\n </p>\n }\n @if (means.serviceProviderIdentifier) {\n <p>\n <strong>{{ textWords.instructionsServiceProviderIdentifier }}: </strong>\n <br />\n <span>{{ means.serviceProviderIdentifier }}</span>\n </p>\n }\n </div>\n }\n </section>\n\n <section class=\"invoice-totals\">\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.totalsTopic }}\n </h2>\n\n @if (invoice()?.totals?.totalNet != null) {\n <p>\n <strong>{{ textWords.totalsTotalNet }}: </strong>\n <br />\n <span>{{ invoice()?.totals?.totalNet | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalAllowances != null) {\n <p>\n <strong>{{ textWords.totalsTotalAllowances }}: </strong>\n <br />\n <span> {{ invoice()?.totals?.totalAllowances | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalCharges != null) {\n <p>\n <strong>{{ textWords.totalsTotalCharges }}: </strong>\n <br />\n <span> {{ invoice()?.totals?.totalCharges | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalAfterDeductions != null) {\n <p>\n <strong>{{ textWords.totalsTotalAfterDeductions }}: </strong>\n <br />\n <span>{{ invoice()?.totals?.totalAfterDeductions | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalVatAmount != null) {\n <p>\n <strong>{{ textWords.totalsTotalVatAmount }}: </strong>\n <br />\n <span>{{ invoice()?.totals?.totalVatAmount | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalGross != null) {\n <p>\n <strong>{{ textWords.totalsTotalGross }}: </strong>\n <br />\n <span> {{ invoice()?.totals?.totalGross | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.alreadyPaidTotal != null) {\n <p>\n <strong>{{ textWords.totalsAlreadyPaidTotal }}: </strong>\n <br />\n <span>{{ invoice()?.totals?.alreadyPaidTotal | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalToBePaid != null) {\n <p\n class=\"total\"\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n <strong>{{ textWords.totalsTotalToBePaid }}: </strong>\n <br />\n <strong> {{ invoice()?.totals?.totalToBePaid | currencyPlus }}</strong>\n </p>\n }\n </section>\n </div>\n @if (invoice()?.previousInvoices && invoice()?.previousInvoices?.length) {\n <section\n class=\"previous-invoices\"\n [style]=\"{\n justifyContent: (alignmentOptions$ | async)?.previousInvoiceAlignment || '',\n }\"\n >\n <div class=\"previous-invoices-wrapper\">\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.previousInvoicesTopic }}\n </h2>\n\n <table class=\"previous-invoices-table\">\n <thead>\n <tr>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.previousInvoiceNumber }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.previousInvoiceDate }}\n </th>\n </tr>\n </thead>\n <tbody>\n @for (prevInvoice of invoice()?.previousInvoices; track prevInvoice) {\n <tr>\n <td>\n {{ prevInvoice.invoiceNumber }}\n </td>\n <td>\n {{ prevInvoice.invoiceDate | date: 'shortDate' }}\n </td>\n </tr>\n }\n </tbody>\n </table>\n </div>\n </section>\n }\n\n @if (invoice()?.invoiceNotes?.length) {\n <section class=\"invoice-notes\">\n <h2>{{ textWords.notesTopic }}</h2>\n @for (note of invoice()?.invoiceNotes; track note) {\n <div>\n @if (note?.shortText) {\n <p>\n <strong>{{ note?.shortText }}</strong>\n </p>\n }\n @if (note?.longText) {\n <p>\n @for (line of note.longText! | lineSplit; track line; let isLast = $last) {\n {{ line }}\n\n @if (!isLast) {\n <br />\n }\n }\n </p>\n }\n </div>\n }\n </section>\n }\n @if (invoice()?.documents?.length) {\n <section class=\"invoice-attachments\">\n <ava-invoice-documents [documents]=\"invoice()?.documents || []\"></ava-invoice-documents>\n </section>\n }\n </div>\n } @else if (invoice() === null && (pdfViewEnabled$ | async)) {\n <div class=\"error-container\">\n <div class=\"error-message\">\n <mat-icon>error_outline</mat-icon>\n <h2>Oops! Something went wrong.</h2>\n <p>We couldn't retrieve the invoice data. Please try again later.</p>\n </div>\n </div>\n } @else {\n <div></div>\n }\n }\n}\n", styles: [".invoice-container{width:100%;max-width:800px;margin:auto;font-family:Arial,sans-serif;line-height:1.5}.invoice-header{display:flex;justify-content:space-between;margin-bottom:20px;gap:10px;font-size:calc(1em - 1pt)}.invoice-header .header{height:32px}.invoice-header .header-title{background:var(--color-primary);color:#fff;text-align:center}.seller-info,.buyer-info,.invoice-details .seller-tax-representive{width:25%}.seller-info,.payment-instructions,.invoice-totals{text-align:right}.currency-table-cell{text-align:right!important}.invoice-title{font-size:48px;margin:20px 0}.invoice-references,.invoice-totals,.payment-instructions,.invoice-notes,.taxes-and-allowances,.invoice-delivery,.invoice-details{margin:20px 0}.invoice-totals p,.payment-instructions p,.invoice-notes p{margin:5px 0}h2{font-size:18px;margin-bottom:10px}.addition-info{display:flex;justify-content:space-between;gap:10px}.total{background-color:var(--color-primary);color:#fff;padding:5px;border-radius:5px}th{color:#fff;text-wrap:nowrap}.invoice-attachments{padding-bottom:15px}.info-title{border-bottom:2px solid var(--color-primary);text-align:center}.previous-invoices{width:100%;display:flex}.previous-invoices-wrapper{width:400px}.tax-report-table,.previous-invoices-table{width:100%;border-collapse:collapse;margin-top:10px}.tax-report-table th,.previous-invoices-table th,.tax-report-table td,.previous-invoices-table td{padding:6px;text-align:center;border:1px solid #ddd}.tax-report-table th,.previous-invoices-table th{background-color:var(--color-primary);color:#fff;font-weight:700;border:1px solid #000}.tax-report-table td,.previous-invoices-table td{font-size:14px;color:#333;border:1px solid #000}.center{text-align:center!important}.error-container{display:flex;justify-content:center;align-items:center;height:100vh}.error-message{text-align:center;background-color:#fff3f3;border:1px solid #d32f2f;padding:20px;border-radius:8px;box-shadow:0 4px 6px #0000001a;color:#d32f2f;max-width:400px;width:100%}.error-message h2{font-size:1.5em;margin:0 0 10px;font-weight:700}.error-message p{font-size:1em;margin-top:0;color:#555}.invoice-date{margin-bottom:12px;display:flex;gap:5px}.line-break-after{display:block}\n"] }]
3292
+ ], template: "@if (textWords$ | async; as textWords) {\n @if ((colorSettings$ | async) || true; as colorSettings) {\n @if (invoice() !== null) {\n <div class=\"invoice-container\">\n <!-- Seller and Buyer Information -->\n <h1 class=\"invoice-title\">{{ invoiceTitle() }}</h1>\n\n <header class=\"invoice-header\">\n <div class=\"buyer-info\">\n <ava-organization-info [organizationInfo]=\"invoice()?.buyer || null\">\n <h2\n class=\"header-title\"\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceBuyerTitle }}\n </h2>\n </ava-organization-info>\n </div>\n <div class=\"invoice-details\">\n @if (invoice()?.invoiceNumber) {\n <p>\n <strong>{{ textWords.detailsInvoiceNumber }}: </strong>\n <span>{{ invoice()?.invoiceNumber }}</span>\n </p>\n }\n @if (invoice()?.invoiceDate) {\n <div class=\"invoice-date\">\n <strong>{{ textWords.detailsInvoiceDate }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (invoice()?.invoiceDate | date: 'dd.MM.yyyy')\n : (invoice()?.invoiceDate | date: 'dd/MM/yyyy')\n }}</span\n >\n </div>\n }\n @if (invoice()?.paymentDueDate) {\n <div class=\"invoice-date\">\n <strong>{{ textWords.detailsPaymentDueDate }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (invoice()?.paymentDueDate | date: 'dd.MM.yyyy')\n : (invoice()?.paymentDueDate | date: 'dd/MM/yyyy')\n }}</span\n >\n </div>\n }\n @if (invoice()?.invoicePeriod && (invoice()?.invoicePeriod?.start || invoice()?.invoicePeriod?.end)) {\n @if (invoice()!.invoicePeriod!.start && invoice()!.invoicePeriod!.end) {\n <p>\n <strong class=\"line-break-after\">{{ textWords.detailsInvoicePeriod }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (invoice()!.invoicePeriod!.start | date: 'dd.MM.yyyy')\n : (invoice()!.invoicePeriod!.start | date: 'dd/MM/yyyy')\n }}\n -\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (invoice()!.invoicePeriod!.end | date: 'dd.MM.yyyy')\n : (invoice()!.invoicePeriod!.end | date: 'dd/MM/yyyy')\n }}\n </span>\n </p>\n } @else {\n <div class=\"invoice-date\">\n <strong>{{ textWords.detailsInvoicePeriodSingle }}: </strong>\n <span>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? ((invoice()?.invoicePeriod)!.start || (invoice()?.invoicePeriod)!.end | date: 'dd.MM.yyyy')\n : ((invoice()?.invoicePeriod)!.start || (invoice()?.invoicePeriod)!.end | date: 'dd/MM/yyyy')\n }}</span\n >\n </div>\n }\n }\n @if (invoice()?.currencyCode) {\n <p>\n <strong>{{ textWords.detailsCurrencyCode }}: </strong>\n <span>{{ invoice()?.currencyCode }}</span>\n </p>\n }\n @if (invoice()?.paymentTerms) {\n <p>\n <strong class=\"line-break-after\">{{ textWords.detailsPaymentTerms }}: </strong>\n <span>{{ invoice()?.paymentTerms }}</span>\n </p>\n }\n </div>\n\n <div class=\"seller-tax-representive\">\n <ava-organization-info [organizationInfo]=\"invoice()?.sellerTaxRepresentative || null\">\n <h2\n class=\"header-title\"\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceSellerTaxRepresentativeTitle }}\n </h2>\n </ava-organization-info>\n </div>\n <div class=\"seller-info\">\n <ava-organization-info [organizationInfo]=\"invoice()?.seller || null\">\n <h2\n class=\"header-title\"\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceSellerTitle }}\n </h2>\n </ava-organization-info>\n </div>\n </header>\n <mat-divider></mat-divider>\n\n <ava-reference-and-delivery-information\n [deliveryInformation]=\"invoice()?.deliveryInformation || null\"\n [references]=\"invoice()?.references || null\"\n ></ava-reference-and-delivery-information>\n <ava-invoice-line-items-table [lineItems]=\"invoice()?.lineItems || []\"></ava-invoice-line-items-table>\n\n <div class=\"addition-info\">\n <section class=\"taxes-and-allowances\">\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.taxesHeading }}\n </h2>\n <table class=\"tax-report-table\">\n <thead>\n <tr>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.vat }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.totalsTotalNet }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.totalsTotalVatAmount }}\n </th>\n </tr>\n </thead>\n <tbody>\n @for (tax of invoice()?.vatBreakdown; track tax.taxRate) {\n @if (tax.vatExemptionReasonText || tax.vatExemptionReasonCode) {\n <tr>\n <td colspan=\"3\">\n <span>{{ tax.vatExemptionReasonText }} / {{ tax.vatExemptionReasonCode }}</span>\n </td>\n </tr>\n }\n\n <tr>\n <td class=\"currency-table-cell\">\n @if (tax.taxRate != null) {\n <span>{{ tax.taxRate | percentPlus: '1.0-2' }}</span>\n }\n </td>\n <td class=\"currency-table-cell\">\n @if (tax.netTaxableAmount != null) {\n <span>{{ tax.netTaxableAmount | currencyPlus }}</span>\n }\n </td>\n <td class=\"currency-table-cell\">\n @if (tax.vatAmount != null) {\n <span>{{ tax.vatAmount | currencyPlus }}</span>\n }\n </td>\n </tr>\n }\n </tbody>\n </table>\n\n @if (invoice()?.allowances && (invoice()?.allowances?.length || 0) > 0) {\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.invoiceAllowancesHeader }}\n </h2>\n\n <table class=\"tax-report-table\">\n <thead>\n <tr>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceAllowancesTableHeaderSum }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceAllowancesTableHeaderVatRate }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceAllowancesTableHeaderAllowance }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceAllowancesTableHeaderBase }}\n </th>\n </tr>\n </thead>\n <tbody>\n @for (allowance of invoice()?.allowances; track allowance) {\n <tr>\n <td colspan=\"4\">\n @if (allowance.reason && allowance.reasonCode) {\n <span>{{ allowance.reason }} / {{ allowance.reasonCode }}</span>\n }\n @if (allowance.reason && !allowance.reasonCode) {\n <span>{{ allowance.reason }}</span>\n }\n\n @if (!allowance.reason && allowance.reasonCode) {\n <span>{{ allowance.reasonCode }}</span>\n }\n </td>\n </tr>\n <tr>\n <td class=\"currency-table-cell\">\n <span>\n {{ allowance.netAmount | currencyPlus }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ allowance.vatRate | percentPlus: '1.0-2' }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ allowance.relativeAllowancePercentage | percentPlus: '1.0-2' }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ allowance.relativeAllowanceBaseAmount | currencyPlus }}\n </span>\n </td>\n </tr>\n }\n </tbody>\n </table>\n }\n\n @if (invoice()?.charges && (invoice()?.charges?.length || 0) > 0) {\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.invoiceChargesHeader }}\n </h2>\n\n <table class=\"tax-report-table\">\n <thead>\n <tr>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceChargesTableHeaderSum }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceChargesTableHeaderVatRate }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceChargesTableHeaderCharge }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.invoiceChargesTableHeaderBase }}\n </th>\n </tr>\n </thead>\n <tbody>\n @for (charge of invoice()?.charges; track charge) {\n <tr>\n <td colspan=\"4\">\n @if (charge.reason && charge.reasonCode) {\n <span>{{ charge.reason }} / {{ charge.reasonCode }}</span>\n }\n @if (charge.reason && !charge.reasonCode) {\n <span>{{ charge.reason }}</span>\n }\n\n @if (!charge.reason && charge.reasonCode) {\n <span>{{ charge.reasonCode }}</span>\n }\n </td>\n </tr>\n <tr>\n <td class=\"currency-table-cell\">\n <span>\n {{ charge.netAmount | currencyPlus }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ charge.vatRate | percentPlus: '1.0-2' }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ charge.relativeChargePercentage | percentPlus: '1.0-2' }}\n </span>\n </td>\n <td class=\"currency-table-cell\">\n <span>\n {{ charge.relativeChargeBaseAmount | currencyPlus }}\n </span>\n </td>\n </tr>\n }\n </tbody>\n </table>\n }\n </section>\n\n <section class=\"payment-instructions\">\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.instructionsTopic }}\n </h2>\n @if (invoice()?.paymentInstructions?.description) {\n <p>{{ invoice()?.paymentInstructions?.description }}</p>\n }\n @for (means of invoice()?.paymentInstructions?.paymentMeans; track means) {\n <div>\n @if (means.accountIdentifier) {\n <p>\n <strong>{{ textWords.instructionsAccountIdentifier }}: </strong>\n <br />\n <span>{{ means.accountIdentifier }}</span>\n </p>\n }\n @if (means.accountName) {\n <p>\n <strong>{{ textWords.instructionsAccountName }}: </strong>\n <br />\n <span>{{ means.accountName }}</span>\n </p>\n }\n @if (means.serviceProviderIdentifier) {\n <p>\n <strong>{{ textWords.instructionsServiceProviderIdentifier }}: </strong>\n <br />\n <span>{{ means.serviceProviderIdentifier }}</span>\n </p>\n }\n </div>\n }\n </section>\n\n <section class=\"invoice-totals\">\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.totalsTopic }}\n </h2>\n\n @if (invoice()?.totals?.totalNet != null) {\n <p>\n <strong>{{ textWords.totalsTotalNet }}: </strong>\n <br />\n <span>{{ invoice()?.totals?.totalNet | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalAllowances != null) {\n <p>\n <strong>{{ textWords.totalsTotalAllowances }}: </strong>\n <br />\n <span> {{ invoice()?.totals?.totalAllowances | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalCharges != null) {\n <p>\n <strong>{{ textWords.totalsTotalCharges }}: </strong>\n <br />\n <span> {{ invoice()?.totals?.totalCharges | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalAfterDeductions != null) {\n <p>\n <strong>{{ textWords.totalsTotalAfterDeductions }}: </strong>\n <br />\n <span>{{ invoice()?.totals?.totalAfterDeductions | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalVatAmount != null) {\n <p>\n <strong>{{ textWords.totalsTotalVatAmount }}: </strong>\n <br />\n <span>{{ invoice()?.totals?.totalVatAmount | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalGross != null) {\n <p>\n <strong>{{ textWords.totalsTotalGross }}: </strong>\n <br />\n <span> {{ invoice()?.totals?.totalGross | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.alreadyPaidTotal != null) {\n <p>\n <strong>{{ textWords.totalsAlreadyPaidTotal }}: </strong>\n <br />\n <span>{{ invoice()?.totals?.alreadyPaidTotal | currencyPlus }}</span>\n </p>\n }\n @if (invoice()?.totals?.totalToBePaid != null) {\n <p\n class=\"total\"\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n <strong>{{ totalsTotalToBePaidTitle() }}: </strong>\n <br />\n <strong> {{ invoice()?.totals?.totalToBePaid | currencyPlus }}</strong>\n </p>\n }\n </section>\n </div>\n @if (invoice()?.previousInvoices && invoice()?.previousInvoices?.length) {\n <section\n class=\"previous-invoices\"\n [style]=\"{\n justifyContent: (alignmentOptions$ | async)?.previousInvoiceAlignment || '',\n }\"\n >\n <div class=\"previous-invoices-wrapper\">\n <h2\n class=\"info-title\"\n [style.borderBottomColor]=\"colorSettings === true ? null : colorSettings?.backgroundColor\"\n >\n {{ textWords.previousInvoicesTopic }}\n </h2>\n\n <table class=\"previous-invoices-table\">\n <thead>\n <tr>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.previousInvoiceNumber }}\n </th>\n <th\n [style]=\"{\n backgroundColor: colorSettings === true ? null : colorSettings?.backgroundColor,\n color: colorSettings === true ? null : colorSettings?.textColor,\n }\"\n >\n {{ textWords.previousInvoiceDate }}\n </th>\n </tr>\n </thead>\n <tbody>\n @for (prevInvoice of invoice()?.previousInvoices; track prevInvoice) {\n <tr>\n <td>\n {{ prevInvoice.invoiceNumber }}\n </td>\n <td>\n {{\n configurationInvoiceService.locale === 'de-DE'\n ? (prevInvoice.invoiceDate | date: 'dd.MM.yyyy')\n : (prevInvoice.invoiceDate | date: 'dd/MM/yyyy')\n }}\n </td>\n </tr>\n }\n </tbody>\n </table>\n </div>\n </section>\n }\n\n @if (invoice()?.invoiceNotes?.length) {\n <section class=\"invoice-notes\">\n <h2>{{ textWords.notesTopic }}</h2>\n @for (note of invoice()?.invoiceNotes; track note) {\n <div>\n @if (note?.shortText) {\n <p>\n <strong>{{ note?.shortText }}</strong>\n </p>\n }\n @if (note?.longText) {\n <p>\n @for (line of note.longText! | lineSplit; track line; let isLast = $last) {\n {{ line }}\n\n @if (!isLast) {\n <br />\n }\n }\n </p>\n }\n </div>\n }\n </section>\n }\n @if (invoice()?.documents?.length) {\n <section class=\"invoice-attachments\">\n <ava-invoice-documents [documents]=\"invoice()?.documents || []\"></ava-invoice-documents>\n </section>\n }\n </div>\n } @else if (invoice() === null && (pdfViewEnabled$ | async)) {\n <div class=\"error-container\">\n <div class=\"error-message\">\n <mat-icon>error_outline</mat-icon>\n <h2>Oops! Something went wrong.</h2>\n <p>We couldn't retrieve the invoice data. Please try again later.</p>\n </div>\n </div>\n } @else {\n <div></div>\n }\n }\n}\n", styles: [".invoice-container{width:100%;max-width:800px;margin:auto;font-family:Arial,sans-serif;line-height:1.5}.invoice-header{display:flex;justify-content:space-between;margin-bottom:20px;gap:10px;font-size:calc(1em - 1pt)}.invoice-header .header{height:32px}.invoice-header .header-title{background:var(--color-primary);color:#fff;text-align:center}.seller-info,.buyer-info,.invoice-details .seller-tax-representive{width:25%}.seller-info,.payment-instructions,.invoice-totals{text-align:right}.currency-table-cell{text-align:right!important}.invoice-title{font-size:48px;margin:20px 0}.invoice-references,.invoice-totals,.payment-instructions,.invoice-notes,.taxes-and-allowances,.invoice-delivery,.invoice-details{margin:20px 0}.invoice-totals p,.payment-instructions p,.invoice-notes p{margin:5px 0}h2{font-size:18px;margin-bottom:10px}.addition-info{display:flex;justify-content:space-between;gap:10px}.total{background-color:var(--color-primary);color:#fff;padding:5px;border-radius:5px}th{color:#fff;text-wrap:nowrap}.invoice-attachments{padding-bottom:15px}.info-title{border-bottom:2px solid var(--color-primary);text-align:center}.previous-invoices{width:100%;display:flex}.previous-invoices-wrapper{width:400px}.tax-report-table,.previous-invoices-table{width:100%;border-collapse:collapse;margin-top:10px}.tax-report-table th,.previous-invoices-table th,.tax-report-table td,.previous-invoices-table td{padding:6px;text-align:center;border:1px solid #ddd}.tax-report-table th,.previous-invoices-table th{background-color:var(--color-primary);color:#fff;font-weight:700;border:1px solid #000}.tax-report-table td,.previous-invoices-table td{font-size:14px;color:#333;border:1px solid #000}.center{text-align:center!important}.error-container{display:flex;justify-content:center;align-items:center;height:100vh}.error-message{text-align:center;background-color:#fff3f3;border:1px solid #d32f2f;padding:20px;border-radius:8px;box-shadow:0 4px 6px #0000001a;color:#d32f2f;max-width:400px;width:100%}.error-message h2{font-size:1.5em;margin:0 0 10px;font-weight:700}.error-message p{font-size:1em;margin-top:0;color:#555}.invoice-date{margin-bottom:12px;display:flex;gap:5px}.line-break-after{display:block}\n"] }]
3273
3293
  }], ctorParameters: () => [], propDecorators: { invoice: [{ type: i0.Input, args: [{ isSignal: true, alias: "invoice", required: true }] }], config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: true }] }] } });
3274
3294
 
3275
3295
  /*