权限管理界面重构：角色概览、生效管理与编辑权限整合

【界面优化】
- 移除权限模板列表和角色概览卡片上的"系统预设"标签，视觉上减少噪音
- 将 PermissionTemplateSelector 改为纯展示组件，重命名为"角色权限概览"
- 移除"应用此模板"按钮及预览面板，卡片仅展示各角色权限统计
- 角色描述改为鼠标悬浮 tooltip 显示，节省卡片空间
- 未生效角色以虚线边框 + 降低透明度区分，悬浮提示状态说明

【生效管理】
- Study 模型新增 active_roles JSON 字段，记录项目已生效角色列表
- 新增 /studies/{study_id}/active-roles GET/PUT 接口
- 数据库迁移 20260518_01：studies 表添加 active_roles 列
- 成员管理的项目角色下拉列表仅显示已生效角色，未生效角色不可分配

【模板管理抽屉重构】
- 抽屉改为三标签页：模板列表 / 生效管理 / 编辑权限
- 生效管理：开关控制各角色生效状态，保存后同步后端
- 编辑权限：左右分栏设计，左侧角色列表点击选中，右侧实时展示权限勾选
- 原独立的角色权限编辑抽屉合并至此，角色概览卡片"编辑权限"直接跳转对应标签页

【操作类型标签统一】
- 系统级权限和编辑权限界面的操作类型标签统一使用细分类型
- 操作类型从粗粒度 read/write 细化为 read/create/update/delete/export
- 颜色规范：读取灰色、创建绿色、更新黄色、删除红色、导出无色
- 权限模板管理接口限制为 ADMIN 角色，修复原先权限过宽的问题

Co-Authored-By: Claude Sonnet 4.6 (1M context) <noreply@anthropic.com>

backend/alembic/versions/20260518_01_add_study_active_roles.py

@@ -0,0 +1,28 @@
+"""add active_roles to studies
+
+Revision ID: 20260518_01
+Revises: 20260514_01
+Create Date: 2026-05-18 16:00:00.000000
+
+"""
+
+from typing import Sequence, Union
+
+import sqlalchemy as sa
+from alembic import op
+
+revision: str = "20260518_01"
+down_revision: Union[str, None] = "20260514_01"
+branch_labels: Union[str, Sequence[str], None] = None
+depends_on: Union[str, Sequence[str], None] = None
+
+
+def upgrade() -> None:
+    op.add_column(
+        "studies",
+        sa.Column("active_roles", sa.JSON(), nullable=False, server_default="[]"),
+    )
+
+
+def downgrade() -> None:
+    op.drop_column("studies", "active_roles")

backend/app/api/v1/api_permissions.py

@@ -165,16 +165,17 @@ async def get_study_api_permissions(
     """
     permissions = await get_api_endpoint_permissions(db, study_id)
 
-    # 构建返回格式
+    # 构建返回格式（get_api_endpoint_permissions 已返回 {role: {key: {"allowed": bool}}}）
     result: dict[str, dict[str, dict[str, bool]]] = {}
     for role in PROJECT_PERMISSION_ROLES:
         if role == "ADMIN":
             continue
         result[role] = {}
         for endpoint_key in API_ENDPOINT_PERMISSIONS.keys():
-            result[role][endpoint_key] = {
+            perm = permissions.get(role, {}).get(endpoint_key, {"allowed": False})
-                "allowed": permissions.get(role, {}).get(endpoint_key, False)
+            # perm 已经是 {"allowed": bool}，直接使用
-            }
+            allowed = perm["allowed"] if isinstance(perm, dict) else bool(perm)
+            result[role][endpoint_key] = {"allowed": allowed}
 
     return result
 
@@ -220,8 +221,8 @@ async def update_study_api_permissions(
             continue
         result[role] = {}
         for endpoint_key in API_ENDPOINT_PERMISSIONS.keys():
-            result[role][endpoint_key] = {
+            perm = permissions.get(role, {}).get(endpoint_key, {"allowed": False})
-                "allowed": permissions.get(role, {}).get(endpoint_key, False)
+            allowed = perm["allowed"] if isinstance(perm, dict) else bool(perm)
-            }
+            result[role][endpoint_key] = {"allowed": allowed}
 
     return result

backend/app/api/v1/permission_templates.py

@@ -9,8 +9,9 @@ from fastapi import APIRouter, Depends, HTTPException, status
 from fastapi.responses import Response
 from sqlalchemy.ext.asyncio import AsyncSession
 
-from app.core.deps import get_current_user, get_db_session, require_study_roles
+from app.core.deps import get_current_user, get_db_session, require_roles, require_study_roles
 from app.models.permission_template import TemplateType
+from app.models.user import UserRole
 from app.schemas.permission_template import (
     ApplyTemplateRequest,
     ApplyTemplateResponse,
@@ -51,7 +52,7 @@ async def list_templates(
 async def create_template(
     payload: PermissionTemplateCreate,
     db: Annotated[AsyncSession, Depends(get_db_session)] = None,
-    current_user=Depends(get_current_user),
+    current_user=Depends(require_roles([UserRole.ADMIN.value])),
 ) -> PermissionTemplateRead:
     """创建权限模板"""
     try:
@@ -78,7 +79,7 @@ async def update_template(
     template_id: uuid.UUID,
     payload: PermissionTemplateUpdate,
     db: Annotated[AsyncSession, Depends(get_db_session)] = None,
-    current_user=Depends(get_current_user),
+    current_user=Depends(require_roles([UserRole.ADMIN.value])),
 ) -> PermissionTemplateRead:
     """更新权限模板"""
     try:
@@ -92,7 +93,7 @@ async def update_template(
 async def delete_template(
     template_id: uuid.UUID,
     db: Annotated[AsyncSession, Depends(get_db_session)] = None,
-    current_user=Depends(get_current_user),
+    current_user=Depends(require_roles([UserRole.ADMIN.value])),
 ):
     """删除权限模板"""
     try:

backend/app/api/v1/router.py

@@ -1,6 +1,6 @@
 from fastapi import APIRouter
 
-from app.api.v1 import auth, users, admin_users, studies, sites, members, attachments, audit_logs, dashboard, subjects, visits, aes, finance_dashboard, finance_contracts, fees_contracts, fees_attachments, drug_shipments, material_equipments, project_milestones, startup, knowledge_notes, subject_histories, subject_pds, study_subject_pds, faq_categories, faqs, documents, overview, notifications, monitoring_visit_issues, api_permissions, permission_monitoring, permission_templates
+from app.api.v1 import auth, users, admin_users, studies, sites, members, attachments, audit_logs, dashboard, subjects, visits, aes, finance_dashboard, finance_contracts, fees_contracts, fees_attachments, drug_shipments, material_equipments, project_milestones, startup, knowledge_notes, subject_histories, subject_pds, study_subject_pds, faq_categories, faqs, documents, overview, notifications, monitoring_visit_issues, api_permissions, permission_monitoring, permission_templates, system_permissions, study_active_roles
 
 
 api_router = APIRouter()
@@ -40,3 +40,5 @@ api_router.include_router(documents.router, prefix="", tags=["documents"])
 api_router.include_router(permission_monitoring.router)
 api_router.include_router(permission_templates.router)
 api_router.include_router(permission_templates.study_router, prefix="/studies/{study_id}", tags=["permission-templates"])
+api_router.include_router(system_permissions.router)
+api_router.include_router(study_active_roles.router, prefix="/studies/{study_id}", tags=["active-roles"])

backend/app/api/v1/study_active_roles.py

@@ -0,0 +1,44 @@
+"""项目角色生效管理API"""
+
+from __future__ import annotations
+
+import uuid
+from typing import Annotated
+
+from fastapi import APIRouter, Depends, HTTPException, status
+from sqlalchemy import select
+from sqlalchemy.ext.asyncio import AsyncSession
+
+from app.core.deps import get_db_session, require_study_roles
+from app.models.study import Study
+
+router = APIRouter(prefix="/active-roles", tags=["active-roles"])
+
+
+@router.get("", summary="获取项目已生效角色列表")
+async def get_active_roles(
+    study_id: uuid.UUID,
+    _=Depends(require_study_roles(["PM"])),
+    db: Annotated[AsyncSession, Depends(get_db_session)] = None,
+) -> dict:
+    result = await db.execute(select(Study).where(Study.id == study_id))
+    study = result.scalar_one_or_none()
+    if not study:
+        raise HTTPException(status_code=status.HTTP_404_NOT_FOUND, detail="项目不存在")
+    return {"active_roles": study.active_roles or []}
+
+
+@router.put("", summary="更新项目已生效角色列表")
+async def update_active_roles(
+    study_id: uuid.UUID,
+    payload: dict,
+    _=Depends(require_study_roles(["PM"])),
+    db: Annotated[AsyncSession, Depends(get_db_session)] = None,
+) -> dict:
+    result = await db.execute(select(Study).where(Study.id == study_id))
+    study = result.scalar_one_or_none()
+    if not study:
+        raise HTTPException(status_code=status.HTTP_404_NOT_FOUND, detail="项目不存在")
+    study.active_roles = payload.get("active_roles", [])
+    await db.commit()
+    return {"active_roles": study.active_roles}

backend/app/api/v1/system_permissions.py

@@ -0,0 +1,37 @@
+"""系统级权限查询API"""
+
+from __future__ import annotations
+
+from fastapi import APIRouter, Depends
+
+from app.core.deps import require_roles
+from app.core.api_permissions import SYSTEM_PERMISSIONS, SYSTEM_MODULE_LABELS
+from app.models.user import UserRole
+
+router = APIRouter(prefix="/system-permissions", tags=["system-permissions"])
+
+
+@router.get(
+    "",
+    summary="获取系统级权限定义",
+    description="返回管理后台所有系统级操作的权限定义，仅 ADMIN 可访问",
+)
+async def list_system_permissions(
+    _=Depends(require_roles([UserRole.ADMIN.value])),
+) -> dict:
+    permissions_list = [
+        {
+            "permission_key": key,
+            "module": config["module"],
+            "module_label": SYSTEM_MODULE_LABELS.get(config["module"], config["module"]),
+            "action": config["action"],
+            "description": config["description"],
+            "roles": config["roles"],
+        }
+        for key, config in SYSTEM_PERMISSIONS.items()
+    ]
+
+    return {
+        "permissions": permissions_list,
+        "module_labels": SYSTEM_MODULE_LABELS,
+    }

backend/app/core/api_permissions.py

@@ -1141,3 +1141,116 @@ OPERATION_PREREQUISITES: dict[str, list[str]] = {
     "monitoring_audit:update": ["sites:read"],
     "monitoring_audit:delete": ["sites:read"],
 }
+
+# 系统级权限定义
+# 描述管理后台各模块操作，当前全部由 ADMIN 角色持有
+SYSTEM_PERMISSIONS: dict[str, dict] = {
+    # 账号管理
+    "system:users:list": {
+        "module": "system_users",
+        "action": "read",
+        "description": "查看用户列表",
+        "roles": ["ADMIN"],
+    },
+    "system:users:create": {
+        "module": "system_users",
+        "action": "create",
+        "description": "创建用户",
+        "roles": ["ADMIN"],
+    },
+    "system:users:update": {
+        "module": "system_users",
+        "action": "update",
+        "description": "编辑用户",
+        "roles": ["ADMIN"],
+    },
+    "system:users:disable": {
+        "module": "system_users",
+        "action": "update",
+        "description": "禁用/启用用户",
+        "roles": ["ADMIN"],
+    },
+    "system:users:approve": {
+        "module": "system_users",
+        "action": "update",
+        "description": "审核用户注册",
+        "roles": ["ADMIN"],
+    },
+    # 项目管理
+    "system:projects:list": {
+        "module": "system_projects",
+        "action": "read",
+        "description": "查看项目列表",
+        "roles": ["ADMIN"],
+    },
+    "system:projects:create": {
+        "module": "system_projects",
+        "action": "create",
+        "description": "创建项目",
+        "roles": ["ADMIN"],
+    },
+    "system:projects:update": {
+        "module": "system_projects",
+        "action": "update",
+        "description": "编辑项目",
+        "roles": ["ADMIN"],
+    },
+    "system:projects:delete": {
+        "module": "system_projects",
+        "action": "delete",
+        "description": "删除项目",
+        "roles": ["ADMIN"],
+    },
+    "system:projects:lock": {
+        "module": "system_projects",
+        "action": "update",
+        "description": "锁定/解锁项目",
+        "roles": ["ADMIN"],
+    },
+    "system:projects:members": {
+        "module": "system_projects",
+        "action": "update",
+        "description": "管理项目成员",
+        "roles": ["ADMIN"],
+    },
+    "system:projects:sites": {
+        "module": "system_projects",
+        "action": "update",
+        "description": "管理项目中心",
+        "roles": ["ADMIN"],
+    },
+    # 权限管理
+    "system:permissions:project_config": {
+        "module": "system_permissions",
+        "action": "update",
+        "description": "配置项目接口权限",
+        "roles": ["ADMIN"],
+    },
+    "system:permissions:templates": {
+        "module": "system_permissions",
+        "action": "update",
+        "description": "管理权限模板",
+        "roles": ["ADMIN"],
+    },
+    # 审计日志
+    "system:audit_logs:read": {
+        "module": "system_audit",
+        "action": "read",
+        "description": "查看审计日志",
+        "roles": ["ADMIN"],
+    },
+    "system:audit_logs:export": {
+        "module": "system_audit",
+        "action": "export",
+        "description": "导出审计日志",
+        "roles": ["ADMIN"],
+    },
+}
+
+# 系统级权限模块标签
+SYSTEM_MODULE_LABELS: dict[str, str] = {
+    "system_users": "账号管理",
+    "system_projects": "项目管理",
+    "system_permissions": "权限管理",
+    "system_audit": "审计日志",
+}

backend/app/models/study.py

@@ -39,5 +39,6 @@ class Study(Base):
     status: Mapped[str] = mapped_column(String(20), nullable=False, default="DRAFT")
     is_locked: Mapped[bool] = mapped_column(Boolean, nullable=False, default=False)
     visit_schedule: Mapped[list[dict]] = mapped_column(JSON, nullable=False, default=list)
+    active_roles: Mapped[list[str]] = mapped_column(JSON, nullable=False, default=list)
     created_by: Mapped[Optional[uuid.UUID]] = mapped_column(UUID(as_uuid=True), ForeignKey("users.id"), nullable=True)
     created_at: Mapped[datetime] = mapped_column(DateTime(timezone=True), nullable=False, server_default=func.now())

frontend/src/api/projectPermissions.ts

@@ -98,3 +98,28 @@ export const applyPermissionTemplate = (studyId: string, payload: ApplyTemplateR
     `/api/v1/studies/${studyId}/permission-templates/${payload.template_id}/apply`,
     payload,
   );
+
+// 系统级权限
+export interface SystemPermissionItem {
+  permission_key: string;
+  module: string;
+  module_label: string;
+  action: string;
+  description: string;
+  roles: string[];
+}
+
+export interface SystemPermissionsResponse {
+  permissions: SystemPermissionItem[];
+  module_labels: Record<string, string>;
+}
+
+export const fetchSystemPermissions = () =>
+  apiGet<SystemPermissionsResponse>(`/api/v1/system-permissions`);
+
+// 项目角色生效管理
+export const fetchActiveRoles = (studyId: string) =>
+  apiGet<{ active_roles: string[] }>(`/api/v1/studies/${studyId}/active-roles`);
+
+export const updateActiveRoles = (studyId: string, activeRoles: string[]) =>
+  apiPut<{ active_roles: string[] }>(`/api/v1/studies/${studyId}/active-roles`, { active_roles: activeRoles });

frontend/src/components/Layout.vue

@@ -33,6 +33,10 @@
             <el-icon><Document /></el-icon>
             <span>{{ TEXT.menu.auditLogs }}</span>
           </el-menu-item>
+          <el-menu-item v-if="isAdmin" index="/admin/permissions">
+            <el-icon><Key /></el-icon>
+            <span>{{ TEXT.menu.permissionManagement }}</span>
+          </el-menu-item>
         </el-menu-item-group>
 
         <el-menu-item-group v-if="study.currentStudy && hasAnyProjectModuleAccess" class="menu-group">
@@ -214,7 +218,7 @@ import { fetchSites } from "../api/sites";
 import { TEXT } from "../locales";
 import {
   Monitor, User, Suitcase, House, Calendar, Flag, ChatDotRound,
-  CircleCheck, Box, Coin, Notebook, Document, ArrowDown, SwitchButton, Files
+  CircleCheck, Box, Coin, Notebook, Document, ArrowDown, SwitchButton, Files, Key
 } from "@element-plus/icons-vue";
 import { ElMessage } from "element-plus";
 import { getProjectRoutePermission, hasProjectPermission, projectRouteLandingPaths } from "../utils/projectRoutePermissions";

frontend/src/components/PermissionTemplateSelector.vue

@@ -1,204 +1,125 @@
 <template>
   <div class="template-selector">
     <div class="selector-header">
-      <h3>快速配置角色权限</h3>
+      <h3>角色权限概览</h3>
-      <p class="selector-desc">选择预设模板，一键应用到项目角色权限</p>
+      <p class="selector-desc">展示当前项目各角色的权限配置状态</p>
     </div>
 
     <div class="template-grid">
-      <div
+      <el-tooltip
         v-for="template in templates"
         :key="template.id"
+        :content="template.description"
+        placement="top"
+        :disabled="!template.description"
+      >
+      <div
         class="template-card"
-        :class="{ selected: selectedId === template.id, system: template.is_system }"
+        :class="{ inactive: template.category && !isRoleActive(template.category) }"
-        @click="select(template)"
       >
         <div class="card-header">
           <span class="card-icon">{{ roleIcon(template.category) }}</span>
           <div class="card-title-wrap">
-            <span class="card-name">{{ template.name }}</span>
+            <span class="card-name">{{ template.category ? (ROLE_LABELS[template.category] || template.name) : template.name }}</span>
-            <el-tag v-if="template.is_system" size="small" type="info">系统预设</el-tag>
+            <el-tag v-if="!template.is_system" size="small" type="success">自定义</el-tag>
-            <el-tag v-else size="small" type="success">自定义</el-tag>
           </div>
+          <el-button
+            v-if="template.category"
+            size="small"
+            type="primary"
+            link
+            class="edit-role-btn"
+            @click.stop="emit('edit-role', template.category!)"
+          >编辑权限</el-button>
         </div>
-        <p class="card-desc">{{ template.description }}</p>
         <div class="card-stats">
-          <span class="stat">
+          <template v-if="props.currentPermissions && template.category && props.currentPermissions[template.category]">
-            <el-icon><Check /></el-icon>
+            <span class="stat">
-            {{ countEnabled(template) }} 项已启用
-          </span>
-          <span class="stat disabled">
-            <el-icon><Close /></el-icon>
-            {{ countDisabled(template) }} 项已禁用
-          </span>
-        </div>
-      </div>
-
-      <!-- 自定义模板入口 -->
-      <div class="template-card add-card" @click="showCreateDialog = true">
-        <el-icon class="add-icon"><Plus /></el-icon>
-        <span>保存当前配置为模板</span>
-      </div>
-    </div>
-
-    <!-- 预览面板 -->
-    <transition name="slide-up">
-      <div v-if="selected" class="preview-panel">
-        <div class="preview-header">
-          <div class="preview-title">
-            <span class="preview-icon">{{ roleIcon(selected.category) }}</span>
-            <strong>{{ selected.name }}</strong>
-            <span class="preview-desc">{{ selected.description }}</span>
-          </div>
-          <div class="preview-actions">
-            <el-button @click="selected = null">取消</el-button>
-            <el-button type="primary" :loading="applying" @click="applyTemplate">
               <el-icon><Check /></el-icon>
-              应用此模板
+              {{ countCurrentEnabled(template.category) }} 项已启用
-            </el-button>
+            </span>
-          </div>
+            <span class="stat disabled">
-        </div>
+              <el-icon><Close /></el-icon>
-
+              {{ countCurrentDisabled(template.category) }} 项已禁用
-        <div class="preview-body">
+            </span>
-          <div v-for="(rolePerms, role) in selected.permissions" :key="role" class="role-preview">
+          </template>
-            <div class="role-label">{{ role }}</div>
+          <template v-else>
-            <div class="perm-summary">
+            <span class="stat">
-              <el-tag type="success" size="small">启用 {{ countRoleEnabled(rolePerms) }}</el-tag>
+              <el-icon><Check /></el-icon>
-              <el-tag type="danger" size="small">禁用 {{ countRoleDisabled(rolePerms) }}</el-tag>
+              {{ countEnabled(template) }} 项已启用
-            </div>
+            </span>
-          </div>
+            <span class="stat disabled">
+              <el-icon><Close /></el-icon>
+              {{ countDisabled(template) }} 项已禁用
+            </span>
+          </template>
         </div>
       </div>
-    </transition>
+      </el-tooltip>
-
+    </div>
-    <!-- 创建自定义模板对话框 -->
-    <el-dialog v-model="showCreateDialog" title="保存为自定义模板" width="480px">
-      <el-form :model="createForm" label-width="80px">
-        <el-form-item label="模板名称" required>
-          <el-input v-model="createForm.name" placeholder="请输入模板名称" />
-        </el-form-item>
-        <el-form-item label="描述">
-          <el-input v-model="createForm.description" type="textarea" :rows="2" placeholder="可选描述" />
-        </el-form-item>
-      </el-form>
-      <template #footer>
-        <el-button @click="showCreateDialog = false">取消</el-button>
-        <el-button type="primary" :loading="creating" @click="createTemplate">保存</el-button>
-      </template>
-    </el-dialog>
   </div>
 </template>
 
 <script setup lang="ts">
-import { ref, computed, onMounted } from "vue";
+import { ref, onMounted } from "vue";
 import { ElMessage } from "element-plus";
-import { Check, Close, Plus } from "@element-plus/icons-vue";
+import { Check, Close } from "@element-plus/icons-vue";
 import {
   fetchPermissionTemplates,
-  createPermissionTemplate,
-  applyPermissionTemplate,
   type PermissionTemplate,
 } from "@/api/projectPermissions";
 
 const props = defineProps<{
   studyId: string;
   currentPermissions?: Record<string, Record<string, boolean>>;
+  activeRoles?: string[];
 }>();
 
 const emit = defineEmits<{
-  applied: [permissions: Record<string, Record<string, { allowed: boolean }>>];
+  "edit-role": [role: string];
 }>();
 
 const templates = ref<PermissionTemplate[]>([]);
-const selectedId = ref<string | null>(null);
+
-const selected = computed(() => templates.value.find((t) => t.id === selectedId.value) ?? null);
+const ROLE_LABELS: Record<string, string> = {
-const applying = ref(false);
+  PM: "项目负责人", CRA: "CRA", PV: "PV",
-const creating = ref(false);
+  MEDICAL_REVIEW: "医学审核", IMP: "药品管理员", QA: "QA",
-const showCreateDialog = ref(false);
+};
-const createForm = ref({ name: "", description: "" });
 
 const roleIcon = (category: string | null) => {
   const icons: Record<string, string> = {
-    PM: "👑",
+    PM: "👑", CRA: "📋", PV: "🔍",
-    CRA: "📋",
+    MEDICAL_REVIEW: "🏥", IMP: "📦", QA: "✅",
-    PV: "🔍",
-    MEDICAL_REVIEW: "🏥",
-    IMP: "📦",
-    QA: "✅",
   };
   return icons[category ?? ""] ?? "📄";
 };
 
+const isRoleActive = (role: string) => props.activeRoles?.includes(role) ?? false;
+
 const countEnabled = (t: PermissionTemplate) => {
   let n = 0;
-  for (const perms of Object.values(t.permissions) as Record<string, boolean>[]) {
+  for (const perms of Object.values(t.permissions) as Record<string, boolean>[])
     n += (Object.values(perms) as boolean[]).filter(Boolean).length;
-  }
   return n;
 };
 
 const countDisabled = (t: PermissionTemplate) => {
   let n = 0;
-  for (const perms of Object.values(t.permissions) as Record<string, boolean>[]) {
+  for (const perms of Object.values(t.permissions) as Record<string, boolean>[])
     n += (Object.values(perms) as boolean[]).filter((v) => !v).length;
-  }
   return n;
 };
 
-const countRoleEnabled = (perms: Record<string, boolean>) =>
+const countCurrentEnabled = (role: string) => {
-  Object.values(perms).filter(Boolean).length;
+  const perms = props.currentPermissions?.[role];
-
+  if (!perms) return 0;
-const countRoleDisabled = (perms: Record<string, boolean>) =>
+  return Object.values(perms).filter(Boolean).length;
-  Object.values(perms).filter((v) => !v).length;
-
-const select = (t: PermissionTemplate) => {
-  selectedId.value = selectedId.value === t.id ? null : t.id;
 };
 
-const applyTemplate = async () => {
+const countCurrentDisabled = (role: string) => {
-  if (!selected.value) return;
+  const perms = props.currentPermissions?.[role];
-  applying.value = true;
+  if (!perms) return 0;
-  try {
+  return Object.values(perms).filter((v) => !v).length;
-    const res = await applyPermissionTemplate(props.studyId, {
-      template_id: selected.value.id,
-      override: true,
-    });
-    ElMessage.success(`已应用模板「${selected.value.name}」`);
-    emit("applied", res.data.permissions);
-    selectedId.value = null;
-  } catch {
-    ElMessage.error("应用模板失败");
-  } finally {
-    applying.value = false;
-  }
-};
-
-const createTemplate = async () => {
-  if (!createForm.value.name.trim()) {
-    ElMessage.warning("请输入模板名称");
-    return;
-  }
-  if (!props.currentPermissions) {
-    ElMessage.warning("当前没有权限配置可保存");
-    return;
-  }
-  creating.value = true;
-  try {
-    await createPermissionTemplate({
-      name: createForm.value.name,
-      description: createForm.value.description || undefined,
-      template_type: "CUSTOM",
-      permissions: props.currentPermissions,
-    });
-    ElMessage.success("模板保存成功");
-    showCreateDialog.value = false;
-    createForm.value = { name: "", description: "" };
-    await loadTemplates();
-  } catch {
-    ElMessage.error("保存模板失败");
-  } finally {
-    creating.value = false;
-  }
 };
 
 const loadTemplates = async () => {
@@ -246,19 +167,24 @@ onMounted(loadTemplates);
   padding: 14px;
   border: 1.5px solid #e4e7ed;
   border-radius: 8px;
-  cursor: pointer;
   transition: all 0.2s;
   background: #fff;
 }
 
-.template-card:hover {
+.template-card.inactive {
-  border-color: #409eff;
+  border-style: dashed;
-  box-shadow: 0 2px 8px rgba(64, 158, 255, 0.15);
+  background: #fafafa;
+  opacity: 0.75;
 }
 
-.template-card.selected {
+.template-card:hover {
+  border-color: #c0c4cc;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
+}
+
+.template-card:not(.inactive):hover {
   border-color: #409eff;
-  background: #ecf5ff;
+  box-shadow: 0 2px 8px rgba(64, 158, 255, 0.15);
 }
 
 .card-header {
@@ -268,11 +194,6 @@ onMounted(loadTemplates);
   margin-bottom: 6px;
 }
 
-.card-icon {
-  font-size: 20px;
-  line-height: 1;
-}
-
 .card-title-wrap {
   display: flex;
   flex-direction: column;
@@ -285,11 +206,23 @@ onMounted(loadTemplates);
   color: #303133;
 }
 
-.card-desc {
+.template-card.inactive .card-name {
-  font-size: 12px;
   color: #909399;
-  margin: 0 0 8px;
+}
-  line-height: 1.4;
+
+.edit-role-btn {
+  margin-left: auto;
+  opacity: 0;
+  transition: opacity 0.15s;
+}
+
+.template-card:hover .edit-role-btn {
+  opacity: 1;
+}
+
+.card-icon {
+  font-size: 20px;
+  line-height: 1;
 }
 
 .card-stats {
@@ -299,6 +232,10 @@ onMounted(loadTemplates);
   color: #67c23a;
 }
 
+.template-card.inactive .card-stats {
+  color: #b0b0b0;
+}
+
 .card-stats .stat {
   display: flex;
   align-items: center;
@@ -309,92 +246,7 @@ onMounted(loadTemplates);
   color: #f56c6c;
 }
 
-.add-card {
+.template-card.inactive .card-stats .stat.disabled {
-  display: flex;
+  color: #c0c4cc;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  gap: 8px;
-  border-style: dashed;
-  color: #909399;
-  font-size: 13px;
-  min-height: 110px;
-}
-
-.add-card:hover {
-  color: #409eff;
-  border-color: #409eff;
-}
-
-.add-icon {
-  font-size: 24px;
-}
-
-.preview-panel {
-  border: 1.5px solid #409eff;
-  border-radius: 8px;
-  background: #ecf5ff;
-  padding: 14px 16px;
-}
-
-.preview-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 12px;
-}
-
-.preview-title {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  font-size: 14px;
-}
-
-.preview-icon {
-  font-size: 18px;
-}
-
-.preview-desc {
-  color: #909399;
-  font-size: 12px;
-}
-
-.preview-body {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 10px;
-}
-
-.role-preview {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  background: #fff;
-  border-radius: 6px;
-  padding: 6px 10px;
-}
-
-.role-label {
-  font-size: 13px;
-  font-weight: 600;
-  color: #303133;
-  min-width: 60px;
-}
-
-.perm-summary {
-  display: flex;
-  gap: 6px;
-}
-
-.slide-up-enter-active,
-.slide-up-leave-active {
-  transition: all 0.25s ease;
-}
-
-.slide-up-enter-from,
-.slide-up-leave-to {
-  opacity: 0;
-  transform: translateY(8px);
 }
 </style>

frontend/src/locales/zh-CN.ts

@@ -257,6 +257,7 @@ export const TEXT = {
     accountManagement: "账号管理",
     projectManagement: "项目管理",
     auditLogs: "审计日志",
+    permissionManagement: "权限管理",
     currentProject: "当前项目",
     projectOverview: "项目总览",
     projectMilestones: "项目里程碑",

frontend/src/router/index.ts

@@ -16,10 +16,9 @@ import AuditLogs from "../views/admin/AuditLogs.vue";
 import AdminUsers from "../views/admin/Users.vue";
 import AdminUserApproval from "../views/admin/AdminUserApproval.vue";
 import AdminProjects from "../views/admin/Projects.vue";
-import ProjectMembers from "../views/admin/ProjectMembers.vue";
 import AdminSites from "../views/admin/Sites.vue";
+import PermissionManagement from "../views/admin/PermissionManagement.vue";
 import ProjectDetail from "../views/admin/ProjectDetail.vue";
-import ApiPermissions from "../views/admin/ApiPermissions.vue";
 import ProfileSettings from "../views/ProfileSettings.vue";
 import ProjectOverview from "../views/ia/ProjectOverview.vue";
 import ProjectMilestones from "../views/ia/ProjectMilestones.vue";
@@ -437,15 +436,11 @@ const routes: RouteRecordRaw[] = [
       },
       {
         path: "projects/:projectId/members",
-        name: "AdminProjectMembers",
+        redirect: (to) => ({ path: "/admin/permissions", query: { projectId: to.params.projectId as string, sub: "members" } }),
-        component: ProjectMembers,
-        meta: { title: TEXT.modules.adminProjectMembers.memberLabel, adminProjectPermission: { module: "project_members", action: "read" } },
       },
       {
         path: "projects/:id/api-permissions",
-        name: "AdminApiPermissions",
+        redirect: (to) => ({ path: "/admin/permissions", query: { projectId: to.params.id as string } }),
-        component: ApiPermissions,
-        meta: { title: "接口级权限管理", adminProjectPermission: { module: "project_members", action: "write" } },
       },
       {
         path: "projects/:projectId/sites",
@@ -459,6 +454,12 @@ const routes: RouteRecordRaw[] = [
         component: AuditLogs,
         meta: { title: TEXT.menu.auditLogs, adminProjectPermission: { module: "audit_export", action: "read" } },
       },
+      {
+        path: "permissions",
+        name: "AdminPermissions",
+        component: PermissionManagement,
+        meta: { title: TEXT.menu.permissionManagement, requiresAdmin: true },
+      },
     ],
   },
   {

frontend/src/views/admin/Projects.vue

@@ -141,7 +141,7 @@ const canProject = (row: Study, module: string, action: "read" | "write") => {
 };
 
 const goMembers = (row: Study) => {
-  router.push(`/admin/projects/${row.id}/members`);
+  router.push(`/admin/permissions?projectId=${row.id}&sub=members`);
 };
 
 const goSites = (row: Study) => {
@@ -149,7 +149,7 @@ const goSites = (row: Study) => {
 };
 
 const goPermissions = (row: Study) => {
-  router.push(`/admin/projects/${row.id}/api-permissions`);
+  router.push(`/admin/permissions?projectId=${row.id}`);
 };
 
 const goAuditLogs = async (row: Study) => {