Multiple reports

Client/src/app/app-routing.module.ts

@@ -15,6 +15,7 @@ import { MembersPageComponent } from './components/members-page/members-page.com
 import { AddTransactionPageComponent } from './components/add-transaction-page/add-transaction-page.component';
 import { MissionaryFormPageComponent } from './components/missionary-form-page/missionary-form-page.component';
 import { ContributorYearlyReportComponent } from './components/contributor-yearly-report/contributor-yearly-report.component';
+import { ContributorAllReportsComponent } from './components/contributor-all-reports/contributor-all-reports.component';
 
 const routes =
   [
@@ -80,7 +81,7 @@ const routes =
       },
       {
         path: 'contributor/report',
-        component: ContributorYearlyReportComponent
+        component: ContributorAllReportsComponent
       }
     ]
 

Client/src/app/app.module.ts

@@ -75,6 +75,7 @@ import { AddTransactionPopupComponent } from './components/add-transaction-page/
 import { MissionaryFormPageComponent } from './components/missionary-form-page/missionary-form-page.component';
 import { MissionarySupportService } from './services/missionary-support-service';
 import { ContributorYearlyReportComponent } from './components/contributor-yearly-report/contributor-yearly-report.component';
+import { ContributorAllReportsComponent } from './components/contributor-all-reports/contributor-all-reports.component';
 
 
 
@@ -121,7 +122,8 @@ import { ContributorYearlyReportComponent } from './components/contributor-yearl
     AddTransactionPageComponent,
     AddTransactionPopupComponent,
     MissionaryFormPageComponent,
-    ContributorYearlyReportComponent
+    ContributorYearlyReportComponent,
+    ContributorAllReportsComponent
   ],
   imports: [
     BrowserModule,

Client/src/app/components/contributor-all-reports/contributor-all-reports.component.css

@@ -0,0 +1,5 @@
+@media print {
+    :host {
+        display: block;
+    }
+  }

Client/src/app/components/contributor-all-reports/contributor-all-reports.component.html

@@ -0,0 +1,4 @@
+
+<app-contributor-yearly-report *ngFor="let c of contributors; let i = index" [index]="i">
+
+</app-contributor-yearly-report>

Client/src/app/components/contributor-all-reports/contributor-all-reports.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ContributorAllReportsComponent } from './contributor-all-reports.component';
+
+describe('ContributorAllReportsComponent', () => {
+  let component: ContributorAllReportsComponent;
+  let fixture: ComponentFixture<ContributorAllReportsComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ContributorAllReportsComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ContributorAllReportsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

Client/src/app/components/contributor-all-reports/contributor-all-reports.component.ts

@@ -0,0 +1,21 @@
+import { Component, OnInit } from '@angular/core';
+import { PrintService } from 'src/app/services/print-service';
+
+@Component({
+  selector: 'app-contributor-all-reports',
+  templateUrl: './contributor-all-reports.component.html',
+  styleUrls: ['./contributor-all-reports.component.css']
+})
+export class ContributorAllReportsComponent implements OnInit {
+
+  public contributors: number[] = [];
+
+  constructor(private printService: PrintService) { }
+
+  ngOnInit() {
+    this.contributors.push(1);
+    this.contributors.push(2);
+    this.printService.setPrinting(true);
+  }
+
+}

Client/src/app/components/contributor-yearly-report/contributor-yearly-report.component.html

@@ -1,7 +1,9 @@
+
+<div *ngIf="index > 0" class="page-break-before"></div>
 <div class="h-100 flex flex-align-center flex-justify-center flex-direction-column">
   <img src="../../../assets/images/original/logo_dark.png">
   <p class="mt-5">
-    Old Fashion Baptist Church Contribution Report {{taxYear}}
+    Old Fashion Baptist Church Contribution Report {{taxYear}} {{index}}
   </p>
   <p class="mt-5">
     {{contributorName}}
@@ -85,4 +87,5 @@
         <td nowrap>{{t.amount | currency}}</td>
       </tr>   
   </tbody>
-</table>
+</table>
+<div *ngIf="pagesOdd" class="page-break-before">&nbsp;</div>

Client/src/app/components/contributor-yearly-report/contributor-yearly-report.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, Input } from '@angular/core';
 import { PrintService } from '../../services/print-service';
 import { Transaction } from '../add-transaction-page/transaction';
 
@@ -9,6 +9,7 @@ import { Transaction } from '../add-transaction-page/transaction';
 })
 export class ContributorYearlyReportComponent implements OnInit {
 
+  @Input() index: number;
   public transactions: Transaction[] = [];
   public contributorName: string = 'Bob and Jill Handerson';
   public contributorStreet: string = '7878 Washington St';
@@ -18,6 +19,14 @@ export class ContributorYearlyReportComponent implements OnInit {
   public taxYear: number = 2019;
   public registrationCode: string = 'HDIJDHDFD*#*@';
 
+  public rowsPerPage: number = 32;
+  public get pages(): number {
+    return Math.ceil(this.transactions.length / this.rowsPerPage) + 2;
+  }
+  public get pagesOdd(): boolean {
+    return !(this.pages % 2 == 0)
+  }
+
   constructor(public printService: PrintService) { }
 
   ngOnInit() {
@@ -31,7 +40,7 @@ export class ContributorYearlyReportComponent implements OnInit {
     t.goodsOrServices = false;
     t.taxYear = 2019;
     t.typeId = 1;
-    for(let i = 0; i < 100; i++) {
+    for(let i = 0; i < 90; i++) {
       const t2 = new Transaction();
       t2.amount = 300;
       t2.checkNumber = 'ghff';
@@ -45,8 +54,6 @@ export class ContributorYearlyReportComponent implements OnInit {
       this.transactions.push(t2);
     }
     this.transactions.push(t);
-    this.printService.setPrinting(true);
-    window.print();
   }
 
   public totalGeneral() {