161 lines
7.4 KiB
PHP
161 lines
7.4 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Rentsmart Admin Dashboard</title>
|
|
@vite(['resources/css/app.css', 'resources/js/app.js'])
|
|
<style>
|
|
@keyframes car-move {
|
|
0% {
|
|
left: -40px;
|
|
}
|
|
|
|
100% {
|
|
left: 100%;
|
|
}
|
|
}
|
|
|
|
.animate-car-move {
|
|
animation: car-move 6s linear infinite;
|
|
}
|
|
</style>
|
|
</head>
|
|
<script>
|
|
document.addEventListener("DOMContentLoaded", function() {
|
|
const hari = ["Minggu", "Senin", "Selasa", "Rabu", "Kamis", "Jumat", "Sabtu"];
|
|
const bulan = [
|
|
"Januari", "Februari", "Maret", "April", "Mei", "Juni",
|
|
"Juli", "Agustus", "September", "Oktober", "November", "Desember"
|
|
];
|
|
|
|
const today = new Date();
|
|
const tanggal = `${hari[today.getDay()]}, ${today.getDate()} ${bulan[today.getMonth()]} ${today.getFullYear()}`;
|
|
|
|
document.getElementById("tanggal-hari-ini").textContent = tanggal;
|
|
});
|
|
|
|
function toggleFullscreen() {
|
|
const doc = window.document;
|
|
const docEl = doc.documentElement;
|
|
|
|
const requestFullScreen = docEl.requestFullscreen || docEl.mozRequestFullScreen || docEl.webkitRequestFullscreen || docEl.msRequestFullscreen;
|
|
const cancelFullScreen = doc.exitFullscreen || doc.mozCancelFullScreen || doc.webkitExitFullscreen || doc.msExitFullscreen;
|
|
|
|
if (!doc.fullscreenElement && !doc.mozFullScreenElement && !doc.webkitFullscreenElement && !doc.msFullscreenElement) {
|
|
requestFullScreen.call(docEl);
|
|
} else {
|
|
cancelFullScreen.call(doc);
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<body class="bg-gray-100 min-h-screen flex">
|
|
|
|
<!-- Sidebar -->
|
|
<aside class="w-64 bg-[#1e3a8a] text-white shadow-lg hidden md:flex flex-col font-inter">
|
|
<div
|
|
class="p-3 flex items-center gap-4 border-b border-blue-700 bg-white shadow-sm select-none">
|
|
<!-- Icon Dashboard - modern & minimal -->
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-10 w-10 text-[#1e3a8a]" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M3 12l2-2m0 0l7-7 7 7M13 5v6h6" />
|
|
<circle cx="12" cy="14" r="3" stroke="#1e3a8a" stroke-width="2" fill="#2563eb" />
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M9 20h6" />
|
|
</svg>
|
|
|
|
<!-- Teks Admin Panel -->
|
|
<h1 class="text-2xl font-extrabold text-[#1e3a8a] tracking-wide drop-shadow-sm">
|
|
RentSmart
|
|
</h1>
|
|
</div>
|
|
|
|
<!-- Nav -->
|
|
<nav class="flex-1 px-6 py-6 space-y-2 text-base font-medium">
|
|
@php
|
|
$navItems = [
|
|
['route' => 'dashboard', 'label' => 'Dashboard', 'icon' => 'home'],
|
|
['route' => 'kriteria.index', 'label' => 'Kriteria', 'icon' => 'list'],
|
|
['route' => 'sub-kriteria.index', 'label' => 'Sub Kriteria', 'icon' => 'plus'],
|
|
['route' => 'mobil.index', 'label' => 'Mobil', 'icon' => 'car'],
|
|
['route' => 'nilai-alternatif.index', 'label' => 'Nilai Alternatif', 'icon' => 'clipboard'],
|
|
];
|
|
|
|
$icons = [
|
|
'home' => '
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M3 12l2-2 7-7 7 7M13 5v6h6" />',
|
|
'list' => '
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M4 6h16M4 10h16M4 14h16M4 18h16" />',
|
|
'plus' => '
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M12 4v16m8-8H4" />',
|
|
'car' => '
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M3 10h18M7 10v8m10-8v8M10 18h4" />',
|
|
'clipboard' => '
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12h6m-3-3v6m-3-9h6a2 2 0 012 2v14a2 2 0 01-2 2H9a2 2 0 01-2-2V7a2 2 0 012-2z" />',
|
|
];
|
|
@endphp
|
|
|
|
@foreach ($navItems as $item)
|
|
@php
|
|
$isActive = request()->routeIs($item['route']) ? 'bg-white text-[#1e3a8a]' : '';
|
|
@endphp
|
|
<a href="{{ route($item['route']) }}" class="flex items-center gap-4 px-5 py-3 rounded-md transition-colors duration-300 group shadow-sm {{ $isActive }} hover:bg-white hover:text-[#1e3a8a]">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 flex-shrink-0 stroke-current {{ $isActive ? 'text-[#1e3a8a]' : 'text-white group-hover:text-[#1e3a8a]' }}" fill="none" viewBox="0 0 24 24" stroke-width="2">{!! $icons[$item['icon']] !!}</svg>
|
|
<span class="tracking-wide drop-shadow-sm select-none">{{ $item['label'] }}</span>
|
|
</a>
|
|
@endforeach
|
|
</nav>
|
|
{{-- <div class="relative h-16 bg-gradient-to-r from-[#3b82f6] via-[#2563eb] to-[#1e40af] overflow-hidden">
|
|
<!-- Ikon Mobil -->
|
|
<div class="absolute bottom-0 left-0 animate-car-move">
|
|
<img src="{{ asset('assets/images/car.svg') }}" alt="Mobil" class="h-12 w-auto">
|
|
</div>
|
|
</div> --}}
|
|
</aside>
|
|
|
|
<!-- Content -->
|
|
<div class="flex-1 flex flex-col">
|
|
<!-- Topbar -->
|
|
<header class="w-full h-16 bg-white shadow flex items-center justify-between px-6 border-b">
|
|
<div class="text-lg font-semibold text-[#1e3a8a]" id="tanggal-hari-ini"></div>
|
|
|
|
<div class="flex items-center gap-4">
|
|
<!-- Fullscreen Button -->
|
|
<button onclick="toggleFullscreen()" class="p-2 rounded hover:bg-[#e0e7ff] transition" title="Perbesar Layar">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-[#1e3a8a] hover:text-[#1e3a8a]" fill="none"
|
|
viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
<path stroke-linecap="round" stroke-linejoin="round"
|
|
d="M4 4h6M4 4v6M20 4h-6M20 4v6M4 20h6M4 20v-6M20 20h-6M20 20v-6" />
|
|
</svg>
|
|
</button>
|
|
|
|
<!-- User dropdown -->
|
|
<div x-data="{ open: false }" class="relative">
|
|
<button @click="open = !open" class="flex items-center space-x-2 text-gray-600 focus:outline-none">
|
|
<div class="border-r pr-2 mr-2 h-6"></div>
|
|
<svg class="w-6 h-6 text-gray-500" fill="currentColor" viewBox="0 0 24 24">
|
|
<path d="M12 12c2.7 0 4.5-2 4.5-4.5S14.7 3 12 3 7.5 5 7.5 7.5 9.3 12 12 12zM12 14c-3.3 0-6 2.7-6 6h12c0-3.3-2.7-6-6-6z" />
|
|
</svg>
|
|
<span class="font-medium">{{ Auth::user()->name }}</span>
|
|
</button>
|
|
|
|
<!-- Dropdown menu -->
|
|
<div x-show="open" @click.outside="open = false" class="absolute right-0 mt-2 w-44 bg-white border rounded-md shadow z-50">
|
|
<a href="{{ route('profile.edit') }}" class="block px-4 py-2 hover:bg-gray-100 text-sm text-gray-700">Profil</a>
|
|
<form method="POST" action="{{ route('logout') }}">
|
|
@csrf
|
|
<button type="submit" class="w-full text-left px-4 py-2 hover:bg-gray-100 text-sm text-gray-700">Logout</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<!-- Page Content -->
|
|
<main class="p-6">
|
|
@yield('content')
|
|
</main>
|
|
</div>
|
|
|
|
</body>
|
|
|
|
</html> |