From c21f62b7b81a87a360e420aeb4309e8f3601a568 Mon Sep 17 00:00:00 2001 From: Tsanie Date: Fri, 23 Feb 2024 10:52:30 +0800 Subject: [PATCH] fix: grid hover position issue. --- lib/ui/grid/grid.js | 20 ++++++++++++++------ 1 file changed, 14 insertions(+), 6 deletions(-) diff --git a/lib/ui/grid/grid.js b/lib/ui/grid/grid.js index 5ff5fae..2079f82 100644 --- a/lib/ui/grid/grid.js +++ b/lib/ui/grid/grid.js @@ -691,6 +691,12 @@ export class Grid { * @private */ footerOffset: null, + /** + * 容器宽度 + * @type {number} + * @private + */ + wrapClientWidth: null, /** * 正文宽度 * @type {number} @@ -1369,7 +1375,7 @@ export class Grid { }); holder.addEventListener('dblclick', e => this._onRowDblClicked(e)); wrapper.appendChild(holder); - wrapper.addEventListener('mousemove', e => throttle(this._onGridMouseMove, HoverInternal, this, e, holder), { passive: true }); + grid.addEventListener('mousemove', e => throttle(this._onGridMouseMove, HoverInternal, this, e, holder), { passive: true }); } // loading @@ -1437,6 +1443,7 @@ export class Grid { this.reload(keep); } } + this._var.wrapClientWidth = this._var.refs.wrapper.clientWidth; this._var.bodyClientWidth = body.clientWidth; } @@ -1491,7 +1498,7 @@ export class Grid { if (!keep) { this._var.scrollTop = 0; this._var.el.scrollTop = 0; - // this._var.el.scrollLeft = 0; + this._var.el.scrollLeft = 0; this._var.refs.table.style.top = '0px'; } this._adjustRows(this._var.refs.body); @@ -3597,6 +3604,7 @@ export class Grid { if (this.onBodyScrolled === 'function') { this.onBodyScrolled(e); } + this._var.scrollLeft = e.target.scrollLeft; if (!this.virtual) { if (this.total != null) { this._var.refs.footer.parentElement.style.bottom = `${this._var.footerOffset - e.target.scrollTop}px`; @@ -3659,15 +3667,15 @@ export class Grid { const top = (parent.classList.contains('ui-grid-total-row') ? this._var.refs.footer.parentElement.offsetTop + 1 : target.offsetTop) + this._var.refs.table.offsetTop; let left = target.offsetLeft; let width = holder.offsetWidth; - if (width > this._var.bodyClientWidth) { - width = this._var.bodyClientWidth; + if (width > this._var.wrapClientWidth) { + width = this._var.wrapClientWidth; } - const maxleft = this._var.bodyClientWidth + this._var.scrollLeft - width; + const maxleft = this._var.wrapClientWidth + this._var.scrollLeft - width; if (left > maxleft) { left = maxleft; } const height = target.offsetHeight; - holder.style.cssText = `top: ${top}px; left: ${left}px; max-width: ${this._var.bodyClientWidth}px; height: ${height - 2}px`; + holder.style.cssText = `top: ${top}px; left: ${left}px; max-width: ${this._var.wrapClientWidth}px; height: ${height - 2}px`; holder.classList.add('active'); } else if (holder.classList.contains('active')) { delete holder.dataset.row;