add refferal page layout

2026-01-12 17:12:50 +07:00
parent 77ca4775b1
commit d0918b8c0b
9 changed files with 652 additions and 7 deletions
@@ -0,0 +1,123 @@
+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>
+	)
+}