xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:BankingApp"
xmlns:res="clr-namespace:BankingApp.Resources"
xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
x:Class="BankingApp.MenuPage"
Title="MenuPage"
BackgroundColor="#041014"
Shell.NavBarIsVisible="False" NavigationPage.HasBackButton="False">
<ScrollView>
<VerticalStackLayout>
<Label HorizontalOptions="Center" Margin="0,20,0,20" Text="{x:Static res:LanguageResources.YourAccount}" FontSize="32"/>
<!--Account Bank Card-->    
<Grid Margin="25,0,25,0" >
<!--<Image Source="bankcardesb.svg" Aspect="AspectFill"/>-->
<StackLayout x:Name="selectedCardLayout"
IsVisible="{Binding IsCardSelected}">
<Label Text="{Binding SelectedCard.card_number}"
FontAttributes="Bold"/>
<Label Text="{Binding SelectedCard.card_type}" />
<Label Text="{Binding SelectedCard.valid_month}"/>
</StackLayout>
<Frame>
<Label x:Name="balanceLabel"  FontSize="Medium" />
</Frame>
</Grid>
<Picker x:Name="CardPicker"
Margin="0,0,20,20"
BackgroundColor="#5fb3f9"
HorizontalTextAlignment="Center"
HeightRequest="50"
WidthRequest="150"
HorizontalOptions="End"
SelectedItem="{Binding SelectedCard}"
ItemsSource="{Binding Cards}"
SelectedIndex="0"
ItemDisplayBinding="{Binding card_number}" />
<Button HorizontalOptions="Center" Margin="10" WidthRequest="200" HeightRequest="50" BackgroundColor="#00B2FF"
Text="{x:Static res:LanguageResources.MakeTransaction}" TextColor="White" FontFamily="AgeoBold" FontSize="18" Clicked="GotoTransactionPage"/>
<Button HorizontalOptions="Center" Margin="10" WidthRequest="200" HeightRequest="50" BackgroundColor="#00B2FF"
Text="{x:Static res:LanguageResources.GoToLoans}" TextColor="White" FontFamily="AgeoBold" FontSize="18" Clicked="GotoLoanPage"/>
<!--TransactionList-->
<StackLayout Margin="50,10,50,0" VerticalOptions="EndAndExpand" BindableLayout.ItemsSource="{Binding Transactions}">
<BindableLayout.ItemTemplate>
<DataTemplate>
<toolkit:Expander BackgroundColor="#5fb3f9" Margin="0,0,0,5" Padding="10">
<toolkit:Expander.Header>
<StackLayout Orientation="Horizontal">
<Label FontFamily="OpenSansSemibold" Text="{Binding date_time}" FontSize="Small" HorizontalOptions="StartAndExpand" />
<Label FontFamily="OpenSansSemibold" Text="{Binding amount}" FontSize="Small" HorizontalOptions="End" />
<Label FontFamily="OpenSansSemibold" Text="{Binding currency}" FontSize="Small" HorizontalOptions="End" />
</StackLayout>
</toolkit:Expander.Header>
<StackLayout IsVisible="{Binding IsExpanded}">
<StackLayout Orientation="Horizontal">
<Label FontFamily="AgeoBold" Text="{x:Static res:LanguageResources.RecipientName} " FontSize="Small" />
<Label Text="{Binding name_recipient}" FontSize="Small" />
</StackLayout>
<StackLayout Orientation="Horizontal" >
<Label FontFamily="AgeoBold" Text="{x:Static res:LanguageResources.IBANPayer}" FontSize="Small" />
<Label Text="{Binding iban_payer}" FontSize="Small" />
</StackLayout>
<StackLayout Orientation="Horizontal" >
<Label FontFamily="AgeoBold" Text="{x:Static res:LanguageResources.IBANRecipient}" FontSize="Small" />
<Label Text="{Binding iban_recipient}" FontSize="Small" />
</StackLayout>
<StackLayout Orientation="Horizontal">
<Label FontFamily="AgeoBold" Text="{x:Static res:LanguageResources.PaymentDescription}" FontSize="Small" />
<Label Text="{Binding payment_description}" FontSize="Small" />
</StackLayout>
<StackLayout Orientation="Horizontal" >
<Label FontFamily="AgeoBold" Text="{x:Static res:LanguageResources.ReferenceNumber}" FontSize="Small" />
<Label Text="{Binding reference_number}" FontSize="Small" />
</StackLayout>
</StackLayout>
</toolkit:Expander>
</DataTemplate>
</BindableLayout.ItemTemplate>
</StackLayout>
</VerticalStackLayout>
</ScrollView>
</ContentPage>

using System.Collections.Generic;
using System.Diagnostics;
using System.Net.Http;
using BankingApp.Models;
using Microsoft.Maui.Controls;
using BankingApp.Services;
using Microsoft.Maui.Controls.Xaml;
using Newtonsoft.Json.Linq;
using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Xml;
using BankingApp.Views;
using Newtonsoft.Json;
using System.Runtime.CompilerServices;
namespace BankingApp
{
public partial class MenuPage : ContentPage, INotifyPropertyChanged
{
//Transactions
private ObservableCollection<TransactionData> _transactions = new ObservableCollection<TransactionData>();
public ObservableCollection<TransactionData> Transactions
{
get { return _transactions; }
set
{
_transactions = value;
OnPropertyChanged(nameof(Transactions));
}
}
//Cards
private ObservableCollection<CardData> _cards = new ObservableCollection<CardData>();
public ObservableCollection<CardData> Cards
{
get { return _cards; }
set
{
_cards = value;
OnPropertyChanged(nameof(Cards));
}
}
//Selected Card
private CardData _selectedCard;
public CardData SelectedCard
{
get { return _selectedCard; }
set { _selectedCard = value; OnPropertyChanged(nameof(SelectedCard)); OnPropertyChanged(nameof(IsCardSelected)); }
}
public bool IsCardSelected
{
get { return SelectedCard != null; }
}
//Active Account
public Account SelectedAccount { get; }
//Account Balance
public class AccountBalance
{
[JsonProperty("status")]
public string status { get; set; }
[JsonProperty("msg")]
public string msg { get; set; }
[JsonProperty("data")]
public string data { get; set; }
}
public MenuPage(Account _selectedAccount)
{
InitializeComponent();
Title = "Transactions";
BindingContext = this;
SelectedAccount = _selectedAccount;
}
//When the screen appears
protected override async void OnAppearing()
{
base.OnAppearing();
await GetTransactionsAsync();
await GetBalanceAsync();
await GetCardsAsync();
}
//Confirm you want to go back
protected override bool OnBackButtonPressed()
{
MainThread.BeginInvokeOnMainThread(async () => {
var result = await this.DisplayAlert("Alert!", "Do you really want to choose another account?", "Yes", "No");
if (result) await this.Navigation.PopAsync(); 
});
return true;
}
//Get Transactions from Account
private async Task GetTransactionsAsync()
{
string iban = App.ActiveAccount.iban;
string url = $"https://example";
HttpClient client = new HttpClient();
HttpResponseMessage response = await client.GetAsync(url);
if (response.IsSuccessStatusCode)
{
string json = await response.Content.ReadAsStringAsync();
TransactionsResponse responseObj = Newtonsoft.Json.JsonConvert.DeserializeObject<TransactionsResponse>(json);
Transactions = responseObj.data;
}
else
{
Debug.WriteLine("Error: Unable to get transactions data.");
}
}
//Get Account Balance
private async Task GetBalanceAsync()
{
string iban = App.ActiveAccount.iban;
string url = $"https://example";
HttpClient client = new HttpClient();
HttpResponseMessage response = await client.GetAsync(url);
var responseString = await response.Content.ReadAsStringAsync();
if (response.IsSuccessStatusCode)
{
string json = await response.Content.ReadAsStringAsync();              
JObject resultX = JObject.Parse(responseString);
JObject data = (JObject)resultX["data"];
string account_balance = (string)data["account_balance"];
balanceLabel.Text = account_balance + "€";
}
else
{
Debug.WriteLine("Error: Unable to get balance data.");
}
}
//Get Client Cards
private async Task GetCardsAsync()
{
int id_client = App.ActiveAccount.id_client_account;
string url = $"https://example";
HttpClient client = new HttpClient();
HttpResponseMessage response = await client.GetAsync(url);
if (response.IsSuccessStatusCode)
{
string json = await response.Content.ReadAsStringAsync();
CardsResponse responseObj = Newtonsoft.Json.JsonConvert.DeserializeObject<CardsResponse>(json);
Cards = responseObj.data;
}
else
{
Debug.WriteLine("Error: Unable to get Card data.");
}
}
//More Transactions -> Updates
public new event PropertyChangedEventHandler PropertyChanged;
protected override void OnPropertyChanged(string propertyName)
{
base.OnPropertyChanged(propertyName);
if (propertyName == "Transactions")
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("Transactions"));
}
else
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
public class TransactionsResponse
{
public ObservableCollection<TransactionData> data { get; set; }
}
public class CardsResponse
{
public ObservableCollection<CardData> data { get; set; }
}
private void GotoTransactionPage(object sender, EventArgs e)
{
Navigation.PushAsync(new MakeTransactionPage());
}
private void GotoLoanPage(object sender, EventArgs e)
{
Navigation.PushAsync(new LoansPage(SelectedAccount));
}
}
}

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
namespace BankingApp.Services
{
public class CardData
{
[JsonProperty("id_client_account")]
public string id_client_account { get; set; }
[JsonProperty("card_number")]
public string card_number { get; set; }
[JsonProperty("valid_month")]
public int valid_month { get; set; }
[JsonProperty("valid_year")]
public int valid_year { get; set; }
[JsonProperty("card_type")]
public string card_type { get; set; }
}
}

<Grid Margin="25,0,25,0" >    
<StackLayout x:Name="selectedCardLayout">
<Label Text="{Binding SelectedCard.card_number}">
......
</StackLayout>
<Frame >
<Label x:Name="balanceLabel"  FontSize="Medium" />
</Frame>
</Grid>

public MainPage()
{      
InitializeComponent();
...
CardPicker.SelectedIndex = 0;
}