270 lines
11 KiB
PHP
270 lines
11 KiB
PHP
@extends('layouts.app')
|
|
|
|
@section('content')
|
|
<div class="container-fluid p-4">
|
|
<!-- Header -->
|
|
<div class="d-flex justify-content-between align-items-center mb-4">
|
|
<div>
|
|
<h2 class="mb-0">Admin Dashboard</h2>
|
|
<small class="text-muted">Group-wide analytics and management</small>
|
|
</div>
|
|
<div>
|
|
<button class="btn btn-primary me-2">
|
|
<i class="fas fa-plus"></i> New Campaign
|
|
</button>
|
|
<button class="btn btn-outline-secondary">
|
|
<i class="fas fa-download"></i> Export Report
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- KPI Cards -->
|
|
<div class="row mb-4">
|
|
<div class="col-md-3">
|
|
<div class="card border-0 shadow-sm">
|
|
<div class="card-body text-center">
|
|
<div class="text-primary mb-2">
|
|
<i class="fas fa-users fa-2x"></i>
|
|
</div>
|
|
<h4 class="mb-0">12,847</h4>
|
|
<small class="text-muted">Total Members</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="card border-0 shadow-sm">
|
|
<div class="card-body text-center">
|
|
<div class="text-success mb-2">
|
|
<i class="fas fa-calendar-check fa-2x"></i>
|
|
</div>
|
|
<h4 class="mb-0">1,234</h4>
|
|
<small class="text-muted">Visits This Month</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="card border-0 shadow-sm">
|
|
<div class="card-body text-center">
|
|
<div class="text-warning mb-2">
|
|
<i class="fas fa-dollar-sign fa-2x"></i>
|
|
</div>
|
|
<h4 class="mb-0">AED 2.4M</h4>
|
|
<small class="text-muted">Revenue This Month</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="card border-0 shadow-sm">
|
|
<div class="card-body text-center">
|
|
<div class="text-info mb-2">
|
|
<i class="fas fa-percentage fa-2x"></i>
|
|
</div>
|
|
<h4 class="mb-0">23.5%</h4>
|
|
<small class="text-muted">Cross-sell Success Rate</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<!-- Revenue Chart -->
|
|
<div class="col-md-8">
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-light">
|
|
<h6 class="mb-0"><i class="fas fa-chart-line"></i> Revenue by Venue (Last 30 Days)</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
<canvas id="revenueChart" height="300"></canvas>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Tier Distribution -->
|
|
<div class="col-md-4">
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-light">
|
|
<h6 class="mb-0"><i class="fas fa-crown"></i> Member Tier Distribution</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
<canvas id="tierChart" height="300"></canvas>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<!-- Active Campaigns -->
|
|
<div class="col-md-6">
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-light d-flex justify-content-between align-items-center">
|
|
<h6 class="mb-0"><i class="fas fa-bullhorn"></i> Active Campaigns</h6>
|
|
<button class="btn btn-sm btn-primary">
|
|
<i class="fas fa-plus"></i> New
|
|
</button>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="campaign-item mb-3 p-3 border rounded">
|
|
<div class="d-flex justify-content-between align-items-start">
|
|
<div>
|
|
<h6 class="mb-1">City to Coral Bay Cross-sell</h6>
|
|
<p class="small text-muted mb-2">Target: City Center Hotel guests → Coral Bay packages</p>
|
|
<div class="progress mb-2" style="height: 6px;">
|
|
<div class="progress-bar bg-success" style="width: 67%"></div>
|
|
</div>
|
|
<small class="text-muted">67% conversion rate</small>
|
|
</div>
|
|
<span class="badge bg-success">Active</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="campaign-item mb-3 p-3 border rounded">
|
|
<div class="d-flex justify-content-between align-items-start">
|
|
<div>
|
|
<h6 class="mb-1">Lebanese Nights Bundle</h6>
|
|
<p class="small text-muted mb-2">Target: Rayes & Taiga Sky visitors</p>
|
|
<div class="progress mb-2" style="height: 6px;">
|
|
<div class="progress-bar bg-primary" style="width: 45%"></div>
|
|
</div>
|
|
<small class="text-muted">45% conversion rate</small>
|
|
</div>
|
|
<span class="badge bg-success">Active</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="campaign-item p-3 border rounded">
|
|
<div class="d-flex justify-content-between align-items-start">
|
|
<div>
|
|
<h6 class="mb-1">Family Pool Package</h6>
|
|
<p class="small text-muted mb-2">Target: Hotel guests with children</p>
|
|
<div class="progress mb-2" style="height: 6px;">
|
|
<div class="progress-bar bg-warning" style="width: 23%"></div>
|
|
</div>
|
|
<small class="text-muted">23% conversion rate</small>
|
|
</div>
|
|
<span class="badge bg-warning">Testing</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Voucher Management -->
|
|
<div class="col-md-6">
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-light d-flex justify-content-between align-items-center">
|
|
<h6 class="mb-0"><i class="fas fa-gift"></i> Voucher Management</h6>
|
|
<button class="btn btn-sm btn-success">
|
|
<i class="fas fa-plus"></i> New Voucher
|
|
</button>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="voucher-item mb-3 p-3 border rounded">
|
|
<div class="d-flex justify-content-between align-items-start">
|
|
<div>
|
|
<h6 class="mb-1">Beach Day Pass - 20% Off</h6>
|
|
<p class="small text-muted mb-1">Valid at Coral Bay Beach</p>
|
|
<small class="text-muted">Expires: Dec 31, 2024</small>
|
|
</div>
|
|
<div class="text-end">
|
|
<span class="badge bg-success mb-1">Active</span>
|
|
<br>
|
|
<small class="text-muted">142 issued</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="voucher-item mb-3 p-3 border rounded">
|
|
<div class="d-flex justify-content-between align-items-start">
|
|
<div>
|
|
<h6 class="mb-1">Dinner for Two - Free Dessert</h6>
|
|
<p class="small text-muted mb-1">Valid at La Taverna & Rayes</p>
|
|
<small class="text-muted">Expires: Jan 15, 2025</small>
|
|
</div>
|
|
<div class="text-end">
|
|
<span class="badge bg-success mb-1">Active</span>
|
|
<br>
|
|
<small class="text-muted">89 issued</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="voucher-item p-3 border rounded">
|
|
<div class="d-flex justify-content-between align-items-start">
|
|
<div>
|
|
<h6 class="mb-1">Jetski Adventure - 15% Off</h6>
|
|
<p class="small text-muted mb-1">Valid at Jetskis</p>
|
|
<small class="text-muted">Expires: Feb 28, 2025</small>
|
|
</div>
|
|
<div class="text-end">
|
|
<span class="badge bg-warning mb-1">Limited</span>
|
|
<br>
|
|
<small class="text-muted">23 issued</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
@section('scripts')
|
|
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
|
<script>
|
|
// Revenue Chart
|
|
const revenueCtx = document.getElementById('revenueChart').getContext('2d');
|
|
new Chart(revenueCtx, {
|
|
type: 'bar',
|
|
data: {
|
|
labels: ['Seven Hotel', 'City Center', 'Coral Bay', 'La Taverna', 'Rayes', 'Taiga Sky', 'Trabouche', 'Beach', 'Pool', 'Jetskis'],
|
|
datasets: [{
|
|
label: 'Revenue (AED)',
|
|
data: [450000, 380000, 520000, 120000, 95000, 78000, 65000, 35000, 28000, 45000],
|
|
backgroundColor: 'rgba(13, 110, 253, 0.8)',
|
|
borderColor: 'rgba(13, 110, 253, 1)',
|
|
borderWidth: 1
|
|
}]
|
|
},
|
|
options: {
|
|
responsive: true,
|
|
scales: {
|
|
y: {
|
|
beginAtZero: true,
|
|
ticks: {
|
|
callback: function(value) {
|
|
return 'AED ' + (value / 1000) + 'K';
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
});
|
|
|
|
// Tier Distribution Chart
|
|
const tierCtx = document.getElementById('tierChart').getContext('2d');
|
|
new Chart(tierCtx, {
|
|
type: 'doughnut',
|
|
data: {
|
|
labels: ['Silver', 'Gold', 'Platinum'],
|
|
datasets: [{
|
|
data: [6847, 4235, 1765],
|
|
backgroundColor: [
|
|
'#6c757d',
|
|
'#ffd700',
|
|
'#6f42c1'
|
|
],
|
|
borderWidth: 0
|
|
}]
|
|
},
|
|
options: {
|
|
responsive: true,
|
|
plugins: {
|
|
legend: {
|
|
position: 'bottom'
|
|
}
|
|
}
|
|
}
|
|
});
|
|
</script>
|
|
@endsection
|