sql-assistant 1.0.0__py3-none-any.whl

sql_assistant/web/static/js/chat.js

@@ -0,0 +1,238 @@
+/**
+ * Chat Module
+ */
+
+function updateConnectionStatus() {
+    const hasLLM = state.activeLLM;
+    const hasDB = state.activeDB;
+    const dot = dom.connectionStatus.querySelector('.status-dot');
+    const text = dom.connectionStatus.querySelector('.status-text');
+
+    const refreshBtn = $('btn-refresh-schema');
+
+    if (hasLLM && hasDB) {
+        if (state.schemaError) {
+            dot.className = 'status-dot error';
+            text.textContent = `DB: ${state.activeDB} | Schema 加载失败`;
+        } else if (state.schemaLoaded) {
+            dot.className = 'status-dot online';
+            text.textContent = `LLM: ${state.activeLLM} | DB: ${state.activeDB} (${state.tableCount} 表)`;
+        } else {
+            dot.className = 'status-dot online';
+            text.textContent = `LLM: ${state.activeLLM} | DB: ${state.activeDB}`;
+        }
+        dom.btnSend.disabled = false;
+        if (refreshBtn) refreshBtn.style.display = 'flex';
+    } else if (hasLLM || hasDB) {
+        dot.className = 'status-dot error';
+        text.textContent = hasLLM ? '请配置数据库连接' : '请配置 LLM';
+        dom.btnSend.disabled = true;
+        if (refreshBtn) refreshBtn.style.display = 'none';
+    } else {
+        dot.className = 'status-dot offline';
+        text.textContent = '未配置连接';
+        dom.btnSend.disabled = true;
+        if (refreshBtn) refreshBtn.style.display = 'none';
+    }
+}
+
+async function refreshSchema() {
+    try {
+        state.schemaLoaded = false;
+        state.schemaError = '';
+        const schema = await API.post('/api/schema/refresh');
+        if (schema.error) {
+            state.schemaError = schema.error;
+            showToast('Schema 加载失败: ' + schema.error, 'error');
+        } else {
+            const tables = schema.tables || schema.keys || [];
+            state.tableCount = tables.length;
+            state.schemaLoaded = true;
+            showToast(`Schema 已刷新: ${tables.length} 个对象`, 'success');
+        }
+    } catch (err) {
+        state.schemaError = err.message;
+        showToast('Schema 刷新失败: ' + err.message, 'error');
+    }
+    updateConnectionStatus();
+}
+
+function addMessage(type, content) {
+    const welcome = dom.chatMessages.querySelector('.welcome-message');
+    if (welcome) welcome.remove();
+
+    const msg = document.createElement('div');
+    msg.className = `message ${type}`;
+    msg.innerHTML = `<div class="message-content">${content}</div>`;
+    dom.chatMessages.appendChild(msg);
+    dom.chatMessages.scrollTop = dom.chatMessages.scrollHeight;
+    return msg;
+}
+
+function addSQLBlock(sql) {
+    const block = document.createElement('div');
+    block.className = 'sql-block';
+    block.innerHTML = `
+        <div class="sql-block-header">
+            <span>📋 SQL</span>
+            <button class="btn-copy" onclick="copySQL(this)">复制</button>
+        </div>
+        <pre><code class="language-sql">${escapeHtml(sql)}</code></pre>
+    `;
+    const codeEl = block.querySelector('code');
+    if (typeof hljs !== 'undefined') {
+        hljs.highlightElement(codeEl);
+    }
+    return block;
+}
+
+function addResultTable(result, pagination) {
+    const wrapper = document.createElement('div');
+    if (!result || result.error) {
+        wrapper.innerHTML = `<div class="error-message">${escapeHtml(result?.error || '执行失败')}</div>`;
+        return wrapper;
+    }
+
+    const { columns, rows, row_count, affected_rows, sql_type } = result;
+
+    if (sql_type !== 'SELECT' && affected_rows !== undefined && affected_rows > 0) {
+        wrapper.innerHTML = `
+            <div class="result-meta" style="color: var(--success); font-size: 14px;">
+                ✅ 执行成功，影响 ${affected_rows} 行
+            </div>
+        `;
+        return wrapper;
+    }
+
+    if (!columns || !rows) {
+        wrapper.innerHTML = `<div class="result-meta">执行完成</div>`;
+        return wrapper;
+    }
+
+    let html = '<div class="result-table-wrapper"><table class="result-table">';
+    html += '<thead><tr>';
+    for (const col of columns) {
+        html += `<th>${escapeHtml(String(col))}</th>`;
+    }
+    html += '</tr></thead><tbody>';
+    for (const row of rows) {
+        html += '<tr>';
+        for (const cell of row) {
+            html += `<td>${escapeHtml(String(cell ?? 'NULL'))}</td>`;
+        }
+        html += '</tr>';
+    }
+    html += '</tbody></table></div>';
+
+    let meta = '';
+    if (pagination && pagination.total_rows > 0) {
+        const start = (pagination.page - 1) * pagination.page_size + 1;
+        const end = Math.min(pagination.page * pagination.page_size, pagination.total_rows);
+        meta = `显示 ${start}-${end} 条，共 ${pagination.total_rows} 条`;
+    } else {
+        meta = `显示 ${row_count} 条`;
+    }
+    meta += ` (${sql_type})`;
+    html += `<div class="result-meta">${meta}</div>`;
+
+    if (pagination && pagination.total_pages > 1) {
+        html += `<div class="result-pagination">`;
+        html += `<button class="btn-page" onclick="changePage(-1)" ${pagination.page <= 1 ? 'disabled' : ''}>上一页</button>`;
+        html += `<span class="page-info">第 ${pagination.page} / ${pagination.total_pages} 页</span>`;
+        html += `<button class="btn-page" onclick="changePage(1)" ${pagination.page >= pagination.total_pages ? 'disabled' : ''}>下一页</button>`;
+        html += `</div>`;
+    }
+
+    wrapper.innerHTML = html;
+    wrapper.dataset.pagination = JSON.stringify(pagination || {});
+    return wrapper;
+}
+
+function changePage(delta) {
+    const resultDiv = document.querySelector('.result-pagination')?.closest('.result-wrapper');
+    if (!resultDiv) return;
+
+    let pagination = {};
+    try {
+        pagination = JSON.parse(resultDiv.dataset.pagination || '{}');
+    } catch (e) {}
+
+    if (!pagination.page) return;
+
+    const newPage = pagination.page + delta;
+    if (newPage < 1 || newPage > pagination.total_pages) return;
+
+    state.pendingPageChange = { page: newPage, page_size: pagination.page_size };
+    sendQuery(state.pendingQuestion);
+}
+
+async function sendQuery(question) {
+    if (!question.trim()) return;
+
+    addMessage('user', escapeHtml(question));
+    dom.queryInput.value = '';
+    dom.queryInput.style.height = 'auto';
+
+    const msgDiv = addMessage('assistant', '<div class="loading-dots"><span></span><span></span><span></span></div>');
+    const contentDiv = msgDiv.querySelector('.message-content');
+
+    try {
+        if (!state.currentConversationId) {
+            const convData = await API.post('/api/conversations', { title: question.slice(0, 50) });
+            state.currentConversationId = convData.id;
+            await loadConversations();
+        }
+
+        const queryParams = {
+            question,
+            conversation_id: state.currentConversationId
+        };
+
+        if (state.pendingPageChange) {
+            queryParams.page = state.pendingPageChange.page;
+            queryParams.page_size = state.pendingPageChange.page_size;
+            state.pendingPageChange = null;
+        }
+        state.pendingQuestion = question;
+
+        contentDiv.innerHTML = '<div class="streaming-indicator">正在生成 SQL...</div>';
+
+        const previewData = await API.post('/api/query/preview', queryParams);
+
+        if (!previewData.success) {
+            contentDiv.innerHTML = `<div class="error-message">${escapeHtml(previewData.error)}</div>`;
+            return;
+        }
+
+        contentDiv.innerHTML = '';
+
+        contentDiv.appendChild(addSQLBlock(previewData.sql));
+
+        if (previewData.requires_confirmation) {
+            window.pendingSQLData = {
+                question: question,
+                sql: previewData.sql,
+                sqlHash: previewData.sql_hash,
+                conversationId: state.currentConversationId,
+                contentDiv: contentDiv,
+                msgDiv: msgDiv
+            };
+            showSQLConfirmDialog(previewData);
+        } else {
+            await executeConfirmedQuery(queryParams, contentDiv, msgDiv);
+        }
+    } catch (err) {
+        contentDiv.innerHTML = `<div class="error-message">${escapeHtml(err.message)}</div>`;
+    }
+
+    dom.chatMessages.scrollTop = dom.chatMessages.scrollHeight;
+    loadConversations();
+}
+
+window.updateConnectionStatus = updateConnectionStatus;
+window.refreshSchema = refreshSchema;
+window.addMessage = addMessage;
+window.addSQLBlock = addSQLBlock;
+window.addResultTable = addResultTable;
+window.changePage = changePage;
+window.sendQuery = sendQuery;

sql_assistant/web/static/js/color-theme-manager.js

@@ -0,0 +1,121 @@
+/**
+ * 颜色主题管理器 - 处理主题色切换
+ */
+
+const ColorThemeManager = {
+    STORAGE_KEY: 'sql_assistant_color_theme',
+    currentColor: 'blue',
+
+    COLOR_PRESETS: {
+        blue: {
+            name: '蓝色',
+            accent: '#58a6ff',
+            'accent-hover': '#79c0ff',
+        },
+        purple: {
+            name: '紫色',
+            accent: '#a371f7',
+            'accent-hover': '#b87ff7',
+        },
+        pink: {
+            name: '粉色',
+            accent: '#f778ba',
+            'accent-hover': '#ff9bce',
+        },
+        red: {
+            name: '红色',
+            accent: '#f85149',
+            'accent-hover': '#ff7b72',
+        },
+        orange: {
+            name: '橙色',
+            accent: '#d29922',
+            'accent-hover': '#e3b341',
+        },
+        yellow: {
+            name: '黄色',
+            accent: '#d4a72c',
+            'accent-hover': '#e6c454',
+        },
+        green: {
+            name: '绿色',
+            accent: '#3fb950',
+            'accent-hover': '#56d364',
+        },
+        cyan: {
+            name: '青色',
+            accent: '#39c5cf',
+            'accent-hover': '#56d4dd',
+        },
+    },
+
+    init() {
+        this.loadColor();
+        this.bindEvents();
+    },
+
+    loadColor() {
+        const saved = localStorage.getItem(this.STORAGE_KEY);
+        if (saved && this.COLOR_PRESETS[saved]) {
+            this.currentColor = saved;
+        }
+        this.applyColor();
+    },
+
+    bindEvents() {
+        document.querySelectorAll('.color-btn').forEach(btn => {
+            btn.addEventListener('click', (e) => {
+                const color = e.target.dataset.color;
+                if (color) {
+                    this.setColor(color);
+                }
+            });
+        });
+    },
+
+    setColor(colorName) {
+        if (!this.COLOR_PRESETS[colorName]) {
+            console.warn(`Color ${colorName} not found`);
+            return;
+        }
+        this.currentColor = colorName;
+        this.saveColor();
+        this.applyColor();
+        this.updateColorButtons();
+    },
+
+    saveColor() {
+        localStorage.setItem(this.STORAGE_KEY, this.currentColor);
+    },
+
+    applyColor() {
+        const preset = this.COLOR_PRESETS[this.currentColor];
+        if (!preset) return;
+
+        const root = document.documentElement;
+        root.style.setProperty('--accent', preset.accent);
+        root.style.setProperty('--accent-hover', preset['accent-hover']);
+
+        this.updateColorButtons();
+    },
+
+    updateColorButtons() {
+        document.querySelectorAll('.color-btn').forEach(btn => {
+            if (btn.dataset.color === this.currentColor) {
+                btn.classList.add('active');
+            } else {
+                btn.classList.remove('active');
+            }
+        });
+    },
+
+    getCurrentColor() {
+        return this.currentColor;
+    },
+
+    getColorName(colorName) {
+        return this.COLOR_PRESETS[colorName]?.name || colorName;
+    }
+};
+
+window.ColorThemeManager = ColorThemeManager;

sql_assistant/web/static/js/confirm.js

@@ -0,0 +1,95 @@
+/**
+ * SQL Confirmation Dialog Module
+ */
+
+window.pendingSQLData = null;
+
+function showSQLConfirmDialog(previewData) {
+    const modal = document.getElementById('sql-confirm-modal');
+    const titleEl = document.getElementById('sql-confirm-title');
+    const warningEl = document.getElementById('sql-confirm-warning');
+    const reasonEl = document.getElementById('sql-confirm-reason');
+    const codeEl = document.getElementById('sql-confirm-code');
+
+    titleEl.textContent = '⚠️ 确认执行 SQL';
+
+    if (previewData.warning) {
+        warningEl.textContent = previewData.warning;
+        warningEl.style.display = 'block';
+        warningEl.className = 'sql-warning-box ' + previewData.risk_level;
+    } else {
+        warningEl.style.display = 'none';
+    }
+
+    reasonEl.textContent = previewData.confirmation_reason || '此操作可能修改数据，请确认后再执行';
+
+    codeEl.textContent = previewData.sql;
+    if (typeof hljs !== 'undefined') {
+        hljs.highlightElement(codeEl);
+    }
+
+    modal.classList.add('active');
+}
+
+function hideSQLConfirmDialog() {
+    const modal = document.getElementById('sql-confirm-modal');
+    modal.classList.remove('active');
+    window.pendingSQLData = null;
+}
+
+async function confirmAndExecuteSQL() {
+    if (!window.pendingSQLData) return;
+
+    const { question, sql, sqlHash, conversationId, contentDiv, msgDiv } = window.pendingSQLData;
+
+    hideSQLConfirmDialog();
+
+    const existingLoading = contentDiv.querySelector('.loading-dots');
+    if (existingLoading) existingLoading.remove();
+
+    const loadingDiv = document.createElement('div');
+    loadingDiv.className = 'loading-dots';
+    loadingDiv.innerHTML = '<span></span><span></span><span></span>';
+    loadingDiv.style.marginTop = '12px';
+    contentDiv.appendChild(loadingDiv);
+
+    const queryParams = {
+        question,
+        conversation_id: conversationId,
+        confirmed: true,
+        sql_hash: sqlHash,
+        sql: sql  // 直接传递 SQL 语句，避免 LLM 重新生成导致 hash 不匹配
+    };
+
+    await executeConfirmedQuery(queryParams, contentDiv, msgDiv);
+}
+
+async function executeConfirmedQuery(queryParams, contentDiv, msgDiv) {
+    try {
+        const data = await API.post('/api/query', queryParams);
+
+        // 移除 loading 动画
+        const loadingDots = contentDiv.querySelector('.loading-dots');
+        if (loadingDots) loadingDots.remove();
+
+        if (data.result) {
+            contentDiv.appendChild(addResultTable(data.result, data.pagination));
+        }
+
+        if (data.error && !data.result) {
+            contentDiv.innerHTML += `<div class="error-message">${escapeHtml(data.error)}</div>`;
+        }
+    } catch (err) {
+        const loadingDots = contentDiv.querySelector('.loading-dots');
+        if (loadingDots) loadingDots.remove();
+        contentDiv.innerHTML += `<div class="error-message">${escapeHtml(err.message)}</div>`;
+    }
+
+    dom.chatMessages.scrollTop = dom.chatMessages.scrollTop;
+    loadConversations();
+}
+
+window.showSQLConfirmDialog = showSQLConfirmDialog;
+window.hideSQLConfirmDialog = hideSQLConfirmDialog;
+window.confirmAndExecuteSQL = confirmAndExecuteSQL;
+window.executeConfirmedQuery = executeConfirmedQuery;

sql_assistant/web/static/js/conversations.js

@@ -0,0 +1,182 @@
+/**
+ * Conversation Management Module
+ */
+
+// ============================================================
+// Conversation Management
+// ============================================================
+async function loadConversations() {
+    try {
+        const data = await API.get('/api/conversations');
+        state.conversations = data.conversations || [];
+        renderConversations();
+        
+        if (state.conversations.length > 0 && !state.currentConversationId) {
+            state.currentConversationId = state.conversations[0].id;
+            renderConversations();
+        }
+    } catch (err) {
+        dom.historyList.innerHTML = '<div class="history-empty">加载失败</div>';
+    }
+}
+
+function renderConversations() {
+    if (!state.conversations || state.conversations.length === 0) {
+        dom.historyList.innerHTML = '<div class="history-empty">暂无对话</div>';
+        return;
+    }
+
+    dom.historyList.innerHTML = state.conversations.map(c => `
+        <div class="history-item ${state.currentConversationId === c.id ? 'active' : ''}" onclick="selectConversation(${c.id})">
+            <div class="history-item-main">
+                <div class="history-item-title">${escapeHtml(c.title || '未命名对话')}</div>
+                <div class="history-item-actions">
+                    <button class="btn-icon-chat" onclick="event.stopPropagation(); startRenameConversation(${c.id})" title="重命名">
+                        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"/></svg>
+                    </button>
+                    <button class="btn-delete-chat" onclick="event.stopPropagation(); deleteConversation(${c.id})" title="删除对话">
+                        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="3 6 5 6 21 6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg>
+                    </button>
+                </div>
+            </div>
+            <div class="meta">
+                <span>${c.message_count || 0} 条消息</span>
+                <span>${c.updated_at?.split('T')[0] || ''}</span>
+            </div>
+        </div>
+    `).join('');
+}
+
+function startRenameConversation(conversationId) {
+    const item = document.querySelector(`.history-item[onclick*="selectConversation(${conversationId})"]`);
+    if (!item) return;
+    
+    const titleDiv = item.querySelector('.history-item-title');
+    const currentTitle = titleDiv.textContent;
+    
+    const input = document.createElement('input');
+    input.type = 'text';
+    input.className = 'rename-input';
+    input.value = currentTitle;
+    input.maxLength = 50;
+    
+    titleDiv.innerHTML = '';
+    titleDiv.appendChild(input);
+    input.focus();
+    input.select();
+    
+    const finishRename = async () => {
+        const newTitle = input.value.trim() || currentTitle;
+        try {
+            await API.put(`/api/conversations/${conversationId}`, { title: newTitle });
+            await loadConversations();
+            showToast('重命名成功', 'success');
+        } catch (err) {
+            showToast(err.message, 'error');
+        }
+    };
+    
+    input.addEventListener('blur', finishRename);
+    input.addEventListener('keydown', (e) => {
+        if (e.key === 'Enter') {
+            e.preventDefault();
+            input.blur();
+        } else if (e.key === 'Escape') {
+            input.value = currentTitle;
+            input.blur();
+        }
+    });
+}
+
+async function createNewConversation() {
+    try {
+        const data = await API.post('/api/conversations', { title: '新对话' });
+        state.currentConversationId = data.id;
+        clearChatMessages();
+        loadConversations();
+        renderConversations();
+        showToast('已创建新对话', 'success');
+    } catch (err) {
+        showToast(err.message, 'error');
+    }
+}
+
+async function selectConversation(conversationId) {
+    try {
+        state.currentConversationId = conversationId;
+        const data = await API.get(`/api/conversations/${conversationId}`);
+        
+        clearChatMessages();
+        
+        if (data.messages && data.messages.length > 0) {
+            for (const msg of data.messages) {
+                addMessage('user', escapeHtml(msg.question));
+                
+                const msgDiv = addMessage('assistant', '');
+                const contentDiv = msgDiv.querySelector('.message-content');
+                
+                if (msg.sql) {
+                    contentDiv.appendChild(addSQLBlock(msg.sql));
+                }
+                
+                if (msg.result_json) {
+                    try {
+                        const result = JSON.parse(msg.result_json);
+                        contentDiv.appendChild(addResultTable(result));
+                    } catch (e) {
+                        // ignore
+                    }
+                }
+                
+                if (!msg.success && msg.error_message) {
+                    contentDiv.innerHTML += `<div class="error-message">${escapeHtml(msg.error_message)}</div>`;
+                }
+            }
+        }
+        
+        renderConversations();
+    } catch (err) {
+        showToast('加载对话失败', 'error');
+    }
+}
+
+async function deleteConversation(conversationId) {
+    if (!confirm('确定删除这个对话吗？')) return;
+    try {
+        await API.del(`/api/conversations/${conversationId}`);
+        if (state.currentConversationId === conversationId) {
+            state.currentConversationId = null;
+            clearChatMessages();
+        }
+        loadConversations();
+        showToast('对话已删除', 'success');
+    } catch (err) {
+        showToast(err.message, 'error');
+    }
+}
+
+function clearChatMessages() {
+    dom.chatMessages.innerHTML = `
+        <div class="welcome-message">
+            <div class="welcome-icon">💬</div>
+            <h2>SQL 智能助手</h2>
+            <p>用自然语言描述你的查询需求，AI 会帮你生成 SQL 并执行</p>
+            <p class="welcome-hint">请先在设置中配置 LLM API Key 和数据库连接</p>
+            <div class="welcome-examples">
+                <span class="example-tag" data-question="查询所有用户信息">查询所有用户信息</span>
+                <span class="example-tag" data-question="统计每个部门的员工数量">统计每个部门的员工数量</span>
+                <span class="example-tag" data-question="添加一条商品记录，名称 iPhone 15，价格 6999">添加商品记录</span>
+                <span class="example-tag" data-question="查询最近7天的订单">查询最近7天订单</span>
+            </div>
+        </div>
+    `;
+}
+
+// Expose functions
+window.loadConversations = loadConversations;
+window.renderConversations = renderConversations;
+window.startRenameConversation = startRenameConversation;
+window.createNewConversation = createNewConversation;
+window.selectConversation = selectConversation;
+window.deleteConversation = deleteConversation;
+window.clearChatMessages = clearChatMessages;