add red border when dates do not match

test
dan 2019-11-23 11:08:15 -07:00
parent b886d79879
commit a471b3121b
3 changed files with 26 additions and 6 deletions

View File

@ -6,9 +6,9 @@
<table>
<tbody>
<ng-container *ngFor="let c of contributions; let ci = index">
<tr>
<!-- <td colspan="2" class="fw-bold fs-1-2-5">{{c.date}}</td> -->
<td colspan="3" class="fw-bold fs-1-2-5">{{contributorName(c.contributorId)}}</td>
<tr [class.bg-red]="contributorDatesMatch(c.contributorId)">
<td colspan="2" class="fw-bold fs-1-2-5">{{c.date}}</td>
<td colspan="4" class="fw-bold fs-1-2-5">{{contributorName(c.contributorId)}}</td>
</tr>
<tr>
<td></td>
@ -23,8 +23,8 @@
<td rowspan="2" style="width: 30px;">
<button mat-icon-button (click)="deleteTransaction(t.contributorId, ti)"><i ofbicon>delete_forever</i></button>
</td>
<td colspan="4" *ngIf="t.description && t.description.length > 0">{{t.description}}</td>
<td colspan="4" *ngIf="!t.description || t.description.length === 0" class="b-0 p-0"></td>
<td colspan="5" *ngIf="t.description && t.description.length > 0">{{t.description}}</td>
<td colspan="5" *ngIf="!t.description || t.description.length === 0" class="b-0 p-0"></td>
</tr>
<tr [class.highlight]="ti % 2">
<td [class.remove-top-border]="!t.description || t.description.length === 0">{{t.date}}</td>
@ -35,6 +35,7 @@
</tr>
</ng-container>
<tr>
<td></td>
<td></td>
<td></td>
<td class="fw-bold">General</td>
@ -42,6 +43,7 @@
<td class="fw-bold">Total</td>
</tr>
<tr class="highlight-yellow">
<td></td>
<td></td>
<td></td>
<td>{{contributorTotal(c.contributorId, 1) | currency}}</td>
@ -55,9 +57,10 @@
</tr>
</ng-container>
<tr>
<td colspan="5" class="fw-bold fs-1-2-5">Grand Totals</td>
<td colspan="6" class="fw-bold fs-1-2-5">Grand Totals</td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td class="fw-bold">General</td>
@ -65,6 +68,7 @@
<td class="fw-bold">Total</td>
</tr>
<tr class="highlight-yellow">
<td></td>
<td></td>
<td></td>
<td>{{combinedTotal(1) | currency}}</td>

View File

@ -107,6 +107,18 @@ export class AddTransactionPageComponent implements OnInit {
return contributor ? contributor.display : undefined;
}
contributorDatesMatch(contributorId: number) {
const contributor = this.contributions.find(c => c.contributorId === contributorId);
if (!contributor) return true;
let match = true;
contributor.transactions.forEach(t => {
if (t.date != contributor.date) {
match = false;
}
});
return match;
}
contributorTotal(contributorId: number, fundId: number) {
const contrib = this.contributions.find(c => c.contributorId === contributorId);
if (!contrib) return 0;

View File

@ -19,6 +19,10 @@ body {
color: red;
}
.bg-red {
background-color: red;
}
/*MATERIAL FONT FOR ICONS*/
@font-face {
font-family: 'Material Icons';