Flexmodel UI

---

Flexmodel UI 是基于 React 和 Ant Design 的管理后台，作为 Flexmodel 的前端视觉中心。它提供了可视化的数据建模、服务编排、任务监控及系统配置能力，让后端能力的管理变得直观而高效。

✨ 核心特性

• 📊 可视化建模: 支持 ER 图设计、实体关系定义及模型版本管理。
• ⚡ 流程编排: 可视化的服务编排界面，轻松构建复杂的后端逻辑。
• ⏰ 任务监控: 实时查看调度任务状态、执行日志及性能指标。
• 📂 存储管理: 直观的文件管理界面，支持多存储桶操作。
• 🔐 权限控制: 完整的用户、角色及权限 (RBAC) 配置界面。
• 🎨 现代界面: 基于 Ant Design 5 构建，支持紧凑主题与响应式布局。
• 🔧 开发者工具: 内置 API 文档、GraphQL 调试器及代码生成助手。

🚀 快速开始

环境要求

• Node.js >= 18.0.0
• npm 或 yarn

安装与启动

# 安装依赖
npm install

# 启动开发服务器
npm run dev

生产环境构建

# 构建应用
npm run build

# 预览构建结果
npm run preview

🏗️ 技术栈

• 框架: React 18, TypeScript, Vite
• UI 库: Ant Design 5, Tailwind CSS
• 图形引擎: AntV X6 (用于 ER 图与流程编排)
• 状态管理: Redux Toolkit
• 国际化: i18next

📁 项目结构

src/
├── components/          # 可复用 UI 组件
├── pages/               # 业务页面 (建模、编排、存储、系统等)
├── services/            # API 请求封装
├── store/               # Redux 状态管理
├── locales/             # 国际化文件
└── utils/               # 工具函数