File size: 9,792 Bytes
3ccfbfc e726e32 3ccfbfc |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Staff Panel - Kudaram Lakeview</title>
<link rel="icon" type="image/x-icon" href="/static/favicon.ico">
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
<script src="https://unpkg.com/feather-icons"></script>
</head>
<body class="bg-gray-100">
<div class="flex h-screen">
<!-- Sidebar -->
<div class="w-64 bg-gray-800 text-white">
<div class="p-4 border-b border-gray-700">
<h1 class="text-xl font-bold flex items-center">
<img src="/static/logo.png" alt="Logo" class="h-8 mr-2">
Staff Panel
</h1>
</div>
<nav class="p-4">
<div class="space-y-2">
<a href="/staff" class="flex items-center p-2 rounded bg-gray-700">
<i data-feather="home" class="mr-2"></i> Dashboard
</a>
<a href="/staff/checkin" class="flex items-center p-2 rounded hover:bg-gray-700">
<i data-feather="log-in" class="mr-2"></i> Check-ins
<i data-feather="log-in" class="mr-2"></i> Check-ins
</a>
<a href="/staff/checkout" class="flex items-center p-2 rounded hover:bg-gray-700">
<i data-feather="log-out" class="mr-2"></i> Check-outs
</a>
<a href="/staff/guests" class="flex items-center p-2 rounded hover:bg-gray-700">
<i data-feather="users" class="mr-2"></i> Guests
</a>
<a href="/staff/rooms" class="flex items-center p-2 rounded hover:bg-gray-700">
<i data-feather="home" class="mr-2"></i> Rooms
</a>
<a href="/staff/services" class="flex items-center p-2 rounded hover:bg-gray-700">
<i data-feather="bell" class="mr-2"></i> Guest Services
</a>
</div>
</nav>
</div>
<!-- Main Content -->
<div class="flex-1 overflow-auto">
<!-- Top Navigation -->
<header class="bg-white shadow-sm">
<div class="flex justify-between items-center p-4">
<h2 class="text-xl font-semibold">Staff Dashboard</h2>
<div class="flex items-center space-x-4">
<div class="relative">
<i data-feather="bell" class="text-gray-500"></i>
<span class="absolute top-0 right-0 h-2 w-2 rounded-full bg-red-500"></span>
</div>
<div class="flex items-center">
<img src="http://static.photos/people/200x200/6" alt="Staff" class="h-8 w-8 rounded-full">
<span class="ml-2">Staff Member</span>
</div>
</div>
</div>
</header>
<!-- Dashboard Content -->
<main class="p-6">
<!-- Today's Tasks -->
<div class="bg-white rounded-lg shadow overflow-hidden mb-6">
<div class="px-6 py-4 border-b border-gray-200">
<h3 class="text-lg font-semibold">Today's Tasks</h3>
</div>
<div class="p-6">
<div class="space-y-4">
<div class="flex items-start">
<div class="flex-shrink-0 h-10 w-10 rounded-full bg-blue-100 flex items-center justify-center">
<i data-feather="log-in" class="text-blue-600"></i>
</div>
<div class="ml-4">
<h4 class="text-sm font-medium">Check-in for Room 203</h4>
<p class="text-sm text-gray-500">Mr. Sharma - Expected at 2:00 PM</p>
</div>
</div>
<div class="flex items-start">
<div class="flex-shrink-0 h-10 w-10 rounded-full bg-green-100 flex items-center justify-center">
<i data-feather="log-out" class="text-green-600"></i>
</div>
<div class="ml-4">
<h4 class="text-sm font-medium">Check-out for Room 105</h4>
<p class="text-sm text-gray-500">Ms. Patel - By 11:00 AM</p>
</div>
</div>
<div class="flex items-start">
<div class="flex-shrink-0 h-10 w-10 rounded-full bg-purple-100 flex items-center justify-center">
<i data-feather="bell" class="text-purple-600"></i>
</div>
<div class="ml-4">
<h4 class="text-sm font-medium">Room Service Request</h4>
<p class="text-sm text-gray-500">Room 307 - Extra towels needed</p>
</div>
</div>
</div>
</div>
</div>
<!-- Current Guests -->
<div class="bg-white rounded-lg shadow overflow-hidden">
<div class="px-6 py-4 border-b border-gray-200">
<h3 class="text-lg font-semibold">Current Guests</h3>
</div>
<div class="overflow-x-auto">
<table class="min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50">
<tr>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Room</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Guest</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Check-in</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Check-out</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Status</th>
</tr>
</thead>
<tbody class="bg-white divide-y divide-gray-200">
<tr>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">Deluxe 203</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">Rahul Sharma</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">15 May 2023</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">18 May 2023</td>
<td class="px-6 py-4 whitespace-nowrap">
<span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">Checked In</span>
</td>
</tr>
<tr>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">Suite 105</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">Priya Patel</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">14 May 2023</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">16 May 2023</td>
<td class="px-6 py-4 whitespace-nowrap">
<span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-yellow-100 text-yellow-800">Pending Check-out</span>
</td>
</tr>
<tr>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">Family 307</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">Vikram Singh</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">12 May 2023</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">15 May 2023</td>
<td class="px-6 py-4 whitespace-nowrap">
<span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">Checked In</span>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</main>
</div>
</div>
<script>
// Initialize feather icons
feather.replace();
</script>
</body>
</html> |