123 lines
3.3 KiB
TypeScript
123 lines
3.3 KiB
TypeScript
|
export default function IncomeAndPayments() {
|
||
|
|
return (
|
||
|
|
<div className="block-wrapper income-and-payments">
|
||
|
|
<div className="section-title">
|
||
|
|
<span className="icon">💳</span>
|
||
|
|
Доходы и выплаты
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="earnings-cards">
|
||
|
|
<div className="earning-card success">
|
||
|
|
<h4>💰 Доступно к выводу</h4>
|
||
|
|
<p>
|
||
|
|
135.00 Б
|
||
|
|
</p>
|
||
|
|
<small>Минимальная сумма вывода: 100 Б</small>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="earning-card">
|
||
|
|
<h4>📈 Всего заработано</h4>
|
||
|
|
<p>
|
||
|
|
135.00 Б
|
||
|
|
</p>
|
||
|
|
<small>За все время участия в программе</small>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="earning-card warning">
|
||
|
|
<h4>✅ Выплачено</h4>
|
||
|
|
<p>
|
||
|
|
0.00 Б
|
||
|
|
</p>
|
||
|
|
<small>Успешно выплачено на ваши счета</small>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="payout-form">
|
||
|
|
<h4>💸 Запросить выплату</h4>
|
||
|
|
<div className="payout-wrapper">
|
||
|
|
<div className="form-group">
|
||
|
|
<label>Сумма к выводу (Б)</label>
|
||
|
|
<input type="number" id="payout-amount" min="100.00" max="135.00" step="0.01" placeholder="Введите сумму"></input>
|
||
|
|
</div>
|
||
|
|
<div className="form-group" >
|
||
|
|
<label>Способ выплаты</label>
|
||
|
|
<select id="payout-method">
|
||
|
|
<option value="BALANCE">💳 На баланс аккаунта</option>
|
||
|
|
<option value="BANK_TRANSFER">🏦 Банковский перевод</option>
|
||
|
|
<option value="PAYPAL">💰 PayPal</option>
|
||
|
|
<option value="CARD">💳 Банковская карта</option>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
<button className="btn-success">💸 Заказать выплату</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<h4 className="mt-[30px]">📊 История выплат</h4>
|
||
|
|
<div className="stats-grid">
|
||
|
|
<div className="stats-item left-top-corner stats-header">
|
||
|
|
Сумма
|
||
|
|
</div>
|
||
|
|
<div className="stats-item stats-header">
|
||
|
|
Способ
|
||
|
|
</div>
|
||
|
|
<div className="stats-item stats-header">
|
||
|
|
Статус
|
||
|
|
</div>
|
||
|
|
<div className="stats-item stats-header">
|
||
|
|
Дата запроса
|
||
|
|
</div>
|
||
|
|
<div className="stats-item last-column right-top-corner stats-header">
|
||
|
|
Обработано
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="stats-item first-column second-row">
|
||
|
|
100.00
|
||
|
|
</div>
|
||
|
|
<div className="stats-item second-row">
|
||
|
|
0
|
||
|
|
</div>
|
||
|
|
<div className="stats-item second-row">
|
||
|
|
0
|
||
|
|
</div>
|
||
|
|
<div className="stats-item second-row">
|
||
|
|
0
|
||
|
|
</div>
|
||
|
|
<div className="stats-item second-row last-column">
|
||
|
|
0
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="stats-item first-column">
|
||
|
|
100.00
|
||
|
|
</div>
|
||
|
|
<div className="stats-item">
|
||
|
|
0
|
||
|
|
</div>
|
||
|
|
<div className="stats-item">
|
||
|
|
0
|
||
|
|
</div>
|
||
|
|
<div className="stats-item">
|
||
|
|
0
|
||
|
|
</div>
|
||
|
|
<div className="stats-item last-column">
|
||
|
|
0
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="stats-item last-row left-bottom-corner first-column">
|
||
|
|
100.00
|
||
|
|
</div>
|
||
|
|
<div className="stats-item last-row">
|
||
|
|
0
|
||
|
|
</div>
|
||
|
|
<div className="stats-item last-row">
|
||
|
|
0
|
||
|
|
</div>
|
||
|
|
<div className="stats-item last-row">
|
||
|
|
0
|
||
|
|
</div>
|
||
|
|
<div className="stats-item last-row last-column right-bottom-corner">
|
||
|
|
0
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|