190 lines
8.3 KiB
PHP
190 lines
8.3 KiB
PHP
<?php
|
|
require_once 'db/config.php';
|
|
|
|
// Fetch initial user data (Koffi)
|
|
try {
|
|
$stmt = db()->prepare("SELECT * FROM users WHERE id = 1");
|
|
$stmt->execute();
|
|
$user = $stmt->fetch();
|
|
|
|
$stmt = db()->prepare("SELECT * FROM wallets WHERE user_id = 1");
|
|
$stmt->execute();
|
|
$wallets = $stmt->fetchAll();
|
|
|
|
// Index wallets by type for easy access
|
|
$walletMap = [];
|
|
foreach ($wallets as $w) {
|
|
$walletMap[$w['type']] = $w;
|
|
}
|
|
} catch (Exception $e) {
|
|
die("Error connecting to database: " . $e->getMessage());
|
|
}
|
|
|
|
$projectDescription = $_SERVER['PROJECT_DESCRIPTION'] ?? 'AfriPay-Tontine: Comprehensive financial services for West Africa.';
|
|
$projectImageUrl = $_SERVER['PROJECT_IMAGE_URL'] ?? '';
|
|
?>
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>AfriPay-Tontine | Dashboard</title>
|
|
|
|
<!-- Meta Tags -->
|
|
<meta name="description" content="<?= htmlspecialchars($projectDescription) ?>">
|
|
<meta property="og:title" content="AfriPay-Tontine Dashboard">
|
|
<meta property="og:description" content="<?= htmlspecialchars($projectDescription) ?>">
|
|
<?php if ($projectImageUrl): ?>
|
|
<meta property="og:image" content="<?= htmlspecialchars($projectImageUrl) ?>">
|
|
<?php endif; ?>
|
|
|
|
<!-- Fonts & Icons -->
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
|
|
|
|
<!-- CSS -->
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<link rel="stylesheet" href="assets/css/custom.css?v=<?= time() ?>">
|
|
</head>
|
|
<body>
|
|
|
|
<!-- Top Navigation -->
|
|
<nav class="navbar sticky-top">
|
|
<div class="container-fluid d-flex justify-content-between align-items-center">
|
|
<a class="navbar-brand" href="#">
|
|
<i class="bi bi-shield-check-fill"></i>
|
|
AfriPay<span>Tontine</span>
|
|
</a>
|
|
<div class="d-flex align-items-center gap-3">
|
|
<span id="currencyBadge" class="currency-badge"><?= $user['currency_pref'] ?></span>
|
|
<div class="rounded-circle bg-light d-flex align-items-center justify-content-center" style="width: 35px; height: 35px;">
|
|
<i class="bi bi-person-fill text-muted"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<div class="container mt-3">
|
|
<!-- Welcome Header -->
|
|
<div class="mb-4">
|
|
<h5 class="fw-bold mb-1">Hello, <?= explode(' ', $user['name'])[0] ?> 👋</h5>
|
|
<p class="text-muted small">Your financial overview in <?= $user['country'] ?></p>
|
|
</div>
|
|
|
|
<!-- Wallets Slider -->
|
|
<div class="wallet-slider">
|
|
<!-- Current Account -->
|
|
<div class="wallet-card">
|
|
<div class="wallet-type">Current Account</div>
|
|
<div class="wallet-balance" data-base-balance="<?= $walletMap['current']['balance'] ?>">
|
|
<?= number_format((float)$walletMap['current']['balance'], 0, ',', ' ') ?> <span class="wallet-currency">CFA</span>
|
|
</div>
|
|
<div class="mt-2 small text-muted">Available Balance</div>
|
|
</div>
|
|
|
|
<!-- Savings Account -->
|
|
<div class="wallet-card savings">
|
|
<div class="wallet-type">Savings</div>
|
|
<div class="wallet-balance" data-base-balance="<?= $walletMap['savings']['balance'] ?>">
|
|
<?= number_format((float)$walletMap['savings']['balance'], 0, ',', ' ') ?> <span class="wallet-currency">CFA</span>
|
|
</div>
|
|
<div class="mt-2 small text-success"><i class="bi bi-graph-up-arrow"></i> +2.5% p.a.</div>
|
|
</div>
|
|
|
|
<!-- Tontine Account -->
|
|
<div class="wallet-card tontine">
|
|
<div class="wallet-type">Tontine Pot</div>
|
|
<div class="wallet-balance" data-base-balance="<?= $walletMap['tontine']['balance'] ?>">
|
|
<?= number_format((float)$walletMap['tontine']['balance'], 0, ',', ' ') ?> <span class="wallet-currency">CFA</span>
|
|
</div>
|
|
<div class="mt-2 small text-warning"><i class="bi bi-people-fill"></i> 3 active groups</div>
|
|
</div>
|
|
|
|
<!-- Escrow Account -->
|
|
<div class="wallet-card">
|
|
<div class="wallet-type">Escrow (SafePay)</div>
|
|
<div class="wallet-balance" data-base-balance="<?= $walletMap['escrow']['balance'] ?>">
|
|
<?= number_format((float)$walletMap['escrow']['balance'], 0, ',', ' ') ?> <span class="wallet-currency">CFA</span>
|
|
</div>
|
|
<div class="mt-2 small text-muted">Funds locked for delivery</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Quick Actions Grid -->
|
|
<div class="action-grid">
|
|
<button class="action-btn">
|
|
<div class="action-icon"><i class="bi bi-plus-lg"></i></div>
|
|
<div class="action-label">Deposit</div>
|
|
</button>
|
|
<button class="action-btn">
|
|
<div class="action-icon"><i class="bi bi-send"></i></div>
|
|
<div class="action-label">Send</div>
|
|
</button>
|
|
<button class="action-btn tontine">
|
|
<div class="action-icon"><i class="bi bi-people"></i></div>
|
|
<div class="action-label">Tontine</div>
|
|
</button>
|
|
<button class="action-btn">
|
|
<div class="action-icon"><i class="bi bi-safe"></i></div>
|
|
<div class="action-label">Escrow</div>
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Recent Activity -->
|
|
<div class="activity-section">
|
|
<div class="section-header">
|
|
<div class="section-title">Recent Activity</div>
|
|
<a href="#" class="text-primary text-decoration-none small">See all</a>
|
|
</div>
|
|
|
|
<div class="activity-item">
|
|
<div class="activity-icon text-success"><i class="bi bi-arrow-down-left"></i></div>
|
|
<div class="activity-details">
|
|
<div class="activity-name">MTN Mobile Money</div>
|
|
<div class="activity-meta">Today, 10:45 AM • Deposit</div>
|
|
</div>
|
|
<div class="activity-amount">
|
|
<div class="amount-positive">+15 000</div>
|
|
<span class="status-badge status-success">Success</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="activity-item">
|
|
<div class="activity-icon text-primary"><i class="bi bi-globe"></i></div>
|
|
<div class="activity-details">
|
|
<div class="activity-name">Ghana Tontine <span class="small">🇬ðŸ‡</span></div>
|
|
<div class="activity-meta">Yesterday • Contribution</div>
|
|
</div>
|
|
<div class="activity-amount">
|
|
<div class="amount-negative">-50 000</div>
|
|
<span class="status-badge status-pending">Pending</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Bottom Navigation (Mobile) -->
|
|
<div class="fixed-bottom bg-white border-top d-md-none py-2 px-4 d-flex justify-content-between">
|
|
<div class="text-primary text-center">
|
|
<i class="bi bi-house-door-fill d-block h5 mb-0"></i>
|
|
<span style="font-size: 0.6rem; font-weight: 700;">Home</span>
|
|
</div>
|
|
<div class="text-muted text-center">
|
|
<i class="bi bi-wallet2 d-block h5 mb-0"></i>
|
|
<span style="font-size: 0.6rem;">Wallets</span>
|
|
</div>
|
|
<div class="text-muted text-center">
|
|
<i class="bi bi-people d-block h5 mb-0"></i>
|
|
<span style="font-size: 0.6rem;">Tontine</span>
|
|
</div>
|
|
<div class="text-muted text-center">
|
|
<i class="bi bi-gear d-block h5 mb-0"></i>
|
|
<span style="font-size: 0.6rem;">Settings</span>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- JS -->
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
|
|
<script src="assets/js/main.js?v=<?= time() ?>"></script>
|
|
</body>
|
|
</html>
|