Commit 4730b3af31d40fcd2dfe21c0d9faf08ef8420cfa
Committed by
GitHub
1 parent
740d1601
Table BasicColumn 添加 editDynamicDisabled (#2018)
* Table BasicColumn 添加 editDynamicDisabled Co-authored-by: Cyrus Zhou <6802207@qq.com> 使用方式同 Form FormSchema dynamicDisabled ``` export const Columns: BasicColumn[] = [ { title: 'Title', dataIndex: 'Title', editRow: true, editComponent: 'Select', editDynamicDisabled: ({ record }) => record.isDisabled, }, * editComponentProps onChange 功能恢复 Co-authored-by: Cyrus Zhou <6802207@qq.com> 说明: ...omit(compProps, 'onChange') 这会忽略 onChange ,导致 editComponentProps onChange 被取消 如下功能将不支持: ``` editComponentProps: ({ record }) => { return { options: effectTypeData, onChange: () => { }, }; }, ``` * tableData == null 报错 * ApiSelect 第一次选择触发required错误提示问题 * 恢复 虽然可以解决第一次选择提示报错问题,但是会导致 onChange: (e: any, options: any) => 无法获得 options 的值
Showing
3 changed files
with
25 additions
and
4 deletions
src/components/Table/src/components/editable/EditableCell.vue
@@ -82,17 +82,36 @@ | @@ -82,17 +82,36 @@ | ||
82 | if (component === 'ApiSelect') { | 82 | if (component === 'ApiSelect') { |
83 | apiSelectProps.cache = true; | 83 | apiSelectProps.cache = true; |
84 | } | 84 | } |
85 | - | 85 | + upEditDynamicDisabled(record, column, value); |
86 | return { | 86 | return { |
87 | size: 'small', | 87 | size: 'small', |
88 | getPopupContainer: () => unref(table?.wrapRef.value) ?? document.body, | 88 | getPopupContainer: () => unref(table?.wrapRef.value) ?? document.body, |
89 | placeholder: createPlaceholderMessage(unref(getComponent)), | 89 | placeholder: createPlaceholderMessage(unref(getComponent)), |
90 | ...apiSelectProps, | 90 | ...apiSelectProps, |
91 | - ...omit(compProps, 'onChange'), | 91 | + ...compProps, |
92 | [valueField]: value, | 92 | [valueField]: value, |
93 | + disabled: unref(getDisable), | ||
93 | } as any; | 94 | } as any; |
94 | }); | 95 | }); |
95 | - | 96 | + function upEditDynamicDisabled(record, column, value) { |
97 | + if (!record) return false; | ||
98 | + const { key, dataIndex } = column; | ||
99 | + if (!key && !dataIndex) return; | ||
100 | + const dataKey = (dataIndex || key) as string; | ||
101 | + set(record, dataKey, value); | ||
102 | + } | ||
103 | + const getDisable = computed(() => { | ||
104 | + const { editDynamicDisabled } = props.column; | ||
105 | + let disabled = false; | ||
106 | + if (isBoolean(editDynamicDisabled)) { | ||
107 | + disabled = editDynamicDisabled; | ||
108 | + } | ||
109 | + if (isFunction(editDynamicDisabled)) { | ||
110 | + const { record } = props; | ||
111 | + disabled = editDynamicDisabled({ record }); | ||
112 | + } | ||
113 | + return disabled; | ||
114 | + }); | ||
96 | const getValues = computed(() => { | 115 | const getValues = computed(() => { |
97 | const { editValueMap } = props.column; | 116 | const { editValueMap } = props.column; |
98 | 117 |
src/components/Table/src/hooks/useTableScroll.ts
@@ -90,7 +90,7 @@ export function useTableScroll( | @@ -90,7 +90,7 @@ export function useTableScroll( | ||
90 | 90 | ||
91 | bodyEl!.style.height = 'unset'; | 91 | bodyEl!.style.height = 'unset'; |
92 | 92 | ||
93 | - if (!unref(getCanResize) || tableData.length === 0) return; | 93 | + if (!unref(getCanResize) || !unref(tableData) || tableData.length === 0) return; |
94 | 94 | ||
95 | await nextTick(); | 95 | await nextTick(); |
96 | // Add a delay to get the correct bottomIncludeBody paginationHeight footerHeight headerHeight | 96 | // Add a delay to get the correct bottomIncludeBody paginationHeight footerHeight headerHeight |
src/components/Table/src/types/table.ts
@@ -463,6 +463,8 @@ export interface BasicColumn extends ColumnProps<Recordable> { | @@ -463,6 +463,8 @@ export interface BasicColumn extends ColumnProps<Recordable> { | ||
463 | column: BasicColumn; | 463 | column: BasicColumn; |
464 | index: number; | 464 | index: number; |
465 | }) => VNodeChild | JSX.Element; | 465 | }) => VNodeChild | JSX.Element; |
466 | + // 动态 Disabled | ||
467 | + editDynamicDisabled?: boolean | ((record: Recordable) => boolean); | ||
466 | } | 468 | } |
467 | 469 | ||
468 | export type ColumnChangeParam = { | 470 | export type ColumnChangeParam = { |