{"id":50322884,"url":"https://github.com/bestxby/campus-buddy","last_synced_at":"2026-05-31T09:02:48.348Z","repository":{"id":360250730,"uuid":"1248781965","full_name":"bestxby/Campus-Buddy","owner":"bestxby","description":"Campus Buddy 校园社交网络与智能推荐系统 - 基于图论的活动匹配与搭子推荐平台","archived":false,"fork":false,"pushed_at":"2026-05-25T16:24:39.000Z","size":822,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2026-05-25T17:32:35.806Z","etag":null,"topics":["bfs","campus","d3js","data-structures","github-pages","graph-algorithms","jaccard-similarity","recommendation-system","social-network","typescript","vite","vue3"],"latest_commit_sha":null,"homepage":"https://bestxby.github.io/Campus-Buddy/","language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/bestxby.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2026-05-25T03:38:02.000Z","updated_at":"2026-05-25T16:24:43.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/bestxby/Campus-Buddy","commit_stats":null,"previous_names":["bestxby/campus-buddy"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/bestxby/Campus-Buddy","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bestxby%2FCampus-Buddy","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bestxby%2FCampus-Buddy/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bestxby%2FCampus-Buddy/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bestxby%2FCampus-Buddy/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/bestxby","download_url":"https://codeload.github.com/bestxby/Campus-Buddy/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bestxby%2FCampus-Buddy/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":33635961,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-05-29T02:00:06.066Z","response_time":107,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["bfs","campus","d3js","data-structures","github-pages","graph-algorithms","jaccard-similarity","recommendation-system","social-network","typescript","vite","vue3"],"created_at":"2026-05-29T04:00:39.330Z","updated_at":"2026-05-29T04:01:24.385Z","avatar_url":"https://github.com/bestxby.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 🧭 Campus Buddy: 校园社交拓扑网络与智能匹配系统\n\n\u003e 🌐 **在线演示**: [https://bestxby.github.io/Campus-Buddy/](https://bestxby.github.io/Campus-Buddy/)\n\u003e \n\u003e 🧪 **测试覆盖率**: 26/26 前端 Vitest 通过, 21/21 后端 Pytest 通过, Vue-tsc 编译 0 报错\n\n`Campus Buddy` 是一个基于图数据结构（Graph Data Structure）的高性能校园社交与活动匹配推荐系统。本项目支持 **1,500+ 学生、30 种兴趣标签、100 个校园活动**的大规模数据关联，提供命令行 MVP 工具与基于 **Vue 3 + D3.js + TypeScript** 开发的极客霓虹感（Sleek Slate \u0026 Neon）现代化可视化 Web 交互面板。\n\n项目完全适配 **GitHub Pages 静态托管**，前端采用**模块化面向对象领域服务架构**（OOP Domain Services + Canvas Painter Separation + Facade Composables），提供 60FPS 丝滑的 ego-network 拓扑图与邻接矩阵性能体验。\n\n---\n\n## 📖 设计思路与算法架构\n\n本项目的核心是一个**异构无向图（Heterogeneous Undirected Graph）**。通过将不同类型的实体抽象为节点，并用关联边连接，编织成一张校园人脉关系网络：\n\n```mermaid\ngraph TD\n    subgraph 节点类型\n        S[学生节点 student:姓名]\n        I[兴趣节点 interest:名称]\n        A[活动节点 activity:名称]\n    end\n\n    S -- 兴趣归属 (1跳) --\u003e I\n    A -- 兴趣分类 (1跳) --\u003e I\n    S -- 活动报名 (1跳) --\u003e A\n```\n\n### 1. 核心图算法设计\n\n* **双跳路径穿透推荐（2-Hop BFS Recommendations）**：\n  * **活动匹配**：从给定学生节点出发，搜索其关联的所有兴趣节点（1跳），再由兴趣节点搜索关联的所有校园活动（2跳）。路径为 `Student -\u003e Interest -\u003e Activity`，返回去重并按报名热度排序的推荐活动。\n  * **搭子匹配**：同样通过两步搜索，寻找拥有共同兴趣的其他同学：`Student -\u003e Interest -\u003e Other Student`，排除学生自身。\n* **Jaccard 相似度搭子排序（Jaccard Similarity Ranking）**：\n  * 对搭子匹配结果按 Jaccard 系数降序排列，量化两人兴趣圈的重合程度：\n    $$J(A, B) = \\frac{|Interests_A \\cap Interests_B|}{|Interests_A \\cup Interests_B|}$$\n  * **社交特权模式 (Social Boost)**：开启社交达人/社交模式的学生会获得 $1.3\\times$ 的相似度加成，上限为数学极限值 `1.0`。该算法确保了即使被 boost 后，原本满分（1.0）的匹配也不会降级，保证了排名的逻辑正确性。\n* **BFS 隐私保护最短路径查找（Shortest Path via BFS \u0026 Privacy Filter）**：\n  * 实现了任意两个学生节点之间的 BFS 最短路径搜索（使用 **parent-map 回溯法**，空间复杂度 $O(V)$），展示跨兴趣圈人脉路径。\n  * **隐私过滤**：在寻路过程中，系统在 **TypeScript** 和 **Python** 两端同步实现了严格的**隐私过滤算法**。如果路径中的中间节点包含开启了隐私模式（`isPrivate`）的学生，则会自动绕道或跳过该路径；如果终点学生为隐私模式，则直接拒绝返回路径，从而在算法底层切实保护了用户隐私安全。\n* **社区划分与指标分析（Connected Components \u0026 Network Metrics）**：\n  * **连通社群划分**：使用 BFS 遍历全图，识别出相互独立的极大连通子图（社群圈子），并在前端以美观的环状比例图和信息卡片展示。\n  * **网络指标分析**：实时计算网络密度（Density）、聚类系数（Clustering Coefficient）以及平均路径长度（Average Path Length），帮助管理员把控网络健康度。\n  * **度中心性与介数中心性**：计算节点的关联度数（Degree Centrality）和最短路径通过频次（Betweenness Centrality），精确诊断出校园社交达人（Influencers）和跨界中介纽带（Bridges）。\n\n---\n\n## 🏗️ 软件架构设计 (OOP Domain Services)\n\n为应对前端业务规模的扩大，系统进行了一次彻底的**架构解耦重构**，从原先的平铺逻辑升级为了面向对象领域服务架构，确保所有组件代码在 **300 行以内**：\n\n```mermaid\ngraph TD\n    %% Python Backend Data Processing\n    subgraph Python Backend (Data Layer)\n        GMD[generate_mock_data.py] --\u003e|1. 生成 CSV| CSV[data/*.csv]\n        CSV --\u003e|2. 加载与分析| CBP[campus_buddy.py]\n        CSV --\u003e|3. 导出图结构| EGJ[export_graph_to_json.py]\n        EGJ --\u003e|4. 存储静态 JSON 库| GJSON[frontend/public/graph_data.json]\n        \n        CBP --\u003e|交互终端 MVP| IAPP[interactive_app.py]\n        CBP --\u003e|经典演示 MVP| DR[demo_runner.py]\n        CBP --\u003e|单元测试| TCB[test_campus_buddy.py]\n    end\n\n    %% Frontend Layered Architecture\n    subgraph Frontend Client (Vue 3 Client App)\n        GJSON --\u003e|1. Fetch 加载| GStore[stores/graph.ts]\n        \n        subgraph Stores (Pinia 状态存储层)\n            GStore\n            AStore[stores/auth.ts]\n            RStore[stores/recommendation.ts]\n            LStore[stores/log.ts]\n        end\n        \n        subgraph Composables (Facade 外观适配层)\n            UC[useGraph.ts]\n            UA[useAuth.ts]\n            UR[useRecommendations.ts]\n            UL[useLogs.ts]\n        end\n        \n        AStore \u003c--\u003e UA\n        GStore \u003c--\u003e UC\n        RStore \u003c--\u003e UR\n        LStore \u003c--\u003e UL\n        \n        subgraph Domain Services (领域服务 \u0026 Painter 渲染器)\n            FGR[ForceGraphRenderer.ts] --\u003e|物理仿真 \u0026 拖动交互| FGCP[ForceGraphCanvasPainter.ts]\n            AMR[AdjacencyMatrixRenderer.ts] --\u003e|手势处理| AMP[AdjacencyMatrixPainter.ts]\n            GAS[GraphAnalyticsService.ts] --\u003e|后台诊断计算| GStore\n            LPE[LoadingParticleEngine.ts] --\u003e|离子流动| LoginOverlay\n        end\n        \n        subgraph Pure Utilities (无状态图论算法纯函数)\n            GA[graph-algorithms.ts] --\u003e|Jaccard \u0026 BFS 寻路| UR\n            GM[graph-metrics*.ts] --\u003e|中心性 \u0026 密度系数| GAS\n        end\n        \n        subgraph UI Components (Vue 组件层)\n            LoginOverlay[components/LoginOverlay.vue]\n            AppSidebar[components/AppSidebar.vue]\n            GraphModal[components/GraphModal.vue]\n            AdminDashboard[components/AdminDashboard.vue]\n        end\n        \n        UC --\u003e UI Components\n        UA --\u003e UI Components\n        UR --\u003e UI Components\n        UL --\u003e UI Components\n        \n        UI Components --\u003e FGR\n        UI Components --\u003e AMR\n    end\n```\n\n1. **Painter 像素渲染器分离**：\n   - 将 Canvas 底层的绘图细节提取为独立的 `ForceGraphCanvasPainter` 和 `AdjacencyMatrixPainter`，使 `ForceGraphRenderer` 和 `AdjacencyMatrixRenderer` 只专注于事件监听、D3 Simulation 状态机管理与物理引擎微调。\n2. **纯算法函数解耦**：\n   - 将所有图论分析算法从 Service 中剥离为 `graph-metrics.ts` 中的 Stateless Pure Functions，方便在无 DOM 依赖下进行单元测试。\n3. **样式表分离 (CSS Isolation)**：\n   - 将 Vue 单文件组件（SFC）中庞大的样式块抽离成同级的 `.css` 文件，并利用 `\u003cstyle scoped src=\"./App.css\"\u003e\u003c/style\u003e` 引入，在降低单个文件行数的同时，保障了样式的局部隔离性。\n\n---\n\n## ⚡ 性能优化与技术亮点\n\n* **无刷新 SPA 路由跳转 (Zero-Flicker SPA Router Migration)**：全面重构页面跳转机制，使用 Vue Router `router.push` 和 `\u003crouter-link\u003e` 替代原生 `\u003ca\u003e` 标签与 `window.location`，彻底解决页面切换时的“白屏闪烁”和“页面硬刷新”问题，维持 Vue 实例和全局状态的持续挂载。\n* **响应式邻接矩阵与双向触控滚动 (Responsive Matrix \u0026 Bidirectional Touch Scrolling)**：针对移动端小屏幕展示密集矩阵（30 兴趣 / 100 活动）时的挤压遮挡问题，设计并实现了基于 Canvas 的视口平移 Interaction Handler。设置单元格最小宽度 `28px`，引入 X/Y 双向触控滑动（Touch Pan Tracking）与 Shift+Wheel 横向滚动，并在底部动态渲染微型滚动条，确保在移动端也能流畅、清晰地交互和阅读海量拓扑关联。\n* **局部自我聚焦子图 (Ego Network)**：避免直接在前端绘制包含 1,500+ 节点和千条边的全局大图，当选择特定学生时，仅抓取其 2跳 范围内的聚焦子图（节点数 15~35 个），实现 60FPS 丝滑的拓扑图拖拽和缩放体验。\n* **LOD（Level of Detail）视口文字剔除**：在 Canvas 渲染层，根据视口缩放比例自动隐藏过小的文字标签，减少每帧文字绘制的重绘开销。\n* **Session 动态随机种子**：在 [stores/graph.ts](file:///e:/学习/大二下课程/数据结构与算法/数据结构大作业/Campus-Buddy/frontend/src/stores/graph.ts) 和 [utils/graph-metrics.ts](file:///e:/学习/大二下课程/数据结构与算法/数据结构大作业/Campus-Buddy/frontend/src/utils/graph-metrics.ts) 中设计了页面级的随机种子：每次页面加载或管理员点击“重置数据”时刷新，但在同一个页面周期内保持稳定。既保证了刷新的新颖性，又杜绝了因局部状态更新导致 UI 拓扑图或指标发生震荡跳变。\n* **健壮的节点名解析**：在 [ForceGraphDataBuilder.ts](file:///e:/学习/大二下课程/数据结构与算法/数据结构大作业/Campus-Buddy/frontend/src/services/ForceGraphDataBuilder.ts) 中将提取 subName 的切分方法升级为 substring 机制，即使节点名称本身包含冒号（如 `student:张三:计算机`），也能够完整保留而不被错误截断。\n* **全能画像 tie-breaker**：在 [auth-helpers.ts](file:///e:/学习/大二下课程/数据结构与算法/数据结构大作业/Campus-Buddy/frontend/src/utils/auth-helpers.ts) 中优化了画像判定算法，当并列最高兴趣域的数量大于 1 时，返回全新的 **“斜杠青年”**（Slash Youth）角色，彻底消除了原先判定时总是偏向 `tech`（科技极客）维度的程序偏置。\n* **无冲突递增 Log ID**：操作日志 ID 生成摒弃了 `Math.random`，改用内部 `idCounter` 递增方式，确保了日志 ID 的唯一性与确定性。\n\n---\n\n## 📁 项目文件结构\n\n```text\nCampus-Buddy/\n├── data/                             # 模拟生成的 CSV 数据集（学生、兴趣、活动注册）\n│   ├── student_interests.csv\n│   ├── student_registrations.csv\n│   └── activity_interests.csv\n├── design-system/                    # 项目设计系统与规范文档\n│   └── campus-buddy/\n│       └── MASTER.md\n├── campus_buddy.py                   # Python 核心图算法（BFS寻路、Jaccard相似度、最短路径、连通分量）\n├── demo_runner.py                    # Python 控制台版经典推荐算法演示入口\n├── interactive_app.py                # Python 命令行交互式数据检索与推荐系统\n├── generate_mock_data.py             # 随机 mock 数据生成脚本（生成 1500+ 学生，30 种兴趣，100 个活动）\n├── export_graph_to_json.py           # 关系图数据导出器（将 CSV 数据打包并导出为前端静态 JSON 数据库）\n├── test_campus_buddy.py              # Pytest 单元测试（验证 BFS 最短路径、隐私过滤、连通分量等）\n├── test_python_scripts.py            # Pytest 单元测试（验证辅助脚本）\n├── verify_project.py                 # 项目完整性校验运行器\n├── system_verification_report.md     # 自动生成的系统校验报告\n├── requirements.txt                  # Python 依赖库\n├── .gitignore                        # Git 忽略配置\n└── frontend/                         # Vue 3 + TypeScript Sleek Slate \u0026 Neon 霓虹感前端\n    ├── package.json                  # 前端依赖与 npm scripts\n    ├── tsconfig.json                 # TypeScript 编译器配置\n    ├── vite.config.ts                # Vite 编译与开发服务器配置\n    ├── index.html                    # 单页应用入口 HTML\n    ├── public/\n    │   └── graph_data.json           # 供前端运行时加载的静态图数据库\n    └── src/\n        ├── main.ts                   # 前端应用入口文件\n        ├── env.d.ts                  # Vue 单文件组件声明\n        ├── App.vue                   # 主页面布局编排组件\n        ├── App.css                   # 主页面局部的布局样式表\n        ├── style.css                 # 全局 Slate \u0026 Neon 设计系统样式与变量\n        ├── types/\n        │   └── index.ts              # 统一的 TypeScript 类型与接口定义\n        ├── constants/\n        │   └── interests.ts          # 静态兴趣分类常量表\n        ├── stores/                   # Pinia 状态管理层\n        │   ├── auth.ts               # 个人登录、画像选择与隐私模式状态\n        │   ├── graph.ts              # 图数据结构、增量节点添加、随机种子状态\n        │   ├── log.ts                # 递增的系统操作日志存储\n        │   └── recommendation.ts     # Jaccard 相似度匹配与寻路推荐结果缓存\n        ├── composables/              # Facade 外观适配层（隔离 Vue 响应式 ref 与底层 Service）\n        │   ├── useAuth.ts\n        │   ├── useGraph.ts\n        │   ├── useGraphInsights.ts\n        │   ├── useLogs.ts\n        │   └── useRecommendations.ts\n        ├── services/                 # OOP 领域服务与 Canvas 像素渲染器\n        │   ├── ForceGraphRenderer.ts        # D3.js 仿真物理引擎状态机管理器\n        │   ├── ForceGraphCanvasPainter.ts   # D3 拓扑图 Canvas 像素绘制器\n        │   ├── ForceGraphPhysics.ts         # D3 拓扑物理布局参数配置\n        │   ├── ForceGraphTooltipHelper.ts    # 悬浮节点 Tooltip 细节渲染器\n        │   ├── AdjacencyMatrixRenderer.ts   # 邻接矩阵视口平移与触控手势管理器\n        │   ├── AdjacencyMatrixPainter.ts    # 邻接矩阵 Canvas 像素绘制器\n        │   ├── MatrixLayoutCalculator.ts    # 邻接矩阵坐标网格布局计算器\n        │   ├── MatrixInteractionHandler.ts  # 邻接矩阵双向触控滚动与拖动处理器\n        │   ├── GraphAnalyticsService.ts     # 网页端大屏数据统计与指标分析服务\n        │   ├── ForceGraphDataBuilder.ts     # Ego Network 局部聚焦子图过滤生成器\n        │   └── LoadingParticleEngine.ts     # 登录等待界面的霓虹离子特效引擎\n        ├── utils/                    # Stateless Pure Functions (纯图论算法与辅助工具)\n        │   ├── auth-helpers.ts              # 管理员登录及全能画像“斜杠青年”判定逻辑\n        │   ├── graph-algorithms.ts          # 核心 BFS 最短路径与 Jaccard 相似度推荐算法\n        │   ├── graph-metrics.ts             # 拓扑密度、聚类系数、平均路径算法\n        │   ├── graph-metrics-structure.ts   # 极大连通子群算法\n        │   ├── graph-metrics-centrality.ts  # 度中心性与介数中心性算法\n        │   └── seeded-shuffle.ts            # 基于种子的伪随机打乱工具（确保 UI 刷新的一致性）\n        └── components/               # Vue UI 纯渲染组件层\n            ├── LoginOverlay.vue             # 登录遮罩层容器\n            ├── AppSidebar.vue               # 侧边栏布局\n            ├── RecommendedActivities.vue    # 活动匹配卡片列表\n            ├── BuddyList.vue                # Jaccard 推荐搭子列表\n            ├── GraphModal.vue               # 全屏拓扑网络模态弹窗\n            ├── AdminDashboard.vue           # 管理员诊断后台大面板\n            ├── auth/                        # 鉴权组件\n            │   ├── StudentLoginForm.vue     # 学生登录表单（兴趣多选）\n            │   ├── AdminLoginForm.vue       # 管理员密码表单\n            │   └── LoginLoadingScreen.vue   # 炫酷的 3 秒多阶段霓虹加载动画\n            ├── buddy/                       # 社交匹配组件\n            │   └── PathFinder.vue           # 六度人脉 BFS 寻路高亮面板\n            ├── admin/                       # 管理员看板的原子诊断卡片\n            │   ├── NetworkMetricsCard.vue   # 网络指标卡片（密度、聚类）\n            │   ├── ThemeCommunitiesCard.vue # 连通圈分类与一键桥接方案\n            │   ├── DegreeCentralityCard.vue # 度中心性（社交达人）列表\n            │   ├── BetweennessCentralityCard.vue # 介数中心性（社交桥梁）列表\n            │   ├── IsolationCard.vue        # 孤立学生诊断卡片\n            │   ├── SystemLogsCard.vue       # 系统操作日志卡片\n            │   ├── PopularActivitiesCard.vue# 热门活动图表\n            │   ├── PopularInterestsCard.vue # 热门兴趣图表\n            │   ├── ActivitySaturationCard.vue# 活动饱和度热力图\n            │   ├── MatrixDiagnosticsCard.vue # 邻接矩阵大小诊断\n            │   ├── CreateActivityModal.vue  # 新建活动弹窗\n            │   ├── CreateInterestModal.vue  # 新建兴趣弹窗\n            │   ├── ActivityPromoPanel.vue   # 定向活动邀请推送面板\n            │   └── BridgePlanPanel.vue      # 人脉桥接详细执行方案\n            └── sidebar/                     # 侧边栏子模块\n                ├── SidebarProfile.vue       # 学生个人信息卡片\n                ├── SidebarInterests.vue     # 个人兴趣标签编辑器\n                ├── SidebarStats.vue         # 个人中心性指标分析\n                ├── SidebarTimeline.vue      # 已报名活动日程时间线\n                ├── SidebarIcebreaker.vue    # 圈子破冰搭子提示\n                └── SidebarAdminControl.vue  # 管理员一键切回入口\n```\n\n---\n\n## 🛠️ 使用手册 \u0026 运行指南\n\n### 前置条件\n确保您的系统安装了以下环境：\n* **Python 3.8+** (推荐安装 `pytest` 进行测试)\n* **Node.js 18+** 与 **npm** (用于运行网页端)\n\n---\n\n### 第一步：生成大规模图数据\n在项目根目录下打开终端，运行脚本生成 1,500+ 学生规模的模拟数据集，并导出为 JSON：\n\n```bash\n# 1. 生成模拟 CSV 数据\npython generate_mock_data.py\n\n# 2. 将 CSV 数据打包并导出为前端可加载的静态 JSON 数据库\npython export_graph_to_json.py\n```\n\n---\n\n### 第二步：运行 Python 端测试\n如果您想在控制台验证 Python 算法的正确性：\n\n```bash\n# 1. 运行经典的图遍历路径输出演示\npython demo_runner.py\n\n# 2. 启动命令行下的交互式 Campus Buddy 查询系统\npython interactive_app.py\n\n# 3. 运行自动化单元测试（验证 BFS 逻辑、隐私过滤、连通分量等）\npytest test_campus_buddy.py\n```\n\n---\n\n### 第三步：运行并构建 Vue 3 网页端\n进入前端目录，安装依赖并启动本地服务器：\n\n```bash\n# 进入前端文件夹\ncd frontend\n\n# 安装依赖\nnpm install\n\n# 启动本地开发服务\nnpm run dev\n\n# 运行前端单元测试 (Vitest)\nnpm run test run\n\n# 构建生产包并部署到 GitHub Pages\nnpm run deploy\n```\n\n---\n\n## 🖥️ 网页端交互与功能指南\n\n1. **沉浸式登录过渡动画**\n   * 学生填写姓名、选择头像和兴趣标签后，点击「生成画像并登入」。\n   * 系统播放 **3 秒的三段式加载动画**：头像弹出 → 兴趣标签飞入 → 图谱连接线向外生长，最终以极光扫过全屏的效果进入主界面。\n\n2. **分类与按需展示推荐 (Interest Filter)**\n   * 系统顶端会显示您个人的兴趣标签导航栏（例如：`🌟 全部推荐`、`机器学习`、`羽毛球`）。\n   * 点击不同的标签，下方的匹配推荐会即时响应过滤。\n   * 每个兴趣模块默认只展示 **3 个最佳匹配活动**。点击展开可查看全部，点击「一键报名」可即时参与并更新主页卡片。\n\n3. **Jaccard 搭子匹配排序 (Buddy Similarity)**\n   * 搭子推荐面板按 Jaccard 相似度降序排列，展示每位同学的共享兴趣数量和匹配度百分比。\n\n4. **管理员大数据诊断看板 (Admin Dashboard)**\n   * **连通圈诊断**：显示校园社交独立小圈子数量，诊断孤立同学，支持一键发送“人脉桥接”方案。\n   * **定向活动推广**：显示冷门活动并可指定特定兴趣圈的学生发送定向报名邀请。\n   * **破冰活动推荐**：分析各活动能连接不同社交圈子的“破冰潜力”，管理员可一键将其在首页置顶推荐。\n\n5. **D3.js 全屏力导向拓扑网络与人脉路径高亮**\n   * 支持关系网的无限缩放与平移，拖拽任意节点可看清与其他关联边的拉力。\n   * 输入两个学生姓名即可执行 BFS 寻路算法，在力导图上高亮显示跨越兴趣圈的人脉路径，形象展示“六度分隔”理论。\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbestxby%2Fcampus-buddy","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbestxby%2Fcampus-buddy","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbestxby%2Fcampus-buddy/lists"}