完全移除模块级权限系统，迁移至接口级权限

后端： - 删除 StudyRolePermission 模型和 project_permissions API 文件 - 重写 project_permissions.py core，移除所有模块级权限函数 - 重写 permission_cache.py，移除模块级权限缓存逻辑 - 新增权限模板功能（PermissionTemplate 模型、API、服务层） - 新增 permission_templates 数据库迁移 - 迁移 8 个模块（attachments、audit_logs、dashboard、faqs、 faq_categories、fees_attachments、knowledge_notes、 material_equipments、overview、subject_histories、subject_pds）至接口级权限检查 - 删除所有模块级权限相关测试文件，新增权限模板测试前端： - 删除 ProjectPermissions.vue 和 ProjectPermissionsModule.vue - 重写 projectRoutePermissions.ts，改为基于接口级权限格式 - 更新 store/study.ts、router/index.ts、AuditLogs.vue、Projects.vue 中的权限 API 调用，从 fetchProjectRolePermissions 改为 fetchApiEndpointPermissions - 清理 types/api.ts 中的旧模块级权限类型定义 - 新增 PermissionTemplateSelector.vue 组件 - 更新权限管理页面，移除模块级权限 tab Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-15 09:07:43 +08:00
parent 3b1bdc2070
commit 20ce6bccef
55 changed files with 1971 additions and 3030 deletions
@@ -0,0 +1,400 @@
+<template>
+  <div class="template-selector">
+    <div class="selector-header">
+      <h3>快速配置角色权限</h3>
+      <p class="selector-desc">选择预设模板，一键应用到项目角色权限</p>
+    </div>
+
+    <div class="template-grid">
+      <div
+        v-for="template in templates"
+        :key="template.id"
+        class="template-card"
+        :class="{ selected: selectedId === template.id, system: template.is_system }"
+        @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>
+            <el-tag v-if="template.is_system" size="small" type="info">系统预设</el-tag>
+            <el-tag v-else size="small" type="success">自定义</el-tag>
+          </div>
+        </div>
+        <p class="card-desc">{{ template.description }}</p>
+        <div class="card-stats">
+          <span class="stat">
+            <el-icon><Check /></el-icon>
+            {{ 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>
+              应用此模板
+            </el-button>
+          </div>
+        </div>
+
+        <div class="preview-body">
+          <div v-for="(rolePerms, role) in selected.permissions" :key="role" class="role-preview">
+            <div class="role-label">{{ role }}</div>
+            <div class="perm-summary">
+              <el-tag type="success" size="small">启用 {{ countRoleEnabled(rolePerms) }}</el-tag>
+              <el-tag type="danger" size="small">禁用 {{ countRoleDisabled(rolePerms) }}</el-tag>
+            </div>
+          </div>
+        </div>
+      </div>
+    </transition>
+
+    <!-- 创建自定义模板对话框 -->
+    <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 { ElMessage } from "element-plus";
+import { Check, Close, Plus } 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>>;
+}>();
+
+const emit = defineEmits<{
+  applied: [permissions: Record<string, Record<string, { allowed: boolean }>>];
+}>();
+
+const templates = ref<PermissionTemplate[]>([]);
+const selectedId = ref<string | null>(null);
+const selected = computed(() => templates.value.find((t) => t.id === selectedId.value) ?? null);
+const applying = ref(false);
+const creating = ref(false);
+const showCreateDialog = ref(false);
+const createForm = ref({ name: "", description: "" });
+
+const roleIcon = (category: string | null) => {
+  const icons: Record<string, string> = {
+    PM: "👑",
+    CRA: "📋",
+    PV: "🔍",
+    MEDICAL_REVIEW: "🏥",
+    IMP: "📦",
+    QA: "✅",
+  };
+  return icons[category ?? ""] ?? "📄";
+};
+
+const countEnabled = (t: PermissionTemplate) => {
+  let n = 0;
+  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>[]) {
+    n += (Object.values(perms) as boolean[]).filter((v) => !v).length;
+  }
+  return n;
+};
+
+const countRoleEnabled = (perms: Record<string, boolean>) =>
+  Object.values(perms).filter(Boolean).length;
+
+const countRoleDisabled = (perms: Record<string, boolean>) =>
+  Object.values(perms).filter((v) => !v).length;
+
+const select = (t: PermissionTemplate) => {
+  selectedId.value = selectedId.value === t.id ? null : t.id;
+};
+
+const applyTemplate = async () => {
+  if (!selected.value) return;
+  applying.value = true;
+  try {
+    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 () => {
+  try {
+    const res = await fetchPermissionTemplates();
+    templates.value = res.data;
+  } catch {
+    ElMessage.error("加载模板失败");
+  }
+};
+
+onMounted(loadTemplates);
+</script>
+
+<style scoped>
+.template-selector {
+  padding: 16px 0;
+}
+
+.selector-header {
+  margin-bottom: 16px;
+}
+
+.selector-header h3 {
+  margin: 0 0 4px;
+  font-size: 15px;
+  font-weight: 600;
+  color: #1a1a1a;
+}
+
+.selector-desc {
+  margin: 0;
+  font-size: 13px;
+  color: #888;
+}
+
+.template-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
+  gap: 12px;
+  margin-bottom: 16px;
+}
+
+.template-card {
+  padding: 14px;
+  border: 1.5px solid #e4e7ed;
+  border-radius: 8px;
+  cursor: pointer;
+  transition: all 0.2s;
+  background: #fff;
+}
+
+.template-card:hover {
+  border-color: #409eff;
+  box-shadow: 0 2px 8px rgba(64, 158, 255, 0.15);
+}
+
+.template-card.selected {
+  border-color: #409eff;
+  background: #ecf5ff;
+}
+
+.card-header {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin-bottom: 6px;
+}
+
+.card-icon {
+  font-size: 20px;
+  line-height: 1;
+}
+
+.card-title-wrap {
+  display: flex;
+  flex-direction: column;
+  gap: 3px;
+}
+
+.card-name {
+  font-size: 14px;
+  font-weight: 600;
+  color: #303133;
+}
+
+.card-desc {
+  font-size: 12px;
+  color: #909399;
+  margin: 0 0 8px;
+  line-height: 1.4;
+}
+
+.card-stats {
+  display: flex;
+  gap: 10px;
+  font-size: 12px;
+  color: #67c23a;
+}
+
+.card-stats .stat {
+  display: flex;
+  align-items: center;
+  gap: 3px;
+}
+
+.card-stats .stat.disabled {
+  color: #f56c6c;
+}
+
+.add-card {
+  display: flex;
+  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>