From 61d8f6eabf6f236eeb29fa6bed064b707a6fe7d9 Mon Sep 17 00:00:00 2001
From: zhinianboke <115088296+zhinianboke@users.noreply.github.com>
Date: Sun, 3 Aug 2025 21:40:20 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E9=A1=B9=E7=9B=AE=E7=BB=93?=
=?UTF-8?q?=E6=9E=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
static/js/app-modular.js | 77 ++++
static/js/modules/account-list.js | 132 +++++++
static/js/modules/all-other-features.js | 197 ++++++++++
static/js/modules/cookies.js | 347 ++++++++++++++++++
static/js/modules/dashboard.js | 141 ++++++++
static/js/modules/example-usage.html | 102 ++++++
static/js/modules/globals.js | 15 +
static/js/modules/init.js | 171 +++++++++
static/js/modules/keyword-cache.js | 42 +++
static/js/modules/keywords.js | 463 ++++++++++++++++++++++++
static/js/modules/main-features.js | 189 ++++++++++
static/js/modules/navigation.js | 86 +++++
static/js/modules/utils.js | 85 +++++
13 files changed, 2047 insertions(+)
create mode 100644 static/js/app-modular.js
create mode 100644 static/js/modules/account-list.js
create mode 100644 static/js/modules/all-other-features.js
create mode 100644 static/js/modules/cookies.js
create mode 100644 static/js/modules/dashboard.js
create mode 100644 static/js/modules/example-usage.html
create mode 100644 static/js/modules/globals.js
create mode 100644 static/js/modules/init.js
create mode 100644 static/js/modules/keyword-cache.js
create mode 100644 static/js/modules/keywords.js
create mode 100644 static/js/modules/main-features.js
create mode 100644 static/js/modules/navigation.js
create mode 100644 static/js/modules/utils.js
diff --git a/static/js/app-modular.js b/static/js/app-modular.js
new file mode 100644
index 0000000..3234da5
--- /dev/null
+++ b/static/js/app-modular.js
@@ -0,0 +1,77 @@
+/**
+ * 闲鱼自动回复系统 - 模块化主入口文件
+ *
+ * 此文件负责引入所有功能模块，替代原来的单一app.js文件
+ *
+ * 模块结构：
+ * - globals.js: 全局变量
+ * - utils.js: 通用工具函数
+ * - navigation.js: 页面导航功能
+ * - dashboard.js: 仪表盘管理
+ * - keyword-cache.js: 关键词缓存管理
+ * - account-list.js: 账号列表管理
+ * - keywords.js: 关键词管理
+ * - cookies.js: Cookie管理
+ * - main-features.js: 主要功能
+ * - all-other-features.js: 所有其他功能
+ * - init.js: 应用初始化
+ */
+
+// 注意：在HTML中需要按以下顺序引入所有模块文件：
+/*
+
+
+
+
+
+
+
+
+
+
+
+*/
+
+// 模块加载完成后的初始化检查
+document.addEventListener('DOMContentLoaded', function() {
+ console.log('闲鱼自动回复系统 - 模块化版本已加载');
+
+ // 检查关键函数是否存在
+ const requiredFunctions = [
+ 'showSection',
+ 'loadDashboard',
+ 'loadCookies',
+ 'refreshAccountList',
+ 'loadAccountKeywords',
+ 'showToast',
+ 'toggleLoading'
+ ];
+
+ const missingFunctions = requiredFunctions.filter(func => typeof window[func] !== 'function');
+
+ if (missingFunctions.length > 0) {
+ console.error('缺少必要的函数:', missingFunctions);
+ console.error('请检查模块文件是否正确加载');
+ } else {
+ console.log('所有必要的函数已加载完成');
+ }
+});
+
+// 导出模块信息（用于调试）
+window.moduleInfo = {
+ version: '1.0.0',
+ modules: [
+ 'globals',
+ 'utils',
+ 'navigation',
+ 'dashboard',
+ 'keyword-cache',
+ 'account-list',
+ 'keywords',
+ 'cookies',
+ 'main-features',
+ 'all-other-features',
+ 'init'
+ ],
+ loadedAt: new Date().toISOString()
+};
diff --git a/static/js/modules/account-list.js b/static/js/modules/account-list.js
new file mode 100644
index 0000000..2888fbf
--- /dev/null
+++ b/static/js/modules/account-list.js
@@ -0,0 +1,132 @@
+// ==================== 账号列表管理 ====================
+
+// 刷新账号列表（用于自动回复页面）
+async function refreshAccountList() {
+ try {
+ toggleLoading(true);
+
+ // 获取账号列表
+ const response = await fetch(`${apiBase}/cookies/details`, {
+ headers: {
+ 'Authorization': `Bearer ${authToken}`
+ }
+ });
+
+ if (response.ok) {
+ const accounts = await response.json();
+ const select = document.getElementById('accountSelect');
+ select.innerHTML = '';
+
+ // 为每个账号获取关键词数量
+ const accountsWithKeywords = await Promise.all(
+ accounts.map(async (account) => {
+ try {
+ const keywordsResponse = await fetch(`${apiBase}/keywords/${account.id}`, {
+ headers: {
+ 'Authorization': `Bearer ${authToken}`
+ }
+ });
+
+ if (keywordsResponse.ok) {
+ const keywordsData = await keywordsResponse.json();
+ return {
+ ...account,
+ keywords: keywordsData,
+ keywordCount: keywordsData.length
+ };
+ } else {
+ return {
+ ...account,
+ keywordCount: 0
+ };
+ }
+ } catch (error) {
+ console.error(`获取账号 ${account.id} 关键词失败:`, error);
+ return {
+ ...account,
+ keywordCount: 0
+ };
+ }
+ })
+ );
+
+ // 渲染账号选项（显示所有账号，但标识禁用状态）
+ if (accountsWithKeywords.length === 0) {
+ select.innerHTML = '';
+ return;
+ }
+
+ // 分组显示：先显示启用的账号，再显示禁用的账号
+ const enabledAccounts = accountsWithKeywords.filter(account => {
+ const enabled = account.enabled === undefined ? true : account.enabled;
+ console.log(`账号 ${account.id} 过滤状态: enabled=${account.enabled}, 判断为启用=${enabled}`);
+ return enabled;
+ });
+ const disabledAccounts = accountsWithKeywords.filter(account => {
+ const enabled = account.enabled === undefined ? true : account.enabled;
+ return !enabled;
+ });
+
+ // 渲染启用的账号
+ enabledAccounts.forEach(account => {
+ const option = document.createElement('option');
+ option.value = account.id;
+
+ // 根据关键词数量显示不同的图标和样式
+ let icon = '📝';
+ let status = '';
+ if (account.keywordCount === 0) {
+ icon = '⚪';
+ status = ' (未配置)';
+ } else if (account.keywordCount >= 5) {
+ icon = '🟢';
+ status = ` (${account.keywordCount} 个关键词)`;
+ } else {
+ icon = '🟡';
+ status = ` (${account.keywordCount} 个关键词)`;
+ }
+
+ option.textContent = `${icon} ${account.id}${status}`;
+ select.appendChild(option);
+ });
+
+ // 如果有禁用的账号，添加分隔线和禁用账号
+ if (disabledAccounts.length > 0) {
+ // 添加分隔线
+ const separatorOption = document.createElement('option');
+ separatorOption.disabled = true;
+ separatorOption.textContent = `--- 禁用账号 (${disabledAccounts.length} 个) ---`;
+ select.appendChild(separatorOption);
+
+ // 渲染禁用的账号
+ disabledAccounts.forEach(account => {
+ const option = document.createElement('option');
+ option.value = account.id;
+
+ // 禁用账号使用特殊图标和样式
+ let icon = '🔴';
+ let status = '';
+ if (account.keywordCount === 0) {
+ status = ' (未配置) [已禁用]';
+ } else {
+ status = ` (${account.keywordCount} 个关键词) [已禁用]`;
+ }
+
+ option.textContent = `${icon} ${account.id}${status}`;
+ option.style.color = '#6b7280';
+ option.style.fontStyle = 'italic';
+ select.appendChild(option);
+ });
+ }
+
+ console.log('账号列表刷新完成，关键词统计:', accountsWithKeywords.map(a => ({ id: a.id, keywords: a.keywordCount })));
+ } else {
+ showToast('获取账号列表失败', 'danger');
+ }
+ } catch (error) {
+ console.error('刷新账号列表失败:', error);
+ showToast('刷新账号列表失败', 'danger');
+ } finally {
+ toggleLoading(false);
+ }
+}
diff --git a/static/js/modules/all-other-features.js b/static/js/modules/all-other-features.js
new file mode 100644
index 0000000..e0be265
--- /dev/null
+++ b/static/js/modules/all-other-features.js
@@ -0,0 +1,197 @@
+// ==================== 所有其他功能模块 ====================
+// 此文件包含原app.js中除已拆分模块外的所有其他功能
+
+// ==================== 默认回复管理功能 ====================
+
+// 打开默认回复管理器
+async function openDefaultReplyManager() {
+ try {
+ await loadDefaultReplies();
+ const modal = new bootstrap.Modal(document.getElementById('defaultReplyModal'));
+ modal.show();
+ } catch (error) {
+ console.error('打开默认回复管理器失败:', error);
+ showToast('打开默认回复管理器失败', 'danger');
+ }
+}
+
+// 加载默认回复列表
+async function loadDefaultReplies() {
+ try {
+ // 获取所有账号
+ const accountsResponse = await fetch(`${apiBase}/cookies`, {
+ headers: {
+ 'Authorization': `Bearer ${authToken}`
+ }
+ });
+
+ if (!accountsResponse.ok) {
+ throw new Error('获取账号列表失败');
+ }
+
+ const accounts = await accountsResponse.json();
+
+ // 获取所有默认回复设置
+ const repliesResponse = await fetch(`${apiBase}/default-replies`, {
+ headers: {
+ 'Authorization': `Bearer ${authToken}`
+ }
+ });
+
+ let defaultReplies = {};
+ if (repliesResponse.ok) {
+ defaultReplies = await repliesResponse.json();
+ }
+
+ renderDefaultRepliesList(accounts, defaultReplies);
+ } catch (error) {
+ console.error('加载默认回复列表失败:', error);
+ showToast('加载默认回复列表失败', 'danger');
+ }
+}
+
+// 渲染默认回复列表
+function renderDefaultRepliesList(accounts, defaultReplies) {
+ const tbody = document.getElementById('defaultReplyTableBody');
+ tbody.innerHTML = '';
+
+ if (accounts.length === 0) {
+ tbody.innerHTML = `
+
+
+
+ 暂无账号数据
+ 请先添加账号
+ |
+
+ `;
+ return;
+ }
+
+ accounts.forEach(accountId => {
+ const replySettings = defaultReplies[accountId] || { enabled: false, reply_content: '' };
+ const tr = document.createElement('tr');
+
+ // 状态标签
+ const statusBadge = replySettings.enabled ?
+ '启用' :
+ '禁用';
+
+ // 回复内容预览
+ let contentPreview = replySettings.reply_content || '未设置';
+ if (contentPreview.length > 50) {
+ contentPreview = contentPreview.substring(0, 50) + '...';
+ }
+
+ tr.innerHTML = `
+
+ ${accountId}
+ |
+ ${statusBadge} |
+
+
+ ${contentPreview}
+
+ |
+
+
+
+
+
+ |
+ `;
+
+ tbody.appendChild(tr);
+ });
+}
+
+// 编辑默认回复
+async function editDefaultReply(accountId) {
+ try {
+ // 获取当前设置
+ const response = await fetch(`${apiBase}/default-replies/${accountId}`, {
+ headers: {
+ 'Authorization': `Bearer ${authToken}`
+ }
+ });
+
+ let settings = { enabled: false, reply_content: '' };
+ if (response.ok) {
+ settings = await response.json();
+ }
+
+ // 填充编辑表单
+ document.getElementById('editAccountId').value = accountId;
+ document.getElementById('editAccountIdDisplay').value = accountId;
+ document.getElementById('editDefaultReplyEnabled').checked = settings.enabled;
+ document.getElementById('editReplyContent').value = settings.reply_content || '';
+
+ // 根据启用状态显示/隐藏内容输入框
+ toggleReplyContentVisibility();
+
+ // 显示编辑模态框
+ const modal = new bootstrap.Modal(document.getElementById('editDefaultReplyModal'));
+ modal.show();
+ } catch (error) {
+ console.error('获取默认回复设置失败:', error);
+ showToast('获取默认回复设置失败', 'danger');
+ }
+}
+
+// 切换回复内容输入框的显示/隐藏
+function toggleReplyContentVisibility() {
+ const enabled = document.getElementById('editDefaultReplyEnabled').checked;
+ const contentGroup = document.getElementById('editReplyContentGroup');
+ contentGroup.style.display = enabled ? 'block' : 'none';
+}
+
+// 保存默认回复设置
+async function saveDefaultReply() {
+ try {
+ const accountId = document.getElementById('editAccountId').value;
+ const enabled = document.getElementById('editDefaultReplyEnabled').checked;
+ const replyContent = document.getElementById('editReplyContent').value;
+
+ if (enabled && !replyContent.trim()) {
+ showToast('启用默认回复时必须设置回复内容', 'warning');
+ return;
+ }
+
+ const data = {
+ enabled: enabled,
+ reply_content: enabled ? replyContent : null
+ };
+
+ const response = await fetch(`${apiBase}/default-replies/${accountId}`, {
+ method: 'PUT',
+ headers: {
+ 'Authorization': `Bearer ${authToken}`,
+ 'Content-Type': 'application/json'
+ },
+ body: JSON.stringify(data)
+ });
+
+ if (response.ok) {
+ showToast('默认回复设置保存成功', 'success');
+ bootstrap.Modal.getInstance(document.getElementById('editDefaultReplyModal')).hide();
+ loadDefaultReplies(); // 刷新列表
+ loadCookies(); // 刷新账号列表以更新默认回复状态显示
+ } else {
+ const error = await response.text();
+ showToast(`保存失败: ${error}`, 'danger');
+ }
+ } catch (error) {
+ console.error('保存默认回复设置失败:', error);
+ showToast('保存默认回复设置失败', 'danger');
+ }
+}
+
+// 测试默认回复
+function testDefaultReply(accountId) {
+ console.log('测试默认回复功能，账号ID:', accountId);
+ showToast('测试功能开发中...', 'info');
+}
diff --git a/static/js/modules/cookies.js b/static/js/modules/cookies.js
new file mode 100644
index 0000000..60920fb
--- /dev/null
+++ b/static/js/modules/cookies.js
@@ -0,0 +1,347 @@
+// ==================== Cookie管理 ====================
+
+// 加载Cookie列表
+async function loadCookies() {
+ try {
+ toggleLoading(true);
+ const tbody = document.querySelector('#cookieTable tbody');
+ tbody.innerHTML = '';
+
+ const cookieDetails = await fetchJSON(apiBase + '/cookies/details');
+
+ if (cookieDetails.length === 0) {
+ tbody.innerHTML = `
+
+
+
+ 暂无账号
+ 请添加新的闲鱼账号开始使用
+ |
+
+ `;
+ return;
+ }
+
+ // 为每个账号获取关键词数量和默认回复设置并渲染
+ const accountsWithKeywords = await Promise.all(
+ cookieDetails.map(async (cookie) => {
+ try {
+ // 获取关键词数量
+ const keywordsResponse = await fetch(`${apiBase}/keywords/${cookie.id}`, {
+ headers: { 'Authorization': `Bearer ${authToken}` }
+ });
+
+ let keywordCount = 0;
+ if (keywordsResponse.ok) {
+ const keywordsData = await keywordsResponse.json();
+ keywordCount = keywordsData.length;
+ }
+
+ // 获取默认回复设置
+ const defaultReplyResponse = await fetch(`${apiBase}/default-replies/${cookie.id}`, {
+ headers: { 'Authorization': `Bearer ${authToken}` }
+ });
+
+ let defaultReply = { enabled: false, reply_content: '' };
+ if (defaultReplyResponse.ok) {
+ defaultReply = await defaultReplyResponse.json();
+ }
+
+ // 获取AI回复设置
+ const aiReplyResponse = await fetch(`${apiBase}/ai-reply-settings/${cookie.id}`, {
+ headers: { 'Authorization': `Bearer ${authToken}` }
+ });
+
+ let aiReply = { ai_enabled: false, model_name: 'qwen-plus' };
+ if (aiReplyResponse.ok) {
+ aiReply = await aiReplyResponse.json();
+ }
+
+ return {
+ ...cookie,
+ keywordCount: keywordCount,
+ defaultReply: defaultReply,
+ aiReply: aiReply
+ };
+ } catch (error) {
+ return {
+ ...cookie,
+ keywordCount: 0,
+ defaultReply: { enabled: false, reply_content: '' },
+ aiReply: { ai_enabled: false, model_name: 'qwen-plus' }
+ };
+ }
+ })
+ );
+
+ accountsWithKeywords.forEach(cookie => {
+ // 使用数据库中的实际状态，默认为启用
+ const isEnabled = cookie.enabled === undefined ? true : cookie.enabled;
+
+ console.log(`账号 ${cookie.id} 状态: enabled=${cookie.enabled}, isEnabled=${isEnabled}`); // 调试信息
+
+ const tr = document.createElement('tr');
+ tr.className = `account-row ${isEnabled ? 'enabled' : 'disabled'}`;
+ // 默认回复状态标签
+ const defaultReplyBadge = cookie.defaultReply.enabled ?
+ '启用' :
+ '禁用';
+
+ // AI回复状态标签
+ const aiReplyBadge = cookie.aiReply.ai_enabled ?
+ 'AI启用' :
+ 'AI禁用';
+
+ // 自动确认发货状态（默认开启）
+ const autoConfirm = cookie.auto_confirm === undefined ? true : cookie.auto_confirm;
+
+ tr.innerHTML = `
+
+
+ ${cookie.id}
+
+ |
+
+
+ ${cookie.value || '未设置'}
+
+ |
+
+
+ ${cookie.keywordCount} 个关键词
+
+ |
+
+
+
+
+
+
+
+ |
+
+ ${defaultReplyBadge}
+ |
+
+ ${aiReplyBadge}
+ |
+
+
+
+
+
+
+
+ |
+
+
+
+
+
+
+
+
+ |
+ `;
+ tbody.appendChild(tr);
+ });
+
+ // 为Cookie值添加点击复制功能
+ document.querySelectorAll('.cookie-value').forEach(element => {
+ element.style.cursor = 'pointer';
+ element.addEventListener('click', function() {
+ const cookieValue = this.textContent;
+ if (cookieValue && cookieValue !== '未设置') {
+ navigator.clipboard.writeText(cookieValue).then(() => {
+ showToast('Cookie已复制到剪贴板', 'success');
+ }).catch(() => {
+ showToast('复制失败，请手动复制', 'error');
+ });
+ }
+ });
+ });
+
+ } catch (err) {
+ // 错误已在fetchJSON中处理
+ } finally {
+ toggleLoading(false);
+ }
+}
+
+// 复制Cookie
+function copyCookie(id, value) {
+ if (!value || value === '未设置') {
+ showToast('该账号暂无Cookie值', 'warning');
+ return;
+ }
+
+ navigator.clipboard.writeText(value).then(() => {
+ showToast(`账号 "${id}" 的Cookie已复制到剪贴板`, 'success');
+ }).catch(() => {
+ // 降级方案：创建临时文本框
+ const textArea = document.createElement('textarea');
+ textArea.value = value;
+ document.body.appendChild(textArea);
+ textArea.select();
+ try {
+ document.execCommand('copy');
+ showToast(`账号 "${id}" 的Cookie已复制到剪贴板`, 'success');
+ } catch (err) {
+ showToast('复制失败，请手动复制', 'error');
+ }
+ document.body.removeChild(textArea);
+ });
+}
+
+// 删除Cookie
+async function delCookie(id) {
+ if (!confirm(`确定要删除账号 "${id}" 吗？此操作不可恢复。`)) return;
+
+ try {
+ await fetchJSON(apiBase + `/cookies/${id}`, { method: 'DELETE' });
+ showToast(`账号 "${id}" 已删除`, 'success');
+ loadCookies();
+ } catch (err) {
+ // 错误已在fetchJSON中处理
+ }
+}
+
+// 内联编辑Cookie
+function editCookieInline(id, currentValue) {
+ const row = event.target.closest('tr');
+ const cookieValueCell = row.querySelector('.cookie-value');
+ const originalContent = cookieValueCell.innerHTML;
+
+ // 存储原始数据到全局变量，避免HTML注入问题
+ window.editingCookieData = {
+ id: id,
+ originalContent: originalContent,
+ originalValue: currentValue || ''
+ };
+
+ // 创建编辑界面容器
+ const editContainer = document.createElement('div');
+ editContainer.className = 'd-flex gap-2';
+
+ // 创建输入框
+ const input = document.createElement('input');
+ input.type = 'text';
+ input.className = 'form-control form-control-sm';
+ input.id = `edit-${id}`;
+ input.value = currentValue || '';
+ input.placeholder = '输入新的Cookie值';
+
+ // 创建保存按钮
+ const saveBtn = document.createElement('button');
+ saveBtn.className = 'btn btn-sm btn-success';
+ saveBtn.title = '保存';
+ saveBtn.innerHTML = '';
+ saveBtn.onclick = () => saveCookieInline(id);
+
+ // 创建取消按钮
+ const cancelBtn = document.createElement('button');
+ cancelBtn.className = 'btn btn-sm btn-secondary';
+ cancelBtn.title = '取消';
+ cancelBtn.innerHTML = '';
+ cancelBtn.onclick = () => cancelCookieEdit(id);
+
+ // 组装编辑界面
+ editContainer.appendChild(input);
+ editContainer.appendChild(saveBtn);
+ editContainer.appendChild(cancelBtn);
+
+ // 替换原内容
+ cookieValueCell.innerHTML = '';
+ cookieValueCell.appendChild(editContainer);
+
+ // 聚焦输入框
+ input.focus();
+ input.select();
+
+ // 添加键盘事件监听
+ input.addEventListener('keydown', function (e) {
+ if (e.key === 'Enter') {
+ e.preventDefault();
+ saveCookieInline(id);
+ } else if (e.key === 'Escape') {
+ e.preventDefault();
+ cancelCookieEdit(id);
+ }
+ });
+
+ // 禁用该行的其他按钮
+ const actionButtons = row.querySelectorAll('.btn-group button');
+ actionButtons.forEach(btn => btn.disabled = true);
+}
+
+// 保存内联编辑的Cookie
+async function saveCookieInline(id) {
+ const input = document.getElementById(`edit-${id}`);
+ const newValue = input.value.trim();
+
+ if (!newValue) {
+ showToast('Cookie值不能为空', 'warning');
+ return;
+ }
+
+ try {
+ toggleLoading(true);
+
+ await fetchJSON(apiBase + `/cookies/${id}`, {
+ method: 'PUT',
+ headers: { 'Content-Type': 'application/json' },
+ body: JSON.stringify({
+ id: id,
+ value: newValue
+ })
+ });
+
+ showToast(`账号 "${id}" Cookie已更新`, 'success');
+ loadCookies(); // 重新加载列表
+
+ } catch (err) {
+ console.error('Cookie更新失败:', err);
+ showToast(`Cookie更新失败: ${err.message || '未知错误'}`, 'danger');
+ // 恢复原内容
+ cancelCookieEdit(id);
+ } finally {
+ toggleLoading(false);
+ }
+}
+
+// 取消Cookie编辑
+function cancelCookieEdit(id) {
+ if (!window.editingCookieData || window.editingCookieData.id !== id) {
+ console.error('编辑数据不存在');
+ return;
+ }
+
+ const row = document.querySelector(`#edit-${id}`).closest('tr');
+ const cookieValueCell = row.querySelector('.cookie-value');
+
+ // 恢复原内容
+ cookieValueCell.innerHTML = window.editingCookieData.originalContent;
+
+ // 恢复按钮状态
+ const actionButtons = row.querySelectorAll('.btn-group button');
+ actionButtons.forEach(btn => btn.disabled = false);
+
+ // 清理全局数据
+ delete window.editingCookieData;
+}
diff --git a/static/js/modules/dashboard.js b/static/js/modules/dashboard.js
new file mode 100644
index 0000000..e163fae
--- /dev/null
+++ b/static/js/modules/dashboard.js
@@ -0,0 +1,141 @@
+// ==================== 仪表盘管理 ====================
+
+// 加载仪表盘数据
+async function loadDashboard() {
+ try {
+ toggleLoading(true);
+
+ // 获取账号列表
+ const cookiesResponse = await fetch(`${apiBase}/cookies/details`, {
+ headers: {
+ 'Authorization': `Bearer ${authToken}`
+ }
+ });
+
+ if (cookiesResponse.ok) {
+ const cookiesData = await cookiesResponse.json();
+
+ // 为每个账号获取关键词信息
+ const accountsWithKeywords = await Promise.all(
+ cookiesData.map(async (account) => {
+ try {
+ const keywordsResponse = await fetch(`${apiBase}/keywords/${account.id}`, {
+ headers: {
+ 'Authorization': `Bearer ${authToken}`
+ }
+ });
+
+ if (keywordsResponse.ok) {
+ const keywordsData = await keywordsResponse.json();
+ return {
+ ...account,
+ keywords: keywordsData,
+ keywordCount: keywordsData.length
+ };
+ } else {
+ return {
+ ...account,
+ keywords: [],
+ keywordCount: 0
+ };
+ }
+ } catch (error) {
+ console.error(`获取账号 ${account.id} 关键词失败:`, error);
+ return {
+ ...account,
+ keywords: [],
+ keywordCount: 0
+ };
+ }
+ })
+ );
+
+ dashboardData.accounts = accountsWithKeywords;
+
+ // 计算统计数据
+ let totalKeywords = 0;
+ let activeAccounts = 0;
+ let enabledAccounts = 0;
+
+ accountsWithKeywords.forEach(account => {
+ const keywordCount = account.keywordCount || 0;
+ const isEnabled = account.enabled === undefined ? true : account.enabled;
+
+ if (isEnabled) {
+ enabledAccounts++;
+ totalKeywords += keywordCount;
+ if (keywordCount > 0) {
+ activeAccounts++;
+ }
+ }
+ });
+
+ dashboardData.totalKeywords = totalKeywords;
+
+ // 更新仪表盘显示
+ updateDashboardStats(accountsWithKeywords.length, totalKeywords, enabledAccounts);
+ updateDashboardAccountsList(accountsWithKeywords);
+ }
+ } catch (error) {
+ console.error('加载仪表盘数据失败:', error);
+ showToast('加载仪表盘数据失败', 'danger');
+ } finally {
+ toggleLoading(false);
+ }
+}
+
+// 更新仪表盘统计数据
+function updateDashboardStats(totalAccounts, totalKeywords, enabledAccounts) {
+ document.getElementById('totalAccounts').textContent = totalAccounts;
+ document.getElementById('totalKeywords').textContent = totalKeywords;
+ document.getElementById('activeAccounts').textContent = enabledAccounts;
+}
+
+// 更新仪表盘账号列表
+function updateDashboardAccountsList(accounts) {
+ const tbody = document.getElementById('dashboardAccountsList');
+ tbody.innerHTML = '';
+
+ if (accounts.length === 0) {
+ tbody.innerHTML = `
+
+ |
+
+ 暂无账号数据
+ |
+
+ `;
+ return;
+ }
+
+ accounts.forEach(account => {
+ const keywordCount = account.keywordCount || 0;
+ const isEnabled = account.enabled === undefined ? true : account.enabled;
+
+ let status = '';
+ if (!isEnabled) {
+ status = '已禁用';
+ } else if (keywordCount > 0) {
+ status = '活跃';
+ } else {
+ status = '未配置';
+ }
+
+ const row = document.createElement('tr');
+ row.className = isEnabled ? '' : 'table-secondary';
+ row.innerHTML = `
+
+ ${account.id}
+ ${!isEnabled ? '' : ''}
+ |
+
+ ${keywordCount} 个关键词
+ |
+ ${status} |
+
+ ${new Date().toLocaleString()}
+ |
+ `;
+ tbody.appendChild(row);
+ });
+}
diff --git a/static/js/modules/example-usage.html b/static/js/modules/example-usage.html
new file mode 100644
index 0000000..e951e24
--- /dev/null
+++ b/static/js/modules/example-usage.html
@@ -0,0 +1,102 @@
+
+
+
+
+
+ 闲鱼自动回复系统 - 模块化版本
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/static/js/modules/globals.js b/static/js/modules/globals.js
new file mode 100644
index 0000000..9eecdc0
--- /dev/null
+++ b/static/js/modules/globals.js
@@ -0,0 +1,15 @@
+// ==================== 全局变量 ====================
+const apiBase = location.origin;
+let keywordsData = {};
+let currentCookieId = '';
+let editCookieId = '';
+let authToken = localStorage.getItem('auth_token');
+let dashboardData = {
+ accounts: [],
+ totalKeywords: 0
+};
+
+// 账号关键词缓存
+let accountKeywordCache = {};
+let cacheTimestamp = 0;
+const CACHE_DURATION = 30000; // 30秒缓存
diff --git a/static/js/modules/init.js b/static/js/modules/init.js
new file mode 100644
index 0000000..629e38c
--- /dev/null
+++ b/static/js/modules/init.js
@@ -0,0 +1,171 @@
+// ==================== 应用初始化 ====================
+
+// 登出功能
+async function logout() {
+ try {
+ if (authToken) {
+ await fetch('/logout', {
+ method: 'POST',
+ headers: {
+ 'Authorization': `Bearer ${authToken}`
+ }
+ });
+ }
+ localStorage.removeItem('auth_token');
+ window.location.href = '/';
+ } catch (err) {
+ console.error('登出失败:', err);
+ localStorage.removeItem('auth_token');
+ window.location.href = '/';
+ }
+}
+
+// 检查认证状态
+async function checkAuth() {
+ if (!authToken) {
+ window.location.href = '/';
+ return false;
+ }
+
+ try {
+ const response = await fetch('/verify', {
+ headers: {
+ 'Authorization': `Bearer ${authToken}`
+ }
+ });
+ const result = await response.json();
+
+ if (!result.authenticated) {
+ localStorage.removeItem('auth_token');
+ window.location.href = '/';
+ return false;
+ }
+
+ // 检查是否为管理员，显示管理员菜单和功能
+ if (result.username === 'admin') {
+ const adminMenuSection = document.getElementById('adminMenuSection');
+ if (adminMenuSection) {
+ adminMenuSection.style.display = 'block';
+ }
+
+ // 显示备份管理功能
+ const backupManagement = document.getElementById('backup-management');
+ if (backupManagement) {
+ backupManagement.style.display = 'block';
+ }
+ }
+
+ return true;
+ } catch (err) {
+ localStorage.removeItem('auth_token');
+ window.location.href = '/';
+ return false;
+ }
+}
+
+// 初始化事件监听
+document.addEventListener('DOMContentLoaded', async () => {
+ // 首先检查认证状态
+ const isAuthenticated = await checkAuth();
+ if (!isAuthenticated) return;
+
+ // 添加Cookie表单提交
+ document.getElementById('addForm').addEventListener('submit', async (e) => {
+ e.preventDefault();
+ const id = document.getElementById('cookieId').value.trim();
+ const value = document.getElementById('cookieValue').value.trim();
+
+ if (!id || !value) return;
+
+ try {
+ await fetchJSON(apiBase + '/cookies', {
+ method: 'POST',
+ headers: { 'Content-Type': 'application/json' },
+ body: JSON.stringify({ id, value })
+ });
+
+ document.getElementById('cookieId').value = '';
+ document.getElementById('cookieValue').value = '';
+ showToast(`账号 "${id}" 添加成功`);
+ loadCookies();
+ } catch (err) {
+ // 错误已在fetchJSON中处理
+ }
+ });
+
+ // 增强的键盘快捷键和用户体验
+ document.getElementById('newKeyword')?.addEventListener('keypress', function (e) {
+ if (e.key === 'Enter') {
+ e.preventDefault();
+ document.getElementById('newReply').focus();
+ }
+ });
+
+ document.getElementById('newReply')?.addEventListener('keypress', function (e) {
+ if (e.key === 'Enter') {
+ e.preventDefault();
+ addKeyword();
+ }
+ });
+
+ // ESC键取消编辑
+ document.addEventListener('keydown', function (e) {
+ if (e.key === 'Escape' && typeof window.editingIndex !== 'undefined') {
+ e.preventDefault();
+ cancelEdit();
+ }
+ });
+
+ // 输入框实时验证和提示
+ document.getElementById('newKeyword')?.addEventListener('input', function (e) {
+ const value = e.target.value.trim();
+ const addBtn = document.querySelector('.add-btn');
+ const replyInput = document.getElementById('newReply');
+
+ if (value.length > 0) {
+ e.target.style.borderColor = '#10b981';
+ if (replyInput.value.trim().length > 0) {
+ addBtn.style.opacity = '1';
+ addBtn.style.transform = 'scale(1)';
+ }
+ } else {
+ e.target.style.borderColor = '#e5e7eb';
+ addBtn.style.opacity = '0.7';
+ addBtn.style.transform = 'scale(0.95)';
+ }
+ });
+
+ document.getElementById('newReply')?.addEventListener('input', function (e) {
+ const value = e.target.value.trim();
+ const addBtn = document.querySelector('.add-btn');
+ const keywordInput = document.getElementById('newKeyword');
+
+ if (value.length > 0) {
+ e.target.style.borderColor = '#10b981';
+ if (keywordInput.value.trim().length > 0) {
+ addBtn.style.opacity = '1';
+ addBtn.style.transform = 'scale(1)';
+ }
+ } else {
+ e.target.style.borderColor = '#e5e7eb';
+ addBtn.style.opacity = '0.7';
+ addBtn.style.transform = 'scale(0.95)';
+ }
+ });
+
+ // 初始加载仪表盘
+ loadDashboard();
+
+ // 点击侧边栏外部关闭移动端菜单
+ document.addEventListener('click', function (e) {
+ const sidebar = document.getElementById('sidebar');
+ const toggle = document.querySelector('.mobile-toggle');
+
+ if (window.innerWidth <= 768 &&
+ !sidebar.contains(e.target) &&
+ !toggle.contains(e.target) &&
+ sidebar.classList.contains('show')) {
+ sidebar.classList.remove('show');
+ }
+ });
+});
diff --git a/static/js/modules/keyword-cache.js b/static/js/modules/keyword-cache.js
new file mode 100644
index 0000000..685c04b
--- /dev/null
+++ b/static/js/modules/keyword-cache.js
@@ -0,0 +1,42 @@
+// ==================== 关键词缓存管理 ====================
+
+// 获取账号关键词数量（带缓存）- 包含普通关键词和商品关键词
+async function getAccountKeywordCount(accountId) {
+ const now = Date.now();
+
+ // 检查缓存
+ if (accountKeywordCache[accountId] && (now - cacheTimestamp) < CACHE_DURATION) {
+ return accountKeywordCache[accountId];
+ }
+
+ try {
+ const response = await fetch(`${apiBase}/keywords/${accountId}`, {
+ headers: {
+ 'Authorization': `Bearer ${authToken}`
+ }
+ });
+
+ if (response.ok) {
+ const keywordsData = await response.json();
+ // 现在API返回的是包含普通关键词和商品关键词的完整列表
+ const count = keywordsData.length;
+
+ // 更新缓存
+ accountKeywordCache[accountId] = count;
+ cacheTimestamp = now;
+
+ return count;
+ } else {
+ return 0;
+ }
+ } catch (error) {
+ console.error(`获取账号 ${accountId} 关键词失败:`, error);
+ return 0;
+ }
+}
+
+// 清除关键词缓存
+function clearKeywordCache() {
+ accountKeywordCache = {};
+ cacheTimestamp = 0;
+}
diff --git a/static/js/modules/keywords.js b/static/js/modules/keywords.js
new file mode 100644
index 0000000..ea06808
--- /dev/null
+++ b/static/js/modules/keywords.js
@@ -0,0 +1,463 @@
+// ==================== 关键词管理 ====================
+
+// 加载账号关键词
+async function loadAccountKeywords() {
+ const accountId = document.getElementById('accountSelect').value;
+ const keywordManagement = document.getElementById('keywordManagement');
+
+ if (!accountId) {
+ keywordManagement.style.display = 'none';
+ return;
+ }
+
+ try {
+ toggleLoading(true);
+ currentCookieId = accountId;
+
+ // 获取账号详情以检查状态
+ const accountResponse = await fetch(`${apiBase}/cookies/details`, {
+ headers: {
+ 'Authorization': `Bearer ${authToken}`
+ }
+ });
+
+ let accountStatus = true; // 默认启用
+ if (accountResponse.ok) {
+ const accounts = await accountResponse.json();
+ const currentAccount = accounts.find(acc => acc.id === accountId);
+ accountStatus = currentAccount ? (currentAccount.enabled === undefined ? true : currentAccount.enabled) : true;
+ console.log(`加载关键词时账号 ${accountId} 状态: enabled=${currentAccount?.enabled}, accountStatus=${accountStatus}`); // 调试信息
+ }
+
+ const response = await fetch(`${apiBase}/keywords-with-item-id/${accountId}`, {
+ headers: {
+ 'Authorization': `Bearer ${authToken}`
+ }
+ });
+
+ if (response.ok) {
+ const data = await response.json();
+ console.log('从服务器获取的关键词数据:', data); // 调试信息
+
+ // 后端返回的是 [{keyword, reply, item_id}, ...] 格式，直接使用
+ const formattedData = data;
+
+ console.log('格式化后的关键词数据:', formattedData); // 调试信息
+ keywordsData[accountId] = formattedData;
+ renderKeywordsList(formattedData);
+
+ // 加载商品列表
+ await loadItemsList(accountId);
+
+ // 更新账号徽章显示
+ updateAccountBadge(accountId, accountStatus);
+
+ keywordManagement.style.display = 'block';
+ } else {
+ showToast('加载关键词失败', 'danger');
+ }
+ } catch (error) {
+ console.error('加载关键词失败:', error);
+ showToast('加载关键词失败', 'danger');
+ } finally {
+ toggleLoading(false);
+ }
+}
+
+// 更新账号徽章显示
+function updateAccountBadge(accountId, isEnabled) {
+ const badge = document.getElementById('currentAccountBadge');
+ if (!badge) return;
+
+ const statusIcon = isEnabled ? '🟢' : '🔴';
+ const statusText = isEnabled ? '启用' : '禁用';
+ const statusClass = isEnabled ? 'bg-success' : 'bg-warning';
+
+ badge.innerHTML = `
+
+ ${statusIcon} ${accountId}
+
+
+ 状态: ${statusText}
+ ${!isEnabled ? ' (配置的关键词不会参与自动回复)' : ''}
+
+ `;
+}
+
+// 显示添加关键词表单
+function showAddKeywordForm() {
+ const form = document.getElementById('addKeywordForm');
+ form.style.display = form.style.display === 'none' ? 'block' : 'none';
+
+ if (form.style.display === 'block') {
+ document.getElementById('newKeyword').focus();
+ }
+}
+
+// 加载商品列表
+async function loadItemsList(accountId) {
+ try {
+ const response = await fetch(`${apiBase}/items/${accountId}`, {
+ headers: {
+ 'Authorization': `Bearer ${authToken}`
+ }
+ });
+
+ if (response.ok) {
+ const data = await response.json();
+ const items = data.items || [];
+
+ // 更新商品选择下拉框
+ const selectElement = document.getElementById('newItemIdSelect');
+ if (selectElement) {
+ // 清空现有选项（保留第一个默认选项）
+ selectElement.innerHTML = '';
+
+ // 添加商品选项
+ items.forEach(item => {
+ const option = document.createElement('option');
+ option.value = item.item_id;
+ option.textContent = `${item.item_id} - ${item.item_title}`;
+ selectElement.appendChild(option);
+ });
+ }
+
+ console.log(`加载了 ${items.length} 个商品到选择列表`);
+ } else {
+ console.warn('加载商品列表失败:', response.status);
+ }
+ } catch (error) {
+ console.error('加载商品列表时发生错误:', error);
+ }
+}
+
+// 添加或更新关键词
+async function addKeyword() {
+ const keyword = document.getElementById('newKeyword').value.trim();
+ const reply = document.getElementById('newReply').value.trim();
+ const itemId = document.getElementById('newItemIdSelect').value.trim();
+
+ if (!keyword || !reply) {
+ showToast('请填写关键词和回复内容', 'warning');
+ return;
+ }
+
+ if (!currentCookieId) {
+ showToast('请先选择账号', 'warning');
+ return;
+ }
+
+ // 检查是否为编辑模式
+ const isEditMode = typeof window.editingIndex !== 'undefined';
+ const actionText = isEditMode ? '更新' : '添加';
+
+ try {
+ toggleLoading(true);
+
+ // 获取当前关键词列表
+ let currentKeywords = [...(keywordsData[currentCookieId] || [])];
+
+ // 如果是编辑模式，先移除原关键词
+ if (isEditMode) {
+ currentKeywords.splice(window.editingIndex, 1);
+ }
+
+ // 准备要保存的关键词列表
+ let keywordsToSave = [...currentKeywords];
+
+ // 如果是编辑模式，先移除原关键词
+ if (isEditMode && typeof window.editingIndex !== 'undefined') {
+ keywordsToSave.splice(window.editingIndex, 1);
+ }
+
+ // 检查关键词是否已存在（考虑商品ID）
+ const existingKeyword = keywordsToSave.find(item =>
+ item.keyword === keyword &&
+ (item.item_id || '') === (itemId || '')
+ );
+ if (existingKeyword) {
+ const itemIdText = itemId ? `（商品ID: ${itemId}）` : '（通用关键词）';
+ showToast(`关键词 "${keyword}" ${itemIdText} 已存在，请使用其他关键词或商品ID`, 'warning');
+ toggleLoading(false);
+ return;
+ }
+
+ // 添加新关键词或更新的关键词
+ const newKeyword = {
+ keyword: keyword,
+ reply: reply,
+ item_id: itemId || ''
+ };
+ keywordsToSave.push(newKeyword);
+
+ const response = await fetch(`${apiBase}/keywords-with-item-id/${currentCookieId}`, {
+ method: 'POST',
+ headers: {
+ 'Content-Type': 'application/json',
+ 'Authorization': `Bearer ${authToken}`
+ },
+ body: JSON.stringify({
+ keywords: keywordsToSave
+ })
+ });
+
+ if (response.ok) {
+ showToast(`✨ 关键词 "${keyword}" ${actionText}成功！`, 'success');
+
+ // 清空输入框并重置样式
+ const keywordInput = document.getElementById('newKeyword');
+ const replyInput = document.getElementById('newReply');
+ const selectElement = document.getElementById('newItemIdSelect');
+ const addBtn = document.querySelector('.add-btn');
+
+ keywordInput.value = '';
+ replyInput.value = '';
+ if (selectElement) {
+ selectElement.value = '';
+ }
+ keywordInput.style.borderColor = '#e5e7eb';
+ replyInput.style.borderColor = '#e5e7eb';
+ addBtn.style.opacity = '0.7';
+ addBtn.style.transform = 'scale(0.95)';
+
+ // 如果是编辑模式，重置编辑状态
+ if (isEditMode) {
+ delete window.editingIndex;
+ delete window.originalKeyword;
+
+ // 恢复添加按钮
+ addBtn.innerHTML = '添加';
+ addBtn.style.background = 'linear-gradient(135deg, #10b981 0%, #059669 100%)';
+
+ // 移除取消按钮
+ const cancelBtn = document.getElementById('cancelEditBtn');
+ if (cancelBtn) {
+ cancelBtn.remove();
+ }
+ }
+
+ // 聚焦到关键词输入框，方便连续添加
+ setTimeout(() => {
+ keywordInput.focus();
+ }, 100);
+
+ loadAccountKeywords(); // 重新加载关键词列表
+ clearKeywordCache(); // 清除缓存
+ } else {
+ const errorText = await response.text();
+ console.error('关键词添加失败:', errorText);
+ showToast('关键词添加失败', 'danger');
+ }
+ } catch (error) {
+ console.error('添加关键词失败:', error);
+ showToast('添加关键词失败', 'danger');
+ } finally {
+ toggleLoading(false);
+ }
+}
+
+// 渲染现代化关键词列表
+function renderKeywordsList(keywords) {
+ console.log('渲染关键词列表:', keywords); // 调试信息
+ const container = document.getElementById('keywordsList');
+
+ if (!container) {
+ console.error('找不到关键词列表容器元素');
+ return;
+ }
+
+ container.innerHTML = '';
+
+ if (!keywords || keywords.length === 0) {
+ console.log('关键词列表为空，显示空状态');
+ container.innerHTML = `
+
+
+
还没有关键词
+
添加第一个关键词，让您的闲鱼店铺自动回复客户消息
+
+