fix(ui): prevent column menu from overflowing screen boundaries
This commit is contained in:
parent
4a06d906ce
commit
8bd7e9cbd9
@ -121,7 +121,10 @@ Component.register('DataTable', container => {
|
|||||||
state.activeField = field; state.activeFieldId = field.id;
|
state.activeField = field; state.activeFieldId = field.id;
|
||||||
menu.style.display = 'block';
|
menu.style.display = 'block';
|
||||||
const rect = btn.getBoundingClientRect(), rootRect = container.getBoundingClientRect();
|
const rect = btn.getBoundingClientRect(), rootRect = container.getBoundingClientRect();
|
||||||
menu.style.left = (rect.right - rootRect.left - (menu.offsetWidth || 260)) + 'px';
|
const menuWidth = menu.offsetWidth || 260;
|
||||||
|
let leftPos = rect.right - rootRect.left - menuWidth;
|
||||||
|
if (leftPos < 0) leftPos = Math.max(0, rect.left - rootRect.left);
|
||||||
|
menu.style.left = leftPos + 'px';
|
||||||
menu.style.top = (rect.bottom - rootRect.top + 5) + 'px';
|
menu.style.top = (rect.bottom - rootRect.top + 5) + 'px';
|
||||||
|
|
||||||
const onGlobalClick = (ev) => {
|
const onGlobalClick = (ev) => {
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user