Browse Source

[Feature-10872][UI] Display the total count in all listing page (#16590)

* feature 10872

* feature 10872
dev
xiangzihao 2 months ago committed by GitHub
parent
commit
20d96be478
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
  1. 3
      dolphinscheduler-ui/src/locales/en_US/project.ts
  2. 3
      dolphinscheduler-ui/src/locales/zh_CN/project.ts
  3. 28
      dolphinscheduler-ui/src/utils/tableTotalCount.ts
  4. 3
      dolphinscheduler-ui/src/views/projects/list/index.tsx
  5. 2
      dolphinscheduler-ui/src/views/projects/list/use-table.ts
  6. 3
      dolphinscheduler-ui/src/views/projects/task/instance/batch-task.tsx
  7. 3
      dolphinscheduler-ui/src/views/projects/task/instance/stream-task.tsx
  8. 4
      dolphinscheduler-ui/src/views/projects/task/instance/use-stream-table.ts
  9. 2
      dolphinscheduler-ui/src/views/projects/task/instance/use-table.ts
  10. 3
      dolphinscheduler-ui/src/views/projects/workflow/definition/index.tsx
  11. 2
      dolphinscheduler-ui/src/views/projects/workflow/definition/use-table.ts
  12. 3
      dolphinscheduler-ui/src/views/projects/workflow/instance/index.tsx
  13. 2
      dolphinscheduler-ui/src/views/projects/workflow/instance/use-table.ts

3
dolphinscheduler-ui/src/locales/en_US/project.ts

@ -40,7 +40,8 @@ export default {
no_permission: 'No Permission',
read_permission: 'Read Permission',
all_permission: 'All Permission',
assign_worker_group: 'Worker Group'
assign_worker_group: 'Worker Group',
total_items: 'Total Item is'
},
workflow: {
on_line: 'Online',

3
dolphinscheduler-ui/src/locales/zh_CN/project.ts

@ -40,7 +40,8 @@ export default {
no_permission: '无权限',
read_permission: '读权限',
all_permission: '所有权限',
assign_worker_group: '分配WorkerGroup'
assign_worker_group: '分配WorkerGroup',
total_items: '总条目为'
},
workflow: {
on_line: '线上',

28
dolphinscheduler-ui/src/utils/tableTotalCount.ts

@ -0,0 +1,28 @@
/*
* 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.
*/
import { useI18n } from 'vue-i18n'
import { RenderPrefix } from 'naive-ui/es/pagination/src/interface'
export default function totalCount(params: Parameters<RenderPrefix>[0]) {
const { t } = useI18n()
const prefix = t('project.list.total_items')
const count = Number.prototype.toLocaleString.call(params?.itemCount ?? 0)
return `${prefix}: ${count}`
}

3
dolphinscheduler-ui/src/views/projects/list/index.tsx

@ -30,6 +30,7 @@ import Card from '@/components/card'
import Search from '@/components/input-search'
import ProjectModal from './components/project-modal'
import WorkerGroupModal from '@/views/projects/list/components/worker-group-modal'
import totalCount from '@/utils/tableTotalCount'
const list = defineComponent({
name: 'list',
@ -161,6 +162,8 @@ const list = defineComponent({
show-quick-jumper
onUpdatePage={this.requestData}
onUpdatePageSize={this.handleChangePageSize}
itemCount={this.totalCount}
prefix={totalCount}
/>
</NSpace>
</NSpace>

2
dolphinscheduler-ui/src/views/projects/list/use-table.ts

@ -247,6 +247,7 @@ export function useTable() {
pageSize: ref(10),
searchVal: ref(''),
totalPage: ref(1),
totalCount: ref(0),
showModalRef: ref(false),
showWorkerGroupModalRef: ref(false),
statusRef: ref(0),
@ -259,6 +260,7 @@ export function useTable() {
variables.loadingRef = true
const { state } = useAsyncState(
queryProjectListPaging(params).then((res: ProjectRes) => {
variables.totalCount = res.total
variables.totalPage = res.totalPage
variables.tableData = res.totalList.map((item, unused) => {
item.createTime = format(

3
dolphinscheduler-ui/src/views/projects/task/instance/batch-task.tsx

@ -41,6 +41,7 @@ import { stateType } from '@/common/common'
import { useUISettingStore } from '@/store/ui-setting/ui-setting'
import Card from '@/components/card'
import LogModal from '@/components/log-modal'
import totalCount from '@/utils/tableTotalCount'
const BatchTaskInstance = defineComponent({
name: 'task-instance',
@ -299,6 +300,8 @@ const BatchTaskInstance = defineComponent({
show-quick-jumper
onUpdatePage={requestTableData}
onUpdatePageSize={onUpdatePageSize}
itemCount={this.totalCount}
prefix={totalCount}
/>
</NSpace>
</NSpace>

3
dolphinscheduler-ui/src/views/projects/task/instance/stream-task.tsx

@ -42,6 +42,7 @@ import { streamStateType } from '@/common/common'
import { useUISettingStore } from '@/store/ui-setting/ui-setting'
import Card from '@/components/card'
import LogModal from '@/components/log-modal'
import totalCount from '@/utils/tableTotalCount'
const BatchTaskInstance = defineComponent({
name: 'task-instance',
@ -271,6 +272,8 @@ const BatchTaskInstance = defineComponent({
show-quick-jumper
onUpdatePage={getTableData}
onUpdatePageSize={onUpdatePageSize}
itemCount={this.totalCount}
prefix={totalCount}
/>
</NSpace>
</NSpace>

4
dolphinscheduler-ui/src/views/projects/task/instance/use-stream-table.ts

@ -16,7 +16,7 @@
*/
import { useI18n } from 'vue-i18n'
import { h, reactive } from 'vue'
import { h, reactive, ref } from 'vue'
import {
downloadLog,
queryTaskListPaging,
@ -53,6 +53,7 @@ export function useTable() {
tableData: [] as any[],
page: 1,
pageSize: 10,
totalCount: ref(0),
searchVal: null,
workflowInstanceId: workflowInstanceId ? workflowInstanceId : null,
host: null,
@ -302,6 +303,7 @@ export function useTable() {
queryTaskListPaging(data, { projectCode })
.then((res: TaskInstancesRes) => {
variables.totalCount = res.total
variables.tableData = [...res.totalList]
variables.totalPage = res.totalPage
})

2
dolphinscheduler-ui/src/views/projects/task/instance/use-table.ts

@ -56,6 +56,7 @@ export function useTable() {
tableData: [] as IRecord[],
page: ref(1),
pageSize: ref(10),
totalCount: ref(0),
searchVal: ref(taskName || null),
taskCode: ref(taskCode || null),
workflowInstanceId: ref(workflowInstanceId ? workflowInstanceId : null),
@ -331,6 +332,7 @@ export function useTable() {
const { state } = useAsyncState(
queryTaskListPaging(data, { projectCode }).then(
(res: TaskInstancesRes) => {
variables.totalCount = res.total
variables.tableData = res.totalList as IRecord[]
variables.totalPage = res.totalPage
variables.loadingRef = false

3
dolphinscheduler-ui/src/views/projects/workflow/definition/index.tsx

@ -46,6 +46,7 @@ import CopyModal from './components/copy-modal'
import type { Router } from 'vue-router'
import Search from '@/components/input-search'
import DependenciesModal from '@/views/projects/components/dependencies/dependencies-modal'
import totalCount from '@/utils/tableTotalCount'
export default defineComponent({
name: 'WorkflowDefinitionList',
@ -279,6 +280,8 @@ export default defineComponent({
show-quick-jumper
onUpdatePage={this.requestData}
onUpdatePageSize={this.handleChangePageSize}
itemCount={this.totalCount}
prefix={totalCount}
/>
</NSpace>
</NSpace>

2
dolphinscheduler-ui/src/views/projects/workflow/definition/use-table.ts

@ -62,6 +62,7 @@ export function useTable() {
pageSize: ref(10),
searchVal: ref(),
totalPage: ref(1),
totalCount: ref(0),
timingType: ref('create'),
timingState: ref('OFFLINE'),
showRef: ref(false),
@ -564,6 +565,7 @@ export function useTable() {
variables.loadingRef = true
const { state } = useAsyncState(
queryListPaging({ ...params }, variables.projectCode).then((res: any) => {
variables.totalCount = res.total
variables.totalPage = res.totalPage
variables.tableData = res.totalList.map((item: any) => {
return { ...item }

3
dolphinscheduler-ui/src/views/projects/workflow/instance/index.tsx

@ -29,6 +29,7 @@ import { useTable } from './use-table'
import Card from '@/components/card'
import WorkflowInstanceCondition from './components/workflow-instance-condition'
import type { IWorkflowInstanceSearch } from './types'
import totalCount from '@/utils/tableTotalCount'
export default defineComponent({
name: 'WorkflowInstanceList',
@ -121,6 +122,8 @@ export default defineComponent({
show-quick-jumper
onUpdatePage={this.requestData}
onUpdatePageSize={this.handleChangePageSize}
itemCount={this.totalCount}
prefix={totalCount}
/>
</NSpace>
</NSpace>

2
dolphinscheduler-ui/src/views/projects/workflow/instance/use-table.ts

@ -57,6 +57,7 @@ export function useTable() {
page: ref(1),
pageSize: ref(10),
totalPage: ref(1),
totalCount: ref(0),
searchVal: ref(),
executorName: ref(),
host: ref(),
@ -264,6 +265,7 @@ export function useTable() {
}
queryWorkflowInstanceListPaging({ ...params }, variables.projectCode).then(
(res: any) => {
variables.totalCount = res.total
variables.totalPage = res.totalPage
variables.tableData = res.totalList.map((item: any) => {
return { ...item }

Loading…
Cancel
Save