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 1630147 [Fix][UI Next][V1.0.0-Alpha] Fix the datasource display error
in SQL. (#9261)
1630147 is described below
commit 1630147872d8017fb92818901e4872f23174df93
Author: Amy0104 <[email protected]>
AuthorDate: Tue Mar 29 23:10:07 2022 +0800
[Fix][UI Next][V1.0.0-Alpha] Fix the datasource display error in SQL.
(#9261)
---
.../projects/task/components/node/fields/index.ts | 1 -
.../components/node/fields/use-datasource-type.ts | 130 -----------------
.../task/components/node/fields/use-datasource.ts | 154 +++++++++++++++------
.../task/components/node/tasks/use-procedure.ts | 3 +-
.../projects/task/components/node/tasks/use-sql.ts | 3 +-
5 files changed, 115 insertions(+), 176 deletions(-)
diff --git
a/dolphinscheduler-ui-next/src/views/projects/task/components/node/fields/index.ts
b/dolphinscheduler-ui-next/src/views/projects/task/components/node/fields/index.ts
index b69fb0a..c00d29a 100644
---
a/dolphinscheduler-ui-next/src/views/projects/task/components/node/fields/index.ts
+++
b/dolphinscheduler-ui-next/src/views/projects/task/components/node/fields/index.ts
@@ -30,7 +30,6 @@ export { useTaskType } from './use-task-type'
export { useProcessName } from './use-process-name'
export { useChildNode } from './use-child-node'
export { useTargetTaskName } from './use-target-task-name'
-export { useDatasourceType } from './use-datasource-type'
export { useDatasource } from './use-datasource'
export { useSqlType } from './use-sql-type'
export { useProcedure } from './use-procedure'
diff --git
a/dolphinscheduler-ui-next/src/views/projects/task/components/node/fields/use-datasource-type.ts
b/dolphinscheduler-ui-next/src/views/projects/task/components/node/fields/use-datasource-type.ts
deleted file mode 100644
index 8f276b4..0000000
---
a/dolphinscheduler-ui-next/src/views/projects/task/components/node/fields/use-datasource-type.ts
+++ /dev/null
@@ -1,130 +0,0 @@
-/*
- * 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 { ref, onMounted } from 'vue'
-import { useI18n } from 'vue-i18n'
-import type { IJsonItem } from '../types'
-import { indexOf } from 'lodash'
-
-export function useDatasourceType(
- model: { [field: string]: any },
- supportedDatasourceType?: string[],
- field?: string
-): IJsonItem {
- const { t } = useI18n()
-
- const options = ref([] as { label: string; value: string }[])
- const loading = ref(false)
-
- const datasourceTypes = [
- {
- id: 0,
- code: 'MYSQL',
- disabled: false
- },
- {
- id: 1,
- code: 'POSTGRESQL',
- disabled: false
- },
- {
- id: 2,
- code: 'HIVE',
- disabled: false
- },
- {
- id: 3,
- code: 'SPARK',
- disabled: false
- },
- {
- id: 4,
- code: 'CLICKHOUSE',
- disabled: false
- },
- {
- id: 5,
- code: 'ORACLE',
- disabled: false
- },
- {
- id: 6,
- code: 'SQLSERVER',
- disabled: false
- },
- {
- id: 7,
- code: 'DB2',
- disabled: false
- },
- {
- id: 8,
- code: 'PRESTO',
- disabled: false
- },
- {
- id: 9,
- code: 'REDSHIFT',
- disabled: false
- }
- ]
-
- const getDatasourceTypes = async () => {
- if (loading.value) return
- loading.value = true
- options.value = datasourceTypes
- .filter((item) => {
- if (item.disabled) {
- return false
- }
- if (supportedDatasourceType) {
- return indexOf(supportedDatasourceType, item.code) !== -1
- }
- return true
- })
- .map((item) => ({ label: item.code, value: item.code }))
- loading.value = false
- }
-
- const onChange = (type: string) => {
- if (field) {
- model[field] = type
- } else {
- model.type = type
- }
- }
-
- onMounted(() => {
- getDatasourceTypes()
- })
- return {
- type: 'select',
- field: field ? field : 'datasourceType',
- span: 12,
- name: t('project.node.datasource_type'),
- props: {
- loading: loading,
- 'on-update:value': onChange
- },
- options: options,
- validate: {
- trigger: ['input', 'blur'],
- required: true
- },
- value: model.type
- }
-}
diff --git
a/dolphinscheduler-ui-next/src/views/projects/task/components/node/fields/use-datasource.ts
b/dolphinscheduler-ui-next/src/views/projects/task/components/node/fields/use-datasource.ts
index 950981c..7d9b02a 100644
---
a/dolphinscheduler-ui-next/src/views/projects/task/components/node/fields/use-datasource.ts
+++
b/dolphinscheduler-ui-next/src/views/projects/task/components/node/fields/use-datasource.ts
@@ -15,73 +15,145 @@
* limitations under the License.
*/
-import { ref, onMounted, watch } from 'vue'
+import { ref, onMounted, nextTick } from 'vue'
import { useI18n } from 'vue-i18n'
import { queryDataSourceList } from '@/service/modules/data-source'
+import { indexOf, find } from 'lodash'
import type { IJsonItem } from '../types'
-import { TypeReq } from '@/service/modules/data-source/types'
-import { find } from 'lodash'
+import type { TypeReq } from '@/service/modules/data-source/types'
export function useDatasource(
model: { [field: string]: any },
+ supportedDatasourceType?: string[],
field?: string
-): IJsonItem {
+): IJsonItem[] {
const { t } = useI18n()
- const options = ref([] as { label: string; value: number }[])
- const loading = ref(false)
- const defaultValue = ref(null)
+ const options = ref([] as { label: string; value: string }[])
+ const datasourceOptions = ref([] as { label: string; value: number }[])
- const getDatasources = async () => {
- if (loading.value) return
- loading.value = true
- await refreshOptions()
- loading.value = false
+ const datasourceTypes = [
+ {
+ id: 0,
+ code: 'MYSQL',
+ disabled: false
+ },
+ {
+ id: 1,
+ code: 'POSTGRESQL',
+ disabled: false
+ },
+ {
+ id: 2,
+ code: 'HIVE',
+ disabled: false
+ },
+ {
+ id: 3,
+ code: 'SPARK',
+ disabled: false
+ },
+ {
+ id: 4,
+ code: 'CLICKHOUSE',
+ disabled: false
+ },
+ {
+ id: 5,
+ code: 'ORACLE',
+ disabled: false
+ },
+ {
+ id: 6,
+ code: 'SQLSERVER',
+ disabled: false
+ },
+ {
+ id: 7,
+ code: 'DB2',
+ disabled: false
+ },
+ {
+ id: 8,
+ code: 'PRESTO',
+ disabled: false
+ },
+ {
+ id: 9,
+ code: 'REDSHIFT',
+ disabled: false
+ }
+ ]
+
+ const getDatasourceTypes = async () => {
+ options.value = datasourceTypes
+ .filter((item) => {
+ if (item.disabled) {
+ return false
+ }
+ if (supportedDatasourceType) {
+ return indexOf(supportedDatasourceType, item.code) !== -1
+ }
+ return true
+ })
+ .map((item) => ({ label: item.code, value: item.code }))
}
const refreshOptions = async () => {
const params = { type: model.type } as TypeReq
const res = await queryDataSourceList(params)
- defaultValue.value = null
- options.value = []
-
- options.value = res.map((item: any) => ({
+ datasourceOptions.value = res.map((item: any) => ({
label: item.name,
value: item.id
}))
- if (options.value.length && model.datasource) {
- const item = find(options.value, { value: model.datasource })
+ if (!res.length && model.datasource) model.datasource = null
+ if (res.length && model.datasource) {
+ const item = find(res, { id: model.datasource })
if (!item) {
model.datasource = null
}
}
}
- watch(
- () => model.type,
- () => {
- if (model.type) {
- refreshOptions()
- }
- }
- )
+ const onChange = () => {
+ refreshOptions()
+ }
- onMounted(() => {
- getDatasources()
+ onMounted(async () => {
+ getDatasourceTypes()
+ await nextTick()
+ refreshOptions()
})
- return {
- type: 'select',
- field: field || 'datasource',
- span: 12,
- name: t('project.node.datasource_instances'),
- props: {
- loading: loading
+ return [
+ {
+ type: 'select',
+ field: field ? field : 'type',
+ span: 12,
+ name: t('project.node.datasource_type'),
+ props: {
+ 'on-update:value': onChange
+ },
+ options: options,
+ validate: {
+ trigger: ['input', 'blur'],
+ required: true
+ }
},
- options: options,
- validate: {
- trigger: ['input', 'blur'],
- type: 'number',
- required: true
+ {
+ type: 'select',
+ field: field || 'datasource',
+ span: 12,
+ name: t('project.node.datasource_instances'),
+ options: datasourceOptions,
+ validate: {
+ trigger: ['input', 'blur'],
+ required: true,
+ validator(unuse: any, value) {
+ if (!value && value !== 0) {
+ return Error(t('project.node.datasource_instances'))
+ }
+ }
+ }
}
- }
+ ]
}
diff --git
a/dolphinscheduler-ui-next/src/views/projects/task/components/node/tasks/use-procedure.ts
b/dolphinscheduler-ui-next/src/views/projects/task/components/node/tasks/use-procedure.ts
index df3f11a..a5a6519 100644
---
a/dolphinscheduler-ui-next/src/views/projects/task/components/node/tasks/use-procedure.ts
+++
b/dolphinscheduler-ui-next/src/views/projects/task/components/node/tasks/use-procedure.ts
@@ -76,8 +76,7 @@ export function useProcedure({
...Fields.useFailed(),
Fields.useDelayTime(model),
...Fields.useTimeoutAlarm(model),
- Fields.useDatasourceType(model),
- Fields.useDatasource(model),
+ ...Fields.useDatasource(model),
...Fields.useProcedure(model),
Fields.usePreTasks()
] as IJsonItem[],
diff --git
a/dolphinscheduler-ui-next/src/views/projects/task/components/node/tasks/use-sql.ts
b/dolphinscheduler-ui-next/src/views/projects/task/components/node/tasks/use-sql.ts
index 9c9fb13..7bba537 100644
---
a/dolphinscheduler-ui-next/src/views/projects/task/components/node/tasks/use-sql.ts
+++
b/dolphinscheduler-ui-next/src/views/projects/task/components/node/tasks/use-sql.ts
@@ -80,8 +80,7 @@ export function useSql({
...Fields.useFailed(),
Fields.useDelayTime(model),
...Fields.useTimeoutAlarm(model),
- Fields.useDatasourceType(model),
- Fields.useDatasource(model),
+ ...Fields.useDatasource(model),
...Fields.useSqlType(model),
...Fields.useSql(model),
Fields.usePreTasks()
