204 lines
9.8 KiB
PHP
204 lines
9.8 KiB
PHP
<?php
|
|
session_start();
|
|
require_once 'db/config.php';
|
|
|
|
// 1. Check for a valid user session
|
|
if (!isset($_SESSION['user_id'])) {
|
|
header('Location: login.php');
|
|
exit;
|
|
}
|
|
|
|
// 2. Fetch user data from the database
|
|
$pdo = db();
|
|
$stmt = $pdo->prepare("SELECT * FROM users WHERE id = ?");
|
|
$stmt->execute([$_SESSION['user_id']]);
|
|
$user = $stmt->fetch();
|
|
|
|
if (!$user) {
|
|
// If user not found, destroy session and redirect
|
|
session_destroy();
|
|
header('Location: login.php');
|
|
exit;
|
|
}
|
|
|
|
// Create initials from the username
|
|
$initials = '';
|
|
$parts = explode(' ', $user['username']);
|
|
foreach ($parts as $part) {
|
|
$initials .= strtoupper(substr($part, 0, 1));
|
|
}
|
|
|
|
// 3. Task data remains static for now, but will be moved to database later.
|
|
$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;
|
|
|
|
// For display purposes, placeholder data for manager and start date
|
|
$display_manager = 'Sarah Johnson';
|
|
$display_start_date = '12/14/2024';
|
|
|
|
?>
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Employee View - FinMox</title>
|
|
<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>
|
|
<body class="bg-gray-50">
|
|
<div class="min-h-screen">
|
|
<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($initials); ?>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<p class="text-lg font-medium text-gray-900">Welcome, <?php echo htmlspecialchars($user['username']); ?>!</p>
|
|
<p class="text-sm text-gray-500">New Employee</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 class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
|
|
<div class="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-4 gap-8">
|
|
|
|
<!-- 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($display_manager); ?></span> or contact HR.</p>
|
|
<p class="mt-2"><strong>Start Date:</strong> <?php echo htmlspecialchars($display_start_date); ?></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
<script>
|
|
lucide.createIcons();
|
|
</script>
|
|
</body>
|
|
</html>
|