Add files via upload

internal/handler/openapi.go

@@ -1309,7 +1309,7 @@ func (h *OpenAPIHandler) GetOpenAPISpec(c *gin.Context) {
 			},
 			"/api/conversations/{id}/results": map[string]interface{}{
 				"get": map[string]interface{}{
-					"tags":        []string{"结果查询"},
+					"tags":        []string{"对话管理"},
 					"summary":     "获取对话结果",
 					"description": "获取指定对话的执行结果，包括消息、漏洞信息和执行结果",
 					"operationId": "getConversationResults",

web/static/css/style.css

@@ -6754,21 +6754,146 @@ header {
 
 .group-icon-input {
     position: absolute;
-    left: 16px;
+    left: 8px;
     top: 50%;
     transform: translateY(-50%);
-    width: auto;
+    width: 28px;
-    height: auto;
+    height: 28px;
     display: flex;
     align-items: center;
     justify-content: center;
-    background: none;
+    background: #f5f5f5;
-    border-radius: 0;
+    border: 1px solid #e0e0e0;
+    border-radius: 6px;
     font-size: 1rem;
-    pointer-events: none;
+    cursor: pointer;
-    z-index: 1;
+    z-index: 2;
     box-shadow: none;
     line-height: 1;
+    transition: all 0.2s ease;
+}
+
+.group-icon-input:hover {
+    background: #e8e8e8;
+    border-color: #d0d0d0;
+    transform: translateY(-50%) scale(1.05);
+}
+
+.group-icon-input:active {
+    transform: translateY(-50%) scale(0.98);
+    background: #ddd;
+}
+
+/* 图标选择器面板 */
+.group-icon-picker {
+    position: absolute;
+    top: calc(100% + 8px);
+    left: 0;
+    width: 280px;
+    background: #ffffff;
+    border: 1px solid #e0e0e0;
+    border-radius: 12px;
+    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
+    z-index: 100;
+    overflow: hidden;
+}
+
+.icon-picker-header {
+    padding: 10px 14px;
+    font-size: 0.8125rem;
+    font-weight: 600;
+    color: #666;
+    background: #fafafa;
+    border-bottom: 1px solid #f0f0f0;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 10px;
+}
+
+.icon-picker-header > span {
+    flex-shrink: 0;
+}
+
+.icon-picker-custom {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+}
+
+.custom-icon-input {
+    width: 60px;
+    padding: 4px 8px;
+    border: 1px solid #e0e0e0;
+    border-radius: 6px;
+    font-size: 0.875rem;
+    text-align: center;
+    background: #ffffff;
+    transition: all 0.2s ease;
+}
+
+.custom-icon-input:focus {
+    outline: none;
+    border-color: #667eea;
+    box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.1);
+}
+
+.custom-icon-input::placeholder {
+    color: #bbb;
+    font-size: 0.75rem;
+}
+
+.custom-icon-btn {
+    padding: 4px 10px;
+    font-size: 0.75rem;
+    font-weight: 500;
+    color: #fff;
+    background: #667eea;
+    border: none;
+    border-radius: 6px;
+    cursor: pointer;
+    transition: all 0.2s ease;
+    white-space: nowrap;
+}
+
+.custom-icon-btn:hover {
+    background: #5a6fd6;
+}
+
+.custom-icon-btn:active {
+    transform: scale(0.96);
+}
+
+.icon-picker-grid {
+    display: grid;
+    grid-template-columns: repeat(6, 1fr);
+    gap: 4px;
+    padding: 12px;
+    max-height: 180px;
+    overflow-y: auto;
+}
+
+.icon-option {
+    width: 36px;
+    height: 36px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 1.25rem;
+    cursor: pointer;
+    border-radius: 8px;
+    transition: all 0.15s ease;
+    user-select: none;
+}
+
+.icon-option:hover {
+    background: #f0f0f0;
+    transform: scale(1.15);
+}
+
+.icon-option:active {
+    transform: scale(1);
+    background: #e0e0e0;
 }
 
 #create-group-name-input {
@@ -9588,41 +9713,33 @@ header {
     color: var(--text-primary);
 }
 
-/* 技能卡片网格布局 */
+/* 技能列表布局 */
 .skills-grid {
-    display: grid;
+    display: flex;
-    /* 优化网格布局：使用 auto-fit 让卡片更好地分布，减少最小宽度以容纳更多列 */
+    flex-direction: column;
-    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+    gap: 12px;
-    gap: 16px;
     padding: 0;
     /* 确保列表可以滚动，不会把分页栏推出视口 */
     flex: 1;
     overflow-y: auto;
     overflow-x: hidden;
     min-height: 0;
-    /* 统一同一行卡片的高度 */
-    align-items: stretch;
-    /* 让卡片在容器中更好地分布，避免都聚集在左侧 */
-    justify-items: stretch;
 }
 
-/* 技能卡片样式 */
+/* 技能列表项样式 */
 .skill-card {
     background: var(--bg-primary);
     border: 1px solid var(--border-color);
     border-radius: 12px;
     padding: 16px;
     display: flex;
-    flex-direction: column;
+    flex-direction: row;
-    gap: 10px;
+    align-items: center;
+    gap: 16px;
     transition: all 0.2s;
     cursor: default;
-    /* 统一卡片高度：让卡片填满网格单元格高度 */
-    align-items: stretch;
-    height: 100%;
-    /* 确保卡片宽度填满网格单元格 */
-    width: 100%;
     box-sizing: border-box;
+    width: 100%;
 }
 
 .skill-card:hover {
@@ -9633,9 +9750,10 @@ header {
 
 .skill-card-header {
     display: flex;
-    justify-content: space-between;
+    flex-direction: column;
-    align-items: flex-start;
+    flex: 1;
-    gap: 12px;
+    gap: 8px;
+    min-width: 0;
 }
 
 .skill-card-title {
@@ -9643,75 +9761,42 @@ header {
     font-weight: 600;
     color: var(--text-primary);
     margin: 0;
-    /* 移除 flex: 1，让标题只占据实际需要的高度 */
     line-height: 1.4;
     word-break: break-word;
     overflow-wrap: break-word;
-    /* 限制标题最多显示2行 */
-    display: -webkit-box;
-    -webkit-line-clamp: 2;
-    line-clamp: 2;
-    -webkit-box-orient: vertical;
-    overflow: hidden;
 }
 
 .skill-card-description {
     font-size: 0.875rem;
     color: var(--text-secondary);
     line-height: 1.6;
-    /* 让描述区域占据剩余空间，统一卡片高度 */
-    flex: 1;
-    min-height: 48px;
-    /* 优化文字排版 */
     word-break: break-word;
     overflow-wrap: break-word;
-    /* 限制描述的最大行数，保持卡片整洁 */
+    margin: 0;
-    display: -webkit-box;
-    -webkit-line-clamp: 3;
-    line-clamp: 3;
-    -webkit-box-orient: vertical;
-    overflow: hidden;
 }
 
 .skill-card-actions {
     display: flex;
     gap: 8px;
-    margin-top: auto;
-    /* 使用 margin-top: auto 将按钮推到底部，统一卡片布局 */
     flex-shrink: 0;
 }
 
-/* 技能卡片响应式布局优化 */
+/* 技能列表响应式布局优化 */
-@media (min-width: 1400px) {
-    .skills-grid {
-        grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
-        gap: 20px;
-    }
-}
-
-@media (max-width: 1200px) {
-    .skills-grid {
-        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
-        gap: 16px;
-    }
-}
-
 @media (max-width: 768px) {
-    .skills-grid {
-        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
-        gap: 12px;
-    }
-    
     .skill-card {
         padding: 14px;
-        gap: 8px;
-    }
-}
-
-@media (max-width: 480px) {
-    .skills-grid {
-        grid-template-columns: 1fr;
         gap: 12px;
+        flex-direction: column;
+        align-items: flex-start;
+    }
+    
+    .skill-card-header {
+        width: 100%;
+    }
+    
+    .skill-card-actions {
+        width: 100%;
+        justify-content: flex-start;
     }
 }
 

web/static/js/api-docs.js

@@ -519,14 +519,18 @@ function renderTestSection(endpoint) {
                         </svg>
                         发送请求
                     </button>
-                    <button class="api-test-btn secondary" onclick="copyCurlCommand(event, '${method}', '${escapeHtml(path)}')" title="复制curl命令">
+                    <button class="api-test-btn copy-curl" onclick="copyCurlCommand(event, '${method}', '${escapeHtml(path)}')" title="复制curl命令">
                         <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                             <rect x="9" y="9" width="13" height="13" rx="2" ry="2" stroke="currentColor" stroke-width="2"/>
                             <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" stroke="currentColor" stroke-width="2"/>
                         </svg>
                         复制curl
                     </button>
-                    <button class="api-test-btn secondary" onclick="clearTestResult('${escapeId(path)}-${method}')">
+                    <button class="api-test-btn clear-result" onclick="clearTestResult('${escapeId(path)}-${method}')" title="清除测试结果">
+                        <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                            <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>

web/static/js/chat.js

@@ -4994,9 +4994,25 @@ function closeBatchManageModal() {
 function showCreateGroupModal(andMoveConversation = false) {
     const modal = document.getElementById('create-group-modal');
     const input = document.getElementById('create-group-name-input');
+    const iconBtn = document.getElementById('create-group-icon-btn');
+    const iconPicker = document.getElementById('group-icon-picker');
+    const customInput = document.getElementById('custom-icon-input');
+    
     if (input) {
         input.value = '';
     }
+    // 重置图标为默认值
+    if (iconBtn) {
+        iconBtn.textContent = '📁';
+    }
+    // 清空自定义图标输入框
+    if (customInput) {
+        customInput.value = '';
+    }
+    // 关闭图标选择器
+    if (iconPicker) {
+        iconPicker.style.display = 'none';
+    }
     if (modal) {
         modal.style.display = 'flex';
         modal.dataset.moveConversation = andMoveConversation ? 'true' : 'false';
@@ -5016,6 +5032,21 @@ function closeCreateGroupModal() {
     if (input) {
         input.value = '';
     }
+    // 重置图标为默认值
+    const iconBtn = document.getElementById('create-group-icon-btn');
+    if (iconBtn) {
+        iconBtn.textContent = '📁';
+    }
+    // 清空自定义图标输入框
+    const customInput = document.getElementById('custom-icon-input');
+    if (customInput) {
+        customInput.value = '';
+    }
+    // 关闭图标选择器
+    const iconPicker = document.getElementById('group-icon-picker');
+    if (iconPicker) {
+        iconPicker.style.display = 'none';
+    }
 }
 
 // 选择建议标签
@@ -5027,6 +5058,81 @@ function selectSuggestion(name) {
     }
 }
 
+// 切换图标选择器显示状态
+function toggleGroupIconPicker() {
+    const picker = document.getElementById('group-icon-picker');
+    if (picker) {
+        const isVisible = picker.style.display !== 'none';
+        picker.style.display = isVisible ? 'none' : 'block';
+    }
+}
+
+// 选择分组图标
+function selectGroupIcon(icon) {
+    const iconBtn = document.getElementById('create-group-icon-btn');
+    if (iconBtn) {
+        iconBtn.textContent = icon;
+    }
+    // 清空自定义输入框
+    const customInput = document.getElementById('custom-icon-input');
+    if (customInput) {
+        customInput.value = '';
+    }
+    // 关闭选择器
+    const picker = document.getElementById('group-icon-picker');
+    if (picker) {
+        picker.style.display = 'none';
+    }
+}
+
+// 应用自定义图标
+function applyCustomIcon() {
+    const customInput = document.getElementById('custom-icon-input');
+    if (!customInput) return;
+    
+    const customIcon = customInput.value.trim();
+    if (!customIcon) {
+        return;
+    }
+    
+    const iconBtn = document.getElementById('create-group-icon-btn');
+    if (iconBtn) {
+        iconBtn.textContent = customIcon;
+    }
+    
+    // 清空输入框并关闭选择器
+    customInput.value = '';
+    const picker = document.getElementById('group-icon-picker');
+    if (picker) {
+        picker.style.display = 'none';
+    }
+}
+
+// 自定义图标输入框回车键处理
+document.addEventListener('DOMContentLoaded', function() {
+    const customInput = document.getElementById('custom-icon-input');
+    if (customInput) {
+        customInput.addEventListener('keydown', function(e) {
+            if (e.key === 'Enter') {
+                e.preventDefault();
+                applyCustomIcon();
+            }
+        });
+    }
+});
+
+// 点击外部关闭图标选择器
+document.addEventListener('click', function(event) {
+    const picker = document.getElementById('group-icon-picker');
+    const iconBtn = document.getElementById('create-group-icon-btn');
+    if (picker && iconBtn) {
+        // 如果点击的不是图标按钮和选择器本身，则关闭选择器
+        if (!picker.contains(event.target) && !iconBtn.contains(event.target)) {
+            picker.style.display = 'none';
+        }
+    }
+});
+
 // 创建分组
 async function createGroup(event) {
     // 阻止事件冒泡
@@ -5071,6 +5177,10 @@ async function createGroup(event) {
         console.error('检查分组名称失败:', error);
     }
 
+    // 获取选中的图标
+    const iconBtn = document.getElementById('create-group-icon-btn');
+    const selectedIcon = iconBtn ? iconBtn.textContent.trim() : '📁';
+
     try {
         const response = await apiFetch('/api/groups', {
             method: 'POST',
@@ -5079,7 +5189,7 @@ async function createGroup(event) {
             },
             body: JSON.stringify({
                 name: name,
-                icon: '📁',
+                icon: selectedIcon,
             }),
         });
 

web/static/js/skills.js

@@ -24,7 +24,7 @@ function getSkillsPageSize() {
         const saved = localStorage.getItem('skillsPageSize');
         if (saved) {
             const size = parseInt(saved);
-            if ([20, 50, 100].includes(size)) {
+            if ([10, 20, 50, 100].includes(size)) {
                 return size;
             }
         }
@@ -109,8 +109,8 @@ function renderSkillsList() {
             <div class="skill-card">
                 <div class="skill-card-header">
                     <h3 class="skill-card-title">${escapeHtml(skill.name || '')}</h3>
+                    <div class="skill-card-description">${escapeHtml(skill.description || '无描述')}</div>
                 </div>
-                <div class="skill-card-description">${escapeHtml(skill.description || '无描述')}</div>
                 <div class="skill-card-actions">
                     <button class="btn-secondary btn-small" onclick="viewSkill('${escapeHtml(skill.name)}')">查看</button>
                     <button class="btn-secondary btn-small" onclick="editSkill('${escapeHtml(skill.name)}')">编辑</button>
@@ -161,6 +161,7 @@ function renderSkillsPagination() {
             <label class="pagination-page-size">
                 每页显示
                 <select id="skills-page-size-pagination" onchange="changeSkillsPageSize()">
+                    <option value="10" ${pageSize === 10 ? 'selected' : ''}>10</option>
                     <option value="20" ${pageSize === 20 ? 'selected' : ''}>20</option>
                     <option value="50" ${pageSize === 50 ? 'selected' : ''}>50</option>
                     <option value="100" ${pageSize === 100 ? 'selected' : ''}>100</option>

web/templates/api-docs.html

@@ -516,20 +516,36 @@
             min-width: 150px;
         }
         
-        /* 参数名、类型、必需、示例列不换行 */
+        /* 参数名、类型、必需列不换行 */
         .api-params-table th:nth-child(1),
         .api-params-table td:nth-child(1),
         .api-params-table th:nth-child(2),
         .api-params-table td:nth-child(2),
         .api-params-table th:nth-child(4),
-        .api-params-table td:nth-child(4),
+        .api-params-table td:nth-child(4) {
-        .api-params-table th:nth-child(5),
-        .api-params-table td:nth-child(5) {
             white-space: nowrap;
             overflow: hidden;
             text-overflow: ellipsis;
         }
         
+        /* 示例列允许换行，完整显示 */
+        .api-params-table th:nth-child(5),
+        .api-params-table td:nth-child(5) {
+            white-space: normal;
+            word-wrap: break-word;
+            overflow-wrap: break-word;
+            overflow: visible;
+        }
+        
+        /* 确保示例列中的code标签也能完整显示 */
+        .api-params-table td:nth-child(5) code {
+            white-space: normal;
+            word-wrap: break-word;
+            overflow-wrap: break-word;
+            display: inline-block;
+            max-width: 100%;
+        }
+        
         /* 描述列允许换行，但保持水平方向 */
         .api-params-table th:nth-child(3),
         .api-params-table td:nth-child(3) {
@@ -674,6 +690,44 @@
             background: var(--bg-secondary);
         }
         
+        /* 复制curl按钮 - 黄色主题 */
+        .api-test-btn.copy-curl {
+            background: #ffc107;
+            color: white;
+            border: 1px solid #ffb300;
+        }
+        
+        .api-test-btn.copy-curl:hover {
+            background: #ffb300;
+            border-color: #ffa000;
+            transform: translateY(-1px);
+            box-shadow: 0 2px 8px rgba(255, 193, 7, 0.3);
+        }
+        
+        .api-test-btn.copy-curl:active {
+            transform: translateY(0);
+            box-shadow: 0 1px 4px rgba(255, 193, 7, 0.2);
+        }
+        
+        /* 清除结果按钮 - 红色/橙色主题 */
+        .api-test-btn.clear-result {
+            background: #ff6b6b;
+            color: white;
+            border: 1px solid #ff5252;
+        }
+        
+        .api-test-btn.clear-result:hover {
+            background: #ff5252;
+            border-color: #ff4444;
+            transform: translateY(-1px);
+            box-shadow: 0 2px 8px rgba(255, 107, 107, 0.3);
+        }
+        
+        .api-test-btn.clear-result:active {
+            transform: translateY(0);
+            box-shadow: 0 1px 4px rgba(255, 107, 107, 0.2);
+        }
+        
         .api-test-result {
             margin-top: 20px;
             padding: 16px;

web/templates/index.html

@@ -1284,8 +1284,44 @@ version: 1.0.0<br>
             <div class="modal-body create-group-body">
                 <p class="create-group-description">分组功能可将对话集中归类管理，让对话更加井然有序。</p>
                 <div class="create-group-input-wrapper">
-                    <span class="group-icon-input">😊</span>
+                    <button type="button" class="group-icon-input" id="create-group-icon-btn" onclick="toggleGroupIconPicker()" title="点击选择图标">📁</button>
                     <input type="text" id="create-group-name-input" placeholder="请输入分组名称" />
+                    <!-- Emoji选择器面板 -->
+                    <div id="group-icon-picker" class="group-icon-picker" style="display: none;">
+                        <div class="icon-picker-header">
+                            <span>选择图标</span>
+                            <div class="icon-picker-custom">
+                                <input type="text" id="custom-icon-input" class="custom-icon-input" placeholder="自定义" maxlength="2" />
+                                <button type="button" class="custom-icon-btn" onclick="applyCustomIcon()">确定</button>
+                            </div>
+                        </div>
+                        <div class="icon-picker-grid">
+                            <span class="icon-option" onclick="selectGroupIcon('📁')">📁</span>
+                            <span class="icon-option" onclick="selectGroupIcon('🔒')">🔒</span>
+                            <span class="icon-option" onclick="selectGroupIcon('🛡️')">🛡️</span>
+                            <span class="icon-option" onclick="selectGroupIcon('⚔️')">⚔️</span>
+                            <span class="icon-option" onclick="selectGroupIcon('🎯')">🎯</span>
+                            <span class="icon-option" onclick="selectGroupIcon('🔍')">🔍</span>
+                            <span class="icon-option" onclick="selectGroupIcon('💻')">💻</span>
+                            <span class="icon-option" onclick="selectGroupIcon('🐛')">🐛</span>
+                            <span class="icon-option" onclick="selectGroupIcon('🚀')">🚀</span>
+                            <span class="icon-option" onclick="selectGroupIcon('⚡')">⚡</span>
+                            <span class="icon-option" onclick="selectGroupIcon('🔥')">🔥</span>
+                            <span class="icon-option" onclick="selectGroupIcon('💡')">💡</span>
+                            <span class="icon-option" onclick="selectGroupIcon('🎮')">🎮</span>
+                            <span class="icon-option" onclick="selectGroupIcon('🏴‍☠️')">🏴‍☠️</span>
+                            <span class="icon-option" onclick="selectGroupIcon('🕵️')">🕵️</span>
+                            <span class="icon-option" onclick="selectGroupIcon('🔑')">🔑</span>
+                            <span class="icon-option" onclick="selectGroupIcon('📡')">📡</span>
+                            <span class="icon-option" onclick="selectGroupIcon('🌐')">🌐</span>
+                            <span class="icon-option" onclick="selectGroupIcon('📊')">📊</span>
+                            <span class="icon-option" onclick="selectGroupIcon('📝')">📝</span>
+                            <span class="icon-option" onclick="selectGroupIcon('🗂️')">🗂️</span>
+                            <span class="icon-option" onclick="selectGroupIcon('📌')">📌</span>
+                            <span class="icon-option" onclick="selectGroupIcon('⭐')">⭐</span>
+                            <span class="icon-option" onclick="selectGroupIcon('💎')">💎</span>
+                        </div>
+                    </div>
                 </div>
                 <div class="create-group-suggestions">
                     <div class="suggestion-tag" onclick="selectSuggestion('渗透测试')">渗透测试</div>