December 16th,2025 V.11
This commit is contained in:
Flatlogic Bot
parent
a30194d0d0
commit
32596606d0
@ -1,10 +1,64 @@
|
|||||||
<?php
|
<?php
|
||||||
session_start();
|
session_start();
|
||||||
if (!isset($_SESSION['user_id'])) {
|
// Mock user data for Alex, as we don't have a real user logged in with this identity
|
||||||
header('Location: login.php');
|
$user = [
|
||||||
exit;
|
'name' => 'Alex',
|
||||||
}
|
'initials' => 'AR',
|
||||||
require_once 'db/config.php';
|
'title' => 'Senior Product Designer',
|
||||||
|
'manager' => 'Sarah Johnson',
|
||||||
|
'start_date' => '12/14/2024'
|
||||||
|
];
|
||||||
|
|
||||||
|
$tasks = [
|
||||||
|
[
|
||||||
|
'name' => 'Complete Tax Forms (W-4)',
|
||||||
|
'description' => 'Download, fill out, and upload your W-4 tax withholding form',
|
||||||
|
'due_date' => '12/9/2024',
|
||||||
|
'details' => 'Please upload a completed and signed W-4 form (PDF format preferred)',
|
||||||
|
'status' => 'pending',
|
||||||
|
'type' => 'upload'
|
||||||
|
],
|
||||||
|
[
|
||||||
|
'name' => 'Upload Profile Photo',
|
||||||
|
'description' => 'Upload a professional headshot for your company profile',
|
||||||
|
'due_date' => '12/11/2024',
|
||||||
|
'details' => 'JPG or PNG, minimum 400x400 pixels',
|
||||||
|
'status' => 'pending',
|
||||||
|
'type' => 'upload'
|
||||||
|
],
|
||||||
|
[
|
||||||
|
'name' => 'Review Employee Handbook',
|
||||||
|
'description' => 'Read through the company policies and employee handbook',
|
||||||
|
'due_date' => '12/10/2024',
|
||||||
|
'status' => 'pending',
|
||||||
|
'type' => 'action'
|
||||||
|
],
|
||||||
|
[
|
||||||
|
'name' => 'Set Up Direct Deposit',
|
||||||
|
'description' => 'Provide your bank account information for payroll',
|
||||||
|
'due_date' => '12/9/2024',
|
||||||
|
'details' => 'Upload a voided check or bank letter with account details',
|
||||||
|
'status' => 'pending',
|
||||||
|
'type' => 'upload'
|
||||||
|
],
|
||||||
|
[
|
||||||
|
'name' => 'Complete I-9 Form',
|
||||||
|
'completed_date' => '12/7/2024',
|
||||||
|
'status' => 'completed'
|
||||||
|
],
|
||||||
|
[
|
||||||
|
'name' => 'Sign Offer Letter',
|
||||||
|
'completed_date' => '12/6/2024',
|
||||||
|
'status' => 'completed'
|
||||||
|
]
|
||||||
|
];
|
||||||
|
|
||||||
|
$pending_tasks = array_filter($tasks, fn($t) => $t['status'] === 'pending');
|
||||||
|
$completed_tasks = array_filter($tasks, fn($t) => $t['status'] === 'completed');
|
||||||
|
$total_tasks = count($tasks);
|
||||||
|
$completed_count = count($completed_tasks);
|
||||||
|
$progress_percent = $total_tasks > 0 ? ($completed_count / $total_tasks) * 100 : 0;
|
||||||
|
|
||||||
?>
|
?>
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
@ -13,17 +67,114 @@ require_once 'db/config.php';
|
|||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>Employee View - FinMox</title>
|
<title>Employee View - FinMox</title>
|
||||||
<script src="https://cdn.tailwindcss.com"></script>
|
<script src="https://cdn.tailwindcss.com"></script>
|
||||||
|
<link href="https://cdn.jsdelivr.net/npm/lucide-icons@latest/dist/lucide.min.css" rel="stylesheet">
|
||||||
|
<script src="https://unpkg.com/lucide@latest" defer></script>
|
||||||
|
<style>
|
||||||
|
.progress-bar {
|
||||||
|
transition: width 0.5s ease-in-out;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body class="bg-gray-100">
|
<body class="bg-gray-50">
|
||||||
<div class="flex h-screen bg-gray-200">
|
<div class="min-h-screen">
|
||||||
<?php include '_sidebar.php'; ?>
|
<header class="bg-white border-b border-gray-200">
|
||||||
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||||
|
<div class="flex justify-between items-center h-16">
|
||||||
|
<div class="flex items-center space-x-4">
|
||||||
|
<div class="flex-shrink-0">
|
||||||
|
<div class="w-10 h-10 bg-blue-600 text-white flex items-center justify-center rounded-full font-bold">
|
||||||
|
<?php echo htmlspecialchars($user['initials']); ?>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="text-lg font-medium text-gray-900">Welcome, <?php echo htmlspecialchars($user['name']); ?>!</p>
|
||||||
|
<p class="text-sm text-gray-500"><?php echo htmlspecialchars($user['title']); ?></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a href="logout.php" class="text-sm font-medium text-gray-600 hover:text-gray-900">Logout</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
<!-- Main content -->
|
<main class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
|
||||||
<main class="flex-1 overflow-x-hidden overflow-y-auto bg-[#fafafa]">
|
<div class="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-4 gap-8">
|
||||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 md:px-8 py-8">
|
|
||||||
<h1 class="text-3xl font-bold text-gray-900">Employee View</h1>
|
<!-- Main Content -->
|
||||||
|
<div class="md:col-span-2 lg:col-span-3 space-y-8">
|
||||||
|
<div>
|
||||||
|
<h2 class="text-2xl font-bold text-gray-900 mb-4">Your Tasks</h2>
|
||||||
|
<div class="bg-white border border-gray-200 rounded-lg shadow-sm">
|
||||||
|
<ul class="divide-y divide-gray-200">
|
||||||
|
<?php foreach ($pending_tasks as $task): ?>
|
||||||
|
<li class="p-6">
|
||||||
|
<div class="flex justify-between items-start">
|
||||||
|
<div>
|
||||||
|
<h3 class="text-lg font-semibold text-gray-800"><?php echo htmlspecialchars($task['name']); ?></h3>
|
||||||
|
<p class="text-sm text-gray-600 mt-1"><?php echo htmlspecialchars($task['description']); ?></p>
|
||||||
|
<p class="text-xs text-gray-400 mt-2">Due: <?php echo htmlspecialchars($task['due_date']); ?></p>
|
||||||
|
</div>
|
||||||
|
<div class="text-right">
|
||||||
|
<?php if ($task['type'] === 'upload'): ?>
|
||||||
|
<button class="inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50">Choose File</button>
|
||||||
|
<?php else: ?>
|
||||||
|
<button class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md text-white bg-blue-600 hover:bg-blue-700">Mark Complete</button>
|
||||||
|
<?php endif; ?>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<?php if (isset($task['details'])): ?>
|
||||||
|
<p class="text-sm text-gray-500 mt-3 bg-gray-50 p-3 rounded-md"><?php echo htmlspecialchars($task['details']); ?></p>
|
||||||
|
<?php endif; ?>
|
||||||
|
</li>
|
||||||
|
<?php endforeach; ?>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<h2 class="text-2xl font-bold text-gray-900 mb-4">Completed Tasks</h2>
|
||||||
|
<div class="bg-white border border-gray-200 rounded-lg shadow-sm">
|
||||||
|
<ul class="divide-y divide-gray-200">
|
||||||
|
<?php foreach ($completed_tasks as $task): ?>
|
||||||
|
<li class="p-6 flex justify-between items-center">
|
||||||
|
<h3 class="text-lg font-medium text-gray-500 line-through"><?php echo htmlspecialchars($task['name']); ?></h3>
|
||||||
|
<p class="text-sm text-gray-400">Completed on <?php echo htmlspecialchars($task['completed_date']); ?></p>
|
||||||
|
</li>
|
||||||
|
<?php endforeach; ?>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Right Sidebar -->
|
||||||
|
<div class="space-y-8">
|
||||||
|
<div class="bg-white p-6 rounded-lg border border-gray-200 shadow-sm">
|
||||||
|
<h3 class="text-lg font-semibold text-gray-900 mb-4">Onboarding Progress</h3>
|
||||||
|
<p class="text-gray-600"><?php echo $completed_count; ?> of <?php echo $total_tasks; ?> tasks completed</p>
|
||||||
|
<div class="w-full bg-gray-200 rounded-full h-2.5 mt-2">
|
||||||
|
<div class="bg-blue-600 h-2.5 rounded-full progress-bar" style="width: <?php echo round($progress_percent); ?>%"></div>
|
||||||
|
</div>
|
||||||
|
<p class="text-right text-sm text-gray-500 mt-1"><?php echo round($progress_percent); ?>%</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="bg-white p-6 rounded-lg border border-gray-200 shadow-sm">
|
||||||
|
<h3 class="text-lg font-semibold text-gray-900 mb-4">Need Help?</h3>
|
||||||
|
<div class="space-y-3">
|
||||||
|
<p class="flex items-center text-sm text-gray-700"><i data-lucide="mail" class="w-4 h-4 mr-2 text-gray-400"></i> hr@company.com</p>
|
||||||
|
<p class="flex items-center text-sm text-gray-700"><i data-lucide="phone" class="w-4 h-4 mr-2 text-gray-400"></i> (555) 123-4567</p>
|
||||||
|
<button class="w-full mt-2 inline-flex items-center justify-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50">Contact HR Team</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="bg-gray-100 p-4 rounded-lg border border-gray-200 text-sm text-gray-600">
|
||||||
|
<p><strong>Questions?</strong> Reach out to your manager <span class="font-semibold text-gray-800"><?php echo htmlspecialchars($user['manager']); ?></span> or contact HR.</p>
|
||||||
|
<p class="mt-2"><strong>Start Date:</strong> <?php echo htmlspecialchars($user['start_date']); ?></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
</div>
|
</div>
|
||||||
|
<script>
|
||||||
|
lucide.createIcons();
|
||||||
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
Loading…
x
Reference in New Issue
Block a user