From 35e626971c64dc96fa294cf0aa501f511deebbf6 Mon Sep 17 00:00:00 2001 From: hezhaohui Date: Tue, 14 Jul 2026 15:39:44 +0800 Subject: [PATCH] =?UTF-8?q?feat(frontend):=20=E5=AE=9E=E7=8E=B0=E4=BB=AA?= =?UTF-8?q?=E8=A1=A8=E7=9B=98=E5=92=8C=E5=AD=90=E7=B3=BB=E7=BB=9F=E5=AF=BC?= =?UTF-8?q?=E8=88=AA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 页面： - views/dashboard/Index.vue，首页仪表盘（资源大盘、集群拓扑、最近任务） - views/subsystem/Navigation.vue，子系统导航页（6 个卡片网格展示） 组件： - components/SubsystemCard.vue，子系统卡片组件（图标、名称、状态、SSO 跳转） API： - api/subsystem.ts，子系统相关接口（获取列表、SSO URL） 子系统：Wayne、CloudDM、CacheCloud、Apollo、qpass、Grafana --- frontend/src/api/subsystem.ts | 101 +++++ frontend/src/components/SubsystemCard.vue | 146 ++++++++ frontend/src/views/dashboard/Index.vue | 387 ++++++++++++++++++++ frontend/src/views/subsystem/Navigation.vue | 58 +++ 4 files changed, 692 insertions(+) create mode 100644 frontend/src/api/subsystem.ts create mode 100644 frontend/src/components/SubsystemCard.vue create mode 100644 frontend/src/views/dashboard/Index.vue create mode 100644 frontend/src/views/subsystem/Navigation.vue diff --git a/frontend/src/api/subsystem.ts b/frontend/src/api/subsystem.ts new file mode 100644 index 0000000..a2771e0 --- /dev/null +++ b/frontend/src/api/subsystem.ts @@ -0,0 +1,101 @@ +import request from './request' + +export interface Subsystem { + id: number + name: string + description: string + icon: string + url: string + status: 'integrated' | 'integrating' + sso_enabled: boolean +} + +// Mock 数据 +const mockSubsystems: Subsystem[] = [ + { + id: 1, + name: 'Wayne', + description: '多集群容器管理平台', + icon: 'W', + url: 'https://wayne.qiniu.com', + status: 'integrated', + sso_enabled: true, + }, + { + id: 2, + name: 'CloudDM', + description: '数据库管理与SQL审核', + icon: 'DM', + url: 'https://clouddm.qiniu.com', + status: 'integrated', + sso_enabled: true, + }, + { + id: 3, + name: 'CacheCloud', + description: 'Redis 云管理平台', + icon: 'CC', + url: 'https://cachecloud.qiniu.com', + status: 'integrated', + sso_enabled: true, + }, + { + id: 4, + name: 'Apollo', + description: '配置中心', + icon: 'AP', + url: 'https://apollo.xinfra.internal', + status: 'integrated', + sso_enabled: true, + }, + { + id: 5, + name: 'qpass', + description: '密码管理平台', + icon: 'QP', + url: 'https://qpass.xinfra.internal', + status: 'integrated', + sso_enabled: true, + }, + { + id: 6, + name: 'Grafana', + description: '监控可视化平台', + icon: 'GF', + url: 'https://grafana.xinfra.internal', + status: 'integrated', + sso_enabled: true, + }, +] + +export const subsystemApi = { + // 获取子系统列表 + getSubsystems(): Promise { + return new Promise((resolve) => { + setTimeout(() => { + resolve({ + code: 0, + message: 'success', + data: mockSubsystems, + }) + }, 300) + }) + }, + + // 获取 SSO 跳转 URL + getSSOUrl(id: number): Promise { + return new Promise((resolve) => { + setTimeout(() => { + const subsystem = mockSubsystems.find((s) => s.id === id) + resolve({ + code: 0, + message: 'success', + data: { + sso_url: subsystem?.url + '/sso/callback?code=mock-code&state=mock-state', + expires_in: 300, + }, + }) + }, 200) + }) + }, +} diff --git a/frontend/src/components/SubsystemCard.vue b/frontend/src/components/SubsystemCard.vue new file mode 100644 index 0000000..bd31574 --- /dev/null +++ b/frontend/src/components/SubsystemCard.vue @@ -0,0 +1,146 @@ + + + + + diff --git a/frontend/src/views/dashboard/Index.vue b/frontend/src/views/dashboard/Index.vue new file mode 100644 index 0000000..5dc3b7f --- /dev/null +++ b/frontend/src/views/dashboard/Index.vue @@ -0,0 +1,387 @@ + + + + + diff --git a/frontend/src/views/subsystem/Navigation.vue b/frontend/src/views/subsystem/Navigation.vue new file mode 100644 index 0000000..2effdd9 --- /dev/null +++ b/frontend/src/views/subsystem/Navigation.vue @@ -0,0 +1,58 @@ + + + + +