GithubBackup/codex-register
1
0
Fork 0
mirror of https://github.com/cnlimiter/codex-register.git synced 2026-07-10 06:51:19 +08:00
Code Issues Packages Projects Releases Wiki Activity

4

Browse Source
This commit is contained in:
cnlimiter
2026-03-14 20:36:03 +08:00
parent 0688f4ca7e
commit 6891b9f11d
22 changed files with 3882 additions and 299 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
templates/accounts.html
View File

@@ -6,6 +6,33 @@
<title>账号管理 - OpenAI 注册系统</title>
<link rel="stylesheet" href="/static/css/style.css">
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>📋</text></svg>">
<style>
.password-cell {
font-family: var(--font-mono);
font-size: 0.75rem;
}
.password-hidden {
filter: blur(4px);
cursor: pointer;
transition: filter 0.2s;
}
.password-hidden:hover {
filter: blur(0);
}
.token-status {
display: flex;
align-items: center;
gap: 4px;
}
.token-status .dot {
width: 8px;
height: 8px;
border-radius: 50%;
}
.token-status .dot.healthy { background: var(--success-color); }
.token-status .dot.warning { background: var(--warning-color); }
.token-status .dot.expired { background: var(--danger-color); }
</style>
</head>
<body>
<div class="container">
@@ -17,6 +44,7 @@
<div class="nav-links">
<a href="/" class="nav-link">注册</a>
<a href="/accounts" class="nav-link active">账号管理</a>
<a href="/email-services" class="nav-link">邮箱服务</a>
<a href="/settings" class="nav-link">设置</a>
</div>
<button class="theme-toggle" onclick="theme.toggle()" title="切换主题">
@@ -77,6 +105,12 @@
<button class="btn btn-ghost" id="refresh-btn" title="刷新">
🔄 刷新
</button>
<button class="btn btn-warning" id="batch-refresh-btn" disabled title="批量刷新Token">
🔄 刷新Token
</button>
<button class="btn btn-info" id="batch-validate-btn" disabled title="批量验证Token">
✅ 验证Token
</button>
<button class="btn btn-danger" id="batch-delete-btn" disabled>
🗑️ 批量删除
</button>
@@ -103,15 +137,16 @@
<th style="width: 40px;"><input type="checkbox" id="select-all"></th>
<th style="width: 60px;">ID</th>
<th>邮箱</th>
<th style="width: 100px;">密码</th>
<th style="width: 120px;">邮箱服务</th>
<th style="width: 100px;">状态</th>
<th style="width: 160px;">注册时间</th>
<th style="width: 80px;">状态</th>
<th style="width: 140px;">最后刷新</th>
<th style="width: 140px;">操作</th>
</tr>
</thead>
<tbody id="accounts-table">
<tr>
<td colspan="7">
<td colspan="8">
<div class="empty-state">
<div class="skeleton skeleton-text" style="width: 60%;"></div>
<div class="skeleton skeleton-text" style="width: 80%;"></div>

240
templates/email_services.html Normal file
View File

@@ -0,0 +1,240 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>邮箱服务 - OpenAI 注册系统</title>
<link rel="stylesheet" href="/static/css/style.css">
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>📧</text></svg>">
</head>
<body>
<div class="container">
<!-- 导航栏 -->
<nav class="navbar">
<div class="nav-brand">
<h1>OpenAI 注册系统</h1>
</div>
<div class="nav-links">
<a href="/" class="nav-link">注册</a>
<a href="/accounts" class="nav-link">账号管理</a>
<a href="/email-services" class="nav-link active">邮箱服务</a>
<a href="/settings" class="nav-link">设置</a>
</div>
<button class="theme-toggle" onclick="theme.toggle()" title="切换主题">
🌙
</button>
</nav>
<!-- 主内容区 -->
<main class="main-content">
<div class="page-header">
<h2>邮箱服务管理</h2>
<p class="subtitle">配置和管理注册所需的邮箱服务</p>
</div>
<!-- 统计卡片 -->
<div class="stats-grid">
<div class="stat-card info">
<div class="stat-value" id="outlook-count">0</div>
<div class="stat-label">Outlook 账户</div>
</div>
<div class="stat-card success">
<div class="stat-value" id="custom-count">0</div>
<div class="stat-label">自定义域名</div>
</div>
<div class="stat-card warning">
<div class="stat-value" id="tempmail-status">可用</div>
<div class="stat-label">临时邮箱</div>
</div>
<div class="stat-card">
<div class="stat-value" id="total-enabled">0</div>
<div class="stat-label">已启用服务</div>
</div>
</div>
<!-- Outlook 管理 -->
<div class="card">
<div class="card-header">
<h3>📥 Outlook 批量导入</h3>
<button class="btn btn-ghost btn-sm" id="toggle-outlook-import">展开</button>
</div>
<div class="card-body" id="outlook-import-body" style="display: none;">
<div class="import-info">
<p><strong>支持格式：</strong></p>
<ul>
<li><code>邮箱----密码</code> （密码认证）</li>
<li><code>邮箱----密码----client_id----refresh_token</code> （XOAUTH2 认证，推荐）</li>
</ul>
<p>每行一个账户，使用四个连字符（----）分隔字段。以 # 开头的行将被忽略。</p>
</div>
<div class="form-group">
<label for="outlook-import-data">批量导入数据</label>
<textarea id="outlook-import-data" rows="8" placeholder="example@outlook.com----password123&#10;test@outlook.com----password456----client_id----refresh_token"></textarea>
</div>
<div class="form-row">
<div class="form-group">
<label>
<input type="checkbox" id="outlook-import-enabled" checked>
导入后启用
</label>
</div>
<div class="form-group">
<label for="outlook-import-priority">优先级</label>
<input type="number" id="outlook-import-priority" value="0" min="0">
</div>
</div>
<div class="form-actions">
<button type="button" class="btn btn-primary" id="outlook-import-btn">📥 开始导入</button>
<button type="button" class="btn btn-secondary" id="clear-import-btn">清空</button>
</div>
<div id="import-result" style="display: none; margin-top: var(--spacing-md);"></div>
</div>
</div>
<!-- 自定义域名管理 -->
<div class="card">
<div class="card-header">
<h3>🔗 自定义域名服务</h3>
<button class="btn btn-primary btn-sm" id="add-custom-btn">➕ 添加服务</button>
</div>
<div class="card-body" style="padding: 0;">
<div class="table-container">
<table class="data-table">
<thead>
<tr>
<th style="width: 40px;"><input type="checkbox" id="select-all-custom"></th>
<th>名称</th>
<th style="width: 200px;">API 地址</th>
<th style="width: 100px;">状态</th>
<th style="width: 80px;">优先级</th>
<th style="width: 160px;">最后使用</th>
<th style="width: 180px;">操作</th>
</tr>
</thead>
<tbody id="custom-services-table">
<tr>
<td colspan="7">
<div class="empty-state">
<div class="skeleton skeleton-text"></div>
<div class="skeleton skeleton-text" style="width: 80%;"></div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<!-- Outlook 账户列表 -->
<div class="card">
<div class="card-header">
<h3>📧 Outlook 账户列表</h3>
<button class="btn btn-danger btn-sm" id="batch-delete-outlook-btn" disabled>🗑️ 批量删除</button>
</div>
<div class="card-body" style="padding: 0;">
<div class="table-container">
<table class="data-table">
<thead>
<tr>
<th style="width: 40px;"><input type="checkbox" id="select-all-outlook"></th>
<th>邮箱</th>
<th style="width: 100px;">认证方式</th>
<th style="width: 100px;">状态</th>
<th style="width: 80px;">优先级</th>
<th style="width: 160px;">最后使用</th>
<th style="width: 140px;">操作</th>
</tr>
</thead>
<tbody id="outlook-accounts-table">
<tr>
<td colspan="7">
<div class="empty-state">
<div class="skeleton skeleton-text"></div>
<div class="skeleton skeleton-text" style="width: 80%;"></div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<!-- 临时邮箱配置 -->
<div class="card">
<div class="card-header">
<h3>🌐 临时邮箱配置</h3>
</div>
<div class="card-body">
<form id="tempmail-form">
<div class="form-group">
<label for="tempmail-api">Tempmail.lol API 地址</label>
<input type="text" id="tempmail-api" name="api_url" placeholder="https://tempmail.lol/api">
</div>
<div class="form-group">
<label>
<input type="checkbox" id="tempmail-enabled" checked>
启用临时邮箱
</label>
</div>
<div class="form-actions">
<button type="submit" class="btn btn-primary">💾 保存设置</button>
<button type="button" class="btn btn-secondary" id="test-tempmail-btn">🔌 测试连接</button>
</div>
</form>
</div>
</div>
</main>
</div>
<!-- 添加自定义域名模态框 -->
<div class="modal" id="add-custom-modal">
<div class="modal-content">
<div class="modal-header">
<h3>➕ 添加自定义域名服务</h3>
<button class="modal-close" id="close-custom-modal">&times;</button>
</div>
<div class="modal-body">
<form id="add-custom-form">
<div class="form-group">
<label for="custom-name">服务名称</label>
<input type="text" id="custom-name" name="name" required placeholder="例如：我的域名邮箱">
</div>
<div class="form-group">
<label for="custom-api-url">API 地址</label>
<input type="text" id="custom-api-url" name="api_url" required placeholder="https://api.example.com">
</div>
<div class="form-group">
<label for="custom-api-key">API 密钥 (可选)</label>
<input type="text" id="custom-api-key" name="api_key" placeholder="API Key">
</div>
<div class="form-group">
<label for="custom-domain">邮箱域名</label>
<input type="text" id="custom-domain" name="domain" placeholder="example.com">
</div>
<div class="form-row">
<div class="form-group">
<label for="custom-priority">优先级</label>
<input type="number" id="custom-priority" name="priority" value="0" min="0">
</div>
<div class="form-group">
<label>
<input type="checkbox" id="custom-enabled" name="enabled" checked>
启用服务
</label>
</div>
</div>
<div class="form-actions">
<button type="submit" class="btn btn-primary">添加</button>
<button type="button" class="btn btn-secondary" id="cancel-add-custom">取消</button>
</div>
</form>
</div>
</div>
</div>
<script src="/static/js/utils.js"></script>
<script src="/static/js/email_services.js"></script>
</body>
</html>

334
templates/index.html
View File

@@ -6,6 +6,94 @@
<title>注册控制台 - OpenAI 注册系统</title>
<link rel="stylesheet" href="/static/css/style.css">
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>🚀</text></svg>">
<style>
/* 两栏布局 */
.two-column-layout {
display: grid;
grid-template-columns: 30% 70%;
gap: var(--spacing-lg);
align-items: start;
}
.left-panel {
position: sticky;
top: calc(60px + var(--spacing-lg));
}
.right-panel {
display: flex;
flex-direction: column;
gap: var(--spacing-lg);
}
/* 任务状态行 */
.task-status-row {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: var(--spacing-sm);
padding: var(--spacing-md);
background: var(--surface-hover);
border-radius: var(--radius);
margin-bottom: var(--spacing-md);
}
.task-status-item {
text-align: center;
}
.task-status-item .label {
font-size: 0.75rem;
color: var(--text-muted);
}
.task-status-item .value {
font-weight: 600;
color: var(--text-primary);
font-size: 0.875rem;
}
/* 已注册账号列表 */
.recent-accounts-table {
max-height: 300px;
overflow-y: auto;
}
.recent-accounts-table table {
width: 100%;
}
.recent-accounts-table th,
.recent-accounts-table td {
padding: var(--spacing-sm) var(--spacing-md);
font-size: 0.8125rem;
}
.password-cell {
font-family: var(--font-mono);
font-size: 0.75rem;
}
.password-hidden {
filter: blur(4px);
cursor: pointer;
transition: filter 0.2s;
}
.password-hidden:hover {
filter: blur(0);
}
/* 响应式 */
@media (max-width: 1024px) {
.two-column-layout {
grid-template-columns: 1fr;
}
.left-panel {
position: static;
}
}
</style>
</head>
<body>
<div class="container">
@@ -17,6 +105,7 @@
<div class="nav-links">
<a href="/" class="nav-link active">注册</a>
<a href="/accounts" class="nav-link">账号管理</a>
<a href="/email-services" class="nav-link">邮箱服务</a>
<a href="/settings" class="nav-link">设置</a>
</div>
<button class="theme-toggle" onclick="theme.toggle()" title="切换主题">
@@ -24,132 +113,153 @@
</button>
</nav>
<!-- 主内容区 -->
<!-- 主内容区 - 两栏布局 -->
<main class="main-content">
<div class="page-header">
<h2>注册控制台</h2>
<p class="subtitle">启动新的 OpenAI/Codex CLI 账号注册任务</p>
</div>
<!-- 注册表单 -->
<div class="card">
<div class="card-header">
<h3>📝 新建注册任务</h3>
</div>
<div class="card-body">
<form id="registration-form">
<div class="form-row">
<div class="form-group">
<label for="email-service">邮箱服务</label>
<select id="email-service" name="email_service" required>
<option value="tempmail">Tempmail.lol (临时邮箱)</option>
<option value="outlook">Outlook</option>
<option value="custom_domain">自定义域名</option>
</select>
</div>
<div class="form-group">
<label for="proxy">代理地址 (可选)</label>
<input type="text" id="proxy" name="proxy" placeholder="http://127.0.0.1:7890">
</div>
<div class="two-column-layout">
<!-- 左侧面板 - 注册设置 -->
<div class="left-panel">
<div class="card">
<div class="card-header">
<h3>📝 注册设置</h3>
</div>
<div class="form-row">
<div class="form-group">
<label for="reg-mode">注册模式</label>
<select id="reg-mode" name="reg_mode">
<option value="single">单次注册</option>
<option value="batch">批量注册</option>
</select>
</div>
<div class="form-group" id="batch-count-group" style="display: none;">
<label for="batch-count">注册数量 (1-100)</label>
<input type="number" id="batch-count" name="batch_count" min="1" max="100" value="5">
</div>
</div>
<div id="batch-options" style="display: none;">
<div class="form-row">
<div class="card-body">
<form id="registration-form">
<div class="form-group">
<label for="interval-min">最小间隔 (秒)</label>
<input type="number" id="interval-min" name="interval_min" min="0" max="300" value="5">
<label for="email-service">邮箱服务</label>
<select id="email-service" name="email_service" required>
<option value="tempmail">Tempmail.lol (临时邮箱)</option>
<option value="outlook">Outlook</option>
<option value="custom_domain">自定义域名</option>
</select>
</div>
<div class="form-group">
<label for="interval-max">最大间隔 (秒)</label>
<input type="number" id="interval-max" name="interval_max" min="1" max="600" value="30">
<label for="reg-mode">注册模式</label>
<select id="reg-mode" name="reg_mode">
<option value="single">单次注册</option>
<option value="batch">批量注册</option>
</select>
</div>
<div class="form-group" id="batch-count-group" style="display: none;">
<label for="batch-count">注册数量 (1-100)</label>
<input type="number" id="batch-count" name="batch_count" min="1" max="100" value="5">
</div>
<div id="batch-options" style="display: none;">
<div class="form-group">
<label for="interval-min">最小间隔 (秒)</label>
<input type="number" id="interval-min" name="interval_min" min="0" max="300" value="5">
</div>
<div class="form-group">
<label for="interval-max">最大间隔 (秒)</label>
<input type="number" id="interval-max" name="interval_max" min="1" max="600" value="30">
</div>
</div>
<div class="form-actions" style="flex-direction: column;">
<button type="submit" class="btn btn-primary btn-lg" id="start-btn" style="width: 100%;">
🚀 开始注册
</button>
<button type="button" class="btn btn-secondary" id="cancel-btn" disabled style="width: 100%;">
取消任务
</button>
</div>
</form>
</div>
</div>
</div>
<!-- 右侧面板 -->
<div class="right-panel">
<!-- 监控台 -->
<div class="card" id="console-card">
<div class="card-header">
<h3>💻 监控台</h3>
<div style="display: flex; gap: var(--spacing-sm); align-items: center;">
<span id="task-status-badge" class="status-badge pending" style="display: none;">等待中</span>
<button class="btn btn-ghost btn-sm" id="clear-log-btn">清空</button>
</div>
</div>
<div class="card-body" style="padding: 0;">
<!-- 任务状态行 -->
<div class="task-status-row" id="task-status-row" style="display: none;">
<div class="task-status-item">
<div class="label">任务 ID</div>
<div class="value" id="task-id">-</div>
</div>
<div class="task-status-item">
<div class="label">邮箱</div>
<div class="value" id="task-email">-</div>
</div>
<div class="task-status-item">
<div class="label">邮箱服务</div>
<div class="value" id="task-service">-</div>
</div>
<div class="task-status-item">
<div class="label">状态</div>
<div class="value" id="task-status">-</div>
</div>
</div>
<div class="form-actions">
<button type="submit" class="btn btn-primary btn-lg" id="start-btn">
🚀 开始注册
</button>
<button type="button" class="btn btn-secondary" id="cancel-btn" disabled>
取消任务
</button>
</div>
</form>
</div>
</div>
<!-- 批量进度 -->
<div id="batch-progress-section" style="display: none; padding: var(--spacing-md); border-bottom: 1px solid var(--border-light);">
<div style="display: flex; justify-content: space-between; margin-bottom: var(--spacing-sm);">
<span id="batch-progress-text">0/0</span>
<span id="batch-progress-percent">0%</span>
</div>
<div class="progress-bar-container">
<div id="progress-bar" class="progress-bar" style="width: 0%"></div>
</div>
<div class="batch-stats" style="margin-top: var(--spacing-sm);">
<span>✅ <strong id="batch-success">0</strong></span>
<span>❌ <strong id="batch-failed">0</strong></span>
<span>⏳ <strong id="batch-remaining">0</strong></span>
</div>
</div>
<!-- 批量任务状态 -->
<div class="card" id="batch-status-card" style="display: none;">
<div class="card-header">
<h3>📊 批量任务进度</h3>
<span id="batch-progress" class="status-badge">0/0</span>
</div>
<div class="card-body">
<div class="progress-bar-container">
<div id="progress-bar" class="progress-bar" style="width: 0%"></div>
</div>
<div class="batch-stats">
<span>✅ 成功: <strong id="batch-success">0</strong></span>
<span>❌ 失败: <strong id="batch-failed">0</strong></span>
<span>⏳ 剩余: <strong id="batch-remaining">0</strong></span>
</div>
</div>
</div>
<!-- 任务状态 -->
<div class="card" id="task-status-card" style="display: none;">
<div class="card-header">
<h3>⚡ 任务状态</h3>
<span id="task-status-badge" class="status-badge pending">等待中</span>
</div>
<div class="card-body">
<div class="info-grid">
<div class="info-item">
<span class="label">任务 ID</span>
<span id="task-id" class="value">-</span>
</div>
<div class="info-item">
<span class="label">邮箱</span>
<span id="task-email" class="value">-</span>
</div>
<div class="info-item">
<span class="label">状态</span>
<span id="task-status" class="value">-</span>
</div>
<div class="info-item">
<span class="label">邮箱服务</span>
<span id="task-service" class="value">-</span>
<!-- 控制台日志 -->
<div id="console-log" class="console-log">
<div class="log-line info">[系统] 准备就绪，等待开始注册...</div>
</div>
</div>
</div>
</div>
</div>
<!-- 控制台日志 -->
<div class="card">
<div class="card-header">
<h3>💻 控制台日志</h3>
<button class="btn btn-ghost btn-sm" id="clear-log-btn">清空</button>
</div>
<div class="card-body" style="padding: 0;">
<div id="console-log" class="console-log">
<div class="log-line info">[系统] 准备就绪，等待开始注册...</div>
<!-- 已注册账号列表 -->
<div class="card">
<div class="card-header">
<h3>📋 已注册账号</h3>
<div style="display: flex; gap: var(--spacing-sm);">
<button class="btn btn-ghost btn-sm" id="refresh-accounts-btn">🔄 刷新</button>
<a href="/accounts" class="btn btn-secondary btn-sm">查看全部</a>
</div>
</div>
<div class="card-body" style="padding: 0;">
<div class="recent-accounts-table">
<table class="data-table">
<thead>
<tr>
<th style="width: 50px;">ID</th>
<th>邮箱</th>
<th style="width: 120px;">密码</th>
<th style="width: 80px;">状态</th>
<th style="width: 80px;">操作</th>
</tr>
</thead>
<tbody id="recent-accounts-table">
<tr>
<td colspan="5">
<div class="empty-state" style="padding: var(--spacing-md);">
<div class="empty-state-icon">📭</div>
<div class="empty-state-title">暂无已注册账号</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>

161
templates/settings.html
View File

@@ -17,6 +17,7 @@
<div class="nav-links">
<a href="/" class="nav-link">注册</a>
<a href="/accounts" class="nav-link">账号管理</a>
<a href="/email-services" class="nav-link">邮箱服务</a>
<a href="/settings" class="nav-link active">设置</a>
</div>
<button class="theme-toggle" onclick="theme.toggle()" title="切换主题">
@@ -34,16 +35,17 @@
<!-- 设置标签页 -->
<div class="tabs">
<button class="tab-btn active" data-tab="proxy">🌐 代理设置</button>
<button class="tab-btn" data-tab="email">📧 邮箱服务</button>
<button class="tab-btn" data-tab="registration">⚙️ 注册配置</button>
<button class="tab-btn" data-tab="database">💾 数据库</button>
</div>
<!-- 代理设置 -->
<div class="tab-content active" id="proxy-tab">
<!-- 默认代理配置 -->
<div class="card">
<div class="card-header">
<h3>代理配置</h3>
<h3>默认代理配置</h3>
<span class="hint">当代理列表为空时使用此配置</span>
</div>
<div class="card-body">
<form id="proxy-form">
@@ -93,74 +95,37 @@
</form>
</div>
</div>
</div>
<!-- 邮箱服务 -->
<div class="tab-content" id="email-tab">
<!-- Outlook 批量导入 -->
<div class="card" id="outlook-import-card">
<!-- 代理列表 -->
<div class="card" style="margin-top: var(--spacing-lg);">
<div class="card-header">
<h3>📥 Outlook 批量导入</h3>
<button class="btn btn-ghost btn-sm" id="toggle-import-btn">展开</button>
</div>
<div class="card-body" id="outlook-import-body" style="display: none;">
<div class="import-info">
<p><strong>支持格式：</strong></p>
<ul>
<li><code>邮箱----密码</code> （密码认证）</li>
<li><code>邮箱----密码----client_id----refresh_token</code> （XOAUTH2 认证，推荐）</li>
</ul>
<p>每行一个账户，使用四个连字符（----）分隔字段。以 # 开头的行将被忽略。</p>
<h3>代理列表</h3>
<div style="display: flex; gap: var(--spacing-sm);">
<button class="btn btn-secondary btn-sm" id="test-all-proxies-btn">🔌 测试全部</button>
<button class="btn btn-primary btn-sm" id="add-proxy-btn">➕ 添加代理</button>
</div>
<div class="form-group">
<label for="outlook-import-data">批量导入数据</label>
<textarea id="outlook-import-data" rows="8" placeholder="example@outlook.com----password123&#10;test@outlook.com----password456----client_id----refresh_token"></textarea>
</div>
<div class="form-row">
<div class="form-group">
<label>
<input type="checkbox" id="outlook-import-enabled" checked>
导入后启用
</label>
</div>
<div class="form-group">
<label for="outlook-import-priority">优先级</label>
<input type="number" id="outlook-import-priority" value="0" min="0">
</div>
</div>
<div class="form-actions">
<button type="button" class="btn btn-primary" id="outlook-import-btn">📥 开始导入</button>
<button type="button" class="btn btn-secondary" id="clear-import-btn">清空</button>
</div>
<div id="import-result" style="display: none; margin-top: var(--spacing-md);"></div>
</div>
</div>
<div class="card">
<div class="card-header">
<h3>邮箱服务配置</h3>
<button class="btn btn-primary btn-sm" id="add-email-service-btn">➕ 添加服务</button>
</div>
<div class="card-body" style="padding: 0;">
<div class="table-container">
<table class="data-table">
<thead>
<tr>
<th style="width: 40px;"><input type="checkbox" id="select-all-services"></th>
<th style="width: 50px;">ID</th>
<th>名称</th>
<th style="width: 120px;">类型</th>
<th style="width: 100px;">状态</th>
<th style="width: 80px;">优先级</th>
<th style="width: 160px;">最后使用</th>
<th style="width: 180px;">操作</th>
<th>类型</th>
<th>地址</th>
<th style="width: 80px;">状态</th>
<th style="width: 120px;">最后使用</th>
<th style="width: 150px;">操作</th>
</tr>
</thead>
<tbody id="email-services-table">
<tbody id="proxies-table">
<tr>
<td colspan="7">
<div class="empty-state">
<div class="skeleton skeleton-text"></div>
<div class="skeleton skeleton-text" style="width: 80%;"></div>
<div class="empty-state-icon">🌐</div>
<div class="empty-state-title">暂无代理</div>
<div class="empty-state-description">点击"添加代理"按钮添加代理服务器</div>
</div>
</td>
</tr>
@@ -171,6 +136,56 @@
</div>
</div>
<!-- 添加代理模态框 -->
<div class="modal" id="add-proxy-modal">
<div class="modal-content">
<div class="modal-header">
<h3 id="proxy-modal-title">添加代理</h3>
<button class="modal-close" id="close-proxy-modal">&times;</button>
</div>
<div class="modal-body">
<form id="proxy-item-form">
<input type="hidden" id="proxy-item-id">
<div class="form-group">
<label for="proxy-item-name">名称</label>
<input type="text" id="proxy-item-name" name="name" required placeholder="例如：美国代理 1">
</div>
<div class="form-row">
<div class="form-group">
<label for="proxy-item-type">类型</label>
<select id="proxy-item-type" name="type">
<option value="http">HTTP</option>
<option value="socks5">SOCKS5</option>
</select>
</div>
<div class="form-group">
<label for="proxy-item-host">主机地址</label>
<input type="text" id="proxy-item-host" name="host" required placeholder="127.0.0.1">
</div>
<div class="form-group">
<label for="proxy-item-port">端口</label>
<input type="number" id="proxy-item-port" name="port" required placeholder="7890">
</div>
</div>
<div class="form-row">
<div class="form-group">
<label for="proxy-item-username">用户名 (可选)</label>
<input type="text" id="proxy-item-username" name="username" autocomplete="off">
</div>
<div class="form-group">
<label for="proxy-item-password">密码 (可选)</label>
<input type="password" id="proxy-item-password" name="password" autocomplete="new-password">
</div>
</div>
<div class="form-actions">
<button type="button" class="btn btn-secondary" id="cancel-proxy-btn">取消</button>
<button type="submit" class="btn btn-primary">💾 保存</button>
</div>
</form>
</div>
</div>
</div>
<!-- 注册配置 -->
<div class="tab-content" id="registration-tab">
<div class="card">
@@ -252,42 +267,6 @@
</main>
</div>
<!-- 添加邮箱服务模态框 -->
<div class="modal" id="add-service-modal">
<div class="modal-content">
<div class="modal-header">
<h3>➕ 添加邮箱服务</h3>
<button class="modal-close" id="close-service-modal">&times;</button>
</div>
<div class="modal-body">
<form id="add-service-form">
<div class="form-group">
<label for="service-type">服务类型</label>
<select id="service-type" name="service_type" required>
<option value="tempmail">Tempmail.lol</option>
<option value="outlook">Outlook</option>
<option value="custom_domain">自定义域名</option>
</select>
</div>
<div class="form-group">
<label for="service-name">服务名称</label>
<input type="text" id="service-name" name="name" required placeholder="例如：我的 Outlook 账号">
</div>
<div id="service-config-fields">
<!-- 根据类型动态加载 -->
</div>
<div class="form-actions">
<button type="submit" class="btn btn-primary">添加</button>
<button type="button" class="btn btn-secondary" id="cancel-add-service">取消</button>
</div>
</form>
</div>
</div>
</div>
<script src="/static/js/utils.js"></script>
<script src="/static/js/settings.js"></script>
</body>