89 lines
3.7 KiB
PHP
89 lines
3.7 KiB
PHP
<?php
|
|
// Dummy data for the dashboard
|
|
$client_name = "Example Client";
|
|
$data = [
|
|
"sessions" => ["value" => "12,345", "change" => "+5.2%"],
|
|
"conversions" => ["value" => "678", "change" => "+12.8%"],
|
|
"ad_spend" => ["value" => "$2,456", "change" => "-3.1%"],
|
|
"clicks" => ["value" => "34,567", "change" => "+8.4%"],
|
|
"keyword_ranks" => ["value" => "5", "change" => "+2"],
|
|
"backlinks" => ["value" => "1,234", "change" => "+50"],
|
|
"site_audit_score" => ["value" => "88/100", "change" => "+3"],
|
|
"calls" => ["value" => "98", "change" => "+15%"],
|
|
];
|
|
|
|
// Dummy data for the main chart (e.g., sessions over time)
|
|
$chart_data = [
|
|
"labels" => ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
|
|
"values" => [5000, 5500, 6200, 7100, 8000, 8500, 9200, 9800, 10500, 11200, 12000, 12345],
|
|
];
|
|
|
|
?>
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title><?php echo htmlspecialchars($client_name); ?> - Marketing Dashboard</title>
|
|
<link href="https://fonts.googleapis.com/css2?family=Georgia:wght@700&family=Helvetica+Neue:wght@400&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="assets/css/custom.css">
|
|
</head>
|
|
<body>
|
|
|
|
<header class="dashboard-header">
|
|
<div class="logo">
|
|
<a href="index.php">AgencyMoguls</a>
|
|
</div>
|
|
<nav class="dashboard-nav">
|
|
<a href="#overview" class="active">Overview</a>
|
|
<a href="#reports">Reports</a>
|
|
<a href="#settings">Settings</a>
|
|
<a href="index.php" class="logout-btn">Logout</a>
|
|
</nav>
|
|
</header>
|
|
|
|
<main class="dashboard-main">
|
|
<div class="dashboard-title">
|
|
<h1><?php echo htmlspecialchars($client_name); ?>'s Dashboard</h1>
|
|
<div class="date-range-picker">
|
|
<input type="text" value="Last 30 Days">
|
|
<svg width="14" height="8" viewBox="0 0 14 8" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 1L7 7L13 1" stroke="#6C757D" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
|
</div>
|
|
</div>
|
|
|
|
<section class="metrics-grid">
|
|
<?php foreach ($data as $key => $metric): ?>
|
|
<div class="metric-card">
|
|
<h3 class="metric-title"><?php echo ucwords(str_replace("_", " ", $key)); ?></h3>
|
|
<p class="metric-value"><?php echo htmlspecialchars($metric['value']); ?></p>
|
|
<p class="metric-change <?php echo strpos($metric['change'], '+') !== false ? 'positive' : 'negative'; ?>">
|
|
<?php echo htmlspecialchars($metric['change']); ?>
|
|
</p>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
</section>
|
|
|
|
<section class="chart-section">
|
|
<div class="chart-container">
|
|
<h2 class="chart-title">Sessions Over Time</h2>
|
|
<!-- Simple bar chart using inline styles for dummy representation -->
|
|
<div class="chart">
|
|
<?php
|
|
$max_value = max($chart_data['values']);
|
|
foreach ($chart_data['values'] as $index => $value):
|
|
$height_percentage = ($value / $max_value) * 100;
|
|
?>
|
|
<div class="chart-bar-wrapper">
|
|
<div class="chart-bar" style="height: <?php echo $height_percentage; ?>%;"></div>
|
|
<span class="chart-label"><?php echo $chart_data['labels'][$index]; ?></span>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
</main>
|
|
|
|
</body>
|
|
</html>
|