Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(pro:table): column visible change should be trigger onColumnsChange #1327

Merged
merged 1 commit into from
Dec 2, 2022
Merged

fix(pro:table): column visible change should be trigger onColumnsChange #1327

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
fix(pro:table): column visible change should be trigger onColumnsChange
  • Loading branch information
@danranVm
danranVm committed Dec 2, 2022
commit 27ebe97ba8a1365c842e92e333fea66882704cbd
2 changes: 1 addition & 1 deletion packages/pro/table/src/composables/useColumns.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ export interface ColumnsContext {

export function useColumns(props: ProTableProps, config: ProTableConfig): ColumnsContext {
const originalColumns = computed(() => props.columns)
const [mergedColumns, setMergedColumns] = useState(mergeColumns(originalColumns.value, config), false)
const [mergedColumns, setMergedColumns] = useState(mergeColumns(originalColumns.value, config))
const mergedColumnMap = computed(() => {
const map = new Map<VKey, ProTableColumn>()
loopColumns(mergedColumns.value, column => map.set(column.key!, column))
Expand Down
21 changes: 15 additions & 6 deletions packages/pro/table/src/contents/LayoutToolContent.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,13 +50,24 @@ export default defineComponent({
setSearchValue(inputValue)
}

const handleCheckAll = (checked: boolean) =>
const handleCheckAll = (checked: boolean) => {
loopColumns(mergedColumns.value, column => {
// undefined or true
if (column.changeVisible !== false) {
column.visible = checked
}
})
handleFixedChange()
}

const handleFixedChange = () => {
const { startColumns, centerColumns, endColumns } = groupColumns(mergedColumns.value)
setMergedColumns([...startColumns, ...centerColumns, ...endColumns])
}

const handleVisibleChange = () => {
setMergedColumns([...mergedColumns.value])
}

return () => {
const { startColumns, centerColumns, endColumns } = groupColumns(mergedColumns.value)
Expand All @@ -83,11 +94,6 @@ export default defineComponent({
}
}

const handleFixedChange = () => {
const { startColumns, centerColumns, endColumns } = groupColumns(mergedColumns.value)
setMergedColumns([...startColumns, ...centerColumns, ...endColumns])
}

const settingLength = mergedColumns.value.length
const hiddenLength = hiddenColumns.value.length
const checked = hiddenLength === 0 && settingLength !== 0
Expand Down Expand Up @@ -121,6 +127,7 @@ export default defineComponent({
title={startPinTitle}
onDrop={handleDrop}
onFixedChange={handleFixedChange}
onVisibleChange={handleVisibleChange}
/>
)}
{(!withFixed || centerColumns.length > 0) && (
Expand All @@ -131,6 +138,7 @@ export default defineComponent({
title={withFixed ? noPinTitle : undefined}
onDrop={handleDrop}
onFixedChange={handleFixedChange}
onVisibleChange={handleVisibleChange}
/>
)}
{hasEndFixed && (
Expand All @@ -141,6 +149,7 @@ export default defineComponent({
title={endPinTitle}
onDrop={handleDrop}
onFixedChange={handleFixedChange}
onVisibleChange={handleVisibleChange}
/>
)}
</div>
Expand Down
4 changes: 3 additions & 1 deletion packages/pro/table/src/contents/LayoutToolTree.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ export default defineComponent({
title: { type: String, default: undefined },
onDrop: { type: Function, required: true },
onFixedChange: { type: Function, required: true },
onVisibleChange: { type: Function, required: true },
},
setup(props) {
const key = useKey()
Expand All @@ -46,6 +47,7 @@ export default defineComponent({
currColumn = parent
}
}
props.onVisibleChange()
}

const onDrop = (options: TreeDragDropOptions) => {
Expand All @@ -66,7 +68,7 @@ export default defineComponent({
loopColumns(column.children, child => {
child.fixed = fixed
})
props.onFixedChange!()
props.onFixedChange()
}

return () => {
Expand Down
14 changes: 1 addition & 13 deletions packages/pro/table/style/index.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,20 +2,8 @@
// .reset-component();

&-layout-tool {
.@{popover-prefix}-wrapper {
padding: @spacing-sm @spacing-xs;
min-width: 240px;
}

&-search-wrapper,
&-select-wrapper,
&-tree-wrapper {
padding: 0 @spacing-sm;
}

.@{header-prefix} {
padding-left: @spacing-sm;
padding-right: @spacing-sm;
padding-bottom: 0;

&-title {
color: @text-color;
Expand Down