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 35316f0 [Fix][UI Next] Fix a few bug with resource manage (#8363)
35316f0 is described below
commit 35316f066e99be9fc1e0d2065ef5b6b433c84ee5
Author: Devosend <[email protected]>
AuthorDate: Sun Feb 13 21:07:22 2022 +0800
[Fix][UI Next] Fix a few bug with resource manage (#8363)
* fix resource manage list language switch bug
* fix func manage list language switch bug
---
.../src/views/resource/udf/function/index.tsx | 9 +-
.../src/views/resource/udf/function/use-table.ts | 197 +++++++-------
.../src/views/resource/udf/resource/index.tsx | 10 +-
.../src/views/resource/udf/resource/use-table.ts | 294 +++++++++++----------
4 files changed, 265 insertions(+), 245 deletions(-)
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 4aa083f..9ebbbc0 100644
--- a/dolphinscheduler-ui-next/src/views/resource/udf/function/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/resource/udf/function/index.tsx
@@ -15,7 +15,7 @@
* limitations under the License.
*/
-import { defineComponent, Ref, toRefs, onMounted, toRef } from 'vue'
+import { defineComponent, Ref, toRefs, onMounted, toRef, watch } from 'vue'
import {
NIcon,
NSpace,
@@ -34,7 +34,7 @@ import styles from './index.module.scss'
export default defineComponent({
name: 'function-manage',
setup() {
- const { variables, getTableData } = useTable()
+ const { variables, createColumns, getTableData } = useTable()
const requestData = () => {
getTableData({
@@ -68,7 +68,12 @@ export default defineComponent({
handleShowModal(toRef(variables, 'showRef'))
}
+ watch(useI18n().locale, () => {
+ createColumns(variables)
+ })
+
onMounted(() => {
+ createColumns(variables)
requestData()
})
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 a2bf764..d00d7ed 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
@@ -33,104 +33,8 @@ export function useTable() {
const { t } = useI18n()
const router: Router = useRouter()
- const columns: TableColumns<any> = [
- {
- title: t('resource.function.id'),
- key: 'id',
- width: 50,
- render: (_row, index) => index + 1
- },
- {
- title: t('resource.function.udf_function_name'),
- key: 'funcName'
- },
- {
- title: t('resource.function.class_name'),
- key: 'className'
- },
- {
- title: t('resource.function.type'),
- key: 'type'
- },
- {
- title: t('resource.function.description'),
- key: 'description'
- },
- {
- title: t('resource.function.jar_package'),
- key: 'resourceName'
- },
- {
- title: t('resource.function.update_time'),
- key: 'updateTime'
- },
- {
- title: t('resource.function.operation'),
- key: 'operation',
- render: (row) => {
- return h(NSpace, null, {
- default: () => [
- h(
- NTooltip,
- {},
- {
- trigger: () =>
- h(
- NButton,
- {
- circle: true,
- type: 'info',
- size: 'tiny',
- onClick: () => {
- handleEdit(row)
- }
- },
- {
- icon: () => h(EditOutlined)
- }
- ),
- default: () => t('resource.function.edit')
- }
- ),
- h(
- NPopconfirm,
- {
- onPositiveClick: () => {
- handleDelete(row.id)
- }
- },
- {
- trigger: () =>
- h(
- NTooltip,
- {},
- {
- trigger: () =>
- h(
- NButton,
- {
- circle: true,
- type: 'error',
- size: 'tiny'
- },
- {
- icon: () => h(DeleteOutlined)
- }
- ),
- default: () => t('resource.function.delete')
- }
- ),
- default: () => t('resource.function.delete_confirm')
- }
- )
- ]
- })
- }
- }
- ]
-
const variables = reactive({
- columns,
+ columns: [],
row: {},
tableData: [],
id: ref(Number(router.currentRoute.value.params.id) || -1),
@@ -141,6 +45,104 @@ export function useTable() {
showRef: ref(false)
})
+ const createColumns = (variables: any) => {
+ variables.columns = [
+ {
+ title: t('resource.function.id'),
+ key: 'id',
+ width: 50,
+ render: (_row, index) => index + 1
+ },
+ {
+ title: t('resource.function.udf_function_name'),
+ key: 'funcName'
+ },
+ {
+ title: t('resource.function.class_name'),
+ key: 'className'
+ },
+ {
+ title: t('resource.function.type'),
+ key: 'type'
+ },
+ {
+ title: t('resource.function.description'),
+ key: 'description'
+ },
+ {
+ title: t('resource.function.jar_package'),
+ key: 'resourceName'
+ },
+ {
+ title: t('resource.function.update_time'),
+ key: 'updateTime'
+ },
+ {
+ title: t('resource.function.operation'),
+ key: 'operation',
+ render: (row) => {
+ return h(NSpace, null, {
+ default: () => [
+ h(
+ NTooltip,
+ {},
+ {
+ trigger: () =>
+ h(
+ NButton,
+ {
+ circle: true,
+ type: 'info',
+ size: 'tiny',
+ onClick: () => {
+ handleEdit(row)
+ }
+ },
+ {
+ icon: () => h(EditOutlined)
+ }
+ ),
+ default: () => t('resource.function.edit')
+ }
+ ),
+ h(
+ NPopconfirm,
+ {
+ onPositiveClick: () => {
+ handleDelete(row.id)
+ }
+ },
+ {
+ trigger: () =>
+ h(
+ NTooltip,
+ {},
+ {
+ trigger: () =>
+ h(
+ NButton,
+ {
+ circle: true,
+ type: 'error',
+ size: 'tiny'
+ },
+ {
+ icon: () => h(DeleteOutlined)
+ }
+ ),
+ default: () => t('resource.function.delete')
+ }
+ ),
+ default: () => t('resource.function.delete_confirm')
+ }
+ )
+ ]
+ })
+ }
+ }
+ ] as TableColumns<any>
+ }
+
const getTableData = (params: IUdfFunctionParam) => {
const { state } = useAsyncState(
queryUdfFuncListPaging({ ...params }).then((res: any) => {
@@ -177,6 +179,7 @@ export function useTable() {
return {
variables,
+ createColumns,
getTableData
}
}
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 bed26cc..2f12aea 100644
--- a/dolphinscheduler-ui-next/src/views/resource/udf/resource/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/resource/udf/resource/index.tsx
@@ -15,7 +15,7 @@
* limitations under the License.
*/
-import { defineComponent, Ref, toRefs, onMounted, toRef } from 'vue'
+import { defineComponent, Ref, toRefs, onMounted, toRef, watch } from 'vue'
import {
NIcon,
NSpace,
@@ -37,7 +37,8 @@ import styles from './index.module.scss'
export default defineComponent({
name: 'resource-manage',
setup() {
- const { variables, getTableData, goUdfManage, goBread } = useTable()
+ const { variables, createColumns, getTableData, goUdfManage, goBread } =
+ useTable()
const requestData = () => {
getTableData({
@@ -85,7 +86,12 @@ export default defineComponent({
goBread(breadName)
}
+ watch(useI18n().locale, () => {
+ createColumns(variables)
+ })
+
onMounted(() => {
+ createColumns(variables)
requestData()
})
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 b7f7243..0ed6c96 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
@@ -49,151 +49,8 @@ export function useTable() {
const router: Router = useRouter()
const fileStore = useFileStore()
- const columns: TableColumns<any> = [
- {
- title: t('resource.udf.id'),
- key: 'id',
- width: 50,
- render: (_row, index) => index + 1
- },
- {
- title: t('resource.udf.udf_source_name'),
- key: 'alias',
- render: (row) => {
- if (!row.directory) {
- return row.alias
- } else {
- return h(
- 'a',
- {
- href: 'javascript:',
- class: styles.links,
- onClick: () => goSubFolder(router, row)
- },
- {
- default: () => {
- return row.alias
- }
- }
- )
- }
- }
- },
- {
- title: t('resource.udf.whether_directory'),
- key: 'whether_directory',
- render: (row) =>
- row.directory ? t('resource.file.yes') : t('resource.file.no')
- },
- {
- title: t('resource.udf.file_name'),
- key: 'fileName'
- },
- {
- title: t('resource.udf.file_size'),
- key: 'size',
- render: (row) => bytesToSize(row.size)
- },
- {
- title: t('resource.udf.description'),
- key: 'description'
- },
- {
- title: t('resource.udf.create_time'),
- key: 'createTime'
- },
- {
- title: t('resource.udf.update_time'),
- key: 'updateTime'
- },
- {
- title: t('resource.udf.operation'),
- key: 'operation',
- render: (row) => {
- return h(NSpace, null, {
- default: () => [
- h(
- NTooltip,
- {},
- {
- trigger: () =>
- h(
- NButton,
- {
- circle: true,
- type: 'info',
- size: 'tiny',
- onClick: () => {
- handleEdit(row)
- }
- },
- {
- icon: () => h(EditOutlined)
- }
- ),
- default: () => t('resource.udf.edit')
- }
- ),
- h(
- NTooltip,
- {},
- {
- trigger: () =>
- h(
- NButton,
- {
- circle: true,
- type: 'info',
- size: 'tiny',
- disabled: row?.directory ? true : false,
- onClick: () => downloadResource(row.id)
- },
- {
- icon: () => h(DownloadOutlined)
- }
- ),
- default: () => t('resource.udf.download')
- }
- ),
- h(
- NPopconfirm,
- {
- onPositiveClick: () => {
- handleDelete(row.id)
- }
- },
- {
- trigger: () =>
- h(
- NTooltip,
- {},
- {
- trigger: () =>
- h(
- NButton,
- {
- circle: true,
- type: 'error',
- size: 'tiny'
- },
- {
- icon: () => h(DeleteOutlined)
- }
- ),
- default: () => t('resource.udf.delete')
- }
- ),
- default: () => t('resource.udf.delete_confirm')
- }
- )
- ]
- })
- }
- }
- ]
-
const variables = reactive({
- columns,
+ columns: [],
row: {},
tableData: [],
breadList: [],
@@ -206,6 +63,154 @@ export function useTable() {
uploadShowRef: ref(false)
})
+ const createColumns = (variables: any) => {
+ variables.columns = [
+ {
+ title: t('resource.udf.id'),
+ key: 'id',
+ width: 50,
+ render: (_row, index) => index + 1
+ },
+ {
+ title: t('resource.udf.udf_source_name'),
+ key: 'alias',
+ render: (row) => {
+ if (!row.directory) {
+ return row.alias
+ } else {
+ return h(
+ 'a',
+ {
+ href: 'javascript:',
+ class: styles.links,
+ onClick: () => goSubFolder(router, row)
+ },
+ {
+ default: () => {
+ return row.alias
+ }
+ }
+ )
+ }
+ }
+ },
+ {
+ title: t('resource.udf.whether_directory'),
+ key: 'whether_directory',
+ render: (row) =>
+ row.directory ? t('resource.file.yes') : t('resource.file.no')
+ },
+ {
+ title: t('resource.udf.file_name'),
+ key: 'fileName'
+ },
+ {
+ title: t('resource.udf.file_size'),
+ key: 'size',
+ render: (row) => bytesToSize(row.size)
+ },
+ {
+ title: t('resource.udf.description'),
+ key: 'description'
+ },
+ {
+ title: t('resource.udf.create_time'),
+ key: 'createTime'
+ },
+ {
+ title: t('resource.udf.update_time'),
+ key: 'updateTime'
+ },
+ {
+ title: t('resource.udf.operation'),
+ key: 'operation',
+ render: (row) => {
+ return h(NSpace, null, {
+ default: () => [
+ h(
+ NTooltip,
+ {},
+ {
+ trigger: () =>
+ h(
+ NButton,
+ {
+ tag: 'div',
+ circle: true,
+ type: 'info',
+ size: 'tiny',
+ onClick: () => {
+ handleEdit(row)
+ }
+ },
+ {
+ icon: () => h(EditOutlined)
+ }
+ ),
+ default: () => t('resource.udf.edit')
+ }
+ ),
+ h(
+ NTooltip,
+ {},
+ {
+ trigger: () =>
+ h(
+ NButton,
+ {
+ tag: 'div',
+ circle: true,
+ type: 'info',
+ size: 'tiny',
+ disabled: row?.directory ? true : false,
+ onClick: () => downloadResource(row.id)
+ },
+ {
+ icon: () => h(DownloadOutlined)
+ }
+ ),
+ default: () => t('resource.udf.download')
+ }
+ ),
+ h(
+ NPopconfirm,
+ {
+ onPositiveClick: () => {
+ handleDelete(row.id)
+ }
+ },
+ {
+ trigger: () =>
+ h(
+ NTooltip,
+ {},
+ {
+ trigger: () =>
+ h(
+ NButton,
+ {
+ tag: 'div',
+ circle: true,
+ type: 'error',
+ size: 'tiny'
+ },
+ {
+ icon: () => h(DeleteOutlined)
+ }
+ ),
+ default: () => t('resource.udf.delete')
+ }
+ ),
+ default: () => t('resource.udf.delete_confirm')
+ }
+ )
+ ]
+ })
+ }
+ }
+ ] as TableColumns<any>
+ }
+
const getTableData = (params: IUdfResourceParam) => {
const { state } = useAsyncState(
queryResourceListPaging({ ...params, type: 'UDF' }).then((res: any) => {
@@ -272,6 +277,7 @@ export function useTable() {
return {
variables,
+ createColumns,
getTableData,
goUdfManage,
goBread
