luchanan
3 years ago
committed by
GitHub
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with
1 additions and
73 deletions
-
src/components/Form/src/components/FormItem.vue
-
src/components/Form/src/props.ts
-
src/components/Form/src/types/form.ts
-
src/views/demo/table/tableData.tsx
|
|
|
@ -24,7 +24,6 @@ |
|
|
|
import { cloneDeep, upperFirst } from 'lodash-es'; |
|
|
|
import { useItemLabelWidth } from '../hooks/useLabelWidth'; |
|
|
|
import { useI18n } from '@/hooks/web/useI18n'; |
|
|
|
import { useDebounceFn } from '@vueuse/core'; |
|
|
|
|
|
|
|
export default defineComponent({ |
|
|
|
name: 'BasicFormItem', |
|
|
|
@ -271,8 +270,6 @@ |
|
|
|
component, |
|
|
|
field, |
|
|
|
changeEvent = 'change', |
|
|
|
watchEventNames = ['search', 'change'], |
|
|
|
enableWatchEvent = true, |
|
|
|
valueField, |
|
|
|
} = props.schema; |
|
|
|
|
|
|
|
@ -280,27 +277,6 @@ |
|
|
|
|
|
|
|
const eventKey = `on${upperFirst(changeEvent)}`; |
|
|
|
|
|
|
|
const { autoSetPlaceHolder, size, watchEvent } = props.formProps; |
|
|
|
let eventNames = {}; |
|
|
|
if (watchEvent && enableWatchEvent) { |
|
|
|
// table search 开启才触发事件 |
|
|
|
let immediateEvents = ['search']; // 立即执行的事件 |
|
|
|
watchEventNames.forEach((item) => { |
|
|
|
let timer: number = 500; |
|
|
|
if (immediateEvents.includes(item)) { |
|
|
|
timer = 0; |
|
|
|
} |
|
|
|
eventNames[`on${upperFirst(item)}`] = useDebounceFn( |
|
|
|
(...args: Nullable<Recordable<any>>[]) => { |
|
|
|
// todo 后续需要优化input中文输入的问题 |
|
|
|
console.log(args); |
|
|
|
const { reload = () => {} } = props.tableAction || {}; |
|
|
|
reload(); |
|
|
|
}, |
|
|
|
timer, |
|
|
|
); |
|
|
|
}); |
|
|
|
} |
|
|
|
const on = { |
|
|
|
[eventKey]: (...args: Nullable<Recordable<any>>[]) => { |
|
|
|
const [e] = args; |
|
|
|
@ -314,6 +290,7 @@ |
|
|
|
}; |
|
|
|
const Comp = componentMap.get(component) as ReturnType<typeof defineComponent>; |
|
|
|
|
|
|
|
const { autoSetPlaceHolder, size } = props.formProps; |
|
|
|
const propsData: Recordable<any> = { |
|
|
|
allowClear: true, |
|
|
|
size, |
|
|
|
@ -338,7 +315,6 @@ |
|
|
|
const compAttr: Recordable<any> = { |
|
|
|
...propsData, |
|
|
|
...on, |
|
|
|
...eventNames, |
|
|
|
...bindValue, |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
@ -100,7 +100,4 @@ export const basicProps = { |
|
|
|
labelAlign: propTypes.string, |
|
|
|
|
|
|
|
rowProps: Object as PropType<RowProps>, |
|
|
|
|
|
|
|
// table 开启监听表单监听事件,触发table reload
|
|
|
|
watchEvent: propTypes.bool.def(false), |
|
|
|
}; |
|
|
|
|
|
|
|
@ -124,7 +124,6 @@ export interface FormProps { |
|
|
|
submitFunc?: () => Promise<void>; |
|
|
|
transformDateFunc?: (date: any) => string; |
|
|
|
colon?: boolean; |
|
|
|
watchEvent?: boolean; |
|
|
|
} |
|
|
|
export type RenderOpts = { |
|
|
|
disabled: boolean; |
|
|
|
@ -224,11 +223,6 @@ interface BaseFormSchema { |
|
|
|
dynamicReadonly?: boolean | ((renderCallbackParams: RenderCallbackParams) => boolean); |
|
|
|
|
|
|
|
dynamicRules?: (renderCallbackParams: RenderCallbackParams) => Rule[]; |
|
|
|
|
|
|
|
watchEventNames?: string[]; |
|
|
|
|
|
|
|
// 禁用事件监听触发reload
|
|
|
|
enableWatchEvent?: boolean; |
|
|
|
} |
|
|
|
export interface ComponentFormSchema extends BaseFormSchema { |
|
|
|
// render component
|
|
|
|
|
|
|
|
@ -259,45 +259,6 @@ export function getFormConfig(): Partial<FormProps> { |
|
|
|
xxl: 8, |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
field: `field12`, |
|
|
|
label: `input值改变`, |
|
|
|
component: 'InputSearch', |
|
|
|
enableWatchEvent: true, |
|
|
|
componentProps: { |
|
|
|
placeholder: '需要开启watchEvent', |
|
|
|
}, |
|
|
|
colProps: { |
|
|
|
xl: 12, |
|
|
|
xxl: 8, |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
field: 'field13', |
|
|
|
component: 'Select', |
|
|
|
label: 'select值改变', |
|
|
|
componentProps: { |
|
|
|
placeholder: '需要开启watchEvent', |
|
|
|
options: [ |
|
|
|
{ |
|
|
|
label: '公开', |
|
|
|
value: '1', |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: '部分公开', |
|
|
|
value: '2', |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: '不公开', |
|
|
|
value: '3', |
|
|
|
}, |
|
|
|
], |
|
|
|
}, |
|
|
|
colProps: { |
|
|
|
xl: 12, |
|
|
|
xxl: 8, |
|
|
|
}, |
|
|
|
}, |
|
|
|
], |
|
|
|
}; |
|
|
|
} |
|
|
|
|