79 lines
2.7 KiB
JavaScript
79 lines
2.7 KiB
JavaScript
import { renderHeader } from '../components/header.js?v=20260405171816';
|
||
import { wallet } from '../mock-data.js?v=20260405171816';
|
||
|
||
export const pageMeta = { id: 'wallet-view', title: 'Кошелёк' };
|
||
|
||
export function render({ navigate }) {
|
||
const screen = document.createElement('section');
|
||
screen.className = 'stack';
|
||
let statusText = 'Данные демонстрационные';
|
||
|
||
const status = document.createElement('p');
|
||
status.className = 'meta-muted';
|
||
|
||
const updateStatus = (text) => {
|
||
statusText = text;
|
||
status.textContent = statusText;
|
||
};
|
||
|
||
screen.append(
|
||
renderHeader({
|
||
title: 'Кошелёк',
|
||
leftAction: { label: '←', onClick: () => navigate('profile-view') },
|
||
})
|
||
);
|
||
|
||
const card = document.createElement('div');
|
||
card.className = 'card stack';
|
||
card.innerHTML = `
|
||
<div>
|
||
<p class="meta-muted">Баланс</p>
|
||
<h2 style="font-size:30px;">${wallet.balanceSOL} SOL</h2>
|
||
<p class="meta-muted">Обновлено: ${wallet.updatedAt}</p>
|
||
</div>
|
||
<div class="card" style="padding:10px;">
|
||
<p class="meta-muted" style="margin-bottom:6px;">Публичный адрес</p>
|
||
<p style="font-size:13px; line-height:1.4; word-break:break-all;">${wallet.publicAddress}</p>
|
||
</div>
|
||
`;
|
||
|
||
const actions = document.createElement('div');
|
||
actions.className = 'stack';
|
||
actions.innerHTML = `
|
||
<div class="row">
|
||
<button class="text-btn" id="copy-address">Копировать адрес</button>
|
||
<button class="ghost-btn" id="refresh-balance">Обновить баланс</button>
|
||
</div>
|
||
<div class="row">
|
||
<button class="primary-btn" id="send-sol" style="width:100%;">Перевести</button>
|
||
<button class="primary-btn" id="topup-sol" style="width:100%;">Пополнить</button>
|
||
</div>
|
||
`;
|
||
|
||
actions.querySelector('#copy-address').addEventListener('click', async () => {
|
||
try {
|
||
await navigator.clipboard.writeText(wallet.publicAddress);
|
||
updateStatus('Адрес скопирован в буфер обмена');
|
||
} catch {
|
||
updateStatus('Не удалось скопировать в этом браузере');
|
||
}
|
||
});
|
||
|
||
actions.querySelector('#refresh-balance').addEventListener('click', () => {
|
||
updateStatus(`Баланс обновлен: ${wallet.balanceSOL} SOL`);
|
||
});
|
||
|
||
actions.querySelector('#send-sol').addEventListener('click', () => {
|
||
updateStatus('Демо-функция: перевод будет добавлен позже');
|
||
});
|
||
|
||
actions.querySelector('#topup-sol').addEventListener('click', () => {
|
||
updateStatus('Демо-функция: пополнение будет добавлено позже');
|
||
});
|
||
|
||
updateStatus(statusText);
|
||
|
||
screen.append(card, actions, status);
|
||
return screen;
|
||
}
|