You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@dolphinscheduler.apache.org by so...@apache.org on 2022/03/27 05:54:06 UTC
[dolphinscheduler] branch dev updated: [Feature][UI Next]Added loading state to all tables (#9215)
This is an automated email from the ASF dual-hosted git repository.
songjian pushed a commit to branch dev
in repository https://gitbox.apache.org/repos/asf/dolphinscheduler.git
The following commit(s) were added to refs/heads/dev by this push:
new aea0025 [Feature][UI Next]Added loading state to all tables (#9215)
aea0025 is described below
commit aea0025035cd787e7a6663224d5fe88e1bb88172
Author: labbomb <73...@qq.com>
AuthorDate: Sun Mar 27 13:54:00 2022 +0800
[Feature][UI Next]Added loading state to all tables (#9215)
* Added loading state to all tables
* Delete useless variables
---
.../src/views/data-quality/rule/components/rule-modal.tsx | 2 --
.../src/views/data-quality/rule/index.tsx | 5 +++--
.../src/views/data-quality/rule/use-table.ts | 8 +++++++-
.../src/views/data-quality/task-result/index.tsx | 3 ++-
.../src/views/data-quality/task-result/use-table.ts | 7 ++++++-
.../src/views/home/components/state-card.tsx | 8 ++++++--
dolphinscheduler-ui-next/src/views/home/index.tsx | 14 +++++++++-----
.../src/views/home/use-process-state.ts | 13 ++++++++++---
dolphinscheduler-ui-next/src/views/home/use-task-state.ts | 9 ++++++++-
.../src/views/monitor/statistics/audit-log/index.tsx | 4 ++--
.../src/views/monitor/statistics/audit-log/use-table.ts | 6 +++++-
dolphinscheduler-ui-next/src/views/projects/list/index.tsx | 3 ++-
.../src/views/projects/list/use-table.ts | 6 +++++-
.../src/views/projects/overview/components/state-card.tsx | 8 ++++++--
.../src/views/projects/overview/index.tsx | 14 +++++++++-----
.../src/views/projects/overview/use-process-state.ts | 9 ++++++++-
.../src/views/projects/overview/use-task-state.ts | 9 ++++++++-
.../projects/task/definition/components/use-version.ts | 6 +++++-
.../projects/task/definition/components/version-modal.tsx | 4 ++--
.../src/views/projects/task/definition/index.tsx | 3 ++-
.../src/views/projects/task/definition/use-table.ts | 6 +++++-
.../src/views/projects/task/instance/index.tsx | 3 ++-
.../src/views/projects/task/instance/use-table.ts | 6 +++++-
.../projects/workflow/definition/components/use-table.ts | 6 +++++-
.../workflow/definition/components/version-modal.tsx | 3 ++-
.../src/views/projects/workflow/definition/index.tsx | 2 ++
.../views/projects/workflow/definition/timing/index.tsx | 2 ++
.../views/projects/workflow/definition/timing/use-table.ts | 6 +++++-
.../src/views/projects/workflow/definition/use-table.ts | 6 +++++-
.../src/views/projects/workflow/instance/index.tsx | 2 ++
.../src/views/projects/workflow/instance/use-table.ts | 6 +++++-
.../src/views/resource/task-group/option/index.tsx | 4 +++-
.../src/views/resource/task-group/option/use-table.ts | 6 +++++-
.../src/views/resource/task-group/queue/index.tsx | 4 +++-
.../src/views/resource/task-group/queue/use-table.ts | 6 +++++-
.../src/views/resource/udf/function/index.tsx | 2 ++
.../src/views/resource/udf/function/use-table.ts | 6 +++++-
.../src/views/resource/udf/resource/index.tsx | 2 ++
.../src/views/resource/udf/resource/use-table.ts | 6 +++++-
.../src/views/security/alarm-group-manage/index.tsx | 5 +++--
.../src/views/security/alarm-group-manage/use-table.ts | 6 +++++-
.../src/views/security/environment-manage/index.tsx | 4 +++-
.../src/views/security/environment-manage/use-table.ts | 6 +++++-
.../src/views/security/k8s-namespace-manage/index.tsx | 4 +++-
.../src/views/security/k8s-namespace-manage/use-table.ts | 6 +++++-
.../src/views/security/tenant-manage/index.tsx | 3 ++-
.../src/views/security/tenant-manage/use-table.ts | 8 ++++++--
.../src/views/security/token-manage/index.tsx | 4 +++-
.../src/views/security/token-manage/use-table.ts | 6 +++++-
.../src/views/security/worker-group-manage/index.tsx | 4 +++-
.../src/views/security/worker-group-manage/use-table.ts | 6 +++++-
.../src/views/security/yarn-queue-manage/index.tsx | 4 +++-
.../src/views/security/yarn-queue-manage/use-table.ts | 6 +++++-
53 files changed, 231 insertions(+), 66 deletions(-)
diff --git a/dolphinscheduler-ui-next/src/views/data-quality/rule/components/rule-modal.tsx b/dolphinscheduler-ui-next/src/views/data-quality/rule/components/rule-modal.tsx
index 9afffc1..3cc5504 100644
--- a/dolphinscheduler-ui-next/src/views/data-quality/rule/components/rule-modal.tsx
+++ b/dolphinscheduler-ui-next/src/views/data-quality/rule/components/rule-modal.tsx
@@ -19,7 +19,6 @@ import { defineComponent, PropType } from 'vue'
import { useI18n } from 'vue-i18n'
import { NDataTable } from 'naive-ui'
import Modal from '@/components/modal'
-import styles from '../index.module.scss'
import { TableColumns } from 'naive-ui/es/data-table/src/interface'
const props = {
@@ -94,7 +93,6 @@ export default defineComponent({
data={this.ruleInputEntryList}
striped
size={'small'}
- class={styles.table}
/>
</Modal>
)
diff --git a/dolphinscheduler-ui-next/src/views/data-quality/rule/index.tsx b/dolphinscheduler-ui-next/src/views/data-quality/rule/index.tsx
index 6620912..fdeeb8a 100644
--- a/dolphinscheduler-ui-next/src/views/data-quality/rule/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/data-quality/rule/index.tsx
@@ -100,7 +100,8 @@ const TaskResult = defineComponent({
onCancel,
onConfirm,
viewRuleEntry,
- ruleEntryData
+ ruleEntryData,
+ loadingRef
} = this
const { columns } = useTable(viewRuleEntry)
@@ -127,7 +128,7 @@ const TaskResult = defineComponent({
</NSpace>
</NCard>
<Card class={styles['table-card']}>
- <NDataTable columns={columns} data={this.tableData} />
+ <NDataTable loading={loadingRef} columns={columns} data={this.tableData} />
<div class={styles.pagination}>
<NPagination
v-model:page={this.page}
diff --git a/dolphinscheduler-ui-next/src/views/data-quality/rule/use-table.ts b/dolphinscheduler-ui-next/src/views/data-quality/rule/use-table.ts
index a5e38a2..cb488ff 100644
--- a/dolphinscheduler-ui-next/src/views/data-quality/rule/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/data-quality/rule/use-table.ts
@@ -35,7 +35,8 @@ export function useTable(viewRuleEntry = (unusedRuleJson: string): void => {}) {
pageSize: ref(10),
state: ref(null),
searchVal: ref(null),
- totalPage: ref(1)
+ totalPage: ref(1),
+ loadingRef: ref(false)
})
const columns: TableColumns<any> = [
@@ -97,6 +98,8 @@ export function useTable(viewRuleEntry = (unusedRuleJson: string): void => {}) {
]
const getTableData = (params: any) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const data = {
pageSize: params.pageSize,
pageNo: params.pageNo,
@@ -129,12 +132,15 @@ export function useTable(viewRuleEntry = (unusedRuleJson: string): void => {}) {
'yyyy-MM-dd HH:mm:ss'
)
+
return {
...item,
ruleName: ruleNameLocale,
ruleTypeName: ruleTypeName
}
}) as any
+
+ variables.loadingRef = false
}),
{}
)
diff --git a/dolphinscheduler-ui-next/src/views/data-quality/task-result/index.tsx b/dolphinscheduler-ui-next/src/views/data-quality/task-result/index.tsx
index 2298064..eb43a95 100644
--- a/dolphinscheduler-ui-next/src/views/data-quality/task-result/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/data-quality/task-result/index.tsx
@@ -77,7 +77,7 @@ const TaskResult = defineComponent({
}
},
render() {
- const { t, requestTableData, onUpdatePageSize, onSearch } = this
+ const { t, requestTableData, onUpdatePageSize, onSearch, loadingRef } = this
return (
<>
@@ -156,6 +156,7 @@ const TaskResult = defineComponent({
</NCard>
<Card class={styles['table-card']}>
<NDataTable
+ loading={loadingRef}
columns={this.columns}
data={this.tableData}
scrollX={this.tableWidth}
diff --git a/dolphinscheduler-ui-next/src/views/data-quality/task-result/use-table.ts b/dolphinscheduler-ui-next/src/views/data-quality/task-result/use-table.ts
index ae6dc97..50991c7 100644
--- a/dolphinscheduler-ui-next/src/views/data-quality/task-result/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/data-quality/task-result/use-table.ts
@@ -44,7 +44,8 @@ export function useTable() {
state: ref(null),
searchVal: ref(null),
datePickerRange: ref(null),
- totalPage: ref(1)
+ totalPage: ref(1),
+ loadingRef: ref(false)
})
const createColumns = (variables: any) => {
@@ -191,6 +192,8 @@ export function useTable() {
}
const getTableData = (params: any) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const data = {
pageSize: params.pageSize,
pageNo: params.pageNo,
@@ -212,6 +215,8 @@ export function useTable() {
...item
}
}) as any
+
+ variables.loadingRef = false
}),
{}
)
diff --git a/dolphinscheduler-ui-next/src/views/home/components/state-card.tsx b/dolphinscheduler-ui-next/src/views/home/components/state-card.tsx
index 87a902e..d3dda37 100644
--- a/dolphinscheduler-ui-next/src/views/home/components/state-card.tsx
+++ b/dolphinscheduler-ui-next/src/views/home/components/state-card.tsx
@@ -36,6 +36,10 @@ const props = {
chartData: {
type: Array as PropType<Array<StateChartData>>,
default: () => []
+ },
+ loadingRef: {
+ type: Boolean as PropType<boolean>,
+ default: false
}
}
@@ -51,9 +55,8 @@ const StateCard = defineComponent({
return { onUpdateDatePickerValue }
},
render() {
- const { title, date, tableData, chartData, onUpdateDatePickerValue } = this
+ const { title, date, tableData, chartData, onUpdateDatePickerValue, loadingRef } = this
const { columnsRef } = useTable()
-
return (
<Card title={title}>
{{
@@ -63,6 +66,7 @@ const StateCard = defineComponent({
<NGi>
{tableData && (
<NDataTable
+ loading={loadingRef}
columns={columnsRef}
data={tableData}
striped
diff --git a/dolphinscheduler-ui-next/src/views/home/index.tsx b/dolphinscheduler-ui-next/src/views/home/index.tsx
index 4395daa..4287905 100644
--- a/dolphinscheduler-ui-next/src/views/home/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/home/index.tsx
@@ -15,7 +15,7 @@
* limitations under the License.
*/
-import { defineComponent, onMounted, ref, watch } from 'vue'
+import { defineComponent, onMounted, ref, toRefs, watch } from 'vue'
import { NGrid, NGi } from 'naive-ui'
import { startOfToday, getTime } from 'date-fns'
import { useI18n } from 'vue-i18n'
@@ -31,8 +31,8 @@ export default defineComponent({
const dateRef = ref([getTime(startOfToday()), Date.now()])
const taskStateRef = ref()
const processStateRef = ref()
- const { getTaskState } = useTaskState()
- const { getProcessState } = useProcessState()
+ const { getTaskState, taskVariables } = useTaskState()
+ const { getProcessState, processVariables } = useProcessState()
const initData = () => {
taskStateRef.value = getTaskState(dateRef.value)
@@ -62,11 +62,13 @@ export default defineComponent({
handleTaskDate,
handleProcessDate,
taskStateRef,
- processStateRef
+ processStateRef,
+ ...toRefs(taskVariables),
+ ...toRefs(processVariables),
}
},
render() {
- const { t, dateRef, handleTaskDate, handleProcessDate } = this
+ const { t, dateRef, handleTaskDate, handleProcessDate, taskLoadingRef, processLoadingRef } = this
return (
<div>
@@ -78,6 +80,7 @@ export default defineComponent({
tableData={this.taskStateRef?.value.table}
chartData={this.taskStateRef?.value.chart}
onUpdateDatePickerValue={handleTaskDate}
+ loadingRef={taskLoadingRef}
/>
</NGi>
<NGi>
@@ -87,6 +90,7 @@ export default defineComponent({
tableData={this.processStateRef?.value.table}
chartData={this.processStateRef?.value.chart}
onUpdateDatePickerValue={handleProcessDate}
+ loadingRef={processLoadingRef}
/>
</NGi>
</NGrid>
diff --git a/dolphinscheduler-ui-next/src/views/home/use-process-state.ts b/dolphinscheduler-ui-next/src/views/home/use-process-state.ts
index 2e367bf..18c287e 100644
--- a/dolphinscheduler-ui-next/src/views/home/use-process-state.ts
+++ b/dolphinscheduler-ui-next/src/views/home/use-process-state.ts
@@ -22,11 +22,17 @@ import { toLower } from 'lodash'
import { useI18n } from 'vue-i18n'
import type { TaskStateRes } from '@/service/modules/projects-analysis/types'
import type { StateData } from './types'
+import { reactive, ref } from 'vue'
export function useProcessState() {
const { t } = useI18n()
+ const processVariables = reactive({
+ processLoadingRef: ref(false)
+ })
const getProcessState = (date: Array<number>) => {
+ if (processVariables.processLoadingRef) return
+ processVariables.processLoadingRef = true
const { state } = useAsyncState(
countProcessInstanceState({
startDate: !date ? '' : format(date[0], 'yyyy-MM-dd HH:mm:ss'),
@@ -46,14 +52,15 @@ export function useProcessState() {
name: t('home.' + toLower(item.taskStateType))
}
})
-
+
+ processVariables.processLoadingRef = false
return { table, chart }
}),
{ table: [], chart: [] }
- )
+ )
return state
}
- return { getProcessState }
+ return { getProcessState, processVariables }
}
diff --git a/dolphinscheduler-ui-next/src/views/home/use-task-state.ts b/dolphinscheduler-ui-next/src/views/home/use-task-state.ts
index f91a1b7..ffc5825 100644
--- a/dolphinscheduler-ui-next/src/views/home/use-task-state.ts
+++ b/dolphinscheduler-ui-next/src/views/home/use-task-state.ts
@@ -22,11 +22,17 @@ import { useI18n } from 'vue-i18n'
import { countTaskState } from '@/service/modules/projects-analysis'
import type { TaskStateRes } from '@/service/modules/projects-analysis/types'
import type { StateData } from './types'
+import { reactive, ref } from 'vue'
export function useTaskState() {
const { t } = useI18n()
+ const taskVariables = reactive({
+ taskLoadingRef: ref(false)
+ })
const getTaskState = (date: Array<any>) => {
+ if (taskVariables.taskLoadingRef) return
+ taskVariables.taskLoadingRef = true
const { state } = useAsyncState(
countTaskState({
startDate: !date ? '' : format(date[0], 'yyyy-MM-dd HH:mm:ss'),
@@ -46,6 +52,7 @@ export function useTaskState() {
name: t('home.' + toLower(item.taskStateType))
}
})
+ taskVariables.taskLoadingRef = false
return { table, chart }
}),
@@ -55,5 +62,5 @@ export function useTaskState() {
return state
}
- return { getTaskState }
+ return { getTaskState, taskVariables }
}
diff --git a/dolphinscheduler-ui-next/src/views/monitor/statistics/audit-log/index.tsx b/dolphinscheduler-ui-next/src/views/monitor/statistics/audit-log/index.tsx
index b5d64ab..07a996c 100644
--- a/dolphinscheduler-ui-next/src/views/monitor/statistics/audit-log/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/monitor/statistics/audit-log/index.tsx
@@ -77,7 +77,7 @@ const AuditLog = defineComponent({
}
},
render() {
- const { t, requestTableData, onUpdatePageSize, onSearch } = this
+ const { t, requestTableData, onUpdatePageSize, onSearch, loadingRef } = this
return (
<>
@@ -139,7 +139,7 @@ const AuditLog = defineComponent({
</NSpace>
</NCard>
<Card class={styles['table-card']}>
- <NDataTable columns={this.columns} data={this.tableData} />
+ <NDataTable loading={loadingRef} columns={this.columns} data={this.tableData} />
<div class={styles.pagination}>
<NPagination
v-model:page={this.page}
diff --git a/dolphinscheduler-ui-next/src/views/monitor/statistics/audit-log/use-table.ts b/dolphinscheduler-ui-next/src/views/monitor/statistics/audit-log/use-table.ts
index 7b5260b..a1871e2 100644
--- a/dolphinscheduler-ui-next/src/views/monitor/statistics/audit-log/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/monitor/statistics/audit-log/use-table.ts
@@ -35,7 +35,8 @@ export function useTable() {
operationType: ref(null),
userName: ref(null),
datePickerRange: ref(null),
- totalPage: ref(1)
+ totalPage: ref(1),
+ loadingRef: ref(false)
})
const createColumns = (variables: any) => {
@@ -69,6 +70,8 @@ export function useTable() {
}
const getTableData = (params: any) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const data = {
pageSize: params.pageSize,
pageNo: params.pageNo,
@@ -90,6 +93,7 @@ export function useTable() {
...item
}
}) as any
+ variables.loadingRef = false
}),
{}
)
diff --git a/dolphinscheduler-ui-next/src/views/projects/list/index.tsx b/dolphinscheduler-ui-next/src/views/projects/list/index.tsx
index 2d901d6..4029049 100644
--- a/dolphinscheduler-ui-next/src/views/projects/list/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/projects/list/index.tsx
@@ -91,7 +91,7 @@ const list = defineComponent({
}
},
render() {
- const { t } = this
+ const { t, loadingRef } = this
return (
<div>
<NCard>
@@ -124,6 +124,7 @@ const list = defineComponent({
class={styles['table-card']}
>
<NDataTable
+ loading={loadingRef}
columns={this.columns}
data={this.tableData}
scrollX={this.tableWidth}
diff --git a/dolphinscheduler-ui-next/src/views/projects/list/use-table.ts b/dolphinscheduler-ui-next/src/views/projects/list/use-table.ts
index c708c6d..4ee5727 100644
--- a/dolphinscheduler-ui-next/src/views/projects/list/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/projects/list/use-table.ts
@@ -218,10 +218,13 @@ export function useTable() {
totalPage: ref(1),
showModalRef: ref(false),
statusRef: ref(0),
- row: {}
+ row: {},
+ loadingRef: ref(false)
})
const getTableData = (params: any) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const { state } = useAsyncState(
queryProjectListPaging(params).then((res: ProjectRes) => {
variables.totalPage = res.totalPage
@@ -238,6 +241,7 @@ export function useTable() {
...item
}
}) as any
+ variables.loadingRef = false
}),
{}
)
diff --git a/dolphinscheduler-ui-next/src/views/projects/overview/components/state-card.tsx b/dolphinscheduler-ui-next/src/views/projects/overview/components/state-card.tsx
index 87a902e..d3dda37 100644
--- a/dolphinscheduler-ui-next/src/views/projects/overview/components/state-card.tsx
+++ b/dolphinscheduler-ui-next/src/views/projects/overview/components/state-card.tsx
@@ -36,6 +36,10 @@ const props = {
chartData: {
type: Array as PropType<Array<StateChartData>>,
default: () => []
+ },
+ loadingRef: {
+ type: Boolean as PropType<boolean>,
+ default: false
}
}
@@ -51,9 +55,8 @@ const StateCard = defineComponent({
return { onUpdateDatePickerValue }
},
render() {
- const { title, date, tableData, chartData, onUpdateDatePickerValue } = this
+ const { title, date, tableData, chartData, onUpdateDatePickerValue, loadingRef } = this
const { columnsRef } = useTable()
-
return (
<Card title={title}>
{{
@@ -63,6 +66,7 @@ const StateCard = defineComponent({
<NGi>
{tableData && (
<NDataTable
+ loading={loadingRef}
columns={columnsRef}
data={tableData}
striped
diff --git a/dolphinscheduler-ui-next/src/views/projects/overview/index.tsx b/dolphinscheduler-ui-next/src/views/projects/overview/index.tsx
index 9cbfaf4..f71aed4 100644
--- a/dolphinscheduler-ui-next/src/views/projects/overview/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/projects/overview/index.tsx
@@ -15,7 +15,7 @@
* limitations under the License.
*/
-import { defineComponent, onMounted, ref, watch } from 'vue'
+import { defineComponent, onMounted, ref, toRefs, watch } from 'vue'
import { NGrid, NGi } from 'naive-ui'
import { startOfToday, getTime } from 'date-fns'
import { useI18n } from 'vue-i18n'
@@ -31,8 +31,8 @@ const workflowMonitor = defineComponent({
const dateRef = ref([getTime(startOfToday()), Date.now()])
const taskStateRef = ref()
const processStateRef = ref()
- const { getTaskState } = useTaskState()
- const { getProcessState } = useProcessState()
+ const { getTaskState, taskVariables } = useTaskState()
+ const { getProcessState, processVariables } = useProcessState()
const handleTaskDate = (val: any) => {
taskStateRef.value = getTaskState(val)
@@ -62,11 +62,13 @@ const workflowMonitor = defineComponent({
handleTaskDate,
handleProcessDate,
taskStateRef,
- processStateRef
+ processStateRef,
+ ...toRefs(taskVariables),
+ ...toRefs(processVariables),
}
},
render() {
- const { t, dateRef, handleTaskDate, handleProcessDate } = this
+ const { t, dateRef, handleTaskDate, handleProcessDate, taskLoadingRef, processLoadingRef } = this
return (
<div>
@@ -78,6 +80,7 @@ const workflowMonitor = defineComponent({
tableData={this.taskStateRef?.value.table}
chartData={this.taskStateRef?.value.chart}
onUpdateDatePickerValue={handleTaskDate}
+ loadingRef={taskLoadingRef}
/>
</NGi>
<NGi>
@@ -87,6 +90,7 @@ const workflowMonitor = defineComponent({
tableData={this.processStateRef?.value.table}
chartData={this.processStateRef?.value.chart}
onUpdateDatePickerValue={handleProcessDate}
+ loadingRef={processLoadingRef}
/>
</NGi>
</NGrid>
diff --git a/dolphinscheduler-ui-next/src/views/projects/overview/use-process-state.ts b/dolphinscheduler-ui-next/src/views/projects/overview/use-process-state.ts
index b4d7f9e..dbadba7 100644
--- a/dolphinscheduler-ui-next/src/views/projects/overview/use-process-state.ts
+++ b/dolphinscheduler-ui-next/src/views/projects/overview/use-process-state.ts
@@ -23,12 +23,18 @@ import { toLower } from 'lodash'
import { useI18n } from 'vue-i18n'
import type { TaskStateRes } from '@/service/modules/projects-analysis/types'
import type { StateData } from './types'
+import { reactive, ref } from 'vue'
export function useProcessState() {
const route = useRoute()
const { t } = useI18n()
+ const processVariables = reactive({
+ processLoadingRef: ref(false)
+ })
const getProcessState = (date: Array<number>) => {
+ if (processVariables.processLoadingRef) return
+ processVariables.processLoadingRef = true
const { state } = useAsyncState(
countProcessInstanceState({
startDate: !date ? '' : format(date[0], 'yyyy-MM-dd HH:mm:ss'),
@@ -48,6 +54,7 @@ export function useProcessState() {
name: t('home.' + toLower(item.taskStateType))
}
})
+ processVariables.processLoadingRef = false
return { table, chart }
}),
@@ -57,5 +64,5 @@ export function useProcessState() {
return state
}
- return { getProcessState }
+ return { getProcessState, processVariables }
}
diff --git a/dolphinscheduler-ui-next/src/views/projects/overview/use-task-state.ts b/dolphinscheduler-ui-next/src/views/projects/overview/use-task-state.ts
index 0bee982..5bc99a9 100644
--- a/dolphinscheduler-ui-next/src/views/projects/overview/use-task-state.ts
+++ b/dolphinscheduler-ui-next/src/views/projects/overview/use-task-state.ts
@@ -23,12 +23,18 @@ import { useI18n } from 'vue-i18n'
import { countTaskState } from '@/service/modules/projects-analysis'
import type { TaskStateRes } from '@/service/modules/projects-analysis/types'
import type { StateData } from './types'
+import { reactive, ref } from 'vue'
export function useTaskState() {
const route = useRoute()
const { t } = useI18n()
+ const taskVariables = reactive({
+ taskLoadingRef: ref(false)
+ })
const getTaskState = (date: Array<number>) => {
+ if (taskVariables.taskLoadingRef) return
+ taskVariables.taskLoadingRef = true
const { state } = useAsyncState(
countTaskState({
startDate: !date ? '' : format(date[0], 'yyyy-MM-dd HH:mm:ss'),
@@ -48,6 +54,7 @@ export function useTaskState() {
name: t('home.' + toLower(item.taskStateType))
}
})
+ taskVariables.taskLoadingRef = false
return { table, chart }
}),
@@ -57,5 +64,5 @@ export function useTaskState() {
return state
}
- return { getTaskState }
+ return { getTaskState, taskVariables }
}
diff --git a/dolphinscheduler-ui-next/src/views/projects/task/definition/components/use-version.ts b/dolphinscheduler-ui-next/src/views/projects/task/definition/components/use-version.ts
index 109aeb1..924dca6 100644
--- a/dolphinscheduler-ui-next/src/views/projects/task/definition/components/use-version.ts
+++ b/dolphinscheduler-ui-next/src/views/projects/task/definition/components/use-version.ts
@@ -158,7 +158,8 @@ export function useVersion() {
taskVersion: ref(null),
taskCode: ref(null),
refreshTaskDefinition: ref(false),
- row: {}
+ row: {},
+ loadingRef: ref(false)
})
const handleSwitchVersion = (row: TaskDefinitionVersionItem) => {
@@ -182,6 +183,8 @@ export function useVersion() {
}
const getTableData = (params: any) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const { state } = useAsyncState(
queryTaskVersions(
{ ...params },
@@ -194,6 +197,7 @@ export function useVersion() {
}
}) as any
variables.totalPage = res.totalPage
+ variables.loadingRef = false
}),
{}
)
diff --git a/dolphinscheduler-ui-next/src/views/projects/task/definition/components/version-modal.tsx b/dolphinscheduler-ui-next/src/views/projects/task/definition/components/version-modal.tsx
index 289755a..3fd657f 100644
--- a/dolphinscheduler-ui-next/src/views/projects/task/definition/components/version-modal.tsx
+++ b/dolphinscheduler-ui-next/src/views/projects/task/definition/components/version-modal.tsx
@@ -77,7 +77,7 @@ const VersionModal = defineComponent({
return { t, ...toRefs(variables), requestData, onConfirm }
},
render() {
- const { t, requestData, onConfirm, show } = this
+ const { t, requestData, onConfirm, show, loadingRef } = this
return (
<Modal
@@ -86,7 +86,7 @@ const VersionModal = defineComponent({
cancelShow={false}
onConfirm={onConfirm}
>
- <NDataTable columns={this.columns} data={this.tableData} />
+ <NDataTable loading={loadingRef} columns={this.columns} data={this.tableData} />
<div class={styles.pagination}>
<NPagination
v-model:page={this.page}
diff --git a/dolphinscheduler-ui-next/src/views/projects/task/definition/index.tsx b/dolphinscheduler-ui-next/src/views/projects/task/definition/index.tsx
index bf59455..9e573d1 100644
--- a/dolphinscheduler-ui-next/src/views/projects/task/definition/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/projects/task/definition/index.tsx
@@ -114,7 +114,7 @@ const TaskDefinition = defineComponent({
}
},
render() {
- const { t, onSearch, requestData, onUpdatePageSize, onRefresh, onCreate } =
+ const { t, onSearch, requestData, onUpdatePageSize, onRefresh, onCreate, loadingRef } =
this
return (
@@ -163,6 +163,7 @@ const TaskDefinition = defineComponent({
</NCard>
<Card class={styles['table-card']}>
<NDataTable
+ loading={loadingRef}
columns={this.columns}
data={this.tableData}
scrollX={this.tableWidth}
diff --git a/dolphinscheduler-ui-next/src/views/projects/task/definition/use-table.ts b/dolphinscheduler-ui-next/src/views/projects/task/definition/use-table.ts
index 871496f..3fbb755 100644
--- a/dolphinscheduler-ui-next/src/views/projects/task/definition/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/projects/task/definition/use-table.ts
@@ -266,7 +266,8 @@ export function useTable(onEdit: Function) {
taskType: ref(null),
showVersionModalRef: ref(false),
showMoveModalRef: ref(false),
- row: {}
+ row: {},
+ loadingRef: ref(false)
})
const handleDelete = (row: any) => {
@@ -285,6 +286,8 @@ export function useTable(onEdit: Function) {
}
const getTableData = (params: any) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const { state } = useAsyncState(
queryTaskDefinitionListPaging({ ...params }, { projectCode }).then(
(res: TaskDefinitionRes) => {
@@ -302,6 +305,7 @@ export function useTable(onEdit: Function) {
}
}) as any
variables.totalPage = res.totalPage
+ variables.loadingRef = false
}
),
{}
diff --git a/dolphinscheduler-ui-next/src/views/projects/task/instance/index.tsx b/dolphinscheduler-ui-next/src/views/projects/task/instance/index.tsx
index b8f5fa7..382d0b2 100644
--- a/dolphinscheduler-ui-next/src/views/projects/task/instance/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/projects/task/instance/index.tsx
@@ -86,7 +86,7 @@ const TaskInstance = defineComponent({
}
},
render() {
- const { t, requestTableData, onUpdatePageSize, onSearch, onConfirmModal } =
+ const { t, requestTableData, onUpdatePageSize, onSearch, onConfirmModal, loadingRef } =
this
return (
@@ -183,6 +183,7 @@ const TaskInstance = defineComponent({
</NCard>
<Card class={styles['table-card']}>
<NDataTable
+ loading={loadingRef}
columns={this.columns}
data={this.tableData}
scrollX={this.tableWidth}
diff --git a/dolphinscheduler-ui-next/src/views/projects/task/instance/use-table.ts b/dolphinscheduler-ui-next/src/views/projects/task/instance/use-table.ts
index 26f58bd..88e9cb1 100644
--- a/dolphinscheduler-ui-next/src/views/projects/task/instance/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/projects/task/instance/use-table.ts
@@ -62,7 +62,8 @@ export function useTable() {
processInstanceName: ref(null),
totalPage: ref(1),
showModalRef: ref(false),
- row: {}
+ row: {},
+ loadingRef: ref(false)
})
const createColumns = (variables: any) => {
@@ -268,6 +269,8 @@ export function useTable() {
}
const getTableData = (params: any) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const data = {
pageSize: params.pageSize,
pageNo: params.pageNo,
@@ -306,6 +309,7 @@ export function useTable() {
}
}) as any
variables.totalPage = res.totalPage
+ variables.loadingRef = false
}
),
{}
diff --git a/dolphinscheduler-ui-next/src/views/projects/workflow/definition/components/use-table.ts b/dolphinscheduler-ui-next/src/views/projects/workflow/definition/components/use-table.ts
index 145188b..c543ce4 100644
--- a/dolphinscheduler-ui-next/src/views/projects/workflow/definition/components/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/projects/workflow/definition/components/use-table.ts
@@ -152,10 +152,13 @@ export function useTable(
page: ref(1),
totalPage: ref(1),
pageSize: ref(10),
- projectCode: ref(Number(router.currentRoute.value.params.projectCode))
+ projectCode: ref(Number(router.currentRoute.value.params.projectCode)),
+ loadingRef: ref(false)
})
const getTableData = (row: any) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
variables.row = row
queryVersions(
{
@@ -168,6 +171,7 @@ export function useTable(
variables.tableData = res.totalList.map((item: any) => ({ ...item }))
variables.totalPage = res.totalPage
+ variables.loadingRef = false
})
}
diff --git a/dolphinscheduler-ui-next/src/views/projects/workflow/definition/components/version-modal.tsx b/dolphinscheduler-ui-next/src/views/projects/workflow/definition/components/version-modal.tsx
index 52d6192..3d76129 100644
--- a/dolphinscheduler-ui-next/src/views/projects/workflow/definition/components/version-modal.tsx
+++ b/dolphinscheduler-ui-next/src/views/projects/workflow/definition/components/version-modal.tsx
@@ -80,7 +80,7 @@ export default defineComponent({
render() {
const { t } = useI18n()
- const { requestData } = this
+ const { requestData, loadingRef } = this
return (
<Modal
@@ -90,6 +90,7 @@ export default defineComponent({
onConfirm={this.hideModal}
>
<NDataTable
+ loading={loadingRef}
columns={this.columns}
data={this.tableData}
striped
diff --git a/dolphinscheduler-ui-next/src/views/projects/workflow/definition/index.tsx b/dolphinscheduler-ui-next/src/views/projects/workflow/definition/index.tsx
index aef090b..4563b66 100644
--- a/dolphinscheduler-ui-next/src/views/projects/workflow/definition/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/projects/workflow/definition/index.tsx
@@ -112,6 +112,7 @@ export default defineComponent({
},
render() {
const { t } = useI18n()
+ const { loadingRef } = this
return (
<div class={styles.content}>
@@ -150,6 +151,7 @@ export default defineComponent({
</Card>
<Card title={t('project.workflow.workflow_definition')}>
<NDataTable
+ loading={loadingRef}
rowKey={(row) => row.code}
columns={this.columns}
data={this.tableData}
diff --git a/dolphinscheduler-ui-next/src/views/projects/workflow/definition/timing/index.tsx b/dolphinscheduler-ui-next/src/views/projects/workflow/definition/timing/index.tsx
index 4c5f15a..f2dc456 100644
--- a/dolphinscheduler-ui-next/src/views/projects/workflow/definition/timing/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/projects/workflow/definition/timing/index.tsx
@@ -73,6 +73,7 @@ export default defineComponent({
render() {
const { t } = useI18n()
const router: Router = useRouter()
+ const { loadingRef } = this
return (
<div class={styles.content}>
@@ -87,6 +88,7 @@ export default defineComponent({
</Card>
<Card title={t('project.workflow.cron_manage')}>
<NDataTable
+ loading={loadingRef}
columns={this.columns}
data={this.tableData}
striped
diff --git a/dolphinscheduler-ui-next/src/views/projects/workflow/definition/timing/use-table.ts b/dolphinscheduler-ui-next/src/views/projects/workflow/definition/timing/use-table.ts
index 6ba3d78..4a253c1 100644
--- a/dolphinscheduler-ui-next/src/views/projects/workflow/definition/timing/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/projects/workflow/definition/timing/use-table.ts
@@ -55,7 +55,8 @@ export function useTable() {
pageSize: ref(10),
searchVal: ref(),
totalPage: ref(1),
- showRef: ref(false)
+ showRef: ref(false),
+ loadingRef: ref(false)
})
const renderTime = (time: string, timeZone: string) => {
@@ -243,6 +244,8 @@ export function useTable() {
}
const getTableData = (params: ISearchParam) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const definitionCode = Number(
router.currentRoute.value.params.definitionCode
)
@@ -254,6 +257,7 @@ export function useTable() {
variables.tableData = res.totalList.map((item: any) => {
return { ...item }
})
+ variables.loadingRef = false
})
}
diff --git a/dolphinscheduler-ui-next/src/views/projects/workflow/definition/use-table.ts b/dolphinscheduler-ui-next/src/views/projects/workflow/definition/use-table.ts
index 71c6d80..375a295 100644
--- a/dolphinscheduler-ui-next/src/views/projects/workflow/definition/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/projects/workflow/definition/use-table.ts
@@ -60,7 +60,8 @@ export function useTable() {
startShowRef: ref(false),
timingShowRef: ref(false),
versionShowRef: ref(false),
- copyShowRef: ref(false)
+ copyShowRef: ref(false),
+ loadingRef: ref(false)
})
const createColumns = (variables: any) => {
@@ -337,12 +338,15 @@ export function useTable() {
}
const getTableData = (params: IDefinitionParam) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const { state } = useAsyncState(
queryListPaging({ ...params }, variables.projectCode).then((res: any) => {
variables.totalPage = res.totalPage
variables.tableData = res.totalList.map((item: any) => {
return { ...item }
})
+ variables.loadingRef = false
}),
{ total: 0, table: [] }
)
diff --git a/dolphinscheduler-ui-next/src/views/projects/workflow/instance/index.tsx b/dolphinscheduler-ui-next/src/views/projects/workflow/instance/index.tsx
index bf07245..1f4c73b 100644
--- a/dolphinscheduler-ui-next/src/views/projects/workflow/instance/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/projects/workflow/instance/index.tsx
@@ -89,6 +89,7 @@ export default defineComponent({
},
render() {
const { t } = useI18n()
+ const { loadingRef } = this
return (
<div class={styles.content}>
@@ -99,6 +100,7 @@ export default defineComponent({
</Card>
<Card title={t('project.workflow.workflow_instance')}>
<NDataTable
+ loading={loadingRef}
rowKey={(row) => row.id}
columns={this.columns}
data={this.tableData}
diff --git a/dolphinscheduler-ui-next/src/views/projects/workflow/instance/use-table.ts b/dolphinscheduler-ui-next/src/views/projects/workflow/instance/use-table.ts
index 9335b68..6a212a0 100644
--- a/dolphinscheduler-ui-next/src/views/projects/workflow/instance/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/projects/workflow/instance/use-table.ts
@@ -61,7 +61,8 @@ export function useTable() {
stateType: ref(),
startDate: ref(),
endDate: ref(),
- projectCode: ref(Number(router.currentRoute.value.params.projectCode))
+ projectCode: ref(Number(router.currentRoute.value.params.projectCode)),
+ loadingRef: ref(false)
})
const createColumns = (variables: any) => {
@@ -236,6 +237,8 @@ export function useTable() {
}
const getTableData = () => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const params = {
pageNo: variables.page,
pageSize: variables.pageSize,
@@ -252,6 +255,7 @@ export function useTable() {
variables.tableData = res.totalList.map((item: any) => {
return { ...item }
})
+ variables.loadingRef = false
}
)
}
diff --git a/dolphinscheduler-ui-next/src/views/resource/task-group/option/index.tsx b/dolphinscheduler-ui-next/src/views/resource/task-group/option/index.tsx
index 551d9c8..f1bc052 100644
--- a/dolphinscheduler-ui-next/src/views/resource/task-group/option/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/resource/task-group/option/index.tsx
@@ -136,7 +136,8 @@ const taskGroupOption = defineComponent({
resetTableData,
onUpdatePageSize,
updateItem,
- onSearch
+ onSearch,
+ loadingRef
} = this
const { columns } = useTable(updateItem, resetTableData)
@@ -176,6 +177,7 @@ const taskGroupOption = defineComponent({
>
<div>
<NDataTable
+ loading={loadingRef}
columns={columns}
size={'small'}
data={this.tableData}
diff --git a/dolphinscheduler-ui-next/src/views/resource/task-group/option/use-table.ts b/dolphinscheduler-ui-next/src/views/resource/task-group/option/use-table.ts
index 9357bbe..93f63ca 100644
--- a/dolphinscheduler-ui-next/src/views/resource/task-group/option/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/resource/task-group/option/use-table.ts
@@ -118,10 +118,13 @@ export function useTable(
page: ref(1),
pageSize: ref(10),
name: ref(null),
- totalPage: ref(1)
+ totalPage: ref(1),
+ loadingRef: ref(false)
})
const getTableData = (params: any) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
Promise.all([queryTaskGroupListPaging(params), queryAllProjectList()]).then(
(values: any[]) => {
variables.totalPage = values[0].totalPage
@@ -149,6 +152,7 @@ export function useTable(
}
}
)
+ variables.loadingRef = false
}
)
}
diff --git a/dolphinscheduler-ui-next/src/views/resource/task-group/queue/index.tsx b/dolphinscheduler-ui-next/src/views/resource/task-group/queue/index.tsx
index 67ce2dc..89f669f 100644
--- a/dolphinscheduler-ui-next/src/views/resource/task-group/queue/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/resource/task-group/queue/index.tsx
@@ -150,7 +150,8 @@ const taskGroupQueue = defineComponent({
onSearch,
showModalRef,
updateItemData,
- taskGroupOptions
+ taskGroupOptions,
+ loadingRef
} = this
const { columns } = useTable(updatePriority, resetTableData)
@@ -192,6 +193,7 @@ const taskGroupQueue = defineComponent({
>
<div>
<NDataTable
+ loading={loadingRef}
columns={columns}
size={'small'}
data={this.tableData}
diff --git a/dolphinscheduler-ui-next/src/views/resource/task-group/queue/use-table.ts b/dolphinscheduler-ui-next/src/views/resource/task-group/queue/use-table.ts
index 7cfdc72..bd86274 100644
--- a/dolphinscheduler-ui-next/src/views/resource/task-group/queue/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/resource/task-group/queue/use-table.ts
@@ -121,10 +121,13 @@ export function useTable(
page: ref(1),
pageSize: ref(10),
groupId: ref(3),
- totalPage: ref(1)
+ totalPage: ref(1),
+ loadingRef: ref(false)
})
const getTableData = (params: any) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const taskGroupSearchParams = {
pageNo: 1,
pageSize: 2147483647
@@ -159,6 +162,7 @@ export function useTable(
}
}
)
+ variables.loadingRef = false
})
}
diff --git a/dolphinscheduler-ui-next/src/views/resource/udf/function/index.tsx b/dolphinscheduler-ui-next/src/views/resource/udf/function/index.tsx
index 8739bab..2601815 100644
--- a/dolphinscheduler-ui-next/src/views/resource/udf/function/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/resource/udf/function/index.tsx
@@ -88,6 +88,7 @@ export default defineComponent({
},
render() {
const { t } = useI18n()
+ const { loadingRef } = this
return (
<div class={styles.content}>
@@ -123,6 +124,7 @@ export default defineComponent({
</Card>
<Card title={t('resource.function.udf_function')}>
<NDataTable
+ loading={loadingRef}
columns={this.columns}
data={this.tableData}
striped
diff --git a/dolphinscheduler-ui-next/src/views/resource/udf/function/use-table.ts b/dolphinscheduler-ui-next/src/views/resource/udf/function/use-table.ts
index c1e38cf..5dfa900 100644
--- a/dolphinscheduler-ui-next/src/views/resource/udf/function/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/resource/udf/function/use-table.ts
@@ -48,7 +48,8 @@ export function useTable() {
pageSize: ref(10),
searchVal: ref(),
totalPage: ref(1),
- showRef: ref(false)
+ showRef: ref(false),
+ loadingRef: ref(false)
})
const createColumns = (variables: any) => {
@@ -162,12 +163,15 @@ export function useTable() {
}
const getTableData = (params: IUdfFunctionParam) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const { state } = useAsyncState(
queryUdfFuncListPaging({ ...params }).then((res: any) => {
variables.totalPage = res.totalPage
variables.tableData = res.totalList.map((item: any) => {
return { ...item }
})
+ variables.loadingRef = false
}),
{ total: 0, table: [] }
)
diff --git a/dolphinscheduler-ui-next/src/views/resource/udf/resource/index.tsx b/dolphinscheduler-ui-next/src/views/resource/udf/resource/index.tsx
index 2bcd409..361d227 100644
--- a/dolphinscheduler-ui-next/src/views/resource/udf/resource/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/resource/udf/resource/index.tsx
@@ -109,6 +109,7 @@ export default defineComponent({
},
render() {
const { t } = useI18n()
+ const { loadingRef } = this
return (
<div class={styles.content}>
@@ -155,6 +156,7 @@ export default defineComponent({
default: () => (
<div>
<NDataTable
+ loading={loadingRef}
columns={this.columns}
data={this.tableData}
striped
diff --git a/dolphinscheduler-ui-next/src/views/resource/udf/resource/use-table.ts b/dolphinscheduler-ui-next/src/views/resource/udf/resource/use-table.ts
index 1b5bac6..916cf5e 100644
--- a/dolphinscheduler-ui-next/src/views/resource/udf/resource/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/resource/udf/resource/use-table.ts
@@ -66,7 +66,8 @@ export function useTable() {
searchVal: ref(),
totalPage: ref(1),
folderShowRef: ref(false),
- uploadShowRef: ref(false)
+ uploadShowRef: ref(false),
+ loadingRef: ref(false)
})
const createColumns = (variables: any) => {
@@ -224,6 +225,8 @@ export function useTable() {
}
const getTableData = (params: IUdfResourceParam) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const { state } = useAsyncState(
queryResourceListPaging({ ...params, type: 'UDF' }).then((res: any) => {
const breadList =
@@ -237,6 +240,7 @@ export function useTable() {
variables.tableData = res.totalList.map((item: any) => {
return { ...item }
})
+ variables.loadingRef = false
}),
{ total: 0, table: [] }
)
diff --git a/dolphinscheduler-ui-next/src/views/security/alarm-group-manage/index.tsx b/dolphinscheduler-ui-next/src/views/security/alarm-group-manage/index.tsx
index c57d10b..975a4f6 100644
--- a/dolphinscheduler-ui-next/src/views/security/alarm-group-manage/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/security/alarm-group-manage/index.tsx
@@ -97,7 +97,8 @@ const alarmGroupManage = defineComponent({
onCancelModal,
onConfirmModal,
handleModalChange,
- onSearch
+ onSearch,
+ loadingRef
} = this
return (
@@ -129,7 +130,7 @@ const alarmGroupManage = defineComponent({
</div>
</NCard>
<Card class={styles['table-card']}>
- <NDataTable columns={this.columns} data={this.tableData} />
+ <NDataTable loading={loadingRef} columns={this.columns} data={this.tableData} />
<div class={styles.pagination}>
<NPagination
v-model:page={this.page}
diff --git a/dolphinscheduler-ui-next/src/views/security/alarm-group-manage/use-table.ts b/dolphinscheduler-ui-next/src/views/security/alarm-group-manage/use-table.ts
index 02944ac..be5e7ed 100644
--- a/dolphinscheduler-ui-next/src/views/security/alarm-group-manage/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/security/alarm-group-manage/use-table.ts
@@ -139,7 +139,8 @@ export function useTable() {
totalPage: ref(1),
showModalRef: ref(false),
statusRef: ref(0),
- row: {}
+ row: {},
+ loadingRef: ref(false)
})
const handleDelete = (row: any) => {
@@ -156,6 +157,8 @@ export function useTable() {
}
const getTableData = (params: any) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const { state } = useAsyncState(
queryAlertGroupListPaging({ ...params }).then((res: AlarmGroupRes) => {
variables.tableData = res.totalList.map((item, unused) => {
@@ -172,6 +175,7 @@ export function useTable() {
}
}) as any
variables.totalPage = res.totalPage
+ variables.loadingRef = false
}),
{}
)
diff --git a/dolphinscheduler-ui-next/src/views/security/environment-manage/index.tsx b/dolphinscheduler-ui-next/src/views/security/environment-manage/index.tsx
index 7fb2b8a..9a82baf 100644
--- a/dolphinscheduler-ui-next/src/views/security/environment-manage/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/security/environment-manage/index.tsx
@@ -97,7 +97,8 @@ const environmentManage = defineComponent({
onCancelModal,
onConfirmModal,
handleModalChange,
- onSearch
+ onSearch,
+ loadingRef
} = this
return (
@@ -135,6 +136,7 @@ const environmentManage = defineComponent({
</NCard>
<Card class={styles['table-card']}>
<NDataTable
+ loading={loadingRef}
row-class-name='items'
columns={this.columns}
data={this.tableData}
diff --git a/dolphinscheduler-ui-next/src/views/security/environment-manage/use-table.ts b/dolphinscheduler-ui-next/src/views/security/environment-manage/use-table.ts
index 908230a..115341e 100644
--- a/dolphinscheduler-ui-next/src/views/security/environment-manage/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/security/environment-manage/use-table.ts
@@ -181,7 +181,8 @@ export function useTable() {
totalPage: ref(1),
showModalRef: ref(false),
statusRef: ref(0),
- row: {}
+ row: {},
+ loadingRef: ref(false)
})
const handleDelete = (row: any) => {
@@ -198,6 +199,8 @@ export function useTable() {
}
const getTableData = (params: any) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const { state } = useAsyncState(
queryEnvironmentListPaging({ ...params }).then((res: EnvironmentRes) => {
variables.tableData = res.totalList.map((item, unused) => {
@@ -214,6 +217,7 @@ export function useTable() {
}
}) as any
variables.totalPage = res.totalPage
+ variables.loadingRef = false
}),
{}
)
diff --git a/dolphinscheduler-ui-next/src/views/security/k8s-namespace-manage/index.tsx b/dolphinscheduler-ui-next/src/views/security/k8s-namespace-manage/index.tsx
index 9ccc2ad..baaff8a 100644
--- a/dolphinscheduler-ui-next/src/views/security/k8s-namespace-manage/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/security/k8s-namespace-manage/index.tsx
@@ -98,7 +98,8 @@ const k8sNamespaceManage = defineComponent({
onCancelModal,
onConfirmModal,
handleModalChange,
- onSearch
+ onSearch,
+ loadingRef
} = this
return (
@@ -131,6 +132,7 @@ const k8sNamespaceManage = defineComponent({
</NCard>
<Card class={styles['table-card']}>
<NDataTable
+ loading={loadingRef}
columns={this.columns}
data={this.tableData}
scrollX={this.tableWidth}
diff --git a/dolphinscheduler-ui-next/src/views/security/k8s-namespace-manage/use-table.ts b/dolphinscheduler-ui-next/src/views/security/k8s-namespace-manage/use-table.ts
index 16c3e2e..4132d6b 100644
--- a/dolphinscheduler-ui-next/src/views/security/k8s-namespace-manage/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/security/k8s-namespace-manage/use-table.ts
@@ -190,10 +190,13 @@ export function useTable() {
totalPage: ref(1),
showModalRef: ref(false),
statusRef: ref(0),
- row: {}
+ row: {},
+ loadingRef: ref(false)
})
const getTableData = (params: any) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const { state } = useAsyncState(
queryNamespaceListPaging({ ...params }).then((res: NamespaceListRes) => {
variables.tableData = res.totalList.map((item, unused) => {
@@ -210,6 +213,7 @@ export function useTable() {
}
}) as any
variables.totalPage = res.totalPage
+ variables.loadingRef = false
}),
{}
)
diff --git a/dolphinscheduler-ui-next/src/views/security/tenant-manage/index.tsx b/dolphinscheduler-ui-next/src/views/security/tenant-manage/index.tsx
index d8b5b2b..e6410ca 100644
--- a/dolphinscheduler-ui-next/src/views/security/tenant-manage/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/security/tenant-manage/index.tsx
@@ -91,7 +91,7 @@ const tenementManage = defineComponent({
}
},
render() {
- const { t } = this
+ const { t, loadingRef } = this
return (
<div class={styles.container}>
<NCard>
@@ -124,6 +124,7 @@ const tenementManage = defineComponent({
class={styles['table-card']}
>
<NDataTable
+ loading={loadingRef}
columns={this.columns}
data={this.tableData}
row-class-name='items'
diff --git a/dolphinscheduler-ui-next/src/views/security/tenant-manage/use-table.ts b/dolphinscheduler-ui-next/src/views/security/tenant-manage/use-table.ts
index b6be067..30b0f3e 100644
--- a/dolphinscheduler-ui-next/src/views/security/tenant-manage/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/security/tenant-manage/use-table.ts
@@ -172,10 +172,13 @@ export function useTable() {
totalPage: ref(1),
showModalRef: ref(false),
statusRef: ref(0),
- row: {}
+ row: {},
+ loadingRef: ref(false)
})
const getTableData = (params: any) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const { state } = useAsyncState(
queryTenantListPaging({ ...params }).then((res: any) => {
variables.tableData = res.totalList.map((item: any, unused: number) => {
@@ -184,9 +187,10 @@ export function useTable() {
}
})
variables.totalPage = res.totalPage
+ variables.loadingRef = false
}),
{}
- )
+ )
return state
}
diff --git a/dolphinscheduler-ui-next/src/views/security/token-manage/index.tsx b/dolphinscheduler-ui-next/src/views/security/token-manage/index.tsx
index 4f7bdd5..89a90b6 100644
--- a/dolphinscheduler-ui-next/src/views/security/token-manage/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/security/token-manage/index.tsx
@@ -97,7 +97,8 @@ const tokenManage = defineComponent({
onCancelModal,
onConfirmModal,
handleModalChange,
- onSearch
+ onSearch,
+ loadingRef
} = this
return (
@@ -135,6 +136,7 @@ const tokenManage = defineComponent({
</NCard>
<Card class={styles['table-card']}>
<NDataTable
+ loading={loadingRef}
row-class-name='items'
columns={this.columns}
data={this.tableData}
diff --git a/dolphinscheduler-ui-next/src/views/security/token-manage/use-table.ts b/dolphinscheduler-ui-next/src/views/security/token-manage/use-table.ts
index 2a79f7f..ccc1a5c 100644
--- a/dolphinscheduler-ui-next/src/views/security/token-manage/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/security/token-manage/use-table.ts
@@ -144,7 +144,8 @@ export function useTable() {
totalPage: ref(1),
showModalRef: ref(false),
statusRef: ref(0),
- row: {}
+ row: {},
+ loadingRef: ref(false)
})
const handleDelete = (row: any) => {
@@ -161,6 +162,8 @@ export function useTable() {
}
const getTableData = (params: any) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const { state } = useAsyncState(
queryAccessTokenList({ ...params }).then((res: TokenRes) => {
variables.tableData = res.totalList.map((item, unused) => {
@@ -181,6 +184,7 @@ export function useTable() {
}
}) as any
variables.totalPage = res.totalPage
+ variables.loadingRef = false
}),
{}
)
diff --git a/dolphinscheduler-ui-next/src/views/security/worker-group-manage/index.tsx b/dolphinscheduler-ui-next/src/views/security/worker-group-manage/index.tsx
index 4ad51f0..c997094 100644
--- a/dolphinscheduler-ui-next/src/views/security/worker-group-manage/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/security/worker-group-manage/index.tsx
@@ -98,7 +98,8 @@ const workerGroupManage = defineComponent({
onCancelModal,
onConfirmModal,
handleModalChange,
- onSearch
+ onSearch,
+ loadingRef
} = this
return (
@@ -136,6 +137,7 @@ const workerGroupManage = defineComponent({
</NCard>
<Card class={styles['table-card']}>
<NDataTable
+ loading={loadingRef}
row-class-name='items'
columns={this.columns}
data={this.tableData}
diff --git a/dolphinscheduler-ui-next/src/views/security/worker-group-manage/use-table.ts b/dolphinscheduler-ui-next/src/views/security/worker-group-manage/use-table.ts
index 06c8fd4..796fc03 100644
--- a/dolphinscheduler-ui-next/src/views/security/worker-group-manage/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/security/worker-group-manage/use-table.ts
@@ -160,7 +160,8 @@ export function useTable() {
totalPage: ref(1),
showModalRef: ref(false),
statusRef: ref(0),
- row: {}
+ row: {},
+ loadingRef: ref(false)
})
const handleDelete = (row: any) => {
@@ -177,6 +178,8 @@ export function useTable() {
}
const getTableData = (params: any) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const { state } = useAsyncState(
queryAllWorkerGroupsPaging({ ...params }).then((res: WorkerGroupRes) => {
variables.tableData = res.totalList.map((item, unused) => {
@@ -185,6 +188,7 @@ export function useTable() {
}
}) as any
variables.totalPage = res.totalPage
+ variables.loadingRef = false
}),
{}
)
diff --git a/dolphinscheduler-ui-next/src/views/security/yarn-queue-manage/index.tsx b/dolphinscheduler-ui-next/src/views/security/yarn-queue-manage/index.tsx
index 9b9456b..e8b6bb6 100644
--- a/dolphinscheduler-ui-next/src/views/security/yarn-queue-manage/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/security/yarn-queue-manage/index.tsx
@@ -98,7 +98,8 @@ const yarnQueueManage = defineComponent({
onCancelModal,
onConfirmModal,
handleModalChange,
- onSearch
+ onSearch,
+ loadingRef
} = this
return (
@@ -136,6 +137,7 @@ const yarnQueueManage = defineComponent({
</NCard>
<Card class={styles['table-card']}>
<NDataTable
+ loading={loadingRef}
row-class-name='items'
columns={this.columns}
data={this.tableData}
diff --git a/dolphinscheduler-ui-next/src/views/security/yarn-queue-manage/use-table.ts b/dolphinscheduler-ui-next/src/views/security/yarn-queue-manage/use-table.ts
index d801b47..be54000 100644
--- a/dolphinscheduler-ui-next/src/views/security/yarn-queue-manage/use-table.ts
+++ b/dolphinscheduler-ui-next/src/views/security/yarn-queue-manage/use-table.ts
@@ -98,10 +98,13 @@ export function useTable() {
totalPage: ref(1),
showModalRef: ref(false),
statusRef: ref(0),
- row: {}
+ row: {},
+ loadingRef: ref(false)
})
const getTableData = (params: any) => {
+ if (variables.loadingRef) return
+ variables.loadingRef = true
const { state } = useAsyncState(
queryQueueListPaging({ ...params }).then((res: QueueRes) => {
variables.tableData = res.totalList.map((item, unused) => {
@@ -110,6 +113,7 @@ export function useTable() {
}
}) as any
variables.totalPage = res.totalPage
+ variables.loadingRef = false
}),
{}
)