136 lines
6.4 KiB
HTML
136 lines
6.4 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<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 id="app-view">
|
|
<div class="header">
|
|
<div style="display: flex; align-items: center; gap: 8px;">
|
|
<button id="archive-toggle" class="icon-btn" title="查看已归档项目" style="padding: 4px;">
|
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M21 8v13H3V8M1 3h22v5H1V3zm10 8h2" />
|
|
</svg>
|
|
</button>
|
|
<div class="logo">
|
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M12 2L2 7L12 12L22 7L12 2Z" fill="url(#logo-grad)" stroke="white" stroke-width="1.5"
|
|
stroke-linejoin="round" />
|
|
<path d="M2 17L12 22L22 17" stroke="url(#logo-grad)" stroke-width="1.5" stroke-linecap="round"
|
|
stroke-linejoin="round" />
|
|
<path d="M2 12L12 17L22 12" stroke="url(#logo-grad)" stroke-width="1.5" stroke-linecap="round"
|
|
stroke-linejoin="round" />
|
|
<defs>
|
|
<linearGradient id="logo-grad" x1="2" y1="2" x2="22" y2="22" gradientUnits="userSpaceOnUse">
|
|
<stop stop-color="#3b82f6" />
|
|
<stop offset="1" stop-color="#8b5cf6" />
|
|
</linearGradient>
|
|
</defs>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
<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="main-view-content">
|
|
<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="rules-container">
|
|
<ul id="rules-list">
|
|
<!-- Rules will be dynamically inserted here by JS -->
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="archive-view-content" class="hidden">
|
|
<div
|
|
style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; border-bottom: 1px dashed var(--border-color); padding-bottom: 8px;">
|
|
<h2 style="font-size: 13px; margin: 0; color: var(--text-secondary); font-weight: 500;">已归档账号</h2>
|
|
<button id="back-to-main" class="secondary-btn" style="padding: 2px 8px; font-size: 11px;">返回列表</button>
|
|
</div>
|
|
<div class="rules-container">
|
|
<ul id="archive-list">
|
|
<!-- Archived rules will be inserted here -->
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 登录视图 -->
|
|
<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> |