insightflow/chrome-extension/options.js

// InsightFlow Chrome Extension - Options Script

document.addEventListener('DOMContentLoaded', () => {
  const serverUrlInput = document.getElementById('serverUrl');
  const apiKeyInput = document.getElementById('apiKey');
  const defaultProjectSelect = document.getElementById('defaultProject');
  const testBtn = document.getElementById('testBtn');
  const testResult = document.getElementById('testResult');
  const saveBtn = document.getElementById('saveBtn');
  const resetBtn = document.getElementById('resetBtn');
  const openConsole = document.getElementById('openConsole');
  const helpLink = document.getElementById('helpLink');
  
  // 加载配置
  loadConfig();
  
  // 测试连接
  testBtn.addEventListener('click', async () => {
    testBtn.disabled = true;
    testBtn.textContent = '测试中...';
    testResult.className = '';
    testResult.style.display = 'none';
    
    const serverUrl = serverUrlInput.value.trim();
    const apiKey = apiKeyInput.value.trim();
    
    if (!serverUrl || !apiKey) {
      showTestResult('请填写服务器地址和 API Key', 'error');
      testBtn.disabled = false;
      testBtn.textContent = '测试连接';
      return;
    }
    
    try {
      const response = await fetch(`${serverUrl}/api/v1/projects`, {
        headers: { 'X-API-Key': apiKey }
      });
      
      if (response.ok) {
        const data = await response.json();
        showTestResult(`连接成功！找到 ${data.projects?.length || 0} 个项目`, 'success');
        
        // 更新项目列表
        updateProjectList(data.projects || []);
      } else if (response.status === 401) {
        showTestResult('API Key 无效，请检查', 'error');
      } else {
        showTestResult(`连接失败: HTTP ${response.status}`, 'error');
      }
    } catch (error) {
      showTestResult(`连接错误: ${error.message}`, 'error');
    }
    
    testBtn.disabled = false;
    testBtn.textContent = '测试连接';
  });
  
  // 保存设置
  saveBtn.addEventListener('click', async () => {
    const config = {
      serverUrl: serverUrlInput.value.trim(),
      apiKey: apiKeyInput.value.trim(),
      defaultProjectId: defaultProjectSelect.value
    };
    
    if (!config.serverUrl) {
      alert('请填写服务器地址');
      return;
    }
    
    await chrome.storage.sync.set({ insightflowConfig: config });
    
    // 显示保存成功
    saveBtn.textContent = '已保存 ✓';
    saveBtn.classList.add('btn-success');
    
    setTimeout(() => {
      saveBtn.textContent = '保存设置';
      saveBtn.classList.remove('btn-success');
    }, 2000);
  });
  
  // 重置设置
  resetBtn.addEventListener('click', () => {
    if (confirm('确定要重置所有设置吗？')) {
      const defaultConfig = {
        serverUrl: 'http://122.51.127.111:18000',
        apiKey: '',
        defaultProjectId: ''
      };
      
      chrome.storage.sync.set({ insightflowConfig: defaultConfig }, () => {
        loadConfig();
        showTestResult('设置已重置', 'success');
      });
    }
  });
  
  // 打开控制台
  openConsole.addEventListener('click', (e) => {
    e.preventDefault();
    const serverUrl = serverUrlInput.value.trim();
    if (serverUrl) {
      chrome.tabs.create({ url: serverUrl });
    }
  });
  
  // 帮助链接
  helpLink.addEventListener('click', (e) => {
    e.preventDefault();
    const serverUrl = serverUrlInput.value.trim();
    if (serverUrl) {
      chrome.tabs.create({ url: `${serverUrl}/docs` });
    }
  });
  
  // 加载配置
  async function loadConfig() {
    const result = await chrome.storage.sync.get(['insightflowConfig']);
    const config = result.insightflowConfig || {
      serverUrl: 'http://122.51.127.111:18000',
      apiKey: '',
      defaultProjectId: ''
    };
    
    serverUrlInput.value = config.serverUrl;
    apiKeyInput.value = config.apiKey;
    
    // 如果有 API Key，加载项目列表
    if (config.apiKey) {
      loadProjects(config);
    }
  }
  
  // 加载项目列表
  async function loadProjects(config) {
    try {
      const response = await fetch(`${config.serverUrl}/api/v1/projects`, {
        headers: { 'X-API-Key': config.apiKey }
      });
      
      if (response.ok) {
        const data = await response.json();
        updateProjectList(data.projects || [], config.defaultProjectId);
      }
    } catch (error) {
      console.error('Failed to load projects:', error);
    }
  }
  
  // 更新项目列表
  function updateProjectList(projects, selectedId = '') {
    let html = '<option value="">不设置默认项目</option>';
    
    projects.forEach(project => {
      const selected = project.id === selectedId ? 'selected' : '';
      html += `<option value="${project.id}" ${selected}>${escapeHtml(project.name)}</option>`;
    });
    
    defaultProjectSelect.innerHTML = html;
  }
  
  // 显示测试结果
  function showTestResult(message, type) {
    testResult.textContent = message;
    testResult.className = type;
  }
  
  // HTML 转义
  function escapeHtml(text) {
    const div = document.createElement('div');
    div.textContent = text;
    return div.innerHTML;
  }
});