Spaces:
Running
Running
File size: 7,757 Bytes
29f9c32 | 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 | <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ID Management - ChipFlow Commander</title>
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></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">ChipFlow Commander</h1>
<p class="text-sm text-gray-400">ID Management</p>
</div>
<nav class="mt-4">
<a href="admin_dashboard.html" class="block py-2 px-4 text-gray-300 hover:bg-gray-700">Dashboard</a>
<a href="bank_management.html" class="block py-2 px-4 text-gray-300 hover:bg-gray-700">Bank Management</a>
<a href="id_management.html" class="block py-2 px-4 bg-gray-700 text-white">ID Management</a>
<a href="transactions.html" class="block py-2 px-4 text-gray-300 hover:bg-gray-700">Transactions</a>
<a href="history.html" class="block py-2 px-4 text-gray-300 hover:bg-gray-700">History Log</a>
<a href="/index.html" class="block py-2 px-4 text-gray-300 hover:bg-gray-700 mt-8">Logout</a>
</nav>
</div>
<!-- Main Content -->
<div class="flex-1 overflow-auto">
<header class="bg-white shadow-sm p-4">
<div class="flex justify-between items-center">
<h2 class="text-xl font-semibold text-gray-800">Game IDs</h2>
<button id="addIdBtn" class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-lg">
Add New ID
</button>
</div>
</header>
<main class="p-6">
<div class="bg-white rounded-lg shadow overflow-hidden">
<div class="p-4 border-b border-gray-200 flex justify-between items-center">
<h3 class="text-lg font-medium text-gray-800">ID List</h3>
<div class="relative">
<input type="text" placeholder="Search IDs..." class="pl-8 pr-4 py-2 border rounded-lg w-64">
<i data-feather="search" class="absolute left-3 top-2.5 text-gray-400"></i>
</div>
</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">ID</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Nickname</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Current Stock</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Status</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Actions</th>
</tr>
</thead>
<tbody class="bg-white divide-y divide-gray-200">
<tr>
<td class="px-6 py-4 whitespace-nowrap">ID12345678</td>
<td class="px-6 py-4 whitespace-nowrap">ChipMaster</td>
<td class="px-6 py-4 whitespace-nowrap">125.75</td>
<td class="px-6 py-4 whitespace-nowrap">
<span class="px-2 py-1 text-xs rounded-full bg-green-100 text-green-800">Active</span>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<button class="text-blue-600 hover:text-blue-800 mr-3">Edit</button>
<button class="text-red-600 hover:text-red-800">Deactivate</button>
</td>
</tr>
<!-- More rows would be dynamically inserted here -->
</tbody>
</table>
</div>
</div>
</main>
</div>
</div>
<!-- Add ID Modal -->
<div id="addIdModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center hidden">
<div class="bg-white rounded-lg shadow-lg p-6 w-full max-w-md">
<div class="flex justify-between items-center mb-4">
<h3 class="text-lg font-medium text-gray-800">Add New Game ID</h3>
<button id="closeIdModalBtn" class="text-gray-400 hover:text-gray-500">
<i data-feather="x"></i>
</button>
</div>
<form id="idForm">
<div class="mb-4">
<label class="block text-gray-700 mb-2">Game ID</label>
<input type="text" name="gameId" class="w-full px-4 py-2 border rounded-lg" required>
</div>
<div class="mb-4">
<label class="block text-gray-700 mb-2">Nickname</label>
<input type="text" name="nickname" class="w-full px-4 py-2 border rounded-lg" required>
</div>
<div class="mb-4">
<label class="block text-gray-700 mb-2">Initial Stock</label>
<input type="number" name="initialStock" class="w-full px-4 py-2 border rounded-lg" value="0" min="0" step="0.01">
</div>
<div class="flex justify-end space-x-3 mt-6">
<button type="button" id="cancelIdBtn" class="px-4 py-2 border rounded-lg text-gray-700 hover:bg-gray-100">
Cancel
</button>
<button type="submit" class="px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-lg">
Save ID
</button>
</div>
</form>
</div>
</div>
<script>
feather.replace();
// Modal handling
document.getElementById('addIdBtn').addEventListener('click', function() {
document.getElementById('addIdModal').classList.remove('hidden');
});
document.getElementById('closeIdModalBtn').addEventListener('click', function() {
document.getElementById('addIdModal').classList.add('hidden');
});
document.getElementById('cancelIdBtn').addEventListener('click', function() {
document.getElementById('addIdModal').classList.add('hidden');
});
// Form submission
document.getElementById('idForm').addEventListener('submit', async function(e) {
e.preventDefault();
// Here you would handle the form submission via API
// After successful submission:
document.getElementById('addIdModal').classList.add('hidden');
// Then refresh the ID list
});
</script>
</body>
</html> |