refactor(web): 将前端JavaScript代码模块化分离

- 移除index.html中内联的JavaScript代码
- 创建独立的JavaScript文件用于不同功能模块
- 新增config.js用于存储API基础URL配置
- 分离文件管理、组管理、标签管理等模块到单独文件
- 添加utils.js工具函数文件
- 实现main.js作为主入口文件处理页面初始化逻辑
- 更新HTML引入新的JavaScript文件结构
- 优化Tab切换和自动搜索功能实现方式
- 重构表单重置逻辑到各自管理模块中
- 提高代码可维护性和可读性

Author: DataEraserC

file_classification_webapi/static/api.js

@@ -317,124 +317,15 @@ <h2>组关系管理</h2>
         </div>
     </div>
 
-    <script src="api.js"></script>
-    <script>
-        // Tab切换功能
-        document.addEventListener('DOMContentLoaded', function() {
-            const navLinks = document.querySelectorAll('.nav-link');
-            const tabContents = document.querySelectorAll('.tab-content');
-            
-            // 存储已打开的标签页
-            const openedTabs = new Set();
-            
-            navLinks.forEach(link => {
-                link.addEventListener('click', function(e) {
-                    e.preventDefault();
-                    
-                    const target = this.getAttribute('data-target');
-                    
-                    // 添加到已打开标签页集合
-                    openedTabs.add(target);
-                    
-                    // 隐藏所有tab内容
-                    tabContents.forEach(content => {
-                        content.style.display = 'none';
-                    });
-                    
-                    // 移除所有链接的活动状态
-                    navLinks.forEach(nav => {
-                        nav.classList.remove('active');
-                    });
-                    
-                    // 显示当前tab内容
-                    document.getElementById(target).style.display = 'block';
-                    
-                    // 设置当前链接为活动状态
-                    this.classList.add('active');
-                    
-                    // 页面刚打开时自动搜索一次
-                    autoSearch(target);
-                });
-            });
-            
-            // 默认显示第一个tab并自动搜索
-            if (tabContents.length > 0) {
-                tabContents[0].style.display = 'block';
-                navLinks[0].classList.add('active');
-                openedTabs.add(navLinks[0].getAttribute('data-target'));
-                
-                // 自动执行首次搜索
-                autoSearch(navLinks[0].getAttribute('data-target'));
-            }
-        });
-        
-        // 根据当前tab自动执行搜索
-        function autoSearch(tabName) {
-            switch(tabName) {
-                case 'files':
-                    listFilesByFilter();
-                    break;
-                case 'groups':
-                    listGroupsByFilter();
-                    break;
-                case 'tags':
-                    listTagsByFilter();
-                    break;
-                case 'file-groups':
-                    listFileGroupsByFilter();
-                    break;
-                case 'group-tags':
-                    listGroupTagsByFilter();
-                    break;
-                case 'group-relations':
-                    listGroupRelationsByFilter();
-                    break;
-            }
-        }
-        
-        // 重置文件搜索表单
-        function resetFileFilter() {
-            document.getElementById('file-id').value = '';
-            document.getElementById('file-type').value = '';
-            document.getElementById('file-path').value = '';
-            listFilesByFilter(); // 重置后重新搜索
-        }
-        
-        // 重置组搜索表单
-        function resetGroupFilter() {
-            document.getElementById('group-id').value = '';
-            document.getElementById('group-name').value = '';
-            listGroupsByFilter(); // 重置后重新搜索
-        }
-        
-        // 重置标签搜索表单
-        function resetTagFilter() {
-            document.getElementById('tag-id').value = '';
-            document.getElementById('tag-name').value = '';
-            listTagsByFilter(); // 重置后重新搜索
-        }
-        
-        // 重置文件组关联搜索表单
-        function resetFileGroupFilter() {
-            document.getElementById('file-group-file-id').value = '';
-            document.getElementById('file-group-group-id').value = '';
-            listFileGroupsByFilter(); // 重置后重新搜索
-        }
-        
-        // 重置组标签关联搜索表单
-        function resetGroupTagFilter() {
-            document.getElementById('group-tag-group-id').value = '';
-            document.getElementById('group-tag-tag-id').value = '';
-            listGroupTagsByFilter(); // 重置后重新搜索
-        }
-        
-        // 重置组关系搜索表单
-        function resetGroupRelationFilter() {
-            document.getElementById('group-relation-first-id').value = '';
-            document.getElementById('group-relation-second-id').value = '';
-            document.getElementById('group-relation-type').value = '';
-            listGroupRelationsByFilter(); // 重置后重新搜索
-        }
-    </script>
+    <!-- 引入分离后的JavaScript文件 -->
+    <script src="js/config.js"></script>
+    <script src="js/utils.js"></script>
+    <script src="js/fileManager.js"></script>
+    <script src="js/groupManager.js"></script>
+    <script src="js/tagManager.js"></script>
+    <script src="js/fileGroupManager.js"></script>
+    <script src="js/groupTagManager.js"></script>
+    <script src="js/groupRelationManager.js"></script>
+    <script src="js/main.js"></script>
 </body>
 </html>

file_classification_webapi/static/index.html

@@ -0,0 +1,7 @@
+// API基础URL
+const BASE_URL = 'http://127.0.0.1:8082';
+
+// 导出配置
+window.APP_CONFIG = {
+    BASE_URL
+};