UX-2（操作级权限控制）

frontend/src/components/FaqCategoryPanel.vue

@@ -3,7 +3,9 @@
     <div class="header">
       <span>分类</span>
       <div v-if="canMaintain">
-        <el-button type="primary" size="small" @click="openForm()">新建</el-button>
+        <PermissionAction action="faq.edit">
+          <el-button type="primary" size="small" @click="openForm()">新建</el-button>
+        </PermissionAction>
       </div>
     </div>
     <el-menu :default-active="activeCategory" @select="onSelect">
@@ -12,15 +14,16 @@
         <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>
-        <el-button
-          v-if="canEdit(c)"
-          type="text"
-          size="small"
-          style="margin-left: auto"
-          @click.stop="openForm(c)"
-        >
-          编辑
-        </el-button>
+        <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>
       </el-menu-item>
     </el-menu>
     <FaqCategoryForm v-model="showForm" :category="editing" :is-admin="isAdmin" @success="emit('refresh')" />
@@ -33,6 +36,8 @@ import FaqCategoryForm from "./FaqCategoryForm.vue";
 import type { FaqCategory } from "../api/faqs";
 import { useAuthStore } from "../store/auth";
 import { useStudyStore } from "../store/study";
+import PermissionAction from "./PermissionAction.vue";
+import { usePermission } from "../utils/permission";
 
 const props = defineProps<{
   categories: FaqCategory[];
@@ -46,8 +51,9 @@ const study = useStudyStore();
 const showForm = ref(false);
 const editing = ref<FaqCategory | null>(null);
 
+const { can } = usePermission();
 const isAdmin = computed(() => auth.user?.role === "ADMIN");
-const canMaintain = computed(() => isAdmin.value || auth.user?.role === "PM");
+const canMaintain = computed(() => can("faq.edit"));
 
 const sortedCategories = computed(() =>
   [...props.categories].sort((a, b) => (a.sort_order ?? 0) - (b.sort_order ?? 0))
@@ -56,8 +62,9 @@ const sortedCategories = computed(() =>
 const activeCategory = computed(() => props.modelValue || "");
 
 const canEdit = (c: FaqCategory) => {
+  if (!canMaintain.value) return false;
   if (isAdmin.value) return true;
-  return auth.user?.role === "PM" && c.study_id === study.currentStudy?.id;
+  return c.study_id === study.currentStudy?.id;
 };
 
 const onSelect = (id: string) => {