329 lines
9.3 KiB
HTML
329 lines
9.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>拼多多 Cookie 自动保活</title>
|
|
<style>
|
|
* {
|
|
box-sizing: border-box;
|
|
margin: 0;
|
|
padding: 0;
|
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
|
}
|
|
body {
|
|
width: 380px;
|
|
padding: 14px;
|
|
background: #f8fafc;
|
|
color: #1e293b;
|
|
font-size: 13px;
|
|
}
|
|
.header {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding-bottom: 10px;
|
|
border-bottom: 1px solid #e2e8f0;
|
|
margin-bottom: 12px;
|
|
}
|
|
.title {
|
|
font-size: 15px;
|
|
font-weight: 600;
|
|
color: #0f172a;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 6px;
|
|
}
|
|
.version-tag {
|
|
font-size: 10px;
|
|
font-weight: normal;
|
|
background: #e0e7ff;
|
|
color: #3730a3;
|
|
padding: 1px 6px;
|
|
border-radius: 10px;
|
|
}
|
|
.badge {
|
|
display: inline-block;
|
|
padding: 2px 8px;
|
|
border-radius: 12px;
|
|
font-size: 11px;
|
|
font-weight: 500;
|
|
}
|
|
.badge-ok { background: #dcfce7; color: #15803d; }
|
|
.badge-err { background: #fee2e2; color: #b91c1c; }
|
|
.badge-warn { background: #fef3c7; color: #b45309; }
|
|
.badge-gray { background: #f1f5f9; color: #64748b; }
|
|
.card {
|
|
background: #ffffff;
|
|
border: 1px solid #e2e8f0;
|
|
border-radius: 8px;
|
|
padding: 11px;
|
|
margin-bottom: 10px;
|
|
box-shadow: 0 1px 2px rgba(0,0,0,0.03);
|
|
}
|
|
.row {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-bottom: 7px;
|
|
}
|
|
.row:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
.label {
|
|
color: #64748b;
|
|
font-size: 12px;
|
|
}
|
|
.val {
|
|
font-weight: 500;
|
|
color: #0f172a;
|
|
font-size: 12px;
|
|
}
|
|
.val-highlight {
|
|
color: #2563eb;
|
|
}
|
|
.form-group {
|
|
margin-bottom: 9px;
|
|
}
|
|
.form-group label {
|
|
display: block;
|
|
margin-bottom: 3px;
|
|
font-weight: 500;
|
|
font-size: 12px;
|
|
color: #334155;
|
|
}
|
|
input, textarea {
|
|
width: 100%;
|
|
padding: 6px 9px;
|
|
border: 1px solid #cbd5e1;
|
|
border-radius: 6px;
|
|
font-size: 12px;
|
|
outline: none;
|
|
transition: border-color 0.2s;
|
|
}
|
|
input:focus, textarea:focus {
|
|
border-color: #3b82f6;
|
|
box-shadow: 0 0 0 2px rgba(59,130,246,0.1);
|
|
}
|
|
.btn {
|
|
display: inline-block;
|
|
width: 100%;
|
|
padding: 8px 12px;
|
|
border-radius: 6px;
|
|
font-size: 13px;
|
|
font-weight: 500;
|
|
text-align: center;
|
|
cursor: pointer;
|
|
border: none;
|
|
transition: all 0.2s;
|
|
}
|
|
.btn-primary {
|
|
background: #2563eb;
|
|
color: #ffffff;
|
|
}
|
|
.btn-primary:hover {
|
|
background: #1d4ed8;
|
|
}
|
|
.btn-secondary {
|
|
background: #ffffff;
|
|
border: 1px solid #cbd5e1;
|
|
color: #334155;
|
|
}
|
|
.btn-secondary:hover {
|
|
background: #f8fafc;
|
|
border-color: #94a3b8;
|
|
}
|
|
.btn-xs {
|
|
width: auto;
|
|
padding: 2px 7px;
|
|
font-size: 11px;
|
|
border-radius: 4px;
|
|
background: #f1f5f9;
|
|
border: 1px solid #cbd5e1;
|
|
color: #475569;
|
|
cursor: pointer;
|
|
}
|
|
.btn-xs:hover {
|
|
background: #e2e8f0;
|
|
color: #1e293b;
|
|
}
|
|
.btn:disabled {
|
|
opacity: 0.6;
|
|
cursor: not-allowed;
|
|
}
|
|
.msg-box {
|
|
font-size: 12px;
|
|
padding: 8px 10px;
|
|
border-radius: 6px;
|
|
margin-top: 8px;
|
|
display: none;
|
|
line-height: 1.4;
|
|
}
|
|
.msg-success { background: #f0fdf4; color: #166534; border: 1px solid #bbf7d0; }
|
|
.msg-error { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
|
|
.msg-warn { background: #fffbeb; color: #92400e; border: 1px solid #fde68a; }
|
|
|
|
/* 日志控制台样式 */
|
|
.log-panel {
|
|
margin-top: 10px;
|
|
}
|
|
.log-header {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-bottom: 6px;
|
|
}
|
|
.log-title {
|
|
font-size: 12px;
|
|
font-weight: 600;
|
|
color: #475569;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 6px;
|
|
}
|
|
.log-actions {
|
|
display: flex;
|
|
gap: 4px;
|
|
}
|
|
.log-box {
|
|
background: #0f172a;
|
|
color: #e2e8f0;
|
|
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
|
|
font-size: 11px;
|
|
border-radius: 6px;
|
|
padding: 8px;
|
|
max-height: 150px;
|
|
overflow-y: auto;
|
|
line-height: 1.5;
|
|
}
|
|
.log-item {
|
|
padding: 2px 0;
|
|
border-bottom: 1px dashed #1e293b;
|
|
word-break: break-all;
|
|
}
|
|
.log-item:last-child {
|
|
border-bottom: none;
|
|
}
|
|
.log-time {
|
|
color: #64748b;
|
|
margin-right: 4px;
|
|
}
|
|
.log-tag-info { color: #38bdf8; font-weight: 600; margin-right: 4px; }
|
|
.log-tag-success { color: #4ade80; font-weight: 600; margin-right: 4px; }
|
|
.log-tag-warn { color: #facc15; font-weight: 600; margin-right: 4px; }
|
|
.log-tag-error { color: #f87171; font-weight: 600; margin-right: 4px; }
|
|
.log-action { color: #a78bfa; margin-right: 4px; }
|
|
.log-empty {
|
|
color: #64748b;
|
|
text-align: center;
|
|
padding: 12px 0;
|
|
}
|
|
|
|
.security-tag {
|
|
font-size: 11px;
|
|
color: #94a3b8;
|
|
text-align: center;
|
|
margin-top: 10px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 4px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="header">
|
|
<div class="title">
|
|
<span>拼多多 Cookie 保活</span>
|
|
<span class="version-tag">v1.1.0</span>
|
|
</div>
|
|
<div id="statusBadge" class="badge badge-gray">未检测</div>
|
|
</div>
|
|
|
|
<!-- 状态概览卡片 -->
|
|
<div class="card">
|
|
<div class="row">
|
|
<span class="label">MMS 登录状态:</span>
|
|
<span id="mmsStatus" class="val">检测中...</span>
|
|
</div>
|
|
<div class="row">
|
|
<span class="label">绑定店铺:</span>
|
|
<span id="shopDisplay" class="val">未配置</span>
|
|
</div>
|
|
<div class="row">
|
|
<span class="label">上次同步:</span>
|
|
<span id="lastSyncDisplay" class="val">未同步</span>
|
|
</div>
|
|
<div class="row" id="orderCountRow" style="display: none;">
|
|
<span class="label">在售/历史单:</span>
|
|
<span id="orderCountDisplay" class="val val-highlight">0 笔</span>
|
|
</div>
|
|
<div id="statusMsg" class="msg-box"></div>
|
|
</div>
|
|
|
|
<!-- 手动立即同步按钮 -->
|
|
<button id="btnSyncNow" class="btn btn-primary">立即上传同步 Cookie</button>
|
|
|
|
<!-- 运行与诊断日志面板 -->
|
|
<div class="log-panel">
|
|
<div class="log-header">
|
|
<div class="log-title">
|
|
<span>📋 运行日志</span>
|
|
<span id="logCountBadge" style="font-size: 10px; color: #64748b;">(0条)</span>
|
|
</div>
|
|
<div class="log-actions">
|
|
<button id="btnCopyLogs" class="btn-xs" title="复制全部日志到剪贴板">复制日志</button>
|
|
<button id="btnClearLogs" class="btn-xs" title="清空历史日志">清空</button>
|
|
</div>
|
|
</div>
|
|
<div id="logBox" class="log-box">
|
|
<div class="log-empty">暂无运行日志</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 配置折叠区 -->
|
|
<div style="margin-top: 12px;">
|
|
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px;">
|
|
<span style="font-weight: 600; font-size: 12px; color: #475569;">⚙️ 连接配置</span>
|
|
<a href="#" id="btnToggleImport" style="font-size: 11px; color: #2563eb; text-decoration: none;">导入配置 JSON</a>
|
|
</div>
|
|
|
|
<!-- 导入 JSON 框（默认隐藏） -->
|
|
<div id="importArea" style="display: none; margin-bottom: 10px;">
|
|
<textarea id="importJsonInput" rows="3" placeholder="在此粘贴后台复制的完整配置 JSON..."></textarea>
|
|
<button id="btnApplyImport" class="btn btn-secondary" style="margin-top: 4px; padding: 5px; font-size: 11px;">解析并填充输入框</button>
|
|
</div>
|
|
|
|
<div class="card" style="margin-bottom: 8px;">
|
|
<div class="form-group">
|
|
<label for="inputServerUrl">服务端 API 地址</label>
|
|
<input type="text" id="inputServerUrl" placeholder="例如：https://order.domain.com">
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="inputShopId">店铺标识 (Shop ID)</label>
|
|
<input type="text" id="inputShopId" placeholder="例如：store_pdd_01">
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="inputSyncToken">专属配对密钥 (Sync Token)</label>
|
|
<input type="password" id="inputSyncToken" placeholder="例如：pdd_tok_xxx">
|
|
</div>
|
|
<div class="form-group" style="margin-bottom: 0;">
|
|
<label for="inputManualCookie" style="display: flex; justify-content: space-between;">
|
|
<span>手动指定 Cookie (选填)</span>
|
|
<span style="color: #94a3b8; font-weight: normal; font-size: 10px;">留空则自动提取</span>
|
|
</label>
|
|
<textarea id="inputManualCookie" rows="2" placeholder="默认自动嗅探浏览器 Cookie；若需要强制覆盖可在此手动粘贴完整 Cookie"></textarea>
|
|
</div>
|
|
</div>
|
|
|
|
<button id="btnSaveConfig" class="btn btn-secondary">保存配置并重连</button>
|
|
</div>
|
|
|
|
<div class="security-tag">
|
|
<span>🛡️ RSA-OAEP + AES-256-GCM 端到端信封加密</span>
|
|
</div>
|
|
|
|
<script src="popup.js"></script>
|
|
</body>
|
|
</html>
|