diff --git a/examples/views/table/TableTest2.vue b/examples/views/table/TableTest2.vue index 9513cb9822..a982199afe 100644 --- a/examples/views/table/TableTest2.vue +++ b/examples/views/table/TableTest2.vue @@ -15,7 +15,7 @@ :row-config="{useKey: true,drag:true}" :row-drag-config="{trigger:'row',disabledMethod:disabledRowMethod}" :column-config="{useKey: true,drag: true}" - :column-drag-config="{isCrossDrag:true,isToChildDrag:true,isSelfToChildDrag:true,trigger:'default',disabledMethod:disabledColumnMethod}" + :column-drag-config="{isPeerDrag:true,isToChildDrag:true,isSelfToChildDrag:true,trigger:'default',disabledMethod:disabledColumnMethod}" :custom-config="customConfig" :loading="demo1.loading" :import-config="{modes: importModes}" diff --git a/package.json b/package.json index 800e0552ff..ff90344485 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vxe-table", - "version": "4.10.0-beta.14", + "version": "4.10.0", "description": "一个基于 vue 的 PC 端表格组件,支持增删改查、虚拟树、拖拽排序,懒加载、快捷菜单、数据校验、树形结构、打印、导入导出、自定义模板、渲染器、JSON 配置式...", "scripts": { "update": "npm install --legacy-peer-deps", @@ -28,7 +28,7 @@ "style": "lib/style.css", "typings": "types/index.d.ts", "dependencies": { - "vxe-pc-ui": "^4.3.52" + "vxe-pc-ui": "^4.3.54" }, "devDependencies": { "@types/resize-observer-browser": "^0.1.11", diff --git a/packages/table/module/custom/panel.ts b/packages/table/module/custom/panel.ts index 63e615c7cb..f5aa74f5cb 100644 --- a/packages/table/module/custom/panel.ts +++ b/packages/table/module/custom/panel.ts @@ -305,7 +305,7 @@ export default defineComponent({ } if (oldAllMaps[newColumn.id]) { isSelfToChildStatus = true - if (!isSelfToChildDrag) { + if (!(isCrossDrag && isSelfToChildDrag)) { if (VxeUI.modal) { VxeUI.modal.message({ status: 'error', @@ -329,7 +329,7 @@ export default defineComponent({ } if (oldAllMaps[newColumn.id]) { isSelfToChildStatus = true - if (!isSelfToChildDrag) { + if (!(isCrossDrag && isSelfToChildDrag)) { if (VxeUI.modal) { VxeUI.modal.message({ status: 'error', @@ -346,7 +346,7 @@ export default defineComponent({ const oldewMatchRest = XEUtils.findTree(collectColumn, item => item.id === oldColumn.id) // 改变层级 - if (isSelfToChildStatus && isSelfToChildDrag) { + if (isSelfToChildStatus && (isCrossDrag && isSelfToChildDrag)) { if (oldewMatchRest) { const { items: oCols, index: oIndex } = oldewMatchRest const childList = oldColumn.children || [] @@ -370,7 +370,7 @@ export default defineComponent({ if (newMatchRest) { const { items: nCols, index: nIndex, parent: nParent } = newMatchRest // 转子级 - if (isToChildDrag && prevDragToChild) { + if ((isCrossDrag && isToChildDrag) && prevDragToChild) { oldColumn.parentId = newColumn.id newColumn.children = (newColumn.children || []).concat([oldColumn]) } else { @@ -459,7 +459,7 @@ export default defineComponent({ showDropTip(evnt, optEl, false, dragPos) return } - prevDragToChild = !!(isToChildDrag && hasCtrlKey && immediate) + prevDragToChild = !!((isCrossDrag && isToChildDrag) && hasCtrlKey && immediate) prevDragCol = column prevDragPos = dragPos showDropTip(evnt, optEl, true, dragPos) diff --git a/packages/table/src/cell.ts b/packages/table/src/cell.ts index 46f43b9371..696cf07d2d 100644 --- a/packages/table/src/cell.ts +++ b/packages/table/src/cell.ts @@ -83,12 +83,12 @@ function renderCellBaseVNs (params: VxeTableDefines.CellRenderBodyParams & { $ta const { computeRowOpts, computeRowDragOpts } = $table.getComputeMaps() const rowOpts = computeRowOpts.value const rowDragOpts = computeRowDragOpts.value - const { showIcon, isCrossDrag, visibleMethod } = rowDragOpts + const { showIcon, isPeerDrag, isCrossDrag, visibleMethod } = rowDragOpts const rVisibleMethod = visibleMethod || (dragConfig ? dragConfig.rowVisibleMethod : null) const vns: VxeComponentSlotType[] = XEUtils.isArray(content) ? content : [content] if (dragSort && rowOpts.drag && ((showIcon || (dragConfig ? dragConfig.showRowIcon : false)) && (!rVisibleMethod || rVisibleMethod(params)))) { if (treeConfig) { - if (isCrossDrag || !level) { + if (isPeerDrag || isCrossDrag || !level) { vns.unshift( renderCellDragIcon(params) ) @@ -107,9 +107,9 @@ function renderHeaderCellDragIcon (params: VxeTableDefines.CellRenderHeaderParam const { computeColumnOpts, computeColumnDragOpts } = $table.getComputeMaps() const columnOpts = computeColumnOpts.value const columnDragOpts = computeColumnDragOpts.value - const { showIcon, icon, trigger, isCrossDrag, visibleMethod, disabledMethod } = columnDragOpts + const { showIcon, icon, trigger, isPeerDrag, isCrossDrag, visibleMethod, disabledMethod } = columnDragOpts if (columnOpts.drag && showIcon && (!visibleMethod || visibleMethod(params))) { - if (!column.fixed && (isCrossDrag || !column.parentId)) { + if (!column.fixed && (isPeerDrag || isCrossDrag || !column.parentId)) { const isDisabled = disabledMethod && disabledMethod(params) const ons: Record = {} if (trigger !== 'cell') { diff --git a/packages/table/src/table.ts b/packages/table/src/table.ts index 15e0086752..2aa11bd583 100644 --- a/packages/table/src/table.ts +++ b/packages/table/src/table.ts @@ -7307,7 +7307,7 @@ export default defineComponent({ const { treeConfig, dragConfig } = props const rowDragOpts = computeRowDragOpts.value const { fullAllDataRowIdData, prevDragToChild } = internalData - const { isCrossDrag, isSelfToChildDrag, dragEndMethod } = rowDragOpts + const { isPeerDrag, isCrossDrag, isSelfToChildDrag, dragEndMethod } = rowDragOpts const treeOpts = computeTreeOpts.value const { transform, rowField, mapChildrenField, parentField } = treeOpts const childrenField = treeOpts.children || treeOpts.childrenField @@ -7356,20 +7356,27 @@ export default defineComponent({ if (oldLevel && newLevel) { // 子到子 - if (!isCrossDrag) { - return - } - if (oldAllMaps[newRowid]) { - isSelfToChildStatus = true - if (!isSelfToChildDrag) { - if (VxeUI.modal) { - VxeUI.modal.message({ - status: 'error', - content: getI18n('vxe.error.treeDragChild') - }) - } + if (isPeerDrag) { + if (oldRest.row[parentField] !== newRest.row[parentField]) { + // 非同级 + return + } + } else { + if (!isCrossDrag) { return } + if (oldAllMaps[newRowid]) { + isSelfToChildStatus = true + if (!(isCrossDrag && isSelfToChildDrag)) { + if (VxeUI.modal) { + VxeUI.modal.message({ + status: 'error', + content: getI18n('vxe.error.treeDragChild') + }) + } + return + } + } } } else if (oldLevel) { // 子到根 @@ -7385,7 +7392,7 @@ export default defineComponent({ } if (oldAllMaps[newRowid]) { isSelfToChildStatus = true - if (!isSelfToChildDrag) { + if (!(isCrossDrag && isSelfToChildDrag)) { if (VxeUI.modal) { VxeUI.modal.message({ status: 'error', @@ -7411,7 +7418,7 @@ export default defineComponent({ fullList.splice(ntfIndex, 0, dragRow) // 改变层级 - if (isSelfToChildStatus && isSelfToChildDrag) { + if (isSelfToChildStatus && (isCrossDrag && isSelfToChildDrag)) { XEUtils.each(dragRow[childrenField], childRow => { childRow[parentField] = dragRow[parentField] }) @@ -7485,9 +7492,9 @@ export default defineComponent({ const { fullAllDataRowIdData } = internalData const { dragRow } = reactData const treeOpts = computeTreeOpts.value - const { transform } = treeOpts + const { transform, parentField } = treeOpts const rowDragOpts = computeRowDragOpts.value - const { isCrossDrag, isToChildDrag } = rowDragOpts + const { isPeerDrag, isCrossDrag, isToChildDrag } = rowDragOpts if (!dragRow) { evnt.preventDefault() return @@ -7502,11 +7509,13 @@ export default defineComponent({ const { dragRow } = reactData const offsetY = evnt.clientY - trEl.getBoundingClientRect().y const dragPos = offsetY < trEl.clientHeight / 2 ? 'top' : 'bottom' - if ($xeTable.eqRow(dragRow, row) || (!isCrossDrag && treeConfig && rest.level)) { + if ($xeTable.eqRow(dragRow, row) || + (!isCrossDrag && treeConfig && transform && (isPeerDrag ? dragRow[parentField] !== row[parentField] : rest.level)) + ) { showDropTip(evnt, trEl, null, false, dragPos) return } - internalData.prevDragToChild = !!(treeConfig && transform && isToChildDrag && hasCtrlKey) + internalData.prevDragToChild = !!(treeConfig && transform && (isCrossDrag && isToChildDrag) && hasCtrlKey) internalData.prevDragRow = row internalData.prevDragPos = dragPos showDropTip(evnt, trEl, null, true, dragPos) @@ -7563,7 +7572,7 @@ export default defineComponent({ handleColDragSwapEvent (evnt, isSyncColumn, dragCol, prevDragCol, prevDragPos, prevDragToChild) { const { mouseConfig } = props const columnDragOpts = computeColumnDragOpts.value - const { isCrossDrag, isSelfToChildDrag, isToChildDrag, dragEndMethod } = columnDragOpts + const { isPeerDrag, isCrossDrag, isSelfToChildDrag, isToChildDrag, dragEndMethod } = columnDragOpts const { collectColumn } = internalData const dragOffsetIndex = prevDragPos === 'right' ? 1 : 0 if (prevDragCol && dragCol) { @@ -7598,20 +7607,28 @@ export default defineComponent({ if (oldColumn.parentId && newColumn.parentId) { // 子到子 - if (!isCrossDrag) { - return - } - if (oldAllMaps[newColumn.id]) { - isSelfToChildStatus = true - if (!isSelfToChildDrag) { - if (VxeUI.modal) { - VxeUI.modal.message({ - status: 'error', - content: getI18n('vxe.error.treeDragChild') - }) - } + if (isPeerDrag) { + if (oldColumn.parentId !== newColumn.parentId) { + // 非同级 + return + } + } else { + if (!isCrossDrag) { return } + + if (oldAllMaps[newColumn.id]) { + isSelfToChildStatus = true + if (!(isCrossDrag && isSelfToChildDrag)) { + if (VxeUI.modal) { + VxeUI.modal.message({ + status: 'error', + content: getI18n('vxe.error.treeDragChild') + }) + } + return + } + } } } else if (oldColumn.parentId) { // 子到根 @@ -7627,7 +7644,7 @@ export default defineComponent({ } if (oldAllMaps[newColumn.id]) { isSelfToChildStatus = true - if (!isSelfToChildDrag) { + if (!(isCrossDrag && isSelfToChildDrag)) { if (VxeUI.modal) { VxeUI.modal.message({ status: 'error', @@ -7644,7 +7661,7 @@ export default defineComponent({ const oldewMatchRest = XEUtils.findTree(collectColumn, item => item.id === oldColumn.id) // 改变层级 - if (isSelfToChildStatus && isSelfToChildDrag) { + if (isSelfToChildStatus && (isCrossDrag && isSelfToChildDrag)) { if (oldewMatchRest) { const { items: oCols, index: oIndex } = oldewMatchRest const childList = oldColumn.children || [] @@ -7668,7 +7685,7 @@ export default defineComponent({ if (newMatchRest) { const { items: nCols, index: nIndex, parent: nParent } = newMatchRest // 转子级 - if (isToChildDrag && prevDragToChild) { + if ((isCrossDrag && isToChildDrag) && prevDragToChild) { oldColumn.parentId = newColumn.id newColumn.children = (newColumn.children || []).concat([oldColumn]) } else { @@ -7737,7 +7754,7 @@ export default defineComponent({ handleHeaderCellDragDragoverEvent (evnt) { const { dragCol } = reactData const columnDragOpts = computeColumnDragOpts.value - const { isToChildDrag, isCrossDrag } = columnDragOpts + const { isToChildDrag, isPeerDrag, isCrossDrag } = columnDragOpts if (!dragCol) { evnt.preventDefault() return @@ -7751,11 +7768,14 @@ export default defineComponent({ const { clientX } = evnt const offsetX = clientX - thEl.getBoundingClientRect().x const dragPos = offsetX < thEl.clientWidth / 2 ? 'left' : 'right' - if (column.fixed || (dragCol && dragCol.id === column.id) || (!isCrossDrag && column.parentId)) { + if (column.fixed || + (dragCol && dragCol.id === column.id) || + (!isCrossDrag && (isPeerDrag ? dragCol.parentId !== column.parentId : column.parentId)) + ) { showDropTip(evnt, null, thEl, false, dragPos) return } - internalData.prevDragToChild = !!(isToChildDrag && hasCtrlKey) + internalData.prevDragToChild = !!((isCrossDrag && isToChildDrag) && hasCtrlKey) internalData.prevDragCol = column internalData.prevDragPos = dragPos showDropTip(evnt, null, thEl, true, dragPos)