177 lines
11 KiB
PHP
177 lines
11 KiB
PHP
<?php
|
|
session_start();
|
|
if (!isset($_SESSION['user_id'])) {
|
|
header('Location: login.php');
|
|
exit;
|
|
}
|
|
|
|
// Mock data for roles and users, replace with database data
|
|
$roles = [
|
|
['id' => 1, 'name' => 'Admin', 'description' => 'Full access to all features and settings.'],
|
|
['id' => 2, 'name' => 'HR Manager', 'description' => 'Can manage candidates, workflows, and view reports.'],
|
|
['id' => 3, 'name' => 'Team Member', 'description' => 'Limited access to assigned tasks and candidates.']
|
|
];
|
|
|
|
$users = [
|
|
['id' => 1, 'name' => 'Alexandre Dubois', 'email' => 'alex@finmox.com', 'role' => 'Admin', 'status' => 'Active', 'avatar' => 'https://i.pravatar.cc/40?u=1'],
|
|
['id' => 2, 'name' => 'Béatrice Martin', 'email' => 'beatrice@finmox.com', 'role' => 'HR Manager', 'status' => 'Active', 'avatar' => 'https://i.pravatar.cc/40?u=2'],
|
|
['id' => 3, 'name' => 'Charles Leclerc', 'email' => 'charles@finmox.com', 'role' => 'Team Member', 'status' => 'Invited', 'avatar' => 'https://i.pravatar.cc/40?u=3'],
|
|
];
|
|
?>
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Settings - FinMox</title>
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<style>
|
|
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
|
|
* {
|
|
font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
|
|
}
|
|
body {
|
|
background-color: #fafafa;
|
|
-webkit-font-smoothing: antialiased;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body class="bg-gray-100">
|
|
<div class="flex h-screen bg-gray-200">
|
|
<?php include '_sidebar.php'; ?>
|
|
|
|
<!-- Main content -->
|
|
<div class="flex-1 flex flex-col overflow-hidden">
|
|
<main class="flex-1 overflow-x-hidden overflow-y-auto bg-[#fafafa] pb-20 md:pb-0">
|
|
<div class="max-w-7xl mx-auto px-4 md:px-6 py-4 md:py-8">
|
|
|
|
<!-- SettingsHeader -->
|
|
<div class="md:flex md:items-center md:justify-between">
|
|
<div class="flex-1 min-w-0">
|
|
<h2 class="text-2xl font-bold leading-7 text-gray-900 sm:text-3xl sm:truncate">
|
|
Settings
|
|
</h2>
|
|
<p class="mt-1 text-sm text-gray-500">
|
|
Manage your workspace and team settings.
|
|
</p>
|
|
</div>
|
|
<div class="mt-4 flex md:mt-0 md:ml-4">
|
|
<button type="button" class="inline-flex items-center px-4 py-2 border border-gray-300 rounded-md shadow-sm text-sm font-medium text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
|
|
Invite team
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt-6 md:mt-8 space-y-4 md:space-y-6">
|
|
|
|
<!-- PermissionsTable -->
|
|
<div class="bg-white shadow-sm rounded-lg">
|
|
<div class="px-4 py-5 sm:px-6">
|
|
<h3 class="text-lg leading-6 font-medium text-gray-900">Roles & Permissions</h3>
|
|
<p class="mt-1 text-sm text-gray-500">Define what each role can see and do.</p>
|
|
</div>
|
|
<div class="border-t border-gray-200">
|
|
<ul class="divide-y divide-gray-200">
|
|
<?php foreach ($roles as $role): ?>
|
|
<li class="p-4 sm:p-6 hover:bg-gray-50">
|
|
<div class="flex items-center justify-between">
|
|
<div>
|
|
<p class="font-medium text-gray-900"><?php echo htmlspecialchars($role['name']); ?></p>
|
|
<p class="text-sm text-gray-500"><?php echo htmlspecialchars($role['description']); ?></p>
|
|
</div>
|
|
<a href="edit_role.php?id=<?php echo $role['id']; ?>" class="text-sm font-medium text-indigo-600 hover:text-indigo-800">Edit</a>
|
|
</div>
|
|
</li>
|
|
<?php endforeach; ?>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- WorkspaceSettings -->
|
|
<div class="bg-white shadow-sm rounded-lg">
|
|
<div class="px-4 py-5 sm:px-6">
|
|
<h3 class="text-lg leading-6 font-medium text-gray-900">Workspace</h3>
|
|
<p class="mt-1 text-sm text-gray-500">Manage your company profile and branding.</p>
|
|
</div>
|
|
<div class="border-t border-gray-200 px-4 py-5 sm:p-6">
|
|
<form class="space-y-6">
|
|
<div>
|
|
<label for="company-name" class="block text-sm font-medium text-gray-700">Company Name</label>
|
|
<input type="text" id="company-name" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm" value="FinMox">
|
|
</div>
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700">Company Logo</label>
|
|
<div class="mt-2 flex items-center space-x-4">
|
|
<img src="assets/pasted-20251120-051320-b2b0cdfa.png" alt="Logo" class="h-10 w-auto">
|
|
<input type="file" id="logo-upload" class="text-sm text-gray-500 file:mr-4 file:py-2 file:px-4 file:rounded-md file:border-0 file:text-sm file:font-semibold file:bg-indigo-50 file:text-indigo-600 hover:file:bg-indigo-100">
|
|
</div>
|
|
</div>
|
|
<div class="flex justify-end">
|
|
<button type="submit" class="inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
|
|
Save Changes
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- UserManagement -->
|
|
<div class="bg-white shadow-sm rounded-lg">
|
|
<div class="px-4 py-5 sm:px-6">
|
|
<h3 class="text-lg leading-6 font-medium text-gray-900">User Management</h3>
|
|
<p class="mt-1 text-sm text-gray-500">Invite, remove, and manage your team members.</p>
|
|
</div>
|
|
<div class="border-t border-gray-200">
|
|
<table class="min-w-full divide-y divide-gray-200">
|
|
<thead class="bg-gray-50">
|
|
<tr>
|
|
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Name</th>
|
|
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Status</th>
|
|
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Role</th>
|
|
<th scope="col" class="relative px-6 py-3"><span class="sr-only">Edit</span></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="bg-white divide-y divide-gray-200">
|
|
<?php foreach ($users as $user): ?>
|
|
<tr>
|
|
<td class="px-6 py-4 whitespace-nowrap">
|
|
<div class="flex items-center">
|
|
<div class="flex-shrink-0 h-10 w-10">
|
|
<img class="h-10 w-10 rounded-full" src="<?php echo htmlspecialchars($user['avatar']); ?>" alt="">
|
|
</div>
|
|
<div class="ml-4">
|
|
<div class="text-sm font-medium text-gray-900"><?php echo htmlspecialchars($user['name']); ?></div>
|
|
<div class="text-sm text-gray-500"><?php echo htmlspecialchars($user['email']); ?></div>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
<td class="px-6 py-4 whitespace-nowrap">
|
|
<?php if ($user['status'] === 'Active'): ?>
|
|
<span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">
|
|
Active
|
|
</span>
|
|
<?php else: ?>
|
|
<span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-yellow-100 text-yellow-800">
|
|
Invited
|
|
</span>
|
|
<?php endif; ?>
|
|
</td>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"><?php echo htmlspecialchars($user['role']); ?></td>
|
|
<td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
|
|
<a href="#" class="text-indigo-600 hover:text-indigo-900">Edit</a>
|
|
</td>
|
|
</tr>
|
|
<?php endforeach; ?>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|