feat: implement invoice payments component and integrate with supplier invoices

src/app/shared/components/input/input.component.ts

@@ -1,5 +1,4 @@
 import { Maybe } from '@/core';
-import { PriceMaskDirective } from '@/shared/directives';
 import { UikitFieldComponent } from '@/uikit/uikit-field.component';
 import { CommonModule } from '@angular/common';
 import { Component, EventEmitter, Input, Output } from '@angular/core';
@@ -20,7 +19,6 @@ import { ToggleSwitch } from 'primeng/toggleswitch';
     InputGroupModule,
     UikitFieldComponent,
     ToggleSwitch,
-    PriceMaskDirective,
     InputGroupAddon,
     InputNumberModule,
   ],

src/app/shared/components/pageDataList/page-data-list.component.html

@@ -41,7 +41,15 @@
       <ng-template #header let-columns>
         <tr>
           @for (col of columns; track col.header) {
-            <th [style]="{ width: col.width, minWidth: col.minWidth }">{{ col.header }}</th>
+            <th
+              [style]="
+                col.type === 'index'
+                  ? { width: '3rem', minWidth: '3rem' }
+                  : { width: col.width, minWidth: col.minWidth }
+              "
+            >
+              {{ col.header }}
+            </th>
           }
           @if (actionsCount()) {
             <th type="th" [style]="{ width: `${actionsCount() * 2 + (actionsCount() - 1) * 0.25}rem` }"></th>
@@ -49,11 +57,13 @@
         </tr>
       </ng-template>
 
-      <ng-template #body let-item>
+      <ng-template #body let-item let-i="rowIndex">
         <tr>
           @for (col of columns; track col.field) {
             <td>
-              @if (getTemplate(col)) {
+              @if (col.type === "index") {
+                {{ i * (currentPage || 1) + 1 }}
+              } @else if (getTemplate(col)) {
                 <ng-container
                   [ngTemplateOutlet]="getTemplate(col)"
                   [ngTemplateOutletContext]="{ $implicit: item }"

src/app/shared/components/pageDataList/page-data-list.component.ts

@@ -24,7 +24,7 @@ export interface IColumn<T = any> {
   width?: string;
   minWidth?: string;
   canCopy?: boolean;
-  type?: 'text' | 'price' | 'boolean' | 'date' | 'nested';
+  type?: 'text' | 'price' | 'boolean' | 'date' | 'nested' | 'index';
   nestedPath?: string;
   customDataModel?: TemplateRef<any> | ((item: T) => string | number | boolean);
 }