File size: 9,464 Bytes
644c352 | 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 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 | <!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Opus API 管理系统 - Cookie 管理</title>
<link rel="stylesheet" href="/static/styles.css">
</head>
<body>
<div class="dashboard-container">
<!-- 顶部导航 -->
<header class="header">
<h1>🚀 Opus API 管理系统</h1>
<div class="user-menu">
<span id="currentUser">admin</span>
<button class="btn btn-secondary" onclick="showChangePasswordModal()">修改密码</button>
<button class="btn btn-secondary" onclick="logout()">退出</button>
</div>
</header>
<!-- 主内容区 -->
<main class="main-content">
<!-- 统计卡片 -->
<section class="stats-section">
<div class="stats-grid">
<div class="stat-card">
<div class="stat-icon">📊</div>
<div class="stat-info">
<h3 id="totalCount">0</h3>
<p>总账号数</p>
</div>
</div>
<div class="stat-card valid">
<div class="stat-icon">✅</div>
<div class="stat-info">
<h3 id="validCount">0</h3>
<p>有效账号</p>
</div>
</div>
<div class="stat-card invalid">
<div class="stat-icon">❌</div>
<div class="stat-info">
<h3 id="invalidCount">0</h3>
<p>无效账号</p>
</div>
</div>
<div class="stat-card">
<div class="stat-icon">📈</div>
<div class="stat-info">
<h3 id="totalUsage">0</h3>
<p>总请求数</p>
</div>
</div>
</div>
</section>
<!-- 操作按钮 -->
<section class="actions-section">
<button class="btn btn-primary" onclick="showAddModal()">
➕ 添加 Cookie
</button>
<button class="btn btn-secondary" onclick="validateAll()">
🔄 批量验证
</button>
<button class="btn btn-secondary" onclick="refreshCookies()">
🔃 刷新列表
</button>
</section>
<!-- Cookie 列表 -->
<section class="table-section">
<h2>Cookie 列表</h2>
<div class="table-container">
<table id="cookieTable">
<thead>
<tr>
<th>#</th>
<th>名称</th>
<th>状态</th>
<th>使用次数</th>
<th>优先级</th>
<th>最后验证</th>
<th>操作</th>
</tr>
</thead>
<tbody id="cookieTableBody">
<!-- 动态填充 -->
</tbody>
</table>
<div id="emptyState" class="empty-state" style="display: none;">
<p>暂无 Cookie，点击上方按钮添加</p>
</div>
</div>
</section>
</main>
<!-- 添加 Cookie 弹窗 -->
<div id="addModal" class="modal" style="display: none;">
<div class="modal-content">
<div class="modal-header">
<h2>添加 Morph Cookie</h2>
<button class="modal-close" onclick="closeAddModal()">×</button>
</div>
<form id="addCookieForm">
<div class="form-group">
<label for="cookieName">账号名称</label>
<input type="text" id="cookieName" name="name" placeholder="例如：主账号" required>
</div>
<div class="form-group">
<label for="apiKey">API Key</label>
<input type="text" id="apiKey" name="api_key" placeholder="输入 API Key..." required>
</div>
<div class="form-group">
<label for="sessionKey">Session Key (可选)</label>
<input type="text" id="sessionKey" name="session_key" placeholder="输入 Session Key...">
</div>
<div class="form-group">
<label for="cookiePriority">优先级 (0-100)</label>
<input type="number" id="cookiePriority" name="priority" value="0" min="0" max="100">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" onclick="closeAddModal()">取消</button>
<button type="submit" class="btn btn-primary">确定</button>
</div>
</form>
</div>
</div>
<!-- 编辑 Cookie 弹窗 -->
<div id="editModal" class="modal" style="display: none;">
<div class="modal-content">
<div class="modal-header">
<h2>编辑 Cookie</h2>
<button class="modal-close" onclick="closeEditModal()">×</button>
</div>
<form id="editCookieForm">
<input type="hidden" id="editCookieId">
<div class="form-group">
<label for="editCookieName">账号名称</label>
<input type="text" id="editCookieName" name="name" placeholder="例如：主账号">
</div>
<div class="form-group">
<label for="editApiKey">API Key</label>
<input type="text" id="editApiKey" name="api_key" placeholder="输入 API Key...">
</div>
<div class="form-group">
<label for="editSessionKey">Session Key (可选)</label>
<input type="text" id="editSessionKey" name="session_key" placeholder="输入 Session Key...">
</div>
<div class="form-group">
<label for="editCookiePriority">优先级 (0-100)</label>
<input type="number" id="editCookiePriority" name="priority" min="0" max="100">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" onclick="closeEditModal()">取消</button>
<button type="submit" class="btn btn-primary">保存</button>
</div>
</form>
</div>
</div>
<!-- 修改密码弹窗 -->
<div id="changePasswordModal" class="modal" style="display: none;">
<div class="modal-content">
<div class="modal-header">
<h2>修改密码</h2>
<button class="modal-close" onclick="closeChangePasswordModal()">×</button>
</div>
<form id="changePasswordForm">
<div class="form-group">
<label for="oldPassword">原密码</label>
<input type="password" id="oldPassword" name="old_password" placeholder="请输入原密码" required>
</div>
<div class="form-group">
<label for="newPassword">新密码</label>
<input type="password" id="newPassword" name="new_password" placeholder="请输入新密码 (至少6位)" required minlength="6">
</div>
<div class="form-group">
<label for="confirmPassword">确认新密码</label>
<input type="password" id="confirmPassword" name="confirm_password" placeholder="请再次输入新密码" required>
</div>
<div class="error" id="changePasswordError" style="display: none;"></div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" onclick="closeChangePasswordModal()">取消</button>
<button type="submit" class="btn btn-primary">确定</button>
</div>
</form>
</div>
</div>
<!-- Toast 通知 -->
<div id="toast" class="toast" style="display: none;"></div>
</div>
<script src="/static/app.js"></script>
</body>
</html> |