From 16995679ad0a58dfd8157c6babd95e46ad1bcde9 Mon Sep 17 00:00:00 2001 From: qian Date: Sun, 10 May 2026 15:56:41 +0800 Subject: [PATCH] =?UTF-8?q?refactor(web):=E9=87=8D=E6=9E=84=E7=A7=9F?= =?UTF-8?q?=E6=88=B7=E7=AB=AF=E8=90=BD=E5=9C=B0=E9=A1=B5=E4=BB=8B=E7=BB=8D?= =?UTF-8?q?=E5=86=85=E5=AE=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web/tenant/src/router/index.ts | 2 +- web/tenant/src/views/landing/LandingPage.vue | 459 ++++++++++--------- 2 files changed, 244 insertions(+), 217 deletions(-) diff --git a/web/tenant/src/router/index.ts b/web/tenant/src/router/index.ts index 4a22156..1f5e1f9 100644 --- a/web/tenant/src/router/index.ts +++ b/web/tenant/src/router/index.ts @@ -9,7 +9,7 @@ const routes: RouteRecordRaw[] = [ path: '/', name: 'TenantHome', component: () => import('@/views/landing/LandingPage.vue'), - meta: { requiresAuth: false, title: 'Team-API — 统一 AI API 网关' }, + meta: { requiresAuth: false, title: 'Team-API — 开源自托管 AI API 网关' }, }, ...tenantRoutes, { diff --git a/web/tenant/src/views/landing/LandingPage.vue b/web/tenant/src/views/landing/LandingPage.vue index 30fb570..5014e00 100644 --- a/web/tenant/src/views/landing/LandingPage.vue +++ b/web/tenant/src/views/landing/LandingPage.vue @@ -9,18 +9,24 @@ Team-API +
+ - 演示登录 + 在线演示 - 获取报价 + 开始使用
@@ -32,74 +38,58 @@
+
-
- - 开箱即用的多租户 AI API 网关系统 +
+ + + 开源自托管 · AGPL-3.0 +

- 一套系统,开启你的
- AI API 商业化之路 + 自托管的多租户
+ AI API 网关平台

- Team-API 是一套完整的多租户 AI API 网关 SaaS 系统。聚合 40+ 大模型供应商, - 内置计费引擎、用量审计、团队管理、开放平台等能力,助力您快速搭建自己的 AI API 服务。 + 聚合 40+ 大模型供应商,内置计费引擎、团队管理、用量审计与渠道调度。 + 完整源码开放,Docker 一键部署,数据完全自主掌控。

- -
+ +
- 系统架构 + terminal
-
-
-
- -
管理后台
-
运营 · 监控 · 配置
-
-
- -
租户控制台
-
团队 · 用量 · 财务
-
-
- -
AI 代理层
-
调度 · 转发 · 计费
-
-
-
-
- - 40+ AI 供应商适配 - -
-
-
- - {{ name }} - -
+
+
# 克隆项目并启动
+$ git clone https://github.com/qianfree/team-api.git
+$ cd team-api
+$ cp .env.example .env
+$ docker compose up -d
+
+# 访问 http://localhost:3000 即可使用
@@ -123,9 +113,9 @@
-

完整的 SaaS 管理能力

+

核心能力

- 不只是一个 API 转发层,而是一套覆盖运营、管理、计费、监控的完整商业系统。 + 不只是 API 转发,而是一套完整的多租户 AI 网关基础设施。

@@ -141,41 +131,117 @@
- -
+ +
-

为什么选择 Team-API

-

区别于开源方案的差异化优势,让您的业务从第一天就跑在专业级基础设施上。

+

系统架构

+

三层解耦设计,职责清晰,易于扩展和维护。

-
-
-
- +
+ +
+
+
+
+ +
+
+
客户端层
+
通过标准 OpenAI 接口接入
+
+
+
+ OpenAI SDK + Claude SDK + HTTP + SSE +
-
-

{{ item.title }}

-

{{ item.desc }}

-
    -
  • - {{ tag }} -
  • -
+
+ + +
+ +
+ + +
+
+
+ +
+
+
Team-API 网关层
+
认证 · 计费 · 调度 · 审计 · 限流
+
+
+
+
+
+ {{ mod.name }} +
+
+
+ + +
+ +
+ + +
+
+
+
+ +
+
+
AI 供应商层
+
40+ 供应商适配器,统一转发
+
+
+
+ + {{ name }} + +
+ +
+
+
+

技术栈

+

基于成熟稳定的技术选型,代码结构清晰,便于二次开发。

+
+ +
+
+
+ {{ tech.abbr }} +
+
{{ tech.name }}
+
{{ tech.desc }}
+
+
+
+
+ -
+

广泛的模型生态

- 内置 40+ 供应商适配器,统一 OpenAI 兼容接口,您的用户无需修改代码即可接入。 + 内置 40+ 供应商适配器,统一 OpenAI 兼容接口,用户无需修改代码即可接入。

@@ -194,7 +260,7 @@
-

您的用户只需这样调用 —— 完全兼容 OpenAI SDK

+

完全兼容 OpenAI SDK,只需修改 base_url 即可接入

@@ -220,69 +286,68 @@
- -
+ +
-

授权方案

-

按需选择适合您的授权方式,源码交付,永久使用。

+

三步部署

+

Docker Compose 一键启动,五分钟即可拥有自己的 AI API 网关。

-
-
- {{ plan.badge }} +
+
+ {{ idx + 1 }}
-
-

{{ plan.name }}

-
- {{ plan.price }} - {{ plan.period }} -
-

{{ plan.desc }}

+

{{ step.title }}

+

{{ step.desc }}

+
+ {{ step.code }}
-
    -
  • - - {{ item }} -
  • -
- - {{ plan.cta }} +
+
+ +
- +
-
-
-
+
+
+
-

搭建您自己的 AI API 平台

-

- 一次部署,长期收益。Team-API 帮您省去数月开发周期,即刻上线专业的 AI API 商业服务。 +

加入社区,共建 Team-API

+

+ 开源不仅是代码,更是社区。欢迎 Star、Fork、提交 Issue 和 PR,一起打造更好的 AI API 网关。

-
-

© 2026 Team-API. All rights reserved.

+

© 2026 Team-API. Released under the AGPL-3.0 License.

@@ -335,103 +408,72 @@ const stats = [ { value: '40+', label: 'AI 供应商适配器' }, { value: '200+', label: '开箱可用模型' }, - { value: '5 层', label: '额度管控体系' }, - { value: '双控制台', label: '管理 + 租户' }, + { value: 'AGPL-3.0', label: '开源协议' }, + { value: '全栈', label: '完整源码交付' }, ] const features = [ { icon: 'users', - title: '多租户与团队管理', - desc: '完整的多租户数据隔离,支持组织创建、成员邀请、角色权限(Owner/Admin/Member)、项目级资源分配,满足企业级团队协作需求。', + title: '多租户与团队协作', + desc: '行级数据隔离的多租户架构,支持组织创建、成员邀请、RBAC 权限(Owner/Admin/Member)、项目级资源分配。', iconBg: 'bg-blue-50', iconColor: 'text-blue-600', }, { - icon: 'chart', - title: '成员用量分析', - desc: '按成员、项目、Key、模型多维度统计 Token 用量与费用。趋势图表、模型分布、用量排名、费用预测,让每一笔 AI 支出透明可控。', + icon: 'bolt', + title: '统一 AI 代理层', + desc: '40+ 供应商适配器,SSE 流式转发,OpenAI/Claude/Gemini 多协议自动转换,请求级超时控制,流式中断资源回收。', iconBg: 'bg-primary-50', iconColor: 'text-primary-600', }, - { - icon: 'clipboard', - title: '请求审计日志', - desc: '全链路请求追踪,记录每次 API 调用的模型、Token 用量、响应状态、耗时、费用。支持按时间、成员、模型检索,满足合规审计要求。', - iconBg: 'bg-emerald-50', - iconColor: 'text-emerald-600', - }, { icon: 'wallet', - title: '计费引擎与钱包体系', - desc: '预扣→结算→退款的原子化计费流程,五层额度模型(租户→套餐→成员→项目→Key),梯度定价,双币种(CNY/USD),杜绝超额消费。', + title: '精细化计费引擎', + desc: '预扣→结算→退款的原子化计费流程,五层额度模型(租户→套餐→成员→项目→Key),梯度定价,杜绝超额消费。', iconBg: 'bg-amber-50', iconColor: 'text-amber-600', }, - { - icon: 'link', - title: '开放平台与第三方对接', - desc: '内置 Webhook 事件推送、开放平台应用管理、API 文档中心、SSO 单点登录(SAML/OIDC),无缝对接您的现有业务系统。', - iconBg: 'bg-purple-50', - iconColor: 'text-purple-600', - }, - { - icon: 'shield', - title: '安全与权限体系', - desc: 'RBAC 权限模型,API Key 作用域控制,敏感数据 AES-256 加密,并发预扣防超扣,操作审计日志,保障平台与用户数据安全。', - iconBg: 'bg-rose-50', - iconColor: 'text-rose-600', - }, { icon: 'refresh', - title: '渠道调度与容灾', - desc: '多渠道路由引擎,支持优先级/权重调度、健康评分、自动故障切换、渠道亲和性缓存。确保 AI 服务高可用,单渠道故障零感知。', + title: '智能渠道调度', + desc: '多渠道路由引擎,支持优先级/权重调度、健康评分、自动故障切换、渠道亲和性缓存,单渠道故障零感知。', iconBg: 'bg-cyan-50', iconColor: 'text-cyan-600', }, { - icon: 'creditCard', - title: '商业化运营能力', - desc: '套餐方案管理、在线支付(支付宝/微信/Stripe)、订单与退款、兑换码、优惠券、发票管理。从用户注册到付费收款,全流程闭环。', - iconBg: 'bg-orange-50', - iconColor: 'text-orange-600', - }, - { - icon: 'cog', - title: '管理后台与运维', - desc: '独立的管理控制台,渠道管理、模型配置、系统监控、告警规则、工单系统、状态页面。一套后台掌控平台全局运营状态。', - iconBg: 'bg-indigo-50', - iconColor: 'text-indigo-600', - }, -] - -const highlights = [ - { - icon: 'cube', - title: '真·多租户 SaaS 架构', - desc: '从数据模型到路由设计全部围绕多租户构建,行级数据隔离,租户间零干扰。支持无限租户接入,每个租户独立控制台、独立成员体系、独立财务账本。', - tags: ['行级隔离', '独立控制台', '无限租户'], - }, - { - icon: 'bolt', - title: '生产级 AI 代理层', - desc: '40+ 供应商适配器、SSE 流式转发、OpenAI/Claude/Gemini 多协议自动转换、流式中断资源回收、请求级超时控制。经过大流量验证的转发引擎。', - tags: ['流式转发', '协议转换', '大流量验证'], + icon: 'shield', + title: '安全与权限', + desc: 'RBAC 权限模型,API Key 作用域控制,敏感数据 AES-256 加密,并发预扣防超扣,全链路操作审计。', + iconBg: 'bg-rose-50', + iconColor: 'text-rose-600', }, { icon: 'terminal', title: '开发者友好', - desc: '您的用户无需学习新接口,直接使用 OpenAI 官方 SDK 连接。系统自动处理不同供应商的协议差异,包括请求格式转换、响应格式统一、错误码映射。', - tags: ['OpenAI 兼容', '零迁移成本', '多语言 SDK'], - }, - { - icon: 'document', - title: '完整源码交付', - desc: 'Go + Vue 3 全栈源码,代码结构清晰,注释完整。包含后端 API、管理后台前端、租户控制台前端、数据库迁移脚本、部署配置,您完全掌控每一行代码。', - tags: ['全栈源码', 'Go + Vue 3', '可二次开发'], + desc: '完全兼容 OpenAI SDK,只需修改 base_url 即可接入。支持流式/非流式、Function Call、多模态等主流特性。', + iconBg: 'bg-purple-50', + iconColor: 'text-purple-600', }, ] +const gatewayModules = [ + { name: 'API Key 认证', dotColor: 'bg-blue-400' }, + { name: '渠道调度', dotColor: 'bg-primary-400' }, + { name: '计费引擎', dotColor: 'bg-amber-400' }, + { name: '协议转换', dotColor: 'bg-emerald-400' }, + { name: '限流控制', dotColor: 'bg-red-400' }, + { name: '用量审计', dotColor: 'bg-purple-400' }, +] + +const techStack = [ + { name: 'Go', abbr: 'Go', desc: '后端语言', bgColor: '#e0f2fe', textColor: '#0369a1' }, + { name: 'Vue 3', abbr: 'V3', desc: '前端框架', bgColor: '#f0fdf4', textColor: '#15803d' }, + { name: 'PostgreSQL', abbr: 'PG', desc: '数据库', bgColor: '#eff6ff', textColor: '#1d4ed8' }, + { name: 'Redis', abbr: 'Rd', desc: '缓存', bgColor: '#fef2f2', textColor: '#b91c1c' }, + { name: 'Docker', abbr: 'Dk', desc: '容器部署', bgColor: '#e0f2fe', textColor: '#0284c7' }, +] + const providers = [ { name: 'OpenAI', abbr: 'OA', models: '30', bgColor: '#f0fdfa', textColor: '#0d9488' }, { name: 'Anthropic Claude', abbr: 'CL', models: '15', bgColor: '#fef3c7', textColor: '#92400e' }, @@ -443,36 +485,21 @@ const providers = [ { name: '智谱 AI', abbr: 'ZP', models: '10', bgColor: '#fdf2f8', textColor: '#be185d' }, ] -const plans = [ +const quickStartSteps = [ { - name: '标准版', - price: '¥9,999', - period: '起', - desc: '适合快速启动 AI API 业务', - badge: '', - highlighted: false, - cta: '咨询详情', - features: ['完整源码交付', '多租户架构', '40+ 供应商适配', '基础计费引擎', '管理后台 + 租户控制台', 'PostgreSQL + Redis', '3 个月技术支持'], + title: '克隆项目', + desc: '从 GitHub 克隆源码到本地', + code: 'git clone https://github.com/\nqianfree/team-api.git\ncd team-api', }, { - name: '专业版', - price: '¥29,999', - period: '起', - desc: '全功能商业化运营', - badge: '推荐', - highlighted: true, - cta: '咨询详情', - features: ['标准版全部功能', '支付系统集成', '套餐与订阅管理', '开放平台 & Webhook', 'SSO 单点登录', '工单与帮助中心', '12 个月技术支持', '免费功能更新'], + title: '配置环境', + desc: '复制环境变量配置文件并修改', + code: 'cp .env.example .env\n# 编辑 .env 配置数据库\n# 和 Redis 连接信息', }, { - name: '企业版', - price: '定制', - period: '', - desc: '私有化部署 + 定制开发', - badge: '', - highlighted: false, - cta: '联系我们', - features: ['专业版全部功能', '私有化部署支持', '定制功能开发', '品牌白标定制', 'SLA 服务保障', '专属技术对接', 'K8s 部署方案', '优先 Issue 响应'], + title: '启动服务', + desc: 'Docker Compose 一键启动', + code: 'docker compose up -d\n# 访问 http://localhost:3000', }, ]