Конвертер валют на wix

С помощью кода Wix Velo вы можете создать функционал конвертера валют на своем сайте: перевод определенной суммы денег из одной валюты в другую.

Описание

В этом примере посетители сайта выбирают исходную и целевую валюты и указывают сумму для конвертации. После запуска преобразования отображается целевая сумма и время операции.

Посмотреть Пример

Код

Главная

import { currencies } from 'wix-pay';

$w.onReady(function () {

initDropdowns();

$w('#convertButton').onClick(() => conversionHandler());

});

async function initDropdowns() {

const listOfAllCurrencies = await currencies.getAllCurrencies();

const optionsArray = formAsDropdownOptions(listOfAllCurrencies);

optionsArray.sort((option1, option2) => compareOptionsAlphabetically(option1.label, option2.label));

$w('#dropdownFrom').options = optionsArray;

$w('#dropdownTo').options = optionsArray;

}

function formAsDropdownOptions(listOfAllCurrencies) {

const optionsArray = listOfAllCurrencies.map((currencyItem) => {

return {

'value': currencyItem.code,

'label': currencyItem.code,

}

});

return optionsArray;

}

function compareOptionsAlphabetically(label1, label2) {

if (label1 > label2) {

return 1;

}

return -1;

}

async function conversionHandler() {

const amount = Number($w('#amountInput').value);

const fromCurrency = $w('#dropdownFrom').value;

const toCurrency = $w('#dropdownTo').value;

const convertionResult = await currencies.currencyConverter.convertAmounts({

'amounts': [amount],

'from': fromCurrency,

'to': toCurrency

});

const result = String((convertionResult.amounts[0]));

const timestamp = String(convertionResult.timestamp);

$w('#resultInput').value = result;

$w('#timestampText').text = `Rates are valid to \n ${timestamp}`;

$w('#timestampText').expand();

}

Открыть в Редакторе

Элементы страницы

На нашем сайте мы добавили следующие элементы:

2 окна ввода текста: для ввода суммы для конвертации и для отображения конвертированной суммы в целевой валюте

2 раскрывающихся списка: для выбора исходной и целевой валют

Кнопка: для запуска преобразования

Текстовый элемент: для отображения временной метки коэффициента конверсии.

Код страницы

Наш код делает следующее:

1. Импортирует API валют из модуля wix-pay.

2. После загрузки отображаются все валюты, которые Wix поддерживает для конвертации.

3. Сортировка валюты по алфавиту.