From 2f4c80b178714808276a8b7556603f20e13ed5ae Mon Sep 17 00:00:00 2001 From: xuliangzhan Date: Sat, 14 Dec 2024 23:42:08 +0800 Subject: [PATCH] releases 3.11.31 --- package.json | 4 +- packages/grid/src/grid.ts | 10 +- packages/table/src/body.ts | 3 +- packages/table/src/methods.ts | 183 ++++++++++++++++++++++++++-------- packages/table/src/table.ts | 28 ++++-- 5 files changed, 170 insertions(+), 58 deletions(-) diff --git a/package.json b/package.json index 5899ae4edc..c73481cc92 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vxe-table", - "version": "3.11.30", + "version": "3.11.31", "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": "^3.3.33" + "vxe-pc-ui": "^3.3.35" }, "devDependencies": { "@babel/plugin-transform-modules-commonjs": "^7.25.7", diff --git a/packages/grid/src/grid.ts b/packages/grid/src/grid.ts index b204b207e9..ee5b6fe284 100644 --- a/packages/grid/src/grid.ts +++ b/packages/grid/src/grid.ts @@ -461,6 +461,12 @@ export default { tableProps.editConfig = Object.assign({}, editConfig) } return tableProps + }, + computePageConfFlag () { + const $xeGrid = this + + const pagerOpts = $xeGrid.computePagerOpts + return `${pagerOpts.currentPage}${pagerOpts.pageSize}` } } as any, watch: { @@ -480,7 +486,7 @@ export default { proxyConfig () { this.initProxy() }, - pagerConfig () { + computePageConfFlag () { this.initPages() } } as any, @@ -1106,7 +1112,9 @@ export default { }, resetEvent (params: any) { const { proxyConfig } = this + const $xeTable = this.$refs.xTable if (proxyConfig) { + $xeTable.clearScroll() this.commitProxy('reload').then((rest: any) => { this.$emit('proxy-query', { ...rest, isReload: true, $grid: this, $event: params.$event }) }) diff --git a/packages/table/src/body.ts b/packages/table/src/body.ts index 137b7a1908..b326baab7e 100644 --- a/packages/table/src/body.ts +++ b/packages/table/src/body.ts @@ -354,7 +354,6 @@ function renderRows (h: CreateElement, _vm: any, $xeTable: any, fixedType: any, hasFixedColumn, fullAllDataRowIdData, rowOpts, - pendingRowList, pendingRowMaps, columnOpts, isDragColMove @@ -434,7 +433,7 @@ function renderRows (h: CreateElement, _vm: any, $xeTable: any, fixedType: any, 'row--new': isNewRow && (editOpts.showStatus || editOpts.showInsertStatus), 'row--radio': radioOpts.highlight && $xeTable.selectRadioRow === row, 'row--checked': checkboxOpts.highlight && $xeTable.isCheckedByCheckboxRow(row), - 'row--pending': pendingRowList.length && !!pendingRowMaps[rowid] + 'row--pending': !!pendingRowMaps[rowid] }, rowClassName ? (XEUtils.isFunction(rowClassName) ? rowClassName(params) : rowClassName) : '' ] diff --git a/packages/table/src/methods.ts b/packages/table/src/methods.ts index c334467148..0399949da5 100644 --- a/packages/table/src/methods.ts +++ b/packages/table/src/methods.ts @@ -815,16 +815,13 @@ const Methods = { * @param {Array} datas 数据 */ loadData (datas: any) { - const { inited, initStatus } = this + const { initStatus } = this return this.loadTableData(datas).then(() => { this.inited = true this.initStatus = true if (!initStatus) { this.handleLoadDefaults() } - if (!inited) { - this.handleInitDefaults() - } return this.recalculate() }) }, @@ -833,7 +830,6 @@ const Methods = { * @param {Array} datas 数据 */ reloadData (datas: any) { - const { inited } = this return this.clearAll() .then(() => { this.inited = true @@ -842,9 +838,6 @@ const Methods = { }) .then(() => { this.handleLoadDefaults() - if (!inited) { - this.handleInitDefaults() - } return this.recalculate() }) }, @@ -4020,23 +4013,74 @@ const Methods = { * @param {Array/Row} rows 行数据 * @param {Boolean} value 是否选中 */ - setCheckboxRow (rows: any, value: any) { + setCheckboxRow (rows: any, checked: any) { + const $xeTable = this + if (rows && !XEUtils.isArray(rows)) { rows = [rows] } - return this.handleCheckedCheckboxRow(rows, value, true) + return $xeTable.handleCheckedCheckboxRow(rows, checked, true) + }, + setCheckboxRowKey (keys: any, checked: boolean) { + const $xeTable = this + const internalData = $xeTable + + const { fullAllDataRowIdData } = internalData + if (keys && !XEUtils.isArray(keys)) { + keys = [keys] + } + const rows: any = [] + keys.forEach((rowid: string) => { + const rowRest = fullAllDataRowIdData[rowid] + if (rowRest) { + rows.push(rowRest.row) + } + }) + return $xeTable.handleCheckedCheckboxRow(rows, checked, true) }, isCheckedByCheckboxRow (row: any) { - const { selectCheckboxMaps } = this - const { checkField } = this.checkboxOpts + const $xeTable = this + const reactData = $xeTable + + const { selectCheckboxMaps } = reactData + const checkboxOpts = $xeTable.computeCheckboxOpts + const { checkField } = checkboxOpts if (checkField) { return XEUtils.get(row, checkField) } - return !!selectCheckboxMaps[getRowid(this, row)] + return !!selectCheckboxMaps[getRowid($xeTable, row)] + }, + isCheckedByCheckboxRowKey (rowid: string) { + const $xeTable = this + const reactData = $xeTable + const internalData = $xeTable + + const { selectCheckboxMaps } = reactData + const { fullAllDataRowIdData } = internalData + const checkboxOpts = $xeTable.computeCheckboxOpts + const { checkField } = checkboxOpts + if (checkField) { + const rowRest = fullAllDataRowIdData[rowid] + if (rowRest) { + return XEUtils.get(rowRest.row, checkField) + } + return false + } + return !!selectCheckboxMaps[rowid] }, isIndeterminateByCheckboxRow (row: any) { - const { treeIndeterminateMaps } = this - return !!treeIndeterminateMaps[getRowid(this, row)] && !this.isCheckedByCheckboxRow(row) + const $xeTable = this + const reactData = $xeTable + + const { treeIndeterminateMaps } = reactData + return !!treeIndeterminateMaps[getRowid($xeTable, row)] && !$xeTable.isCheckedByCheckboxRow(row) + }, + isIndeterminateByCheckboxRowKey (rowid: string) { + const $xeTable = this + const reactData = $xeTable + + const { treeIndeterminateMaps } = reactData + return !!treeIndeterminateMaps[rowid] && !$xeTable.isCheckedByCheckboxRowKey(rowid) }, /** * 切换选中 @@ -4762,7 +4806,24 @@ const Methods = { return this.$nextTick() }, isCheckedByRadioRow (row: any) { - return this.selectRadioRow === row + const $xeTable = this + const reactData = $xeTable + + const { selectRadioRow } = reactData + if (row && selectRadioRow) { + return $xeTable.eqRow(selectRadioRow, row) + } + return false + }, + isCheckedByRadioRowKey (key: string) { + const $xeTable = this + const reactData = $xeTable + + const { selectRadioRow } = reactData + if (selectRadioRow) { + return key === getRowid($xeTable, selectRadioRow) + } + return false }, handleCheckedRadioRow (row: any, isForce: any) { const { radioOpts } = this @@ -4778,7 +4839,24 @@ const Methods = { * @param {Row} row 行对象 */ setRadioRow (row: any) { - return this.handleCheckedRadioRow(row, true) + const $xeTable = this + + return $xeTable.handleCheckedRadioRow(row, true) + }, + /** + * 用于单选行，设置某一行为选中状态 + * @param key 行主键 + */ + setRadioRowKey (rowid: any) { + const $xeTable = this + const internalData = $xeTable + + const { fullAllDataRowIdData } = internalData + const rowRest = fullAllDataRowIdData[rowid] + if (rowRest) { + return $xeTable.handleCheckedRadioRow(rowRest.row, true) + } + return $xeTable.$nextTick() }, /** * 用于当前行，手动清空当前高亮的状态 @@ -4913,6 +4991,8 @@ const Methods = { * 如果是双击模式，则单击后选中状态 */ triggerCellClickEvent (evnt: any, params: any) { + const $xeTable = this + const { highlightCurrentRow, editStore, radioOpts, expandOpts, treeOpts, keyboardOpts, editConfig, editOpts, checkboxOpts, rowOpts } = this const { actived, focused } = editStore const { row, column } = params @@ -4976,6 +5056,20 @@ const Methods = { } } } + // 如果是双击编辑模式 + if (isEnableConf(editConfig) && editOpts.trigger === 'dblclick') { + if (actived.row && actived.column) { + if (editOpts.mode === 'row') { + if (!$xeTable.eqRow(actived.row, row)) { + $xeTable.handleClearEdit(evnt) + } + } else if (editOpts.mode === 'cell') { + if (!$xeTable.eqRow(actived.row, row) || actived.column.id !== column.id) { + $xeTable.handleClearEdit(evnt) + } + } + } + } this.emitEvent('cell-click', params, evnt) }, /** @@ -5590,62 +5684,66 @@ const Methods = { reactData.isDragColMove = false }, setPendingRow (rows: any, status: any) { - const pendingMaps = { ...this.pendingRowMaps } - const pendingList = [...this.pendingRowList] + const $xeTable = this + const reactData = $xeTable + + const pendingMaps = Object.assign({}, reactData.pendingRowMaps) if (rows && !XEUtils.isArray(rows)) { rows = [rows] } if (status) { rows.forEach((row: any) => { - const rowid = getRowid(this, row) + const rowid = getRowid($xeTable, row) if (rowid && !pendingMaps[rowid]) { - pendingList.push(row) pendingMaps[rowid] = row } }) } else { rows.forEach((row: any) => { - const rowid = getRowid(this, row) + const rowid = getRowid($xeTable, row) if (rowid && pendingMaps[rowid]) { - const pendingIndex = this.findRowIndexOf(pendingList, row) - if (pendingIndex > -1) { - pendingList.splice(pendingIndex, 1) - } delete pendingMaps[rowid] } }) } - this.pendingRowMaps = pendingMaps - this.pendingRowList = pendingList - return this.$nextTick() + reactData.pendingRowMaps = pendingMaps + return $xeTable.$nextTick() }, togglePendingRow (rows: any) { - const pendingMaps = { ...this.pendingRowMaps } - const pendingList = [...this.pendingRowList] + const $xeTable = this + const reactData = $xeTable + + const pendingMaps = Object.assign({}, reactData.pendingRowMaps) if (rows && !XEUtils.isArray(rows)) { rows = [rows] } rows.forEach((row: any) => { - const rowid = getRowid(this, row) + const rowid = getRowid($xeTable, row) if (rowid) { if (pendingMaps[rowid]) { - const pendingIndex = this.findRowIndexOf(pendingList, row) - if (pendingIndex > -1) { - pendingList.splice(pendingIndex, 1) - } delete pendingMaps[rowid] } else { - pendingList.push(row) pendingMaps[rowid] = row } } }) - this.pendingRowMaps = pendingMaps - this.pendingRowList = pendingList - return this.$nextTick() + reactData.pendingRowMaps = pendingMaps + return $xeTable.$nextTick() }, getPendingRecords () { - return this.pendingRowList.slice(0) + const $xeTable = this + const reactData = $xeTable + const internalData = $xeTable + + const { pendingRowMaps } = reactData + const { fullAllDataRowIdData } = internalData + const insertRecords: any[] = [] + XEUtils.each(pendingRowMaps, (row, rowid) => { + if (fullAllDataRowIdData[rowid]) { + insertRecords.push(row) + } + }) + return insertRecords }, hasPendingByRow (row: any) { const { pendingRowMaps } = this @@ -5654,7 +5752,6 @@ const Methods = { }, clearPendingRow () { this.pendingRowMaps = {} - this.pendingRowList = [] return this.$nextTick() }, sort (sortConfs: any, sortOrder: any) { @@ -6545,6 +6642,8 @@ const Methods = { } internalData.lastScrollTop = scrollTop } + reactData.isDragColMove = false + reactData.isDragRowMove = false reactData.lastScrollTime = Date.now() const evntParams = { scrollTop, diff --git a/packages/table/src/table.ts b/packages/table/src/table.ts index bce8f6f484..d10b047c54 100644 --- a/packages/table/src/table.ts +++ b/packages/table/src/table.ts @@ -23,7 +23,7 @@ import keyboardMixin from '../module/keyboard/mixin' import validatorMixin from '../module/validator/mixin' import customMixin from '../module/custom/mixin' -import type { VxeLoadingComponent, VxeTooltipComponent, VxeTabsConstructor, VxeTabsPrivateMethods } from 'vxe-pc-ui' +import type { VxeLoadingComponent, VxeTooltipComponent, VxeTabsConstructor, VxeTabsPrivateMethods, VxeComponentStyleType } from 'vxe-pc-ui' const { getConfig, getIcon, getI18n, renderer, globalResize, globalEvents, globalMixins, renderEmptyElement } = VxeUI @@ -291,8 +291,6 @@ export default { reColumnFlag: 0, // 已标记的对象集 pendingRowMaps: {}, - // 已标记的行 - pendingRowList: [], // 自定义列相关的信息 customStore: { btnEl: null, @@ -777,6 +775,18 @@ export default { y: overflowY && scrollYLoad } }, + computeTableStyle () { + const $xeTable = this + const reactData = $xeTable + + const { tableData } = reactData + const columnOpts = $xeTable.computeColumnOpts + const stys: VxeComponentStyleType = {} + if (columnOpts.drag) { + stys['--vxe-ui-table-drag-column-move-delay'] = `${Math.max(0.06, Math.min(0.3, tableData.length / 800))}s` + } + return stys + }, tabsResizeFlag () { const $xeTable = this const $xeTabs = $xeTable.$xeTabs @@ -786,16 +796,13 @@ export default { } as any, watch: { data (value: any) { - const { inited, initStatus } = this + const { initStatus } = this this.loadTableData(value).then(() => { this.inited = true this.initStatus = true if (!initStatus) { this.handleLoadDefaults() } - if (!inited) { - this.handleInitDefaults() - } // const checkboxColumn = this.tableFullColumn.find(column => column.type === 'checkbox') // if (checkboxColumn && this.tableFullData.length > 300 && !this.checkboxOpts.checkField) { // warnLog('vxe.error.checkProp', ['checkbox-config.checkField']) @@ -1089,8 +1096,8 @@ export default { this.inited = true this.initStatus = true this.handleLoadDefaults() - this.handleInitDefaults() } + this.handleInitDefaults() this.updateStyle() }) globalEvents.on(this, 'paste', this.handleGlobalPasteEvent) @@ -1245,6 +1252,7 @@ export default { const vSize = computeSize const virtualScrollBars = $xeTable.computeVirtualScrollBars const isArea = mouseConfig && mouseOpts.area + const tableStyle = $xeTable.computeTableStyle return h('div', { ref: 'refElem', class: ['vxe-table', 'vxe-table--render-default', `tid_${tId}`, vSize ? `size--${vSize}` : '', `border--${tableBorder}`, { @@ -1277,9 +1285,7 @@ export default { 'is--virtual-x': scrollXLoad, 'is--virtual-y': scrollYLoad }], - style: { - '--vxe-ui-table-drag-column-move-delay': `${Math.max(0.05, Math.min(0.3, tableData.length / 800))}s` - }, + style: tableStyle, attrs: { spellcheck: false },