All files / projects/requisition-management/src/app/pages/requisition-detail/budget-bar budget-bar.component.html

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
3x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
@if (budget && overflowPercentage > 0) {
  <div class="budget-bar-overflow">
    <div class="overflow-indicator" [style.width]="overflowPercentage / 100 | percent" [title]="budget | ishPrice">
      <span class="overflow-display">{{ overflowPercentage / 100 | percent }}</span>
    </div>
  </div>
}
@if (budget) {
  <div class="budget-bar">
    <div
      aria-hidden="true"
      class="budget-bar-used"
      [class]="displayClass"
      [style.width]="budgetPercentage / 100 | percent"
      [title]="spentBudget | ishPrice"
    >
      {{ spentBudget | ishPrice }}
    </div>
    @if (additionalAmount?.value) {
      <div
        aria-hidden="true"
        class="budget-bar-used budget-bar-used-additional border-start"
        role="progressbar"
        [class]="addDisplayClass"
        [style.width]="additionalPercentage / 100 | percent"
        [title]="additionalAmount | ishPrice"
      >
        <span>{{ additionalAmount | ishPrice }}</span>
      </div>
    }
  </div>
}