更新了网页查看products.db时的界面

product/templates/index.html

@@ -94,7 +94,6 @@
         }
         
         .data-container {
-            width: 100%;
             background: rgba(255, 255, 255, 0.95);
             backdrop-filter: blur(10px);
             border-radius: 15px;
@@ -125,7 +124,6 @@
         }
         
         .table-wrapper {
-            width: 100%;
             overflow-x: auto;
             border-radius: 10px;
             box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
@@ -252,6 +250,60 @@
             font-size: 1.1em;
         }
         
+        .analyze-btn {
+            background: linear-gradient(135deg, #28a745, #20c997);
+            color: white;
+            border: none;
+            padding: 8px 16px;
+            border-radius: 6px;
+            font-size: 1em;
+            cursor: pointer;
+            transition: all 0.3s ease;
+        }
+        
+        .analyze-btn:hover {
+            transform: translateY(-1px);
+            box-shadow: 0 4px 8px rgba(40, 167, 69, 0.3);
+        }
+        
+        .analyze-btn:disabled {
+            background: #6c757d;
+            cursor: not-allowed;
+            transform: none;
+            box-shadow: none;
+        }
+        
+        .progress-container {
+            margin-top: 20px;
+            padding: 15px;
+            background: rgba(255, 255, 255, 0.95);
+            backdrop-filter: blur(10px);
+            border-radius: 12px;
+            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
+            display: none;
+        }
+        
+        .progress-bar {
+            width: 100%;
+            height: 20px;
+            background: #e9ecef;
+            border-radius: 10px;
+            overflow: hidden;
+            margin: 10px 0;
+        }
+        
+        .progress-fill {
+            height: 100%;
+            background: linear-gradient(90deg, #667eea, #764ba2);
+            transition: width 0.3s ease;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            color: white;
+            font-size: 0.8em;
+            font-weight: 600;
+        }
+        
         @media (max-width: 768px) {
             .controls {
                 flex-direction: column;
@@ -281,6 +333,10 @@
                     <option value="">加载中...</option>
                 </select>
             </div>
+            <div class="control-group">
+                <label for="analyzeBtn">分析:</label>
+                <button id="analyzeScoresBtn" class="analyze-btn">📊 分析缺失分数</button>
+                </div>
                 <div class="control-group">
                     <label for="searchField">筛选字段:</label>
                     <select id="searchField" multiple disabled style="min-height: 80px;">
@@ -294,6 +350,7 @@
                 <button class="btn" onclick="loadData()">刷新数据</button>
             </div>
             </div>
+        </div>
         
         <div class="data-container">
             <div class="table-info">
@@ -316,6 +373,15 @@
         </div>
     </div>
         
+        <div id="progressSection" class="progress-container">
+            <h3>📊 分数分析进度</h3>
+            <div class="progress-bar">
+                <div id="progressFill" class="progress-fill" style="width: 0%;">0%</div>
+            </div>
+            <p id="progressText">等待分析开始...</p>
+        </div>
+    </div>
+
     <script>
         let currentTable = '';
         let currentPage = 1;
@@ -337,9 +403,77 @@
                     }
                 });
                 
+                // 分析缺失分数按钮事件
+                document.getElementById('analyzeScoresBtn').addEventListener('click', analyzeMissingScores);
+            });
+            
+            // 分析缺失分数
+            async function analyzeMissingScores() {
+                const analyzeBtn = document.getElementById('analyzeScoresBtn');
+                const progressSection = document.getElementById('progressSection');
+                const progressFill = document.getElementById('progressFill');
+                const progressText = document.getElementById('progressText');
+                
+                try {
+                    // 禁用按钮
+                    analyzeBtn.disabled = true;
+                    analyzeBtn.textContent = '分析中...';
+                    
+                    // 显示进度条
+                    progressSection.style.display = 'block';
+                    progressFill.style.width = '0%';
+                    progressFill.textContent = '0%';
+                    progressText.textContent = '正在启动分析任务...';
+                    
+                    // 启动分析任务
+                    const response = await fetch('/api/analyze_missing_scores');
+                    const data = await response.json();
+                    
+                    if (data.task_id) {
+                        // 定期查询任务状态
+                        const interval = setInterval(async () => {
+                            try {
+                                const statusResponse = await fetch(`/api/update_task_status/${data.task_id}`);
+                                const statusData = await statusResponse.json();
+                                
+                                // 更新进度
+                                progressFill.style.width = `${statusData.progress}%`;
+                                progressFill.textContent = `${statusData.progress}%`;
+                                
+                                if (statusData.status === 'running') {
+                                    progressText.textContent = `正在分析: ${statusData.completed}/${statusData.total} 个产品`;
+                                } else if (statusData.status === 'completed') {
+                                    progressText.textContent = '🎉 所有缺失分数分析完成！';
+                                    clearInterval(interval);
+                                    analyzeBtn.disabled = false;
+                                    analyzeBtn.textContent = '📊 分析缺失分数';
+                                    
+                                    // 如果当前正在查看product_analysis表，自动刷新
+                                    if (currentTable === 'product_analysis') {
+                                        loadData();
+                                    }
+                                } else if (statusData.status === 'failed') {
+                                    progressText.textContent = `❌ 分析失败: ${statusData.error}`;
+                                    clearInterval(interval);
+                                    analyzeBtn.disabled = false;
+                                    analyzeBtn.textContent = '📊 分析缺失分数';
+                                }
+                            } catch (error) {
+                                console.error('查询任务状态失败:', error);
+                                progressText.textContent = '查询任务状态失败';
+                            }
+                        }, 2000);
+                    }
+                } catch (error) {
+                    console.error('启动分析任务失败:', error);
+                    progressText.textContent = `启动分析失败: ${error.message}`;
+                    analyzeBtn.disabled = false;
+                    analyzeBtn.textContent = '📊 分析缺失分数';
+                }
+            }
+            
             document.getElementById('searchField').addEventListener('change', loadData);
             document.getElementById('searchValue').addEventListener('input', debounce(loadData, 500));
-        });
 
         // 防抖函数
         function debounce(func, wait) {
@@ -460,11 +594,15 @@
             // 数据行
             data.rows.forEach(row => {
                 html += '<tr>';
-                row.forEach(cell => {
+                row.forEach((cell, index) => {
+                    const colName = data.columns[index];
                     if (cell.type === 'multiline') {
                         html += `<td><div class="multiline-cell">${escapeHtml(cell.value)}</div></td>`;
                     } else if (cell.type === 'empty') {
                         html += '<td><div class="empty-cell">空</div></td>';
+                    } else if (colName === 'product_link' && cell.value) {
+                        // 渲染为链接
+                        html += `<td><div class="normal-cell"><a href="${escapeHtml(cell.value)}" target="_blank" rel="noopener noreferrer">${escapeHtml(cell.value)}</a></div></td>`;
                     } else {
                         html += `<td><div class="normal-cell">${escapeHtml(cell.value)}</div></td>`;
                     }

product/web_sqlite_viewer.py

@@ -848,10 +848,10 @@ def create_html_template():
                     analyzeBtn.disabled = false;
                     analyzeBtn.textContent = '📊 分析缺失分数';
                 }
+            }
             
             document.getElementById('searchField').addEventListener('change', loadData);
             document.getElementById('searchValue').addEventListener('input', debounce(loadData, 500));
-        });
 
         // 防抖函数
         function debounce(func, wait) {
@@ -972,11 +972,15 @@ def create_html_template():
             // 数据行
             data.rows.forEach(row => {
                 html += '<tr>';
-                row.forEach(cell => {
+                row.forEach((cell, index) => {
+                    const colName = data.columns[index];
                     if (cell.type === 'multiline') {
                         html += `<td><div class="multiline-cell">${escapeHtml(cell.value)}</div></td>`;
                     } else if (cell.type === 'empty') {
                         html += '<td><div class="empty-cell">空</div></td>';
+                    } else if (colName === 'product_link' && cell.value) {
+                        // 渲染为链接
+                        html += `<td><div class="normal-cell"><a href="${escapeHtml(cell.value)}" target="_blank" rel="noopener noreferrer">${escapeHtml(cell.value)}</a></div></td>`;
                     } else {
                         html += `<td><div class="normal-cell">${escapeHtml(cell.value)}</div></td>`;
                     }

templates/index.html

@@ -470,10 +470,10 @@
                     analyzeBtn.disabled = false;
                     analyzeBtn.textContent = '📊 分析缺失分数';
                 }
+            }
             
             document.getElementById('searchField').addEventListener('change', loadData);
             document.getElementById('searchValue').addEventListener('input', debounce(loadData, 500));
-        });
 
         // 防抖函数
         function debounce(func, wait) {
@@ -594,11 +594,15 @@
             // 数据行
             data.rows.forEach(row => {
                 html += '<tr>';
-                row.forEach(cell => {
+                row.forEach((cell, index) => {
+                    const colName = data.columns[index];
                     if (cell.type === 'multiline') {
                         html += `<td><div class="multiline-cell">${escapeHtml(cell.value)}</div></td>`;
                     } else if (cell.type === 'empty') {
                         html += '<td><div class="empty-cell">空</div></td>';
+                    } else if (colName === 'product_link' && cell.value) {
+                        // 渲染为链接
+                        html += `<td><div class="normal-cell"><a href="${escapeHtml(cell.value)}" target="_blank" rel="noopener noreferrer">${escapeHtml(cell.value)}</a></div></td>`;
                     } else {
                         html += `<td><div class="normal-cell">${escapeHtml(cell.value)}</div></td>`;
                     }