BIGTOP-4371: Add cluster management page (#179)

bigtop-manager-ui/src/api/cluster/index.ts

@@ -18,9 +18,10 @@
  */
 
 import request from '@/api/request.ts'
-import type { ClusterVO, UpdateClusterParam } from './types'
+import type { PageVO, ListParams } from '@/api/types'
+import type { ClusterVO, ServiceUserVO, UpdateClusterParam } from './types'
 
-export const getCluster = (id: number): Promise<ClusterVO[]> => {
+export const getCluster = (id: number): Promise<ClusterVO> => {
   return request({
     method: 'get',
     url: `/clusters/${id}`
@@ -41,3 +42,11 @@ export const getClusterList = (): Promise<ClusterVO[]> => {
     url: '/clusters'
   })
 }
+
+export const getUserListOfService = (id: number, params: ListParams): Promise<PageVO<ServiceUserVO[]>> => {
+  return request({
+    method: 'get',
+    url: `/clusters/${id}/services/users`,
+    params
+  })
+}

bigtop-manager-ui/src/api/cluster/types.ts

@@ -19,14 +19,16 @@
 
 export type UpdateClusterParam = { name: string; desc: string }
 
+export type ClusterStatusType = 1 | 2 | 3
+
 export interface ClusterVO {
   createUser?: string
   desc?: string
   displayName?: string
   id?: number
   name?: string
   rootDir?: string
-  status?: number
+  status?: ClusterStatusType
   totalDisk?: number
   totalHost?: number
   totalMemory?: number
@@ -35,3 +37,11 @@ export interface ClusterVO {
   type?: number
   userGroup?: string
 }
+
+export interface ServiceUserVO {
+  desc?: string
+  displayName?: string
+  user?: string
+  userGroup?: string
+  [property: string]: any
+}

bigtop-manager-ui/src/api/command/types.ts

@@ -20,8 +20,8 @@
 export interface CommandRequest {
   clusterCommand?: ClusterCommandReq
   clusterId?: number
-  command: Command
-  commandLevel: CommandLevel
+  command: keyof typeof Command
+  commandLevel: keyof typeof CommandLevel
   componentCommands?: ComponentCommandReq[]
   customCommand?: string
   hostCommands?: HostCommandReq[]
@@ -70,10 +70,10 @@ export enum Command {
 }
 
 export enum CommandLevel {
-  Cluster = 'cluster',
-  Component = 'component',
-  Host = 'host',
-  Service = 'service'
+  cluster = 'cluster',
+  component = 'component',
+  host = 'host',
+  service = 'service'
 }
 
 export interface ComponentCommandReq {

bigtop-manager-ui/src/api/hosts/index.ts

@@ -18,12 +18,13 @@
  */
 
 import request from '@/api/request.ts'
-import { HostParams, HostVO, HostVOList, InstalledStatusVO } from '@/api/hosts/types.ts'
+import type { HostListParams, HostParams, HostVO, HostVOList, InstalledStatusVO } from '@/api/hosts/types.ts'
 
-export const getHosts = (): Promise<HostVOList> => {
+export const getHosts = (params?: HostListParams): Promise<HostVOList> => {
   return request({
     method: 'get',
-    url: '/hosts'
+    url: '/hosts',
+    params
   })
 }
 

bigtop-manager-ui/src/api/hosts/types.ts

@@ -54,6 +54,17 @@ export interface HostVO {
   [property: string]: any
 }
 
+export interface HostListParams {
+  clusterId?: number
+  hostname?: string
+  ipv4?: string
+  orderBy?: string
+  pageNum?: number
+  pageSize?: number
+  sort?: string
+  status?: number
+}
+
 export interface HostParams {
   agentDir?: string
   authType?: number | string // '1-password，2-key，3-no_auth',
@@ -77,8 +88,15 @@ export interface InstalledStatusVO {
 }
 
 export enum Status {
-  Failed = 'FAILED',
   Installing = 'INSTALLING',
   Success = 'SUCCESS',
+  Failed = 'FAILED',
   Unknown = 'UNKNOW'
 }
+
+export enum BaseStatus {
+  'INSTALLING',
+  'SUCCESS',
+  'FAILED',
+  'UNKNOW'
+}

bigtop-manager-ui/src/api/job/index.ts

@@ -16,47 +16,57 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import request from '@/api/request.ts'
-import type { JobParams, JobList, TaskLogParams, TaskParams, JobVO, StageVO, TaskVO } from './types'
+import type {
+  JobParams,
+  JobList,
+  TaskLogParams,
+  JobVO,
+  JobListParams,
+  TaskListParams,
+  StageListParams,
+  StageList,
+  TaskList,
+  LogsRes
+} from './types'
+import type { ListParams } from '../types'
+import { get, post } from '../request-util'
+import axios, { type AxiosProgressEvent, type CancelTokenSource } from 'axios'
+import request from '../request'
 
-export const retryJob = (pathParams: JobParams): Promise<JobVO> => {
-  return request({
-    method: 'post',
-    url: `/clusters/${pathParams.clusterId}/jobs/${pathParams.jobId}/retry`
-  })
+export const retryJob = (pathParams: JobParams) => {
+  return post<JobVO>(`/clusters/${pathParams.clusterId}/jobs/${pathParams.jobId}/retry`)
 }
 
-export const getJobList = (clusterId: number): Promise<JobList> => {
-  return request({
-    method: 'get',
-    url: `/clusters/${clusterId}/jobs`
-  })
+export const getJobDetails = (pathParams: JobParams) => {
+  return get<JobVO>(`/clusters/${pathParams.clusterId}/jobs/${pathParams.jobId}`)
 }
 
-export const getJobDetails = (pathParams: JobParams): Promise<JobVO> => {
-  return request({
-    method: 'get',
-    url: `/clusters/${pathParams.clusterId}/jobs/${pathParams.jobId}`
-  })
+export const getJobList = (pathParams: JobListParams, params: ListParams) => {
+  return get<JobList>(`/clusters/${pathParams.clusterId}/jobs`, params)
 }
 
-export const getStageList = (pathParams: JobParams): Promise<StageVO[]> => {
-  return request({
-    method: 'get',
-    url: `/clusters/${pathParams.clusterId}/jobs/${pathParams.jobId}/stages`
-  })
+export const getStageList = (pathParams: StageListParams, params: ListParams) => {
+  return get<StageList>(`/clusters/${pathParams.clusterId}/jobs/${pathParams.jobId}/stages`, params)
 }
 
-export const getTaskList = (pathParams: TaskParams): Promise<TaskVO[]> => {
-  return request({
-    method: 'get',
-    url: `/clusters/${pathParams.clusterId}/jobs/${pathParams.jobId}/stages/${pathParams.stageId}/tasks`
-  })
+export const getTaskList = (pathParams: TaskListParams, params: ListParams) => {
+  return get<TaskList>(
+    `/clusters/${pathParams.clusterId}/jobs/${pathParams.jobId}/stages/${pathParams.stageId}/tasks`,
+    params
+  )
 }
 
-export const getTaskLog = (pathParams: TaskLogParams): Promise<string[]> => {
-  return request({
+export const getTaskLog = (pathParams: TaskLogParams, func: Function): LogsRes => {
+  const source: CancelTokenSource = axios.CancelToken.source()
+
+  const promise = request({
     method: 'get',
-    url: `/clusters/${pathParams.clusterId}/jobs/${pathParams.jobId}/stages/${pathParams.stageId}/tasks/${pathParams.taskId}/log`
+    url: `/clusters/${pathParams.clusterId}/jobs/${pathParams.jobId}/stages/${pathParams.stageId}/tasks/${pathParams.taskId}/log`,
+    responseType: 'stream',
+    timeout: 0,
+    cancelToken: source.token,
+    onDownloadProgress: (progressEvent: AxiosProgressEvent) => func(progressEvent)
   })
+
+  return { promise, cancel: source.cancel }
 }

bigtop-manager-ui/src/api/job/types.ts

@@ -18,22 +18,21 @@
  */
 
 import type { PageVO } from '@/api/types'
+import { JobState } from '@/enums/state'
 
 export type JobList = PageVO<JobVO>
 export type StageList = PageVO<StageVO>
+export type TaskList = PageVO<TaskVO>
+
 export type JobParams = { clusterId: number; jobId: number }
 export type TaskParams = JobParams & { stageId: number }
 export type TaskLogParams = TaskParams & { taskId: number }
 
-export type StateType = keyof typeof State
+export type StateType = keyof typeof JobState
 
-export enum State {
-  'Pending' = 'pending',
-  'Processing' = 'processing',
-  'Successful' = 'successful',
-  'Failed' = 'failed',
-  'Canceled' = 'canceled'
-}
+export type JobListParams = { clusterId: number }
+export type StageListParams = JobParams
+export type TaskListParams = TaskParams
 
 export interface JobVO {
   createTime?: string
@@ -65,3 +64,8 @@ export interface TaskVO {
   updateTime?: string
   [property: string]: any
 }
+
+export interface LogsRes {
+  promise: Promise<any>
+  cancel: () => void
+}

bigtop-manager-ui/src/api/request-util.ts

@@ -16,23 +16,22 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import type { ResponseEntity } from './types'
 import request from './request'
 import { AxiosRequestConfig } from 'axios'
 
-const get = <T>(url: string, config?: AxiosRequestConfig): Promise<ResponseEntity<T>> => {
-  return request.get(url, config)
+const get = <T, U = any>(url: string, params?: U, config?: AxiosRequestConfig): Promise<T> => {
+  return request.get(url, { ...config, params })
 }
 
-const post = <T, U = any>(url: string, data?: U, config?: AxiosRequestConfig): Promise<ResponseEntity<T>> => {
+const post = <T, U = any>(url: string, data?: U, config?: AxiosRequestConfig): Promise<T> => {
   return request.post(url, data, config)
 }
 
-const put = <T, U = any>(url: string, data: U, config?: AxiosRequestConfig): Promise<ResponseEntity<T>> => {
+const put = <T, U = any>(url: string, data: U, config?: AxiosRequestConfig): Promise<T> => {
   return request.put(url, data, config)
 }
 
-const del = <T>(url: string, config?: AxiosRequestConfig): Promise<ResponseEntity<T>> => {
+const del = <T>(url: string, config?: AxiosRequestConfig): Promise<T> => {
   return request.delete(url, config)
 }
 

bigtop-manager-ui/src/api/service/index.ts

@@ -17,73 +17,51 @@
  * under the License.
  */
 
+import type { ListParams } from '../types'
 import type {
   ServiceParams,
   ServiceVO,
   ServiceConfig,
   ServiceConfigSnapshot,
   ServiceList,
   SnapshotData,
-  SnapshotRecovery
+  SnapshotRecovery,
+  ServiceListParams
 } from './types'
-import request from '@/api/request.ts'
+import { get, post, del } from '@/api/request-util'
 
-export const getServiceList = (clusterId: number): Promise<ServiceList> => {
-  return request({
-    method: 'get',
-    url: `/clusters/${clusterId}/services`
-  })
+export const getServiceList = (clusterId: number, params?: ListParams & ServiceListParams) => {
+  return get<ServiceList>(`/clusters/${clusterId}/services`, params)
 }
 
-export const getService = (params: ServiceParams): Promise<ServiceVO> => {
-  return request({
-    method: 'get',
-    url: `/clusters/${params.clusterId}/services/${params.id}`
-  })
+export const getService = (pathParams: ServiceParams) => {
+  return get<ServiceVO>(`/clusters/${pathParams.clusterId}/services/${pathParams.id}`)
 }
 
-export const getServiceConfigs = (params: ServiceParams): Promise<ServiceConfig[]> => {
-  return request({
-    method: 'get',
-    url: `/clusters/${params.clusterId}/services/${params.id}/configs`
-  })
+export const getServiceConfigs = (pathParams: ServiceParams) => {
+  return get<ServiceConfig[]>(`/clusters/${pathParams.clusterId}/services/${pathParams.id}/configs`)
 }
 
-export const updateServiceConfigs = (params: ServiceParams, data: ServiceConfig): Promise<ServiceConfig[]> => {
-  return request({
-    method: 'post',
-    url: `/clusters/${params.clusterId}/services/${params.id}/configs`,
-    data
-  })
+export const updateServiceConfigs = (pathParams: ServiceParams, data: ServiceConfig) => {
+  return post<ServiceConfig[]>(`/clusters/${pathParams.clusterId}/services/${pathParams.id}/configs`, data)
 }
 
-export const getServiceConfigSnapshotsList = (params: ServiceParams): Promise<ServiceConfigSnapshot[]> => {
-  return request({
-    method: 'get',
-    url: `/clusters/${params.clusterId}/services/${params.id}/config-snapshots`
-  })
+export const getServiceConfigSnapshotsList = (pathParams: ServiceParams) => {
+  return get<ServiceConfigSnapshot[]>(`/clusters/${pathParams.clusterId}/services/${pathParams.id}/config-snapshots`)
 }
 
-export const takeServiceConfigSnapshot = (
-  params: ServiceParams,
-  data: SnapshotData
-): Promise<ServiceConfigSnapshot> => {
-  return request({
-    method: 'post',
-    url: `/clusters/${params.clusterId}/services/${params.id}/config-snapshots`,
+export const takeServiceConfigSnapshot = (pathParams: ServiceParams, data: SnapshotData) => {
+  return post<ServiceConfigSnapshot>(
+    `/clusters/${pathParams.clusterId}/services/${pathParams.id}/config-snapshots`,
     data
-  })
+  )
 }
 
-export const recoveryServiceConfigSnapshot = (params: SnapshotRecovery): Promise<ServiceConfig[]> => {
-  return request({
-    method: 'post',
-    url: `/clusters/${params.clusterId}/services/${params.id}/config-snapshots/${params.snapshotId}`
-  })
+export const recoveryServiceConfigSnapshot = (pathParams: SnapshotRecovery): Promise<ServiceConfig[]> => {
+  return post<ServiceConfig[]>(
+    `/clusters/${pathParams.clusterId}/services/${pathParams.id}/config-snapshots/${pathParams.snapshotId}`
+  )
 }
-export const deleteServiceConfigSnapshot = (params: SnapshotRecovery): Promise<boolean> => {
-  return request({
-    method: 'delete',
-    url: `/clusters/${params.clusterId}/services/${params.id}/config-snapshots/${params.snapshotId}`
-  })
+export const deleteServiceConfigSnapshot = (pathParams: SnapshotRecovery): Promise<boolean> => {
+  return del(`/clusters/${pathParams.clusterId}/services/${pathParams.id}/config-snapshots/${pathParams.snapshotId}`)
 }