Report-lib NPM

Description report-lib

Library for generate paper reports with Angular projects. This package automatically split your data in several pages.

Быстрый старт

Создайте приложение angular: ng new my-report
Установите библиотеку report-lib: npm i report-lib
В файле src/styles.css добавьте импорт стиля:
```
@import '~report-lib/index.css';
```
Создайте компоненту шаблона отчёта ng g component my-report-template

В созданной компоненте добавьте наследование от класса BaseReportComponent.

export class MyReportTemplateComponent
 extends BaseReportTemplateComponent
 implements OnInit {
   constructor() {
      super();
   }
   ngOnInit(): void { }
}

В шаблоне компоненты опишите основную структуру:
```
<div repPageA4>
    
</div>
```
Для ландшафтной ориентации использовать структуру:
```
<div repPageA4="landscape">
    
</div>
```
Также для задания ориентации страницы можно использовать классы report-portrait и report-landscape.
В шаблоне обязательно должны быть указаны идентификаторы контента, вызываемые в цикле ngFor. Идентификатор указывается меткой #content на корневом блоке цикла. Все остальные элементы считаются статическим контентом. Пример:
```
```angular2html
<table>
    <tr>
        <td>№ п/п</td>
        <td>Содержимое</td>
    </tr>
    <ng-container *ngFor="let content of page.items; let npp = index">
      <tr #content>
        <td>{{npp}}</td>
        <td>{{content}}</td>
      </tr>
    </ng-container>
</table>
```
```
Создайте компоненту отчёта ng g component my-report

Загрузите в ней данные и создайте экземпляр класса PagesFactory. Выполните функцию splitPages().

pagesFactory: PagesFactory;
error;

constructor(private dataService: DataService) { }

ngOnInit(): void {
 this.dataService.getLocalReportData('my-report-id')
   .then(data => {
     this.pagesFactory = new PagesFactory(data);
     this.pagesFactory.splitPages();
   })
   .catch(e => this.error = e);
}

data = [{...}, {...}, {...}, ..., {...}]

Проитерируйте страницы и на каждую страницу в шаблоне вызовите ваш созданный шаблон my-report-template. В качестве параметров задайте page, pf, index

<ng-container *ngFor="let page of pagesFactory.pages; let i = index">
   <my-report-template
           [page]="page"
           [pf]="pagesFactory"
           [index]="i"></my-report-template>
</ng-container>

<rep-error-page
        *ngIf="error!==undefined"
        [error]="error"
></rep-error-page>

<div class="overlay no-print" *ngIf="!this.pagesFactory.complited">
   Идет построение отчёта
</div>

Описание методов и полей PagesFactory

constructor(DATA, CONTENT)

В качестве объекта DATA задайте произвольный массив. Данный массив в последующем будет делиться на страницы. Данные массива DATA будут записаны в поле items объекта Page. Также необязательно можно передать объект CONTENT. Данный объект будет записан в поле content объекта Page.

VERSION: string

Read-only.

Возвращает текущую версию библиотеки.

pages: Array\

Read-only.

Поле pages возвращает все страницы отчёта.

numPages: number

Read-only.

Поле numPages возвращает количество страниц отчёта.

items: Array\

Read-only.

Поле items возвращает массив DATA обернутый в объект PageItem.

completed: boolean

Read-only.

Возвращает true когда построение отчёта завершено, в противном случае false.

completedEvent: EventEmitter\

Read-only.

Возвращает объект-событие, на который можно подписаться командой .subscribe(). Событие вызывается, когда разбиение на страницы завершено (флаг completed = true).

maximumSplitIterations: number

Read-Write.

Задает максимальное количество итераций построения отчёта. По-умолчанию 5.

splitPages()

Вызывает цепочку функций для разделения исходного массива DATA на страницы.

reset()

Сбрасывает счётчик итераций построения отчёта и повторно вызывает метод splitPages() для имеющихся данных.

Описание полей класса Page

content: any

Поле content содержит произвольный объект, переданный в качестве параметра CONTENT в конструктор PagesFactory.

items: Array\

Поле items содержит массив PageItem, хранящийся для данной страницы

freeHeight: number

Поле freeHeight содержит высоту свободного места на странице. Может быть использовано в шаблоне для заполнения свободного пространства.

minimumFreeHeight: number

Read-Write.

Требуемое свободное место на странице. Задается в пикселях.

Описание полей класса PageItem

content: any

Содержит элемент массива DATA, переданный в качестве параметра в конструктор PagesFactory.

pageNum: number

Содержит индекс страницы, на которой данный объект располагается.

Директивы

repPageA4

Директива задаёт шаблон для построения отчётов на формате ISO А4. Директива принимает параметр portrait для вертикальной ориентации и landscape для горизонтальной ориентации.