Browse Source

[Fix][UI Next] Fix vue-tsc errors and optimize code. (#8358)

3.0.0/version-upgrade
Amy0104 3 years ago committed by GitHub
parent
commit
840ac22555
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 16
      dolphinscheduler-ui-next/src/components/form/get-elements-by-json.ts
  2. 5
      dolphinscheduler-ui-next/src/components/form/index.tsx
  3. 8
      dolphinscheduler-ui-next/src/components/form/types.ts
  4. 2
      dolphinscheduler-ui-next/src/views/profile/use-form.ts
  5. 2
      dolphinscheduler-ui-next/src/views/projects/node/detail-modal.tsx
  6. 2
      dolphinscheduler-ui-next/src/views/projects/node/detail.tsx
  7. 3
      dolphinscheduler-ui-next/src/views/projects/node/fields/use-environment-name.ts
  8. 1
      dolphinscheduler-ui-next/src/views/projects/node/use-data.ts
  9. 22
      dolphinscheduler-ui-next/src/views/security/alarm-instance-manage/detail.tsx

16
dolphinscheduler-ui-next/src/components/form/get-elements-by-json.ts

@ -15,12 +15,12 @@
* limitations under the License.
*/
import { toRef } from 'vue'
import { toRef, Ref } from 'vue'
import { formatValidate } from './utils'
import getField from './fields/get-field'
import { omit } from 'lodash'
import type { FormRules } from 'naive-ui'
import type { IJsonItem } from './types'
import type { IFormItem, IJsonItem } from './types'
export default function getElementByJson(
json: IJsonItem[],
@ -28,23 +28,23 @@ export default function getElementByJson(
) {
const rules: FormRules = {}
const initialValues: { [field: string]: any } = {}
const elements = []
const elements: IFormItem[] = []
for (let item of json) {
const { name, value, field, span, children, validate, ...rest } = item
const { name, value, field, span = 24, children, validate, ...rest } = item
if (value || value === 0) {
fields[field] = value
initialValues[field] = value
}
if (validate) rules[field] = formatValidate(validate)
const spanRef = span === void 0 ? 24 : toRef(item, 'span')
elements.push({
const element: IFormItem = {
showLabel: !!name,
...omit(rest, ['type', 'props', 'options']),
label: name,
path: !children ? field : '',
widget: () => getField(item, fields, rules),
span: spanRef
})
span: toRef(item, 'span') as Ref<number>
}
elements.push(element)
}
return { rules, elements, initialValues }
}

5
dolphinscheduler-ui-next/src/components/form/index.tsx

@ -15,7 +15,7 @@
* limitations under the License.
*/
import { defineComponent, PropType, toRefs, h, toRef, isRef } from 'vue'
import { defineComponent, PropType, toRefs, h, unref } from 'vue'
import { NSpin, NGrid, NForm, NFormItemGi } from 'naive-ui'
import { useForm } from './use-form'
import type { GridProps, IMeta } from './types'
@ -54,10 +54,11 @@ const Form = defineComponent({
<NGrid {...layout}>
{elements.map((element) => {
const { span = 24, path, widget, ...formItemProps } = element
return (
<NFormItemGi
{...formItemProps}
span={isRef(span) ? span.value : span}
span={unref(span) === void 0 ? 24 : unref(span)}
path={path}
>
{h(widget)}

8
dolphinscheduler-ui-next/src/components/form/types.ts

@ -18,7 +18,6 @@ import { Ref } from 'vue'
import type {
GridProps,
FormProps,
FormItemGiProps,
FormItemRule,
FormRules,
SelectOption,
@ -40,9 +39,12 @@ interface IOption extends SelectOption, TreeSelectOption {
label: string
}
interface IFormItem extends Omit<FormItemGiProps, 'span'> {
interface IFormItem {
showLabel?: boolean
path: string
label?: string
widget: any
span?: any
span?: number | Ref<number>
}
interface IMeta extends Omit<FormProps, 'model'> {

2
dolphinscheduler-ui-next/src/views/profile/use-form.ts

@ -49,7 +49,7 @@ export function useForm() {
validator() {
if (state.profileForm.email === '') {
return new Error(t('profile.email_tips'))
} else if (!utils.regex.email.test(state.profileForm.email)) {
} else if (!utils.regex.email.test(state.profileForm.email || '')) {
return new Error(t('profile.email_correct_tips'))
}
}

2
dolphinscheduler-ui-next/src/views/projects/node/detail-modal.tsx

@ -70,7 +70,7 @@ const NodeDetailModal = defineComponent({
title={`${t('project.node.current_node_settings')}`}
onConfirm={onConfirm}
confirmLoading={false}
onCancel={() => void onCancel()}
onCancel={onCancel}
>
<Detail ref='detailRef' taskType='SHELL' projectCode={111} />
</Modal>

2
dolphinscheduler-ui-next/src/views/projects/node/detail.tsx

@ -65,7 +65,7 @@ const NodeDetail = defineComponent({
layout={{
xGap: 10
}}
></Form>
/>
)
}
})

3
dolphinscheduler-ui-next/src/views/projects/node/fields/use-environment-name.ts

@ -52,8 +52,7 @@ export function useEnvironmentName(
const filterByWorkerGroup = (option: IEnvironmentNameOption) => {
if (!model.workerGroup) return false
if (!option?.workerGroups?.length) return false
if (option.workerGroups.indexOf(model.workerGroup) === -1) return false
return true
return option.workerGroups.indexOf(model.workerGroup) !== -1
}
watch(

1
dolphinscheduler-ui-next/src/views/projects/node/use-data.ts

@ -37,7 +37,6 @@ export function useData({
data.backfill = formatBackfill(taskDefinition, nodeData.taskType)
data.isCreate = false
}
} else {
}
return {

22
dolphinscheduler-ui-next/src/views/security/alarm-instance-manage/detail.tsx

@ -15,7 +15,15 @@
* limitations under the License.
*/
import { defineComponent, PropType, toRefs, watch, onMounted, ref } from 'vue'
import {
defineComponent,
PropType,
toRefs,
watch,
onMounted,
ref,
Ref
} from 'vue'
import { NSelect, NInput } from 'naive-ui'
import Modal from '@/components/modal'
import Form from '@/components/form'
@ -25,6 +33,10 @@ import { useDetail } from './use-detail'
import getElementByJson from '@/components/form/get-elements-by-json'
import type { IRecord, FormRules, IFormItem } from './types'
interface IElements extends Omit<Ref, 'value'> {
value: IFormItem[]
}
const props = {
show: {
type: Boolean as PropType<boolean>,
@ -35,7 +47,6 @@ const props = {
default: {}
}
}
const DetailModal = defineComponent({
name: 'DetailModal',
props,
@ -44,7 +55,7 @@ const DetailModal = defineComponent({
const { t } = useI18n()
const rules = ref<FormRules>({})
const elements = ref<IFormItem[]>([])
const elements = ref<IFormItem[]>([]) as IElements
const {
meta,
@ -60,6 +71,8 @@ const DetailModal = defineComponent({
const onCancel = () => {
resetForm()
rules.value = {}
elements.value = []
ctx.emit('cancel')
}
@ -71,7 +84,6 @@ const DetailModal = defineComponent({
ctx.emit('update')
}
}
const onChangePlugin = changePlugin
watch(
@ -83,7 +95,7 @@ const DetailModal = defineComponent({
watch(
() => state.json,
() => {
if (state.json?.length) return
if (!state.json?.length) return
state.json.forEach((item) => {
item.name = t('security.alarm_instance' + '.' + item.field)
})

Loading…
Cancel
Save