jason/clean-chrome
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: implement custom node.js sync server and secure extension client with login/register UI

Browse Source
This commit is contained in:
jason
2026-03-03 23:50:26 +08:00
parent 0803f9cc14
commit fc4898a9ee
8 changed files with 629 additions and 99 deletions
Download Patch File Download Diff File Expand all files Collapse all files

111
popup.html
View File

@@ -3,50 +3,97 @@
<head>
<meta charset="UTF-8">
<title>QuickPurge</title>
<title>清速登</title>
<link rel="stylesheet" href="popup.css">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
</head>
<body>
<div class="header">
<h1>QuickPurge & AutoLogin</h1>
<button id="add-btn" class="icon-btn" title="添加新账号配置">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path stroke-linecap="round" stroke-linejoin="round" d="M12 5v14m-7-7h14" />
</svg>
</button>
</div>
<div id="app-view">
<div class="header">
<h1>清速登</h1>
<div>
<a href="#" id="logout-btn"
style="font-size: 11px; color: var(--text-secondary); text-decoration: none; margin-right: 8px;">切换账号</a>
<button id="add-btn" class="primary-btn btn-sm" style="padding: 4px 10px; font-size: 12px;"
title="添加新账号配置">
添加账号
</button>
</div>
</div>
<div id="add-form" class="hidden">
<div class="form-group">
<select id="env-select">
<option value="PP">PP环境 (app135148)</option>
<option value="ATS">ATS环境 (app135149)</option>
</select>
<div id="add-form" class="hidden">
<h2 id="form-title">添加配置</h2>
<input type="hidden" id="editing-id" />
<div class="form-group">
<select id="env-select">
<option value="DD_PP">DD PP</option>
<option value="DD_ATS">DD ATS</option>
<option value="STD_PP">STD PP</option>
<option value="STD_ATS">STD ATS</option>
</select>
</div>
<div class="form-group">
<input type="text" id="client-input" placeholder="客户名称 (例如: 某某测试)" autocomplete="off" />
</div>
<div class="form-group">
<input type="text" id="username-input" placeholder="账号" autocomplete="off" />
</div>
<div class="form-group">
<input type="password" id="password-input" placeholder="密码" autocomplete="new-password" />
</div>
<div class="form-actions">
<button id="cancel-btn" class="secondary-btn">取消</button>
<button id="save-btn" class="primary-btn">保存配置</button>
</div>
</div>
<div class="form-group">
<input type="text" id="client-input" placeholder="客户名称 (例如: 某某测试)" autocomplete="off" />
</div>
<div class="form-group">
<input type="text" id="username-input" placeholder="账号" autocomplete="off" />
</div>
<div class="form-group">
<input type="password" id="password-input" placeholder="密码" autocomplete="new-password" />
</div>
<div class="form-actions">
<button id="cancel-btn" class="secondary-btn">取消</button>
<button id="save-btn" class="primary-btn">保存配置</button>
<div class="rules-container">
<ul id="rules-list">
<!-- Rules will be dynamically inserted here by JS -->
</ul>
</div>
</div>
<div class="rules-container">
<ul id="rules-list">
<!-- Rules will be dynamically inserted here by JS -->
</ul>
<!-- 登录视图 -->
<div id="login-view" class="view-container">
<div class="auth-box">
<h2 style="font-size: 16px; margin-bottom: 20px;">账户登录</h2>
<div class="form-group">
<input type="text" id="auth-login-username" placeholder="请输入同步账号">
</div>
<div class="form-group">
<input type="password" id="auth-login-password" placeholder="请输入密码">
</div>
<button id="auth-login-btn" class="primary-btn" style="width: 100%; margin-top: 10px;">登录同步</button>
<div style="margin-top: 15px; font-size: 12px; text-align: center;">
还没有账号？ <a href="#" id="go-to-register"
style="color: var(--accent-color); text-decoration: none;">立即注册</a>
</div>
</div>
</div>
<!-- 注册视图 -->
<div id="register-view" class="view-container hidden">
<div class="auth-box">
<h2 style="font-size: 16px; margin-bottom: 20px;">新用户注册</h2>
<div class="form-group">
<input type="text" id="auth-reg-username" placeholder="账号">
</div>
<div class="form-group">
<input type="password" id="auth-reg-password" placeholder="密码">
</div>
<div class="form-group">
<input type="text" id="auth-reg-invite" placeholder="邀请码">
</div>
<button id="auth-reg-btn" class="primary-btn" style="width: 100%; margin-top: 10px;">注册</button>
<div style="margin-top: 15px; font-size: 12px; text-align: center;">
已有账号？ <a href="#" id="go-to-login" style="color: var(--accent-color); text-decoration: none;">返回登录</a>
</div>
</div>
</div>
<script src="popup.js"></script>
</body>
</html>
</html>