YYC³ Cloud Intelli-Matrix:智能监控与运维平台功能矩阵与架构
YYC-Cube/YYC3-Cloud-Intelli-Matrix
YYC-Cube 的 YYC³ Cloud Intelli-Matrix 是一个智能监控与运维平台,提供数据监控、巡查管理、操作中心、AI 辅助、多数据库支持与离线同步等功能,覆盖 Web、Desktop、PWA、Mobile 四端。
📊 功能矩阵 | Feature Matrix
| 功能模块 | 描述 | Web | Desktop | PWA | Mobile |
|---|---|---|---|---|---|
| 📊 数据监控 | 实时节点状态、QPS、延迟监控 | ✅ | ✅ | ✅ | ✅ |
| 🔍 巡查管理 | 自动化巡查计划与报告生成 | ✅ | ✅ | ✅ | ✅ |
| ⚙️ 操作中心 | 快速操作、模板管理、日志流 | ✅ | ✅ | ✅ | ✅ |
| 🤖 AI 辅助 | 智能决策、模式识别、NLP | ✅ | ✅ | ✅ | ✅ |
| 🗄️ 数据库 | PostgreSQL/MySQL/MongoDB | ✅ | ✅ | ✅ | ✅ |
| 🔄 离线同步 | Service Worker + IndexedDB | ✅ | ✅ | ✅ | ✅ |
| 🖥️ 系统桥接 | Electron IPC 通信 | ❌ | ✅ | ❌ | ❌ |
| 🔔 原生通知 | 系统级通知推送 | ⚠️ | ✅ | ✅ | ✅ |
🤖 AI Family 角色体系 | AI Family Roles
YYC³ Cloud Intelli-Matrix 内置 8 种拟人化 AI 角色构成完整的智能协作体系:
| 角色 | 名称 | 色彩 | 职责 | 核心能力 |
|---|---|---|---|---|
| 🎧 navigator | 言启·千行 | #FFD700 |
系统的「耳朵」与「翻译官」 | 语音识别 · NLP · 多语言翻译 |
| 🧠 thinker | 语枢·万物 | #FF69B4 |
系统的「哲学家」与「分析师」 | 深度推理 · 逻辑分析 · 知识图谱 |
| 👁️ prophet | 预见·先知 | #00BFFF |
系统的「预言家」 | 时序预测 · 趋势分析 · 异常预警 |
| ⭐ bolero | 千里·伯乐 | #E8E8E8 |
系统的「人才官」与「推荐引擎」 | 智能推荐 · 资源匹配 · 评分系统 |
| 🌐 meta-oracle | 元启·天枢 | #00FF88 |
YYC3 的「大脑」与「总指挥」 | 强化学习 · 运筹优化 · 分布式调度 |
| 🛡️ sentinel | 智云·守护 | #BF00FF |
系统的「免疫系统」与「首席安全官」 | UEBA · 异常检测 · SOAR 安全编排 |
| ⚖️ master | 格物·宗师 | #C0C0C0 |
系统的「质量官」与「进化导师」 | SAST · 性能分析 · LLM 代码理解 |
| 💡 creative | 创想·灵韵 | #FF7043 |
系统的「创意引擎」与「设计助手」 | 生成式 AI · 多模态创作 · 设计思维 |
🏨 智慧酒店控制台 | Smart Hotel Console
AI Family 角色自动映射到酒店业务场景:
| 酒店角色 | AI Family 角色 | 业务职责 |
|---|---|---|
| 前台接待 | 🎧 千行 (navigator) | 客户接待、语音交互 |
| 礼宾服务 | ⭐ 伯乐 (bolero) | 智能推荐、资源匹配 |
| 酒店经理 | 🌐 天枢 (meta-oracle) | 全局调度、智能编排 |
| 安全保卫 | 🛡️ 守护 (sentinel) | 安全监控、威胁检测 |
| IT支持 | ⚖️ 宗师 (master) | 代码审查、性能分析 |
| 市场营销 | 💡 灵韵 (creative) | 创意生成、多模态设计 |
| 财务管理 | 🧠 万物 (thinker) | 数据分析、逻辑推理 |
| 客户关系 | 👁️ 先知 (prophet) | 预测分析、趋势洞察 |
🏗️ 系统架构 | Architecture
┌─────────────────────────────────────────────────────────────────────────────┐
│ YYC³ Cloud Intelli-Matrix │
│ 智能监控与运维平台架构图 │
└─────────────────────────────────────────────────────────────────────────────┘
┌─────────────────────────────────────────────────────────────────────────────┐
│ 📱 表现层 | Presentation Layer │
│ ┌──────────────┐ ┌──────────────┐ ┌──────────────┐ ┌──────────────┐ │
│ │ Desktop │ │ Tablet │ │ Mobile │ │ PWA App │ │
│ │ (Electron) │ │ (Web) │ │ (Web) │ │ (Offline) │ │
│ └──────────────┘ └──────────────┘ └──────────────┘ └──────────────┘ │
└─────────────────────────────────────────────────────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────────────────────────────┐
│ 🎨 视图层 | View Layer │
│ ┌──────────────────────────────────────────────────────────────────────┐ │
│ │ React 19 + TypeScript 5.9 (Strict Mode) + React Router 7 │ │
│ ├──────────────────────────────────────────────────────────────────────┤ │
│ │ Tailwind CSS 4 + Motion 12 + Radix UI + Lucide Icons │ │
│ └──────────────────────────────────────────────────────────────────────┘ │
└─────────────────────────────────────────────────────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────────────────────────────┐
│ 🎭 状态层 | State Layer │
│ ┌────────────┐ ┌────────────┐ ┌────────────┐ ┌────────────┐ │
│ │ React │ │ Custom │ │ Local │ │ IndexedDB │ │
│ │ Context │ │ Hooks │ │ Storage │ │ Cache │ │
│ └────────────┘ └────────────┘ └────────────┘ └────────────┘ │
└─────────────────────────────────────────────────────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────────────────────────────┐
│ 📊 数据层 | Data Layer │
│ ┌────────────┐ ┌────────────┐ ┌────────────┐ ┌────────────┐ │
│ │ WebSocket │ │ REST API │ │ Supabase │ │ Recharts │ │
│ │ Realtime │ │ Client │ │ Auth │ │ Charts │ │
│ └────────────┘ └────────────┘ └────────────┘ └────────────┘ │
└─────────────────────────────────────────────────────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────────────────────────────┐
│ 🤖 AI 智能层 | AI Intelligence Layer │
│ ┌──────────────────────────────────────────────────────────────────────┐ │
│ │ AI SDK + Decision Engine + Pattern Analyzer + NLP Processor │ │
│ └──────────────────────────────────────────────────────────────────────┘ │
└─────────────────────────────────────────────────────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────────────────────────────┐
│ 🗄️ 存储层 | Storage Layer │
│ ┌────────────┐ ┌────────────┐ ┌────────────┐ ┌────────────┐ │
│ │ PostgreSQL │ │ MySQL │ │ MongoDB │ │ Electron │ │
│ │ (Primary) │ │ (Optional) │ │ (Optional) │ │ IPC │ │
│ └────────────┘ └────────────┘ └────────────┘ └────────────┘ │
└─────────────────────────────────────────────────────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────────────────────────────┐
│ 🔧 基础设施层 | Infrastructure Layer │
│ ┌────────────┐ ┌────────────┐ ┌────────────┐ ┌────────────┐ │
│ │ Vite │ │ Vitest │ │ Docker │ │ GitHub │ │
│ │ Build │ │ Test │ │ Deploy │ │ Actions │ │
│ └────────────┘ └────────────┘ └────────────┘ └────────────┘ │
└─────────────────────────────────────────────────────────────────────────────┘
🛠️ 技术栈 | Tech Stack
核心框架 | Core Frameworks
| 技术 | 版本 | 描述 | 官网 |
|---|---|---|---|
| 19.2.4 | UI 框架,支持并发特性与 Server Components | react.dev | |
| 5.9.3 | 类型安全,严格模式,零运行时错误 | typescriptlang.org | |
| 7.13.1 | 路由管理,Data Mode,懒加载 | reactrouter.com |
样式与 UI | Styling & UI
| 技术 | 版本 | 描述 | 官网 |
|---|---|---|---|
| 4.2.1 | 原子化 CSS,JIT 编译,零运行时 | tailwindcss.com | |
| 12.34.5 | 高性能动画库,GPU 加速 | motion.dev | |
| 1.x | 无头组件库,可访问性优先 | radix-ui.com | |
| 0.576.0 | 现代化图标库,Tree-shakable | lucide.dev |
构建与测试 | Build & Test
| 技术 | 版本 | 描述 | 官网 |
|---|---|---|---|
| 7.3.1 | 极速构建工具,ESM 优先 | vitejs.dev | |
| 4.0.18 | 单元测试框架,Vite 原生支持 | vitest.dev | |
| 16.x | React 测试工具,用户行为模拟 | testing-library.com |
数据与可视化 | Data & Visualization
| 技术 | 版本 | 描述 | 官网 |
|---|---|---|---|
| 3.7.0 | 响应式图表库,React 原生 | recharts.org | |
| 2.98.0 | 后端即服务,认证与数据库 | supabase.com |
桌面与部署 | Desktop & Deployment
| 技术 | 版本 | 描述 | 官网 |
|---|---|---|---|
| 28.0.0 | 跨平台桌面应用框架 | electronjs.org | |
| - | 容器化部署,多阶段构建 | docker.com |
🚀 快速开始 | Quick Start
📋 环境要求 | Prerequisites
| 依赖 | 版本要求 | 检查命令 | 安装指南 |
|---|---|---|---|
| Node.js | ≥ 18.x (推荐 20.x LTS) | node -v |
nodejs.org |
| pnpm | ≥ 8.x | pnpm -v |
corepack enable pnpm |
| Git | 最新版 | git --version |
git-scm.com |
⚡ 5 分钟快速上手
# 1️⃣ 克隆项目 git clone https://github.com/YYC-Cube/YYC3-Cloud-Intelli-Matrix.git cd YYC3-Cloud-Intelli-Matrix # 2️⃣ 安装依赖 pnpm install # 3️⃣ 启动开发服务器 pnpm dev # 4️⃣ 浏览器访问 # http://localhost:3218
🔧 详细安装步骤
📦 步骤 1: 克隆项目
# HTTPS 方式 git clone https://github.com/YYC-Cube/YYC3-Cloud-Intelli-Matrix.git # SSH 方式 (推荐) git clone git@github.com:YYC-Cube/YYC3-Cloud-Intelli-Matrix.git # GitHub CLI gh repo clone YYC-Cube/YYC3-Cloud-Intelli-Matrix # 进入项目目录 cd YYC3-Cloud-Intelli-Matrix
📥 步骤 2: 安装依赖
# 安装 pnpm (如果未安装) corepack enable corepack prepare pnpm@latest --activate # 安装项目依赖 pnpm install # 验证安装 pnpm list --depth=0
⚙️ 步骤 3: 环境配置
# 复制环境变量模板 cp .env.example .env # 编辑环境变量 (可选) # vim .env 或使用您喜欢的编辑器
环境变量说明:
| 变量名 | 必需 | 默认值 | 说明 |
|---|---|---|---|
VITE_SUPABASE_URL |
❌ | - | Supabase 项目 URL |
VITE_SUPABASE_ANON_KEY |
❌ | - | Supabase 匿名密钥 |
VITE_OLLAMA_URL |
❌ | http://localhost:11434 |
Ollama API 地址 |
VITE_YYC3_ZHIPU_API_KEY |
❌ | - | 智谱 AI API Key |
VITE_YYC3_DEEPSEEK_API_KEY |
❌ | - | DeepSeek API Key |
VITE_YYC3_OLLAMA_BASE_URL |
❌ | http://localhost:11434 |
Ollama 服务地址 |
💡 提示: 不配置环境变量时,系统将自动进入 Ghost Mode (开发模式)
🚀 步骤 4: 启动开发服务器
# Web 开发模式 pnpm dev # Electron 桌面应用开发模式 pnpm electron:dev # 指定端口 pnpm dev --port 3000
开发服务器启动信息:
VITE v7.3.1 ready in 234 ms
➜ Local: http://localhost:3218/
➜ Network: http://192.168.1.100:3218/
➜ press h + enter to show help
🧪 运行测试
# 运行所有测试 pnpm test # 监听模式 (开发推荐) pnpm test:watch # 生成覆盖率报告 pnpm test:coverage # CI 模式 (分片执行) pnpm test:ci # UI 模式 (可视化测试) pnpm test:ui
🏗️ 构建生产版本
# 标准构建 pnpm build # 带分析报告的构建 pnpm build:analyze # Electron 桌面应用构建 pnpm build:electron # 当前平台 pnpm build:mac # macOS (arm64 + x64) pnpm build:win # Windows (x64) pnpm build:linux # Linux (AppImage + deb)
构建输出示例:
✓ 2731 modules transformed.
✓ built in 6.42s
dist/index.html 1.48 kB │ gzip: 0.65 kB
dist/assets/index-CSS.css 143.07 kB │ gzip: 21.59 kB
dist/assets/react-vendor.js 228.83 kB │ gzip: 75.01 kB
dist/assets/charts-vendor.js 442.94 kB │ gzip:116.90 kB
dist/assets/index.js 275.69 kB │ gzip: 80.45 kB
✅ 优化成果:
- 初始 JS 减少 82% (1.54MB → 275KB)
- 完整代码分割 + 路由懒加载
- Gzip 压缩后总大小: 295 KB
📖 使用指南 | Usage Guide
🔑 登录方式
方式 1: 正常登录 (Supabase 认证)
需要配置 VITE_SUPABASE_URL 和 VITE_SUPABASE_ANON_KEY 环境变量。
方式 2: Ghost Mode (开发模式)
点击登录页 GHOST MODE 按钮跳过认证:
| 配置项 | 值 |
|---|---|
| 用户 | ghost@yyc3.local |
| 角色 | developer |
| 数据 | 仅 localStorage |
⌨️ 快捷键
| 快捷键 | 功能 | 全局 |
|---|---|---|
Ctrl/⌘ + K |
命令面板 (全局搜索) | ✅ |
| `Ctrl +`` | 打开集成终端 | ✅ |
Escape |
关闭所有弹窗 | ✅ |
Ctrl/⌘ + B |
切换侧边栏 | ✅ |
Ctrl/⌘ + Shift + F |
全屏模式 | ✅ |
🖥️ 界面导航
桌面端 (Sidebar)
📊 数据监控
├── 实时状态
├── QPS 趋势
├── 延迟分析
└── 节点管理
🔍 巡查管理
├── 巡查计划
├── 巡查报告
└── 历史记录
⚙️ 操作中心
├── 快速操作
├── 模板管理
└── 操作日志
🤖 AI 辅助
├── 智能决策
├── 模式识别
└── 自然语言
🎛️ 系统设置
├── 用户配置
├── 主题设置
└── 数据管理
移动端 (BottomNav)
| Tab | 功能 |
|---|---|
| 📊 仪表盘 | 核心数据概览 |
| 🔍 巡查 | 巡查任务管理 |
| ⚙️ 操作 | 快速操作入口 |
| 🤖 AI | AI 助手对话 |
| 📱 更多 | 设置与帮助 |
📊 性能指标 | Performance
构建性能
| 指标 | 值 | 说明 |
|---|---|---|
| 🚀构建时间 | 6.42s | Vite 极速编译 |
| 📦主包大小 | 275 KB | Gzip 压缩后 |
| 📦总包大小 | 1.09 MB | 包含所有 chunks |
| 🎯代码分割 | 5 chunks | React/Vendor/Charts/UI/App |
| 🔄HMR 速度 | <50ms | 热更新响应时间 |
运行时性能
| 指标 | 值 | 说明 |
|---|---|---|
| ⚡首屏加载 | <1s | 4G 网络环境 |
| ⚡TTI | <1.5s | 可交互时间 |
| ⚡FCP | <0.8s | 首次内容绘制 |
| 💾内存占用 | ~50MB | Chrome Tab |
| 📱PWA 缓存 | 95%+ | 离线可用率 |
测试覆盖
| 指标 | 值 | 说明 |
|---|---|---|
| 🧪测试用例 | 4,622 | 单元 + 集成测试 |
| 📁测试文件 | 264 | 覆盖核心模块 |
| 📊通过率 | 99.8% | 4612/4622 通过 |
| ✅CI 强制 | 100% | 主流程全部通过 |
Lighthouse 评分
| 类别 | 评分 | 说明 |
|---|---|---|
| 🎨Performance | 95+ | 性能优化 |
| ♿Accessibility | 100 | 可访问性 |
| ✅Best Practices | 100 | 最佳实践 |
| 🔍SEO | 100 | 搜索优化 |
| 📱PWA | ✅ | PWA 就绪 |
🤝 贡献指南 | Contributing
我们欢迎所有形式的贡献!无论是报告 Bug、提出新功能、改进文档还是提交代码。
🌟 贡献者
📝 如何贡献
- Fork 项目 - 点击右上角 Fork 按钮
- 创建分支 -
git checkout -b feature/amazing-feature - 提交更改 -
git commit -m 'feat: add amazing feature' - 推送分支 -
git push origin feature/amazing-feature - 提交 PR - 创建 Pull Request
📋 提交规范
我们使用 Conventional Commits 规范:
<type>(<scope>): <subject>
<body>
<footer>
类型 (type):
| 类型 | 说明 |
|---|---|
feat |
新功能 |
fix |
Bug 修复 |
docs |
文档更新 |
style |
代码格式 (不影响功能) |
refactor |
重构 |
perf |
性能优化 |
test |
测试相关 |
chore |
构建/工具相关 |
🔍 代码审查
所有 PR 都需要通过以下检查:
- ✅ TypeScript 类型检查
- ✅ ESLint 代码规范
- ✅ Prettier 格式化
- ✅ 单元测试通过
- ✅ 覆盖率达标
📖 开发指南
# 1. Fork 并克隆 git clone https://github.com/YOUR_USERNAME/YYC3-Cloud-Intelli-Matrix.git # 2. 安装依赖 pnpm install # 3. 创建功能分支 git checkout -b feature/your-feature # 4. 开发并测试 pnpm dev pnpm test # 5. 代码检查 pnpm lint:fix pnpm type-check # 6. 提交代码 git add . git commit -m "feat: your feature description" # 7. 推送并创建 PR git push origin feature/your-feature
🗺️ 路线图 | Roadmap
v1.0.0 (当前)
- 核心监控功能
- 巡查管理系统
- 操作中心
- AI 辅助功能
- PWA 支持
- Electron 桌面版
- 国际化 (中/英)
- AI Family 8种拟人化角色系统
- 智慧酒店多模型协作控制台
- 多模型提供商 (智谱/DeepSeek/Ollama)
- GitHub Pages 自动部署 (matrix.yyc3.top)
v1.1.0 (计划中)
- 仪表盘自定义布局
- 更多图表类型
- 告警规则引擎
- 数据导出功能
- 团队协作功能
v1.2.0 (规划中)
- 插件系统
- 自定义主题
- 移动端原生 App
- WebSocket 集群
- AI 模型训练
长期目标
- 微服务架构
- Kubernetes 部署
- 多租户支持
- 企业级功能
- 开源社区建设
❓ 常见问题 | FAQ
Q: 如何跳过登录直接使用?
A: 点击登录页的 GHOST MODE 按钮,系统将自动以开发模式登录,无需配置 Supabase。
Q: PWA 如何离线使用?
A: 首次访问后,应用会自动缓存到本地。之后即使断网也能访问已缓存的功能。点击地址栏右侧的"安装"按钮可将应用添加到桌面。
Q: 如何配置自己的 AI 模型?
A: 进入 系统设置 → AI 配置,添加您的模型供应商 (如 Ollama、OpenAI 等) 和 API 密钥即可。
Q: 数据存储在哪里?
A: 默认使用 localStorage 本地存储。配置 Supabase 后可同步到云端数据库,支持离线优先策略。
Q: 如何报告 Bug 或提出功能建议?
A: 请在 GitHub Issues 中提交,我们会及时处理。
📄 许可证 | License
本项目采用 MIT License 开源协议。
MIT License
Copyright (c) 2024 YYC³ Cube
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
🙏 致谢 | Acknowledgments
🌟 开源项目
感谢以下开源项目的支持:
- React - UI 框架
- TypeScript - 类型系统
- Vite - 构建工具
- Tailwind CSS - CSS 框架
- Radix UI - 无头组件
- Recharts - 图表库
- Electron - 桌面框架
💖 特别感谢
感谢所有贡献者和用户的支持!
Made with ❤️ by YYC³ Cube
GitHub · 在线演示 · Documentation · Changelog · Contributing
如果这个项目对您有帮助,请给我们一个 ⭐ Star!
来源:GitHub · github.com