Add files via upload

web/static/css/style.css

@@ -5556,6 +5556,80 @@ header {
     padding-bottom: 0;
 }
 
+/* Skill 包内文件树：区分不可点击的文件夹与可点击的文件 */
+#skill-package-tree {
+    flex: 0 0 240px;
+    max-height: 440px;
+    overflow: auto;
+    border: 1px solid var(--border-color);
+    border-radius: 6px;
+    padding: 6px 4px;
+    font-size: 13px;
+    line-height: 1.4;
+}
+
+.skill-package-tree-hint {
+    display: block;
+    font-size: 12px;
+    color: var(--text-muted);
+    margin: 4px 0 8px;
+    line-height: 1.45;
+}
+
+.skill-tree-row {
+    display: flex;
+    align-items: flex-start;
+    gap: 6px;
+    padding: 5px 8px;
+    border-radius: 4px;
+    margin-bottom: 1px;
+    min-width: 0;
+    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+    font-size: 12px;
+    word-break: break-all;
+    line-height: 1.35;
+}
+
+.skill-tree-dir {
+    color: var(--text-muted);
+    cursor: default;
+    user-select: none;
+    font-weight: 500;
+    opacity: 0.88;
+}
+
+.skill-tree-dir .skill-tree-icon {
+    opacity: 0.65;
+}
+
+.skill-tree-file {
+    color: var(--text-primary);
+    cursor: pointer;
+    transition: background 0.15s ease;
+}
+
+.skill-tree-file:hover {
+    background: rgba(0, 102, 255, 0.08);
+}
+
+.skill-tree-file.is-selected {
+    font-weight: 600;
+    background: rgba(99, 102, 241, 0.12);
+    color: var(--accent-color);
+}
+
+.skill-tree-icon {
+    flex-shrink: 0;
+    width: 1.15em;
+    text-align: center;
+    line-height: 1.35;
+}
+
+.skill-tree-label {
+    min-width: 0;
+    flex: 1;
+}
+
 .pagination-fixed {
     background: var(--bg-primary);
     margin-top: 0;

web/static/i18n/en-US.json

@@ -2257,6 +2257,9 @@
     "descriptionPlaceholder": "Short description",
     "descriptionHint": "Maps to the description field in SKILL.md YAML (when creating/editing SKILL.md)",
     "packageFiles": "Package files",
+    "packageFilesHint": "Click a file to edit; folders are labels only and cannot be opened",
+    "folderHint": "Folder (not editable)",
+    "clickToEdit": "Click to edit this file",
     "editingFile": "Editing",
     "newFile": "New file",
     "newFilePlaceholder": "Relative path, e.g. FORMS.md or scripts/extra.sh",

web/static/i18n/zh-CN.json

@@ -2246,6 +2246,9 @@
     "descriptionPlaceholder": "Skill的简短描述",
     "descriptionHint": "对应 SKILL.md 中 YAML 的 description 字段（创建/编辑 SKILL.md 时使用）",
     "packageFiles": "包内文件",
+    "packageFilesHint": "点击文件进行编辑；文件夹仅作分组展示，不可点击",
+    "folderHint": "文件夹（不可编辑）",
+    "clickToEdit": "点击编辑此文件",
     "editingFile": "正在编辑",
     "newFile": "新建文件",
     "newFilePlaceholder": "新文件路径，如 FORMS.md 或 scripts/extra.sh",

web/static/js/monitor.js

@@ -3637,10 +3637,15 @@ function buildMcpTimelineSvg(points, rangeKey) {
     const tickIdx = points.length <= 2
         ? points.map((_, i) => i)
         : [0, Math.floor((points.length - 1) / 2), points.length - 1];
-    const xLabels = tickIdx.map((idx) => {
+    const xLabels = tickIdx.map((idx, ti) => {
         const c = coords[idx];
         const label = formatMcpTimelineLabel(c.p.t, rangeKey, locale);
-        return `<text class="mcp-stats-timeline-axis" x="${c.x.toFixed(2)}" y="${H - 5}" text-anchor="middle">${escapeHtml(label)}</text>`;
+        let anchor = 'middle';
+        if (tickIdx.length > 1) {
+            if (ti === 0) anchor = 'start';
+            else if (ti === tickIdx.length - 1) anchor = 'end';
+        }
+        return `<text class="mcp-stats-timeline-axis" x="${c.x.toFixed(2)}" y="${H - 5}" text-anchor="${anchor}">${escapeHtml(label)}</text>`;
     }).join('');
 
     const dots = coords.map((c) => {

web/static/js/skills.js

@@ -468,6 +468,11 @@ function showAddSkillModal() {
     modal.style.display = 'flex';
 }
 
+function skillPackagePathDepth(path) {
+    if (!path) return 0;
+    return (String(path).replace(/\/$/, '').match(/\//g) || []).length;
+}
+
 function renderSkillPackageTree() {
     const el = document.getElementById('skill-package-tree');
     if (!el) return;
@@ -479,13 +484,19 @@ function renderSkillPackageTree() {
     }
     el.innerHTML = rows.map(f => {
         const path = f.path || '';
+        const indent = 8 + skillPackagePathDepth(path) * 14;
         if (f.is_dir) {
-            return `<div style="padding:4px 6px;opacity:0.85;font-weight:600;">${escapeHtml(path)}/</div>`;
+            const dirLabel = path.endsWith('/') ? path : path + '/';
+            return `<div class="skill-tree-row skill-tree-dir" style="padding-left:${indent}px" title="${escapeHtml(_t('skillModal.folderHint'))}">` +
+                `<span class="skill-tree-icon" aria-hidden="true">📁</span>` +
+                `<span class="skill-tree-label">${escapeHtml(dirLabel)}</span>` +
+                `</div>`;
         }
-        const sel = path === skillActivePath
-            ? 'font-weight:600;background:rgba(99,102,241,0.12);'
-            : '';
-        return `<div style="padding:4px 6px;cursor:pointer;border-radius:4px;margin-bottom:2px;${sel}" data-skill-tree-path="${escapeHtml(path)}" class="skill-tree-item">${escapeHtml(path)}</div>`;
+        const selected = path === skillActivePath ? ' is-selected' : '';
+        return `<div class="skill-tree-row skill-tree-file${selected}" style="padding-left:${indent}px" data-skill-tree-path="${escapeHtml(path)}" title="${escapeHtml(_t('skillModal.clickToEdit'))}">` +
+            `<span class="skill-tree-icon" aria-hidden="true">📄</span>` +
+            `<span class="skill-tree-label">${escapeHtml(path)}</span>` +
+            `</div>`;
     }).join('');
     el.querySelectorAll('[data-skill-tree-path]').forEach(node => {
         node.addEventListener('click', () => {

web/templates/index.html

@@ -3555,8 +3555,9 @@
                 </div>
                 <div class="form-group" id="skill-package-editor" style="display: none;">
                     <label data-i18n="skillModal.packageFiles">包内文件（标准 Agent Skills 布局）</label>
+                    <small class="skill-package-tree-hint" data-i18n="skillModal.packageFilesHint">点击文件进行编辑；文件夹仅作分组展示，不可点击</small>
                     <div style="display: flex; gap: 12px; align-items: flex-start; min-height: 300px;">
-                        <div id="skill-package-tree" style="flex: 0 0 240px; max-height: 440px; overflow: auto; border: 1px solid rgba(127,127,127,0.25); border-radius: 6px; padding: 8px; font-size: 13px; line-height: 1.4;"></div>
+                        <div id="skill-package-tree"></div>
                         <div style="flex: 1; min-width: 0;">
                             <div style="margin-bottom: 8px; font-size: 13px;">
                                 <span data-i18n="skillModal.editingFile">正在编辑</span> <code id="skill-active-path">SKILL.md</code>