diff --git a/Client/src/app/components/contributor-yearly-report/contributor-yearly-report.component.css b/Client/src/app/components/contributor-yearly-report/contributor-yearly-report.component.css index 4be74c1..212b9c3 100644 --- a/Client/src/app/components/contributor-yearly-report/contributor-yearly-report.component.css +++ b/Client/src/app/components/contributor-yearly-report/contributor-yearly-report.component.css @@ -11,6 +11,7 @@ -webkit-print-color-adjust: exact; color-adjust: exact; } + tr.page-break-after:after { content:""; display: block; page-break-before: always; } } .h-100 { @@ -109,7 +110,7 @@ border-collapse: collapse; } - table.borders, table.borders th, table.borders td { + table.borders th, table.borders tr.row td { border: 1px solid black; } @@ -117,6 +118,11 @@ padding: 5px; } - table.highlight-even tr:nth-child(even) { + table.highlight-even tr.row:nth-child(even) { background-color: #e6ffe6; + } + + table tbody tr.footer td { + font-size: small; + vertical-align: bottom; } \ No newline at end of file diff --git a/Client/src/app/components/contributor-yearly-report/contributor-yearly-report.component.html b/Client/src/app/components/contributor-yearly-report/contributor-yearly-report.component.html index d3aee19..fc806e7 100644 --- a/Client/src/app/components/contributor-yearly-report/contributor-yearly-report.component.html +++ b/Client/src/app/components/contributor-yearly-report/contributor-yearly-report.component.html @@ -41,15 +41,15 @@ - + General Fund {{totalGeneral() | currency}} - + Missions Fund {{totalMissions() | currency}} - + Total Giving {{(totalGeneral() + totalMissions()) | currency}} @@ -79,14 +79,43 @@ - + + {{t.date | date:'MM-dd-yyyy'}} {{t.type === 0 ? 'Cash' : 'Check'}} {{t.checkNumber}} {{t.fund === 0 ? 'General' : 'Missions'}} {{t.description}} {{t.amount | currency}} - + + + +
+

Old Fashion Baptist Church Giving Statement {{taxYear }}

+

Page {{calcPage(i+1)}} of {{pages}}

+
+ +
+ +
+ + +   + + + + + + + + +
+

Old Fashion Baptist Church Giving Statement 2019

+

Page {{pages}} of {{pages}}

+
+ + +
 
\ No newline at end of file diff --git a/Client/src/app/components/contributor-yearly-report/contributor-yearly-report.component.ts b/Client/src/app/components/contributor-yearly-report/contributor-yearly-report.component.ts index 7f73ac8..dcc727f 100644 --- a/Client/src/app/components/contributor-yearly-report/contributor-yearly-report.component.ts +++ b/Client/src/app/components/contributor-yearly-report/contributor-yearly-report.component.ts @@ -3,6 +3,7 @@ import { PrintService } from '../../services/print-service'; import { Transaction } from '../add-transaction-page/transaction'; import * as Chart from 'chart.js'; import ChartDataLabels from 'chartjs-plugin-datalabels'; +import { CurrencyPipe } from '@angular/common'; @Component({ selector: 'app-contributor-yearly-report', @@ -35,14 +36,20 @@ export class ContributorYearlyReportComponent implements OnInit { public contributorZip: string = '59701'; public taxYear: number = 2019; - public rowsFirstPage: number = 13; - public rowsPerPage: number = 32; + public rowsFirstPage: number = 12; + public rowsPerPage: number = 31; + public get fillerRows(): number[] { + const rowsToFillPage = this.rowsFirstPage + ((this.pages - 2) * this.rowsPerPage); + const rowsNeeded = rowsToFillPage - this.transactions.length; + return Array(rowsNeeded).fill(1).map((x,i)=>i) + } public get pages(): number { return Math.ceil((this.transactions.length - this.rowsFirstPage) / this.rowsPerPage) + 2; } public get pagesOdd(): boolean { return !(this.pages % 2 == 0) } + private currencyPipe: CurrencyPipe = new CurrencyPipe('en-US'); constructor(public printService: PrintService) { } @@ -80,7 +87,23 @@ export class ContributorYearlyReportComponent implements OnInit { return sum; } + public calcPage(index: number): number { + const val = Math.max(index, this.rowsFirstPage); + return Math.ceil((val - this.rowsFirstPage) / this.rowsPerPage) + 2; + } + + public isFooter(index: number): boolean { + if (index === this.rowsFirstPage) { + return true; + } + if (index === (this.rowsFirstPage + ((this.calcPage(index) - 2) * this.rowsPerPage))) { + return true; + } + return false; + } + private renderChart() { + const me = this; var myChart = new Chart(this.chartElement.nativeElement, { plugins: [ChartDataLabels], type: 'bar', @@ -106,7 +129,12 @@ export class ContributorYearlyReportComponent implements OnInit { stacked: true }], yAxes: [{ - stacked: true + stacked: true, + ticks: { + callback: function(value, index, values) { + return me.currencyPipe.transform(value, 'USD', 'symbol', '1.0-0'); + } + } }] }, plugins:{ @@ -118,7 +146,7 @@ export class ContributorYearlyReportComponent implements OnInit { if (value === 0) { return ''; } - return '$' + value.toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,'); + return me.currencyPipe.transform(value, 'USD', 'symbol', '1.0-2'); } } }