This is an automated email from the ASF dual-hosted git repository.
nicholasjiang pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/paimon-webui.git
The following commit(s) were added to refs/heads/main by this push:
new 278bd58f [Feature] Introduce playground query history (#276)
278bd58f is described below
commit 278bd58f754a06080f0ebf626697264985579290
Author: xiaomo <[email protected]>
AuthorDate: Sat Jun 1 13:23:56 2024 +0800
[Feature] Introduce playground query history (#276)
---
paimon-web-ui/src/api/models/job/index.ts | 12 ++++-
paimon-web-ui/src/api/models/job/types/history.ts | 32 ++++++++++++
.../query/components/menu-tree/index.tsx | 60 ++++++++++++----------
3 files changed, 76 insertions(+), 28 deletions(-)
diff --git a/paimon-web-ui/src/api/models/job/index.ts
b/paimon-web-ui/src/api/models/job/index.ts
index 2f6858ed..8887cc8e 100644
--- a/paimon-web-ui/src/api/models/job/index.ts
+++ b/paimon-web-ui/src/api/models/job/index.ts
@@ -16,9 +16,10 @@ specific language governing permissions and limitations
under the License. */
import httpRequest from '../../request'
-import type { Job, JobResultData, JobStatus, JobSubmitDTO, ResultFetchDTO,
StopJobDTO } from '@/api/models/job/types/job'
-import type { ResponseOptions } from '@/api/types'
+import type { ResponseOptions } from '@/api/types'
+import type { Job, JobResultData, JobStatus, JobSubmitDTO, ResultFetchDTO,
StopJobDTO } from '@/api/models/job/types/job'
+import type { History, HistoryNameParams } from
'@/api/models/job/types/history'
/**
* # Submit a job
*/
@@ -53,3 +54,10 @@ export function getJobStatus(jobId: string) {
export function stopJob(stopJobDTO: StopJobDTO) {
return httpRequest.post<StopJobDTO, ResponseOptions<void>>('/job/stop',
stopJobDTO)
}
+
+/**
+ * # List job histories
+ */
+export function getJobHistoryList(params: HistoryNameParams) {
+ return httpRequest.get<HistoryNameParams,
ResponseOptions<History[]>>('/history/list', { ...params })
+}
diff --git a/paimon-web-ui/src/api/models/job/types/history.ts
b/paimon-web-ui/src/api/models/job/types/history.ts
new file mode 100644
index 00000000..f01e426d
--- /dev/null
+++ b/paimon-web-ui/src/api/models/job/types/history.ts
@@ -0,0 +1,32 @@
+/* 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
+
+ http://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 History {
+ id: number
+ name: string
+ taskType: string
+ isStreaming: boolean
+ uid: number
+ clusterId: number
+ statements: string
+}
+
+export interface HistoryNameParams {
+ name?: string
+ pageNum: number
+ pageSize: number
+}
diff --git
a/paimon-web-ui/src/views/playground/components/query/components/menu-tree/index.tsx
b/paimon-web-ui/src/views/playground/components/query/components/menu-tree/index.tsx
index 1841c277..d4136846 100644
---
a/paimon-web-ui/src/views/playground/components/query/components/menu-tree/index.tsx
+++
b/paimon-web-ui/src/views/playground/components/query/components/menu-tree/index.tsx
@@ -18,21 +18,34 @@ under the License. */
import { CloseSharp, CodeSlash, FileTrayFullOutline, Search, ServerOutline }
from '@vicons/ionicons5'
import { NIcon, type TreeOption } from 'naive-ui'
import { DatabaseOutlined } from '@vicons/antd'
+import { HistoryToggleOffOutlined } from '@vicons/material'
+
import styles from './index.module.scss'
import { useCatalogStore } from '@/store/catalog'
-import type { DataTypeDTO } from '@/api/models/catalog'
import { getColumns } from '@/api/models/catalog'
+import { getJobHistoryList } from '@/api/models/job'
+
+import type { DataTypeDTO } from '@/api/models/catalog'
+
+interface RecordItem {
+ key: number
+ label: string
+ prefix: () => VNode
+ content: string
+}
export default defineComponent({
name: 'MenuTree',
setup() {
const { t } = useLocaleHooks()
+ const message = useMessage()
const catalogStore = useCatalogStore()
const catalogStoreRef = storeToRefs(catalogStore)
const [tableColumns, useColumns] = getColumns()
const tabData = ref({}) as any
+ const recordList = ref<RecordItem[]>([])
const isDetailVisible = ref(true)
const filterValue = ref('')
const selectedKeys = ref([])
@@ -140,32 +153,11 @@ export default defineComponent({
},
]) as any
- const recordList = ref([
- {
- key: 3,
- label: 'test3',
- prefix: () =>
- h(NIcon, { color: '#0066FF' }, {
- default: () => h(CodeSlash),
- }),
- content: '',
- },
- {
- key: 4,
- label: 'test4',
- prefix: () =>
- h(NIcon, { color: '#0066FF' }, {
- default: () => h(CodeSlash),
- }),
- content: '',
- },
- ]) as any
-
- const handleClose = () => {
+ function handleClose() {
isDetailVisible.value = !isDetailVisible.value
}
- const onFetchData = async () => {
+ async function onFetchData() {
if (catalogStore.currentTable &&
Object.keys(catalogStore.currentTable).length > 0) {
useColumns({
params: catalogStore.currentTable,
@@ -173,14 +165,30 @@ export default defineComponent({
}
}
+ async function loadHistoryData() {
+ const params = { name: filterValue.value, pageNum: 1, pageSize:
Number.MAX_SAFE_INTEGER }
+ try {
+ const response = await getJobHistoryList(params)
+ recordList.value = response.data.map(item => ({
+ key: item.id,
+ label: item.name,
+ prefix: () => (<n-icon color="#0066FF"
size={20}><HistoryToggleOffOutlined /></n-icon>),
+ content: item.statements,
+ }))
+ }
+ catch (error) {
+ message.error(JSON.stringify(error))
+ }
+ }
+
watch(() => catalogStore.currentTable, onFetchData)
onMounted(() => {
+ onFetchData()
+ loadHistoryData()
catalogStore.getAllCatalogs(true)
})
- onMounted(onFetchData)
-
const columns = computed(() => tableColumns.value?.columns || [])
const getTypePrefix = (dataType: DataTypeDTO) => {
