admin 页面增加授权码搜索功能

src/main/resources/templates/admin.html

@@ -47,6 +47,14 @@
             overflow-y: auto;
         }
 
+        #search-input {
+            width: 100%;
+            padding: 8px;
+            margin-bottom: 10px;
+            border-radius: 4px;
+            border: 1px solid #ccc;
+        }
+
         .code-list-item { padding: 12px; border-bottom: 1px solid #eee; cursor: pointer; border-radius: 6px; }
         .code-list-item:hover, .code-list-item.active { background-color: #d1e7fd; }
         .code-list-item strong { font-size: 14px; color: #333; }
@@ -66,6 +74,7 @@
 
 <div class="sidebar" id="sidebar">
     <h3>授权码列表</h3>
+    <input type="text" id="search-input" placeholder="搜索授权码...">
     <div id="code-list"></div>
 </div>
 
@@ -81,36 +90,53 @@
     const cartGridEl = document.getElementById('cart-grid');
     const loaderEl = document.getElementById('loader');
     const downloadBtn = document.getElementById('download-btn');
+    const searchInput = document.getElementById('search-input');
     let activeCode = null;
+    let allCodes = [];
 
     async function fetchAuthCodes() {
         try {
             const response = await fetch('/api/admin/codes');
             if (!response.ok) throw new Error('Failed to load codes');
-            const codes = await response.json();
+            allCodes = await response.json();
-
+            renderCodeList();
-            codeListEl.innerHTML = '';
-            codes.forEach(code => {
-                const item = document.createElement('div');
-                item.className = 'code-list-item';
-                item.dataset.code = code.code;
-                item.innerHTML = `<strong>${code.order_id || code.code}</strong><span>${code.login_count}/${code.login_limit} | Expires: ${new Date(code.expires_at).toLocaleDateString()}</span>`;
-                item.onclick = () => loadCartForCode(code.code);
-                codeListEl.appendChild(item);
-            });
         } catch (e) {
             codeListEl.innerHTML = `<p>${e.message}</p>`;
         }
     }
 
+    function renderCodeList() {
+        const searchTerm = searchInput.value.toLowerCase();
+        const filteredCodes = allCodes.filter(code =>
+            (code.order_id && code.order_id.toLowerCase().includes(searchTerm)) ||
+            code.code.toLowerCase().includes(searchTerm)
+        );
+
+        codeListEl.innerHTML = '';
+        filteredCodes.forEach(code => {
+            const item = document.createElement('div');
+            item.className = 'code-list-item';
+            item.dataset.code = code.code;
+            item.innerHTML = `<strong>${code.order_id || code.code}</strong><span>登录/上限：${code.login_count}/${code.login_limit} | 失效: ${new Date(code.expires_at).toLocaleString()}</span>`;
+            item.onclick = () => loadCartForCode(code.code);
+            codeListEl.appendChild(item);
+        });
+
+        if (activeCode) {
+            const activeElement = document.querySelector(`[data-code="${activeCode}"]`);
+            if (activeElement) {
+                activeElement.classList.add('active');
+            }
+        }
+    }
+
     async function loadCartForCode(code) {
         activeCode = code;
-        // Highlight active item
+        renderCodeList(); // Re-render to highlight the active item
-        document.querySelectorAll('.code-list-item').forEach(el => el.classList.remove('active'));
-        document.querySelector(`[data-code="${code}"]`).classList.add('active');
 
         cartGridEl.innerHTML = '';
         loaderEl.innerText = '正在加载...';
+        loaderEl.style.display = 'block';
         downloadBtn.style.display = 'none';
 
         try {
@@ -168,6 +194,8 @@
         }
     };
 
+    searchInput.addEventListener('input', renderCodeList);
+
     document.addEventListener('DOMContentLoaded', () => {
         fetchAuthCodes();