mdk-skills 2.2.8 → 2.2.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mdk-skills",
-  "version": "2.2.8",
+  "version": "2.2.9",
   "description": "mdk-engineer - 沉稳靠谱的前端开发助手 Claude Skills 配置包，一键注入 .claude/ 技能目录和 CLAUDE.md 人设配置",
   "author": "XiaoMa",
   "license": "MIT",

package/scripts/web-ui/server.js

@@ -286,13 +286,14 @@ async function handleApi(req, res) {
       return sendJSON(res, { ok: true, ...result });
     }
 
-    // GET /api/profiles — 获取场景列表
+    // GET /api/profiles — 获取场景列表（含只读状态）
     if (method === "GET" && pathname === "/api/profiles") {
       const profiles = loadProfiles();
       const settings = readSettings();
       return sendJSON(res, {
         profiles: profiles || [],
         activeProfile: settings._active_profile || null,
+        readonly: !settings._skill_source,
       });
     }
 
@@ -309,6 +310,84 @@ async function handleApi(req, res) {
       return sendJSON(res, { ok: true, ...result });
     }
 
+    // POST /api/profiles/save — 新增/编辑场景（仅本地源模式）
+    if (method === "POST" && pathname === "/api/profiles/save") {
+      const body = await parseBody(req);
+      const settings = readSettings();
+      if (!settings._skill_source)
+        return sendJSON(res, { error: "npm 模式下不可编辑场景" }, 403);
+
+      const profilesPath = path.join(skillsSource, ".claude", "profiles.json");
+      let data = { version: 1, profiles: [] };
+      if (fs.existsSync(profilesPath)) {
+        try {
+          data = JSON.parse(fs.readFileSync(profilesPath, "utf-8"));
+        } catch {}
+      }
+
+      const { id, name, description, skills, always_apply } = body;
+      if (!name) return sendJSON(res, { error: "场景名称不能为空" }, 400);
+
+      if (id) {
+        const index = data.profiles.findIndex((p) => p.id === id);
+        if (index === -1) return sendJSON(res, { error: "场景不存在" }, 404);
+        data.profiles[index] = {
+          ...data.profiles[index],
+          name,
+          description: description || "",
+          skills: skills || [],
+          always_apply: always_apply || [],
+        };
+      } else {
+        const newId = "profile_" + Date.now().toString(36);
+        data.profiles.push({
+          id: newId,
+          name,
+          description: description || "",
+          skills: skills || [],
+          always_apply: always_apply || [],
+        });
+      }
+
+      fs.writeFileSync(profilesPath, JSON.stringify(data, null, 2) + "\n", "utf-8");
+
+      // 同步到项目 .claude
+      const projectProfilesPath = path.join(claudeDest, "profiles.json");
+      fs.writeFileSync(projectProfilesPath, JSON.stringify(data, null, 2) + "\n", "utf-8");
+
+      return sendJSON(res, { ok: true, profiles: data.profiles });
+    }
+
+    // POST /api/profiles/delete — 删除场景（仅本地源模式）
+    if (method === "POST" && pathname === "/api/profiles/delete") {
+      const body = await parseBody(req);
+      const settings = readSettings();
+      if (!settings._skill_source)
+        return sendJSON(res, { error: "npm 模式下不可编辑场景" }, 403);
+
+      const { id } = body;
+      if (!id) return sendJSON(res, { error: "缺少场景 ID" }, 400);
+      if (id === "custom")
+        return sendJSON(res, { error: "不能删除内置场景" }, 403);
+
+      const profilesPath = path.join(skillsSource, ".claude", "profiles.json");
+      if (!fs.existsSync(profilesPath))
+        return sendJSON(res, { error: "场景文件不存在" }, 404);
+
+      const data = JSON.parse(fs.readFileSync(profilesPath, "utf-8"));
+      const index = data.profiles.findIndex((p) => p.id === id);
+      if (index === -1) return sendJSON(res, { error: "场景不存在" }, 404);
+
+      data.profiles.splice(index, 1);
+      fs.writeFileSync(profilesPath, JSON.stringify(data, null, 2) + "\n", "utf-8");
+
+      // 同步到项目 .claude
+      const projectProfilesPath = path.join(claudeDest, "profiles.json");
+      fs.writeFileSync(projectProfilesPath, JSON.stringify(data, null, 2) + "\n", "utf-8");
+
+      return sendJSON(res, { ok: true });
+    }
+
     // GET /api/status — 当前状态总览
     if (method === "GET" && pathname === "/api/status") {
       const settings = readSettings();

package/scripts/web-ui/src/api/skills.js

@@ -41,6 +41,20 @@ export function applyProfile(profileId) {
   });
 }
 
+export function saveProfile(data) {
+  return request("/profiles/save", {
+    method: "POST",
+    body: JSON.stringify(data),
+  });
+}
+
+export function deleteProfile(id) {
+  return request("/profiles/delete", {
+    method: "POST",
+    body: JSON.stringify({ id }),
+  });
+}
+
 export function getStatus() {
   return request("/status");
 }

package/scripts/web-ui/src/views/SceneSwitch.vue

@@ -2,19 +2,38 @@
   <div class="scene-switch">
     <div class="page-header">
       <h2>场景切换</h2>
+      <n-button v-if="!readonly" size="small" type="primary" @click="openCreate">
+        <template #icon><n-icon><AddOutline /></n-icon></template>
+        新建场景
+      </n-button>
     </div>
 
     <n-spin :show="loading">
       <div class="scene-grid">
         <n-card
-          v-for="profile in profiles"
+          v-for="profile in filteredProfiles"
           :key="profile.id"
           class="scene-card"
           :class="{ active: profile.id === activeId }"
           :title="profile.name"
           size="small"
-          hoverable
         >
+          <template #header-extra>
+            <n-space v-if="!readonly && profile.id !== 'custom' && profile.skills !== null" :size="4">
+              <n-button size="tiny" quaternary @click="openEdit(profile)">
+                <template #icon><n-icon size="16"><PencilOutline /></n-icon></template>
+              </n-button>
+              <n-popconfirm @positive-click="onDelete(profile)">
+                <template #trigger>
+                  <n-button size="tiny" quaternary>
+                    <template #icon><n-icon size="16"><TrashOutline /></n-icon></template>
+                  </n-button>
+                </template>
+                确定删除场景「{{ profile.name }}」？
+              </n-popconfirm>
+            </n-space>
+          </template>
+
           <p class="scene-desc">{{ profile.description }}</p>
 
           <template #footer>
@@ -30,7 +49,7 @@
               </n-tag>
 
               <n-button
-                v-if="profile.id !== activeId && profile.skills !== null"
+                v-if="profile.id !== activeId"
                 size="small"
                 type="primary"
                 :loading="applying === profile.id"
@@ -38,44 +57,90 @@
               >
                 应用
               </n-button>
-              <n-button
-                v-if="profile.id !== activeId && profile.skills === null"
-                size="small"
-                @click="openCustomDialog"
-              >
-                自定义勾选
-              </n-button>
             </div>
           </template>
         </n-card>
       </div>
     </n-spin>
 
-    <!-- 自定义勾选弹窗 -->
-    <n-modal v-model:show="showCustom" title="自定义技能组合" preset="card" style="width: 480px">
-      <n-checkbox-group v-model:value="customSelected">
-        <n-space vertical>
-          <n-checkbox
-            v-for="skill in allSkills"
-            :key="skill.name"
-            :value="skill.name"
-            :label="skill.name"
+    <!-- 编辑弹窗 -->
+    <n-modal
+      v-model:show="showEditor"
+      :title="editingProfile ? '编辑场景' : '新建场景'"
+      preset="card"
+      style="width: 520px"
+      :mask-closable="false"
+    >
+      <n-form :model="formData" label-placement="top">
+        <n-form-item label="场景名称" required>
+          <n-input
+            v-model:value="formData.name"
+            placeholder="给场景起个名字"
+            :maxlength="30"
           />
-        </n-space>
-      </n-checkbox-group>
+        </n-form-item>
+        <n-form-item label="场景描述">
+          <n-input
+            v-model:value="formData.description"
+            type="textarea"
+            :rows="2"
+            placeholder="简短描述这个场景的用途"
+          />
+        </n-form-item>
+        <n-divider />
+        <n-form-item label="包含的技能">
+          <n-checkbox-group v-model:value="formData.skills">
+            <n-space vertical>
+              <n-checkbox
+                v-for="skill in allSkills"
+                :key="skill.name"
+                :value="skill.name"
+                :label="skill.name"
+              />
+            </n-space>
+          </n-checkbox-group>
+        </n-form-item>
+        <n-divider />
+        <n-form-item label="始终加载（always_apply）">
+          <template v-if="formData.skills.length === 0">
+            <span class="hint-text">请先勾选包含的技能</span>
+          </template>
+          <n-checkbox-group v-else v-model:value="formData.always_apply">
+            <n-space vertical>
+              <n-checkbox
+                v-for="skillName in formData.skills"
+                :key="skillName"
+                :value="skillName"
+                :label="skillName"
+              />
+            </n-space>
+          </n-checkbox-group>
+        </n-form-item>
+      </n-form>
       <template #footer>
-        <n-button type="primary" :loading="customLoading" @click="onApplyCustom">
-          确认安装
-        </n-button>
+        <n-space justify="end">
+          <n-button @click="showEditor = false">取消</n-button>
+          <n-button type="primary" :loading="saving" @click="onSave">
+            保存
+          </n-button>
+        </n-space>
       </template>
     </n-modal>
   </div>
 </template>
 
 <script setup>
-import { ref, onMounted } from "vue";
+import { ref, onMounted, computed } from "vue";
 import { useMessage } from "naive-ui";
-import { getProfiles, applyProfile, getSkills, installSkills } from "../api/skills";
+import { NIcon } from "naive-ui";
+import { AddOutline, PencilOutline, TrashOutline } from "@vicons/ionicons5";
+import {
+  getProfiles,
+  applyProfile,
+  getSkills,
+  saveProfile,
+  deleteProfile,
+} from "../api/skills";
 
 const emit = defineEmits(["refresh"]);
 const message = useMessage();
@@ -85,10 +150,21 @@ const activeId = ref(null);
 const allSkills = ref([]);
 const loading = ref(false);
 const applying = ref(null);
+const readonly = ref(true);
 
-const showCustom = ref(false);
-const customSelected = ref([]);
-const customLoading = ref(false);
+// 编辑器
+const showEditor = ref(false);
+const editingProfile = ref(null);
+const saving = ref(false);
+const formData = ref({
+  name: "",
+  description: "",
+  skills: [],
+  always_apply: [],
+});
+
+// 过滤掉不可见的场景（如已有内置）
+const filteredProfiles = computed(() => profiles.value);
 
 async function loadData() {
   loading.value = true;
@@ -96,47 +172,93 @@ async function loadData() {
     const res = await getProfiles();
     profiles.value = res.profiles || [];
     activeId.value = res.activeProfile;
+    readonly.value = res.readonly !== false;
     allSkills.value = await getSkills();
   } finally {
     loading.value = false;
   }
 }
 
-async function onApply(profile) {
-  applying.value = profile.id;
+function openCreate() {
+  editingProfile.value = null;
+  formData.value = {
+    name: "",
+    description: "",
+    skills: [],
+    always_apply: [],
+  };
+  showEditor.value = true;
+}
+
+function openEdit(profile) {
+  editingProfile.value = profile;
+  formData.value = {
+    name: profile.name,
+    description: profile.description || "",
+    skills: [...(profile.skills || [])],
+    always_apply: [...(profile.always_apply || [])],
+  };
+  showEditor.value = true;
+}
+
+async function onSave() {
+  if (!formData.value.name.trim()) {
+    message.warning("请填写场景名称");
+    return;
+  }
+  saving.value = true;
   try {
-    const res = await applyProfile(profile.id);
+    const data = {
+      id: editingProfile.value?.id,
+      name: formData.value.name.trim(),
+      description: formData.value.description.trim(),
+      skills: formData.value.skills,
+      always_apply: formData.value.always_apply,
+    };
+    const res = await saveProfile(data);
     if (res.ok) {
-      activeId.value = profile.id;
-      message.success(`已切换到「${profile.name}」`);
+      profiles.value = res.profiles;
+      message.success(editingProfile.value ? "场景已更新" : "场景已创建");
+      showEditor.value = false;
       emit("refresh");
+    } else if (res.error) {
+      message.error(res.error);
     }
   } catch {
-    message.error("切换失败");
+    message.error("保存失败");
   } finally {
-    applying.value = null;
+    saving.value = false;
   }
 }
 
-function openCustomDialog() {
-  customSelected.value = allSkills.value.filter((s) => s.enabled).map((s) => s.name);
-  showCustom.value = true;
+async function onDelete(profile) {
+  try {
+    const res = await deleteProfile(profile.id);
+    if (res.ok) {
+      profiles.value = profiles.value.filter((p) => p.id !== profile.id);
+      message.success(`场景「${profile.name}」已删除`);
+      emit("refresh");
+    } else if (res.error) {
+      message.error(res.error);
+    }
+  } catch {
+    message.error("删除失败");
+  }
 }
 
-async function onApplyCustom() {
-  customLoading.value = true;
+async function onApply(profile) {
+  applying.value = profile.id;
   try {
-    const res = await installSkills(customSelected.value);
+    const res = await applyProfile(profile.id);
     if (res.ok) {
-      message.success(`已安装 ${customSelected.value.length} 个技能`);
-      activeId.value = "custom";
-      showCustom.value = false;
+      activeId.value = profile.id;
+      message.success(`已切换到「${profile.name}」`);
       emit("refresh");
     }
   } catch {
-    message.error("安装失败");
+    message.error("切换失败");
   } finally {
-    customLoading.value = false;
+    applying.value = null;
   }
 }
 
@@ -145,6 +267,9 @@ onMounted(loadData);
 
 <style scoped>
 .page-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
   margin-bottom: 20px;
 }
 
@@ -178,4 +303,9 @@ onMounted(loadData);
   align-items: center;
   justify-content: space-between;
 }
+
+.hint-text {
+  font-size: 12px;
+  color: #999;
+}
 </style>

package/.claude/skills/test1/.meta.json

@@ -1,6 +0,0 @@
-{
-  "name": "test1",
-  "version": "1.0.0",
-  "description": "测试技能1",
-  "tags": ["test", "frontend"]
-}

package/.claude/skills/test2/.meta.json

@@ -1,6 +0,0 @@
-{
-  "name": "test2",
-  "version": "1.0.0",
-  "description": "测试技能2",
-  "tags": ["test", "frontend"]
-}

package/.claude/skills/test3/.meta.json

@@ -1,6 +0,0 @@
-{
-  "name": "test3",
-  "version": "1.0.0",
-  "description": "测试技能3",
-  "tags": ["test", "frontend"]
-}