BIGTOP-4234: Add chatbot on ui

bigtop-manager-ui/.env.development

@@ -16,6 +16,5 @@
 NODE_ENV=development
 
 VITE_APP_BASE='/'
-#VITE_APP_BASE_URL='http://172.29.40.96:8080'
 VITE_APP_BASE_URL='http://localhost:8080'
 VITE_APP_BASE_API='/api'

bigtop-manager-ui/package.json

@@ -18,11 +18,16 @@
     "clipboard": "^2.0.11",
     "dayjs": "^1.11.9",
     "echarts": "^5.4.3",
+    "github-markdown-css": "^5.6.1",
+    "highlight.js": "^11.10.0",
     "lodash": "^4.17.21",
+    "marked": "^14.1.2",
+    "marked-highlight": "^2.1.4",
     "md5": "^2.3.0",
     "pinia": "^2.1.6",
     "pinia-plugin-persistedstate": "^3.2.0",
     "vue": "^3.4.37",
+    "vue-dompurify-html": "^5.1.0",
     "vue-i18n": "^9.2.2",
     "vue-router": "^4.2.4"
   },

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

@@ -0,0 +1,108 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *    https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import request from '@/api/request.ts'
+import {
+  AuthorizedPlatform,
+  SupportedPlatform,
+  CredentialFormItem,
+  AuthCredentialTestParams,
+  AuthTestResult,
+  ChatThread,
+  ChatThreadCondition,
+  ChatThreadHistoryCondition,
+  ChatThreadHistoryItem,
+  ChatThreadDelCondition
+} from '@/api/chatbot/types.ts'
+
+export const getAuthorizedPlatforms = (): Promise<AuthorizedPlatform[]> => {
+  return request({
+    method: 'get',
+    url: '/chatbot/auth-platforms'
+  })
+}
+export const getSupportedPlatforms = (): Promise<SupportedPlatform[]> => {
+  return request({
+    method: 'get',
+    url: '/chatbot/platforms'
+  })
+}
+export const getCredentialFormModelOfPlatform = (
+  platformId: string | number
+): Promise<CredentialFormItem[]> => {
+  return request({
+    method: 'get',
+    url: `/chatbot/platforms/${platformId}/auth-credentials`
+  })
+}
+
+export const validateAuthCredentials = (
+  data: AuthCredentialTestParams
+): Promise<AuthTestResult> => {
+  return request({
+    method: 'post',
+    url: '/chatbot/auth-platforms',
+    data
+  })
+}
+
+export const getChatThreads = (
+  params: ChatThreadCondition
+): Promise<ChatThread[]> => {
+  return request({
+    method: 'get',
+    url: `/chatbot/auth-platforms/${params.authId}/threads`,
+    params: {
+      model: params.model
+    }
+  })
+}
+export const createChatThread = (
+  data: ChatThreadCondition
+): Promise<ChatThread> => {
+  return request({
+    method: 'post',
+    url: `/chatbot/auth-platforms/${data.authId}/threads?model=${data.model}`
+  })
+}
+export const getThreadChatHistory = (
+  params: ChatThreadHistoryCondition
+): Promise<ChatThreadHistoryItem[]> => {
+  return request({
+    method: 'get',
+    url: `/chatbot/auth-platforms/${params.authId}/threads/${params.threadId}/history`
+  })
+}
+
+export const delAuthorizedPlatform = (
+  authId: string | number
+): Promise<boolean> => {
+  return request({
+    method: 'delete',
+    url: `/chatbot/auth-platforms/${authId}`
+  })
+}
+export const delChatThread = (
+  params: ChatThreadDelCondition
+): Promise<boolean> => {
+  return request({
+    method: 'delete',
+    url: `/chatbot/auth-platforms/${params.authId}/threads/${params.threadId}`
+  })
+}

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

@@ -0,0 +1,94 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *    https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+export interface ChatbotConfig {
+  authId?: string | number
+  platformName?: string
+  supportModels?: string
+  model?: string
+  threadId?: string | number
+  threadName?: string
+  createTime?: string
+  updateTime?: string
+}
+export interface Platform {
+  id: string | number
+  platformId: string | number
+  platformName: string
+  supportModels: string
+  currModel?: string
+}
+
+export type AuthorizedPlatform = Platform
+
+export interface SupportedPlatform extends Platform {
+  id: string | number
+  name: string
+  supportModels: string
+}
+export interface CredentialFormItem {
+  name: string
+  displayName: string
+}
+export interface ChatThreadCondition {
+  authId: string | number
+  model: string
+}
+
+export interface ChatThread extends ChatThreadCondition {
+  threadId: string | number
+  threadName: string
+  createTime: string
+  updateTime: string
+}
+
+export interface AuthCredential {
+  key: string
+  value: string
+}
+
+export interface AuthCredentialTestParams {
+  platformId: string | number
+  authCredentials: AuthCredential[]
+}
+
+export interface AuthTestResult {
+  id: string | number
+  platformId: string | number
+  platformName: string
+  supportModels: string
+}
+
+export type Sender = 'USER' | 'SYSTEM' | 'AI'
+export interface ChatThreadHistoryItem {
+  sender: Sender
+  message: string
+  createTime?: string
+}
+
+export interface ChatThreadHistoryCondition {
+  authId: string | number
+  threadId: string | number
+}
+
+export interface SendChatMessageCondition extends ChatThreadHistoryCondition {
+  message: string
+}
+
+export type ChatThreadDelCondition = ChatThreadHistoryCondition

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

@@ -19,7 +19,8 @@
 
 import axios, { type AxiosProgressEvent, type CancelTokenSource } from 'axios'
 import request from '@/api/request.ts'
-import type { LogsRes } from './types'
+import type { chatMessagesRes, LogsRes } from './types'
+import type { SendChatMessageCondition } from '@/api/chatbot/types'
 
 export const getLogs = (
   clusterId: number,
@@ -40,3 +41,24 @@ export const getLogs = (
 
   return { promise, cancel: source.cancel }
 }
+export const sendChatMessage = (
+  data: SendChatMessageCondition,
+  func: Function
+): chatMessagesRes => {
+  const source: CancelTokenSource = axios.CancelToken.source()
+
+  const promise = request({
+    method: 'post',
+    url: `/chatbot/auth-platforms/${data.authId}/threads/${data.threadId}/talk`,
+    responseType: 'stream',
+    data: {
+      message: data.message
+    },
+    timeout: 0,
+    cancelToken: source.token,
+    onDownloadProgress: (progressEvent: AxiosProgressEvent) =>
+      func(progressEvent)
+  })
+
+  return { promise, cancel: source.cancel }
+}

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

@@ -21,3 +21,7 @@ export interface LogsRes {
   promise: Promise<any>
   cancel: () => void
 }
+export interface chatMessagesRes {
+  promise: Promise<any>
+  cancel: () => void
+}