feat(debt-dialog): add debt warning dialog for negative balance

This commit is contained in:
Jan-Marlon Leibl 2025-04-02 12:50:51 +02:00
parent d22c4c243f
commit 68a226b677
Signed by: jleibl
GPG key ID: 300B2F906DC6F1D5
7 changed files with 182 additions and 32 deletions

View file

@ -13,39 +13,29 @@ import { GameState } from '../../enum/gameState';
<h2 class="modal-heading" [class]="getResultClass()">{{ getResultTitle() }}</h2>
<p class="py-2 text-text-secondary mb-4">{{ getResultMessage() }}</p>
<div
class="bg-deep-blue-light/50 rounded-lg p-5 mb-6 shadow-inner border border-deep-blue-light/30"
>
<div class="bg-deep-blue-light/50 rounded-lg p-5 mb-6 shadow-inner border border-deep-blue-light/30">
<div class="grid grid-cols-2 gap-4">
<div class="text-text-secondary">Einsatz:</div>
<div class="font-medium text-right">{{ amount }} </div>
<div class="font-medium text-right">{{ amount | currency:'EUR' }}</div>
<div class="text-text-secondary">
{{ isDraw ? 'Zurückgegeben:' : isWin ? 'Gewonnen:' : 'Verloren:' }}
</div>
<div
class="font-medium text-right"
[ngClass]="{
'text-emerald': isWin,
'text-accent-red': isLoss,
'text-yellow-400': isDraw,
}"
>
{{ isLoss ? '-' : '+' }}{{ amount }}
<div class="font-medium text-right" [ngClass]="{
'text-emerald': isWin,
'text-accent-red': isLoss,
'text-yellow-400': isDraw
}">
{{ isLoss ? '-' : '+' }}{{ isWin ? (amount * 2) : amount | currency:'EUR' }}
</div>
<div class="text-text-secondary border-t border-text-secondary/20 pt-3 font-medium">
Gesamt:
</div>
<div
class="font-medium text-right border-t border-text-secondary/20 pt-3"
[ngClass]="{
'text-emerald': isWin,
'text-accent-red': isLoss,
'text-white': isDraw,
}"
>
{{ isWin ? '+' : isLoss ? '-' : '' }}{{ amount }}
<div class="text-text-secondary border-t border-text-secondary/20 pt-3 font-medium">Gesamt:</div>
<div class="font-medium text-right border-t border-text-secondary/20 pt-3" [ngClass]="{
'text-emerald': isWin,
'text-accent-red': isLoss,
'text-white': isDraw
}">
{{ isWin ? (amount * 2) : (isDraw ? amount : 0) | currency:'EUR' }}
</div>
</div>
</div>
@ -76,6 +66,7 @@ import { GameState } from '../../enum/gameState';
export class GameResultComponent {
@Input() gameState: GameState = GameState.IN_PROGRESS;
@Input() amount = 0;
@Input() balance = 0;
@Input() set show(value: boolean) {
console.log('GameResultComponent show input changed:', value, 'gameState:', this.gameState);
this.visible = value;