优化“知识库模块“--基本完善

frontend/src/components/FaqCategoryForm.vue

@@ -49,7 +49,7 @@ const rules: FormRules = {
 const isEdit = computed(() => !!props.category);
 
 const reset = () => {
-  form.study_id = props.isAdmin ? "" : study.currentStudy?.id || "";
+  form.study_id = study.currentStudy?.id || "";
   form.name = "";
   form.description = "";
   form.sort_order = 0;
@@ -72,6 +72,15 @@ watch(
   { immediate: true }
 );
 
+watch(
+  () => props.modelValue,
+  (val) => {
+    if (val && !props.category) {
+      reset();
+    }
+  }
+);
+
 const close = () => emit("update:modelValue", false);
 
 const onSubmit = async () => {
@@ -80,15 +89,12 @@ const onSubmit = async () => {
   submitting.value = true;
   try {
     const payload: Record<string, any> = {
-      study_id: form.study_id || null,
+      study_id: study.currentStudy?.id || null,
       name: form.name,
       description: form.description || null,
       sort_order: form.sort_order,
       is_active: form.is_active,
     };
-    if (!props.isAdmin) {
-      payload.study_id = study.currentStudy?.id || null;
-    }
     if (isEdit.value && props.category) {
       await updateFaqCategory(props.category.id, payload);
     } else {

frontend/src/components/FaqCategoryPanel.vue

@@ -8,22 +8,18 @@
         </PermissionAction>
       </div>
     </div>
-    <el-menu :default-active="activeCategory" @select="onSelect">
+    <el-menu :default-active="activeCategory" @select="onSelect" class="menu">
       <el-menu-item index="">全部</el-menu-item>
       <el-menu-item v-for="c in sortedCategories" :key="c.id" :index="c.id">
-        <span>{{ c.name }}</span>
-        <el-tag v-if="c.study_id" size="small" type="success" class="ml-4">项目</el-tag>
-        <el-tag v-else size="small" class="ml-4">全局</el-tag>
-        <PermissionAction v-if="canEdit(c)" action="faq.edit">
-          <el-button
-            type="text"
-            size="small"
-            style="margin-left: auto"
-            @click.stop="openForm(c)"
-          >
-            编辑
-          </el-button>
-        </PermissionAction>
+        <span class="name" :title="c.name">{{ c.name }}</span>
+        <div v-if="canEdit(c) || canDelete" class="actions">
+          <PermissionAction v-if="canEdit(c)" action="faq.edit">
+            <el-button type="text" size="small" @click.stop="openForm(c)">编辑</el-button>
+          </PermissionAction>
+          <PermissionAction v-if="canDelete" action="faq.edit">
+            <el-button type="text" size="small" class="danger" @click.stop="onDelete(c)">删除</el-button>
+          </PermissionAction>
+        </div>
       </el-menu-item>
     </el-menu>
     <FaqCategoryForm v-model="showForm" :category="editing" :is-admin="isAdmin" @success="emit('refresh')" />
@@ -32,8 +28,10 @@
 
 <script setup lang="ts">
 import { computed, ref } from "vue";
+import { ElMessage, ElMessageBox } from "element-plus";
 import FaqCategoryForm from "./FaqCategoryForm.vue";
 import type { FaqCategory } from "../api/faqs";
+import { deleteFaqCategory } from "../api/faqs";
 import { useAuthStore } from "../store/auth";
 import { useStudyStore } from "../store/study";
 import PermissionAction from "./PermissionAction.vue";
@@ -54,6 +52,7 @@ const editing = ref<FaqCategory | null>(null);
 const { can } = usePermission();
 const isAdmin = computed(() => auth.user?.role === "ADMIN");
 const canMaintain = computed(() => can("faq.edit"));
+const canDelete = computed(() => isAdmin.value);
 
 const sortedCategories = computed(() =>
   [...props.categories].sort((a, b) => (a.sort_order ?? 0) - (b.sort_order ?? 0))
@@ -75,6 +74,18 @@ const openForm = (cat?: FaqCategory) => {
   editing.value = cat || null;
   showForm.value = true;
 };
+
+const onDelete = async (cat: FaqCategory) => {
+  const ok = await ElMessageBox.confirm(`确认删除分类「${cat.name}」？`, "提示").catch(() => null);
+  if (!ok) return;
+  try {
+    await deleteFaqCategory(cat.id);
+    ElMessage.success("删除成功");
+    emit("refresh");
+  } catch (e: any) {
+    ElMessage.error(e?.response?.data?.message || "删除失败");
+  }
+};
 </script>
 
 <style scoped>
@@ -88,7 +99,24 @@ const openForm = (cat?: FaqCategory) => {
   padding: 12px;
   border-bottom: 1px solid #ebeef5;
 }
-.ml-4 {
-  margin-left: 4px;
+.menu {
+  max-height: calc(100vh - 240px);
+  overflow: auto;
+}
+.actions {
+  margin-left: auto;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+.name {
+  flex: 1;
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.danger {
+  color: #f56c6c;
 }
 </style>

frontend/src/components/FaqItemForm.vue

@@ -9,12 +9,6 @@
       <el-form-item label="问题" prop="question">
         <el-input v-model="form.question" />
       </el-form-item>
-      <el-form-item label="答案" prop="answer">
-        <el-input v-model="form.answer" type="textarea" :rows="6" />
-      </el-form-item>
-      <el-form-item label="关键词">
-        <el-input v-model="form.keywords" placeholder="逗号分隔，可选" />
-      </el-form-item>
       <el-form-item label="启用">
         <el-switch v-model="form.is_active" />
       </el-form-item>
@@ -43,15 +37,12 @@ const form = reactive({
   study_id: "",
   category_id: "",
   question: "",
-  answer: "",
-  keywords: "",
   is_active: true,
 });
 
 const rules: FormRules = {
   category_id: [{ required: true, message: "请选择分类", trigger: "change" }],
   question: [{ required: true, message: "请输入问题", trigger: "blur" }],
-  answer: [{ required: true, message: "请输入答案", trigger: "blur" }],
 };
 
 const isEdit = computed(() => !!props.item);
@@ -60,8 +51,6 @@ const reset = () => {
   form.study_id = study.currentStudy?.id || "";
   form.category_id = "";
   form.question = "";
-  form.answer = "";
-  form.keywords = "";
   form.is_active = true;
 };
 
@@ -72,8 +61,6 @@ watch(
       form.study_id = val.study_id || "";
       form.category_id = val.category_id;
       form.question = val.question;
-      form.answer = val.answer;
-      form.keywords = val.keywords || "";
       form.is_active = val.is_active;
     } else {
       reset();
@@ -90,11 +77,9 @@ const onSubmit = async () => {
   submitting.value = true;
   try {
     const payload: Record<string, any> = {
-      study_id: form.study_id || null,
+      study_id: study.currentStudy?.id || null,
       category_id: form.category_id,
       question: form.question,
-      answer: form.answer,
-      keywords: form.keywords || null,
       is_active: form.is_active,
     };
     if (isEdit.value && props.item) {

frontend/src/components/FaqList.vue

@@ -1,12 +1,17 @@
 <template>
-  <el-table :data="items" v-loading="loading" style="width: 100%">
-    <el-table-column prop="question" label="问题" min-width="200" />
+  <el-table :data="items" v-loading="loading" style="width: 100%" @row-click="onRowClick">
+    <el-table-column prop="question" label="问题" min-width="200">
+      <template #default="scope">
+        <el-link type="primary" :underline="false" class="question-link">
+          {{ scope.row.question }}
+        </el-link>
+      </template>
+    </el-table-column>
     <el-table-column prop="category_id" label="分类" width="140">
       <template #default="scope">
         {{ categoryMap[scope.row.category_id] || scope.row.category_id }}
       </template>
     </el-table-column>
-    <el-table-column prop="version" label="版本" width="80" />
     <el-table-column prop="is_active" label="启用" width="80">
       <template #default="scope">
         <el-tag :type="scope.row.is_active ? 'success' : 'info'">{{ scope.row.is_active ? "是" : "否" }}</el-tag>
@@ -15,12 +20,16 @@
     <el-table-column prop="updated_at" label="更新时间" width="180">
       <template #default="scope">{{ displayDateTime(scope.row.updated_at) }}</template>
     </el-table-column>
+    <el-table-column prop="status" label="状态" width="120">
+      <template #default="scope">
+        <el-tag :type="statusTagType(scope.row.status)" size="small">{{ statusLabel(scope.row.status) }}</el-tag>
+      </template>
+    </el-table-column>
     <el-table-column label="操作" width="180">
       <template #default="scope">
-        <el-button type="text" size="small" @click="view(scope.row)">查看</el-button>
-        <PermissionAction v-if="canEdit" action="faq.edit">
-          <el-button type="text" size="small" @click="edit(scope.row)">编辑</el-button>
-        </PermissionAction>
+        <el-button v-if="canDelete(scope.row)" type="text" size="small" class="danger" @click="remove(scope.row)">
+          删除
+        </el-button>
         <PermissionAction v-if="canEdit" action="faq.edit">
           <el-button
             type="text"
@@ -40,10 +49,11 @@
 import { ElMessage, ElMessageBox } from "element-plus";
 import { computed } from "vue";
 import { useRouter } from "vue-router";
-import { updateFaqItem } from "../api/faqs";
+import { deleteFaqItem, updateFaqItem } from "../api/faqs";
 import type { FaqItem, FaqCategory } from "../api/faqs";
 import PermissionAction from "./PermissionAction.vue";
 import { displayDateTime } from "../utils/display";
+import { useAuthStore } from "../store/auth";
 
 const props = defineProps<{
   items: FaqItem[];
@@ -51,9 +61,10 @@ const props = defineProps<{
   loading: boolean;
   canEdit: boolean;
 }>();
-const emit = defineEmits(["refresh", "edit"]);
+const emit = defineEmits(["refresh"]);
 
 const router = useRouter();
+const auth = useAuthStore();
 
 const categoryMap = computed(() =>
   props.categories.reduce<Record<string, string>>((acc, cur) => {
@@ -66,10 +77,26 @@ const view = (row: FaqItem) => {
   router.push(`/study/faq/${row.id}`);
 };
 
-const edit = (row: FaqItem) => {
-  emit("edit", row);
+const onRowClick = (row: FaqItem, column: any, event: MouseEvent) => {
+  if (column?.property !== "question") return;
+  view(row);
 };
 
+const statusLabel = (status?: string) => {
+  if (status === "RESOLVED") return "已解决";
+  if (status === "PROCESSING") return "处理中";
+  return "待回答";
+};
+
+const statusTagType = (status?: string) => {
+  if (status === "RESOLVED") return "success";
+  if (status === "PROCESSING") return "warning";
+  return "info";
+};
+
+const canDelete = (row: FaqItem) => props.canEdit || row.created_by === auth.user?.id;
+
+
 const toggle = async (row: FaqItem) => {
   const target = !row.is_active;
   const ok = await ElMessageBox.confirm(`确认${target ? "启用" : "停用"}此 FAQ?`, "提示").catch(() => null);
@@ -82,4 +109,25 @@ const toggle = async (row: FaqItem) => {
     ElMessage.error(e?.response?.data?.message || "操作失败");
   }
 };
+
+const remove = async (row: FaqItem) => {
+  const ok = await ElMessageBox.confirm(`确认删除 FAQ「${row.question}」？`, "提示").catch(() => null);
+  if (!ok) return;
+  try {
+    await deleteFaqItem(row.id);
+    ElMessage.success("问题已删除");
+    emit("refresh");
+  } catch (e: any) {
+    ElMessage.error(e?.response?.data?.message || "删除失败");
+  }
+};
 </script>
+
+<style scoped>
+.danger {
+  color: #f56c6c;
+}
+.question-link {
+  cursor: pointer;
+}
+</style>