127 lines
5.3 KiB
HTML
127 lines
5.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>ASF SSO - Admin Portal</title>
|
|
<link rel="stylesheet" href="/static/css/style.css">
|
|
</head>
|
|
|
|
<body>
|
|
<!-- Login Page -->
|
|
<div id="login-page" class="flex items-center justify-center" style="height: 100vh;">
|
|
<div class="card text-center" style="width: 100%; max-width: 400px;">
|
|
<img src="/static/img/logo.png" alt="ASF Logo" class="logo" style="height: 80px; margin-bottom: 2rem;">
|
|
<h2 class="text-2xl mb-4">Admin Login</h2>
|
|
<form id="login-form">
|
|
<input type="text" id="username" placeholder="Username" required>
|
|
<input type="password" id="password" placeholder="Password" required>
|
|
<button type="submit" class="btn btn-primary w-full">Login</button>
|
|
</form>
|
|
<p id="login-error" class="text-accent mt-4 hidden"></p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Dashboard Layout -->
|
|
<div id="dashboard-layout" class="hidden">
|
|
<header class="flex items-center justify-between">
|
|
<div class="flex items-center">
|
|
<img src="/static/img/logo.png" alt="ASF Logo" class="logo">
|
|
<h1 class="text-xl">ASF SSO Admin</h1>
|
|
</div>
|
|
<button id="logout-btn" class="btn btn-secondary">Logout</button>
|
|
</header>
|
|
|
|
<main class="p-8">
|
|
<!-- Tabs -->
|
|
<div class="flex gap-4 mb-8">
|
|
<button class="btn btn-primary" onclick="showSection('users')">Users</button>
|
|
<button class="btn btn-secondary" onclick="showSection('apps')">Applications</button>
|
|
</div>
|
|
|
|
<!-- Users Section -->
|
|
<div class="flex justify-between items-center mb-4">
|
|
<h2 class="text-2xl">Applications</h2>
|
|
<button class="btn btn-primary" onclick="addApp()">Add Application</button>
|
|
</div>
|
|
<div class="card">
|
|
<table id="apps-table">
|
|
<thead>
|
|
<tr>
|
|
<th>ID</th>
|
|
<th>Name</th>
|
|
<th>URL</th>
|
|
<th>API Key</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<!-- Apps will be populated here -->
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
</div>
|
|
|
|
<!-- User Modal -->
|
|
<div id="user-modal" class="modal-overlay hidden">
|
|
<div class="card modal">
|
|
<h3 class="text-xl mb-4">Add/Edit User</h3>
|
|
<form id="user-form">
|
|
<input type="hidden" id="user-id">
|
|
<input type="text" id="user-username" placeholder="Username" required>
|
|
<input type="email" id="user-email" placeholder="Email" required>
|
|
<input type="password" id="user-password" placeholder="Password (leave blank to keep current)">
|
|
<div class="flex items-center gap-4 mb-4">
|
|
<label class="flex items-center gap-2">
|
|
<input type="checkbox" id="user-is-admin" style="width: auto; margin: 0;"> Admin
|
|
</label>
|
|
<label class="flex items-center gap-2">
|
|
<input type="checkbox" id="user-is-active" style="width: auto; margin: 0;" checked> Active
|
|
</label>
|
|
</div>
|
|
<div class="flex justify-end gap-4">
|
|
<button type="button" class="btn btn-secondary" onclick="closeModal('user-modal')">Cancel</button>
|
|
<button type="submit" class="btn btn-primary">Save</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- App Modal -->
|
|
<div id="app-modal" class="modal-overlay hidden">
|
|
<div class="card modal">
|
|
<h3 class="text-xl mb-4">Add Application</h3>
|
|
<form id="app-form">
|
|
<input type="text" id="app-name" placeholder="Application Name" required>
|
|
<input type="url" id="app-url" placeholder="Application URL" required>
|
|
<div class="flex justify-end gap-4">
|
|
<button type="button" class="btn btn-secondary" onclick="closeModal('app-modal')">Cancel</button>
|
|
<button type="submit" class="btn btn-primary">Save</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Assign App Modal -->
|
|
<div id="assign-modal" class="modal-overlay hidden">
|
|
<div class="card modal">
|
|
<h3 class="text-xl mb-4">Assign Application</h3>
|
|
<form id="assign-form">
|
|
<input type="hidden" id="assign-user-id">
|
|
<select id="assign-app-select" required>
|
|
<option value="">Select Application</option>
|
|
</select>
|
|
<div class="flex justify-end gap-4">
|
|
<button type="button" class="btn btn-secondary" onclick="closeModal('assign-modal')">Cancel</button>
|
|
<button type="submit" class="btn btn-primary">Assign</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="/static/js/app.js?v=2"></script>
|
|
</body>
|
|
|
|
</html> |