blob: e8d292e91dbc256ec56e94cc703d255f14e5a80c (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
|
<div id="box">
<h1>{{need?.name}}</h1>
<span class="needType">{{need?.type}} GOAL</span>
<img *ngIf="need.image" alt="Need image" [src]="need?.image"/>
<p>{{need?.description}}</p>
<div class="prog">
<!-- <span>{{need?.current}} / {{need?.maxGoal}}</span>-->
<progress [value]="need?.current" [max]="need?.maxGoal"></progress>
<span>This goal is <strong>{{(((need?.current ?? 0)*100) / (need?.maxGoal ?? 0)).toFixed(0)}}%</strong> complete!</span>
</div>
<span><strong>Target Goal:</strong> {{need.maxGoal}}</span>
<span><strong>Amount Currently Collected:</strong> {{need.current}}</span>
<span><strong>Location:</strong> {{need.location}}</span>
<span><strong>Urgency: </strong>
<span *ngIf="!need.urgent">Not urgent</span>
<span *ngIf="need.urgent" class="urgent">URGENT</span>
</span>
<div *ngIf="need.filterAttributes.length > 0">
<strong>Tags:</strong>
<ul style="display: flex; column-gap: 24px;">
<li *ngFor="let tag of need?.filterAttributes">
<p>{{tag}}</p>
</li>
</ul>
</div>
<div class="actionArea">
<button *ngIf="isHelper()" (click)="add(need!)">
<span class="icon">add</span>Add To Basket
</button>
<button *ngIf="isManager()" (click)="edit(need!)">
<span class="icon">edit</span>Edit Need
</button>
<button *ngIf="isManager()" (click)="delete(need!.id)" >
<span class="icon">delete</span>Delete Need
</button>
</div>
</div>
|
