fix: 恢复知识库开关并修复弹层组件

ai_knowledge_base_v2/apps/admin-web/src/components/KnowledgeManagementView.vue

@@ -297,19 +297,24 @@ async function rollback(version: KnowledgeVersion) {
   }
 }
 
-async function toggleOpen(item: KnowledgeItem) {
+async function toggleOpen(item: KnowledgeItem): Promise<boolean> {
   const next = item.status !== 1;
   if (!await confirmAction(
     next ? "开放后，该知识库将从用户下一条消息开始进入 Agent 动态知识目录。" : "关闭后，当前生成不受影响，从用户下一条消息开始无法检索该知识库。",
     next ? "开放知识库" : "关闭知识库",
     { confirmButtonText: next ? "确认开放" : "确认关闭", cancelButtonText: "取消", type: "warning" },
-  )) return;
+  )) return false;
+  operatingId.value = item.id;
   try {
     await api.setKnowledgeOpen(item.id, next);
     ElMessage.success(next ? "知识库已开放" : "知识库已关闭");
-    await load();
+    if (detailOpen.value && detail.value?.knowledge.id === item.id) await refreshDetail(item.id);
+    return true;
   } catch (error) {
     ElMessage.error(errorMessage(error, next ? "知识库开放失败" : "知识库关闭失败"));
+    return false;
+  } finally {
+    operatingId.value = null;
   }
 }
 
@@ -415,9 +420,9 @@ async function confirmAction(
     <el-table-column label="知识库" min-width="240"><template #default="{ row }"><strong>{{ row.name }}</strong><small class="table-subline">{{ row.sourceTitle || "尚未同步源标题" }}</small></template></el-table-column>
     <el-table-column label="类型/审核" width="150"><template #default="{ row }">{{ typeLabel(row.knowledgeType) }}<small class="table-subline">{{ row.reviewMode === 'manual' ? '人工审核' : '允许自动发布' }}</small></template></el-table-column>
     <el-table-column label="版本" width="130"><template #default="{ row }"><span>正式 {{ row.currentVersionId ? `#${row.currentVersionId}` : '无' }}</span><small class="table-subline">待发布 {{ row.pendingVersionId ? `#${row.pendingVersionId}` : '无' }}</small></template></el-table-column>
-    <el-table-column label="状态" width="160"><template #default="{ row }"><el-tag :type="row.status === 1 ? 'success' : 'info'">{{ row.status === 1 ? '已开放' : '已关闭' }}</el-tag><el-tag class="status-gap" :type="statusType(row.sourceStatus)">{{ row.sourceStatus === 'normal' ? '源正常' : '源异常' }}</el-tag></template></el-table-column>
+    <el-table-column label="状态" width="210"><template #default="{ row }"><div class="knowledge-status-cell"><el-switch v-model="row.status" :active-value="1" :inactive-value="0" active-text="开放" inactive-text="关闭" inline-prompt :loading="operatingId === row.id" :disabled="row.lifecycleStatus === 'archived'" :before-change="() => toggleOpen(row)" /><el-tag :type="statusType(row.sourceStatus)">{{ row.sourceStatus === 'normal' ? '源正常' : '源异常' }}</el-tag></div></template></el-table-column>
     <el-table-column prop="lastSyncedAt" label="最近同步" width="180" />
-    <el-table-column label="操作" width="270" fixed="right"><template #default="{ row }"><el-button link type="primary" @click="openDetail(row)">详情</el-button><el-button link type="primary" :disabled="row.lifecycleStatus === 'archived'" :loading="operatingId === row.id" @click="sync(row, 'review')">同步</el-button><el-button link :disabled="row.lifecycleStatus === 'archived'" @click="toggleOpen(row)">{{ row.status === 1 ? '关闭' : '开放' }}</el-button><el-dropdown trigger="click" @command="handleMore($event, row)"><el-button link>更多</el-button><template #dropdown><el-dropdown-menu><el-dropdown-item command="detail">查看详情</el-dropdown-item><el-dropdown-item command="preview">进入 Agent 预览</el-dropdown-item><el-dropdown-item command="versions">查看版本</el-dropdown-item><el-dropdown-item v-if="row.lifecycleStatus === 'active'" command="archive" divided>归档</el-dropdown-item><el-dropdown-item v-else command="restore" divided>恢复</el-dropdown-item><el-dropdown-item command="delete" :disabled="row.lifecycleStatus !== 'archived'" divided>删除</el-dropdown-item></el-dropdown-menu></template></el-dropdown></template></el-table-column>
+    <el-table-column label="操作" width="220" fixed="right"><template #default="{ row }"><el-button link type="primary" @click="openDetail(row)">详情</el-button><el-button link type="primary" :disabled="row.lifecycleStatus === 'archived'" :loading="operatingId === row.id" @click="sync(row, 'review')">同步</el-button><el-dropdown trigger="click" :teleported="true" @command="handleMore($event, row)"><el-button link type="primary">更多</el-button><template #dropdown><el-dropdown-menu><el-dropdown-item command="detail">查看详情</el-dropdown-item><el-dropdown-item command="preview">进入 Agent 预览</el-dropdown-item><el-dropdown-item command="versions">查看版本</el-dropdown-item><el-dropdown-item v-if="row.lifecycleStatus === 'active'" command="archive" divided>归档</el-dropdown-item><el-dropdown-item v-else command="restore" divided>恢复</el-dropdown-item><el-dropdown-item command="delete" :disabled="row.lifecycleStatus !== 'archived'" divided>删除</el-dropdown-item></el-dropdown-menu></template></el-dropdown></template></el-table-column>
   </el-table>
 
   <el-drawer v-model="detailOpen" size="76%" title="知识库详情" destroy-on-close>
@@ -446,7 +451,7 @@ async function confirmAction(
     </template>
   </el-drawer>
 
-  <el-dialog v-model="editOpen" title="编辑知识库基本信息" width="min(520px, 92vw)" destroy-on-close>
+  <el-dialog v-model="editOpen" title="编辑知识库基本信息" width="min(520px, 92vw)" append-to-body destroy-on-close>
     <el-form label-position="top">
       <el-form-item label="后台知识库名称" required><el-input v-model="editForm.name" maxlength="100" show-word-limit /></el-form-item>
       <el-form-item label="知识库类型" required><el-select v-model="editForm.knowledgeType"><el-option label="课程知识库" value="course" /><el-option label="答疑知识库" value="qa" /><el-option label="通用知识库" value="general" /></el-select></el-form-item>
@@ -456,7 +461,7 @@ async function confirmAction(
     <template #footer><el-button @click="editOpen = false">取消</el-button><el-button type="primary" :loading="editSaving" @click="saveMetadata">保存</el-button></template>
   </el-dialog>
 
-  <el-dialog v-model="batchOpen" title="批量修改知识库" width="min(520px, 92vw)" destroy-on-close>
+  <el-dialog v-model="batchOpen" title="批量修改知识库" width="min(520px, 92vw)" append-to-body destroy-on-close>
     <el-alert :title="`已选择 ${selectedRows.length} 个知识库，未选择的字段将保持原值。`" type="info" :closable="false" />
     <el-form label-position="top" class="batch-edit-form">
       <el-form-item label="知识库类型"><el-select v-model="batchForm.knowledgeType" clearable placeholder="不修改"><el-option label="课程知识库" value="course" /><el-option label="答疑知识库" value="qa" /><el-option label="通用知识库" value="general" /></el-select></el-form-item>
@@ -485,6 +490,12 @@ async function confirmAction(
   margin: 0;
 }
 
+.knowledge-status-cell {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+}
+
 .batch-edit-form {
   margin-top: 20px;
 }

ai_knowledge_base_v2/apps/admin-web/src/main.ts

@@ -1,30 +1,40 @@
 import {
+  ElAlert,
   ElButton,
   ElCollapse,
   ElCollapseItem,
   ElDatePicker,
   ElDivider,
+  ElDialog,
   ElDrawer,
+  ElDropdown,
+  ElDropdownItem,
+  ElDropdownMenu,
   ElEmpty,
   ElForm,
   ElFormItem,
   ElInput,
   ElInputNumber,
   ElOption,
+  ElProgress,
   ElSelect,
   ElSwitch,
   ElTabPane,
   ElTable,
   ElTableColumn,
   ElTabs,
+  ElTag,
   vLoading,
 } from "element-plus";
 import "element-plus/theme-chalk/base.css";
+import "element-plus/theme-chalk/el-alert.css";
 import "element-plus/theme-chalk/el-button.css";
 import "element-plus/theme-chalk/el-collapse.css";
 import "element-plus/theme-chalk/el-date-picker.css";
 import "element-plus/theme-chalk/el-divider.css";
+import "element-plus/theme-chalk/el-dialog.css";
 import "element-plus/theme-chalk/el-drawer.css";
+import "element-plus/theme-chalk/el-dropdown.css";
 import "element-plus/theme-chalk/el-empty.css";
 import "element-plus/theme-chalk/el-form.css";
 import "element-plus/theme-chalk/el-input.css";
@@ -34,10 +44,12 @@ import "element-plus/theme-chalk/el-message.css";
 import "element-plus/theme-chalk/el-message-box.css";
 import "element-plus/theme-chalk/el-option.css";
 import "element-plus/theme-chalk/el-overlay.css";
+import "element-plus/theme-chalk/el-progress.css";
 import "element-plus/theme-chalk/el-select.css";
 import "element-plus/theme-chalk/el-switch.css";
 import "element-plus/theme-chalk/el-table.css";
 import "element-plus/theme-chalk/el-tabs.css";
+import "element-plus/theme-chalk/el-tag.css";
 import { createApp } from "vue";
 import zhCn from "element-plus/es/locale/lang/zh-cn";
 
@@ -48,24 +60,31 @@ const app = createApp(App);
 app.config.globalProperties.$ELEMENT = { locale: zhCn };
 
 [
+  ElAlert,
   ElButton,
   ElCollapse,
   ElCollapseItem,
   ElDatePicker,
   ElDivider,
+  ElDialog,
   ElDrawer,
+  ElDropdown,
+  ElDropdownItem,
+  ElDropdownMenu,
   ElEmpty,
   ElForm,
   ElFormItem,
   ElInput,
   ElInputNumber,
   ElOption,
+  ElProgress,
   ElSelect,
   ElSwitch,
   ElTabPane,
   ElTable,
   ElTableColumn,
   ElTabs,
+  ElTag,
 ].forEach((component) => {
   app.use(component);
 });