gps_system/resources/views/livewire/admin-dashboard.blade.php
sackey 6b878bb0a0
Some checks failed
linter / quality (push) Has been cancelled
tests / ci (push) Has been cancelled
Initial commit
2025-09-12 16:19:56 +00:00

110 lines
5.1 KiB
PHP

<div class="space-y-6" wire:key="admin-dashboard">
{{-- Header --}}
<div class="flex items-center justify-between">
<div>
<flux:heading size="lg">Admin Dashboard</flux:heading>
<flux:subheading>System overview and analytics</flux:subheading>
</div>
<div class="flex space-x-3">
<flux:select wire:model.live="statsDateRange" size="sm">
<option value="7">Last 7 days</option>
<option value="30">Last 30 days</option>
<option value="90">Last 90 days</option>
</flux:select>
<flux:button wire:click="refreshStats" variant="outline" size="sm" icon="arrow-path">
Refresh
</flux:button>
</div>
</div>
{{-- Stats Cards --}}
<div class="grid grid-cols-1 md:grid-cols-4 gap-6">
{{-- Users Stats --}}
<flux:card>
<div class="flex items-center">
<div class="flex-shrink-0">
<div class="w-8 h-8 bg-blue-500 rounded-full flex items-center justify-center">
<flux:icon.users class="w-4 h-4 text-white" />
</div>
</div>
<div class="ml-3">
<p class="text-sm font-medium text-blue-600 dark:text-blue-400">Total Users</p>
<p class="text-lg font-semibold text-gray-900 dark:text-gray-100">{{ number_format($this->stats['total_users']) }}</p>
<p class="text-xs text-blue-600 dark:text-blue-400">+{{ $this->stats['new_users'] }} new</p>
</div>
</div>
</flux:card>
{{-- Devices Stats --}}
<flux:card>
<div class="flex items-center">
<div class="flex-shrink-0">
<div class="w-8 h-8 bg-green-500 rounded-full flex items-center justify-center">
<flux:icon.device-phone-mobile class="w-4 h-4 text-white" />
</div>
</div>
<div class="ml-3">
<p class="text-sm font-medium text-green-600 dark:text-green-400">Devices</p>
<p class="text-lg font-semibold text-gray-900 dark:text-gray-100">{{ number_format($this->stats['total_devices']) }}</p>
<p class="text-xs text-green-600 dark:text-green-400">{{ $this->stats['online_devices'] }} online</p>
</div>
</div>
</flux:card>
{{-- Events Stats --}}
<flux:card>
<div class="flex items-center">
<div class="flex-shrink-0">
<div class="w-8 h-8 bg-yellow-500 rounded-full flex items-center justify-center">
<flux:icon.bell class="w-4 h-4 text-white" />
</div>
</div>
<div class="ml-3">
<p class="text-sm font-medium text-yellow-600 dark:text-yellow-400">Events</p>
<p class="text-lg font-semibold text-gray-900 dark:text-gray-100">{{ number_format($this->stats['total_events']) }}</p>
<p class="text-xs text-yellow-600 dark:text-yellow-400">{{ $this->stats['critical_events'] }} critical</p>
</div>
</div>
</flux:card>
{{-- Revenue Stats --}}
<flux:card>
<div class="flex items-center">
<div class="flex-shrink-0">
<div class="w-8 h-8 bg-purple-500 rounded-full flex items-center justify-center">
<flux:icon.currency-dollar class="w-4 h-4 text-white" />
</div>
</div>
<div class="ml-3">
<p class="text-sm font-medium text-purple-600 dark:text-purple-400">Revenue</p>
<p class="text-lg font-semibold text-gray-900 dark:text-gray-100">${{ number_format($this->stats['revenue_this_month'], 2) }}</p>
<p class="text-xs text-purple-600 dark:text-purple-400">{{ $this->stats['active_subscriptions'] }} active</p>
</div>
</div>
</flux:card>
</div>
{{-- Quick Actions --}}
<div class="grid grid-cols-1 md:grid-cols-4 gap-4">
<flux:button href="/admin/users" variant="outline" class="flex items-center justify-center space-x-2">
<flux:icon.users class="w-4 h-4" />
<span>Manage Users</span>
</flux:button>
<flux:button href="/admin/drivers" variant="outline" class="flex items-center justify-center space-x-2">
<flux:icon.user-circle class="w-4 h-4" />
<span>Manage Drivers</span>
</flux:button>
<flux:button href="/admin/commands" variant="outline" class="flex items-center justify-center space-x-2">
<flux:icon.command-line class="w-4 h-4" />
<span>Command Center</span>
</flux:button>
<flux:button href="/admin/subscriptions" variant="outline" class="flex items-center justify-center space-x-2">
<flux:icon.credit-card class="w-4 h-4" />
<span>Subscriptions</span>
</flux:button>
</div>
</div>