feat: implemented confirmation modal for depositing money
This commit is contained in:
parent
f172e00d0a
commit
212bee3bd2
2 changed files with 17 additions and 26 deletions
|
@ -71,7 +71,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<app-confirmation [successful]="isDepositSuccessful" (close)="closeDepositSuccessfulModal()"></app-confirmation>
|
<app-confirmation [successful]="isDepositSuccessful" (close)="closeDepositConfirmationModal()"></app-confirmation>
|
||||||
|
|
||||||
<div class="card p-4">
|
<div class="card p-4">
|
||||||
<h3 class="section-heading text-xl mb-4">Letzte Transaktionen</h3>
|
<h3 class="section-heading text-xl mb-4">Letzte Transaktionen</h3>
|
||||||
|
|
|
@ -1,10 +1,11 @@
|
||||||
import { ChangeDetectionStrategy, Component } from '@angular/core';
|
import {ChangeDetectionStrategy, Component, OnInit} from '@angular/core';
|
||||||
import { NavbarComponent } from '../../shared/components/navbar/navbar.component';
|
import { NavbarComponent } from '../../shared/components/navbar/navbar.component';
|
||||||
import { CurrencyPipe, NgFor } from '@angular/common';
|
import { CurrencyPipe, NgFor } from '@angular/common';
|
||||||
import { Game } from '../../model/Game';
|
import { Game } from '../../model/Game';
|
||||||
import { Transaction } from '../../model/Transaction';
|
import { Transaction } from '../../model/Transaction';
|
||||||
import { DepositComponent } from '../deposit/deposit.component';
|
import { DepositComponent } from '../deposit/deposit.component';
|
||||||
import {ConfirmationComponent} from "../../shared/components/confirmation/confirmation.component";
|
import {ConfirmationComponent} from "../../shared/components/confirmation/confirmation.component";
|
||||||
|
import {ActivatedRoute} from "@angular/router";
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-homepage',
|
selector: 'app-homepage',
|
||||||
|
@ -13,9 +14,18 @@ import {ConfirmationComponent} from "../../shared/components/confirmation/confir
|
||||||
templateUrl: './home.component.html',
|
templateUrl: './home.component.html',
|
||||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||||
})
|
})
|
||||||
export default class HomeComponent {
|
export default class HomeComponent implements OnInit {
|
||||||
isDepositModalOpen = false;
|
isDepositModalOpen = false;
|
||||||
isDepositSuccessful = true;
|
isDepositSuccessful = false;
|
||||||
|
|
||||||
|
constructor(public route: ActivatedRoute) {}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
this.isDepositSuccessful = this.route.snapshot.queryParams['success'] == 'true';
|
||||||
|
if (this.isDepositSuccessful) {
|
||||||
|
this.openDepositConfirmationModal();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
featuredGames: Game[] = [
|
featuredGames: Game[] = [
|
||||||
{
|
{
|
||||||
|
@ -52,26 +62,7 @@ export default class HomeComponent {
|
||||||
|
|
||||||
allGames: Game[] = [...this.featuredGames];
|
allGames: Game[] = [...this.featuredGames];
|
||||||
|
|
||||||
recentTransactions: Transaction[] = [
|
recentTransactions: Transaction[] = [];
|
||||||
{
|
|
||||||
id: '1',
|
|
||||||
type: 'Deposit',
|
|
||||||
amount: 100.0,
|
|
||||||
date: '2024-03-20',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: '2',
|
|
||||||
type: 'Withdrawal',
|
|
||||||
amount: -50.0,
|
|
||||||
date: '2024-03-19',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: '3',
|
|
||||||
type: 'Bonus',
|
|
||||||
amount: 25.0,
|
|
||||||
date: '2024-03-18',
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
openDepositModal() {
|
openDepositModal() {
|
||||||
this.isDepositModalOpen = true;
|
this.isDepositModalOpen = true;
|
||||||
|
@ -80,10 +71,10 @@ export default class HomeComponent {
|
||||||
this.isDepositModalOpen = false;
|
this.isDepositModalOpen = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
openDepositSuccessfulModal() {
|
openDepositConfirmationModal() {
|
||||||
this.isDepositSuccessful = true;
|
this.isDepositSuccessful = true;
|
||||||
}
|
}
|
||||||
closeDepositSuccessfulModal() {
|
closeDepositConfirmationModal() {
|
||||||
this.isDepositSuccessful = false;
|
this.isDepositSuccessful = false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue