import { Component } from '@angular/core';

class Currency {
  id: number;
  name: string;
  value: number;
}

class Saldo {
  id: number;
  balance: number;
  currency: Currency;
}

class Account {
  id: number;
  number: number;
  saldos: Saldo[];
}

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {

  selectedSaldo;

  saldo: Saldo;
  saldo2: Saldo;
  saldo3: Saldo;

  account: Account;
  account2: Account;

  accountList: Account[];
  saldoList: Saldo[];

  result: number;

  selectedAccount;

  destinatedCurrency: Currency;
  currencies: Currency[];
  selected(){
    this.saldoList = this.selectedAccount.saldos;
  }

  constructor() {
    this.initializeData();
  }

  calculate(){
    this.result = (this.selectedSaldo.balance * this.selectedSaldo.currency.value)/this.destinatedCurrency.value;
  }


  initializeData() {

    this.saldoList = [];
    this.accountList = [];
    this.currencies = [];

    let currency = new Currency();
    currency.id = 0;
    currency.name = 'USD';
    currency.value = 3.42;

    let currency2 = new Currency();
    currency2.id = 1;
    currency2.name = 'DOL';
    currency2.value = 4.22;

    let currency3 = new Currency();
    currency3.id = 2;
    currency3.name = 'FRA';
    currency3.value = 2.12;

    this.currencies.push(currency);
    this.currencies.push(currency2);
    this.currencies.push(currency3);

    this.saldo = new Saldo();
    this.saldo.id = 0;
    this.saldo.balance = 150;
    this.saldo.currency = currency;

    this.saldo2 = new Saldo();
    this.saldo2.id = 1;
    this.saldo2.balance = 120;
    this.saldo2.currency = currency2;

    this.account = new Account();
    this.account.id = 0;
    this.account.number = 1231233213;
    this.account.saldos = [];
    this.account.saldos.push(this.saldo);
    this.account.saldos.push(this.saldo2);

    this.saldo3 = new Saldo();
    this.saldo3.id = 2;
    this.saldo3.balance = 200;
    this.saldo3.currency = currency3;

    this.account2 = new Account();
    this.account2.id = 1;
    this.account2.number = 3453454534;
    this.account2.saldos = [];
    this.account2.saldos.push(this.saldo3);

    this.accountList.push(this.account);
    this.accountList.push(this.account2);
  }

}


    <h1>Drop Down</h1>
    <select [(ngModel)]="selectedAccount" (change)="selected()">
      <option *ngFor="let item of accountList" [ngValue]="item">{{item.number}}</option>
    </select>

    <select [(ngModel)]="selectedSaldo">
      <option *ngFor="let item of saldoList" [ngValue]="item">{{item.currency.name}}</option>
    </select>

    <select [(ngModel)]="destinatedCurrency">
      <option *ngFor="let item of currencies" [ngValue]="item">{{item.name}}</option>
    </select>


  <button (click)="calculate()">Przelicz na zł</button>
    {{ selectedSaldo.balance }}

    {{ result }}