From 4f164f328987bda709eede3e2bbfef9c41e2672b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Sedat=20=C3=96zt=C3=BCrk?= Date: Fri, 26 Jun 2026 22:27:55 +0300 Subject: [PATCH] =?UTF-8?q?Grid=20ve=20Tree=20i=C3=A7in=20Dinamik=20Heigth?= =?UTF-8?q?=20/=20Custom=20Button=20Width?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ui/src/index.css | 8 ++++---- ui/src/views/list/Grid.tsx | 25 +++++++++++++++++++++---- ui/src/views/list/Tree.tsx | 24 +++++++++++++++++++++--- 3 files changed, 46 insertions(+), 11 deletions(-) diff --git a/ui/src/index.css b/ui/src/index.css index 263e689..41192b5 100644 --- a/ui/src/index.css +++ b/ui/src/index.css @@ -249,14 +249,14 @@ div.dialog-after-open > div.dialog-content.maximized { .dx-datagrid-header-panel > .dx-toolbar .dx-toolbar-before, .dx-treelist-header-panel > .dx-toolbar .dx-toolbar-before { - width: 50% !important; - max-width: 50% !important; + width: auto !important; + max-width: none !important; } .dx-datagrid-header-panel > .dx-toolbar .dx-toolbar-after, .dx-treelist-header-panel > .dx-toolbar .dx-toolbar-after { - width: 50% !important; - max-width: 50% !important; + width: auto !important; + max-width: 100% !important; margin-left: auto; text-align: right; white-space: nowrap; diff --git a/ui/src/views/list/Grid.tsx b/ui/src/views/list/Grid.tsx index 89eb2e6..8274d26 100644 --- a/ui/src/views/list/Grid.tsx +++ b/ui/src/views/list/Grid.tsx @@ -251,6 +251,21 @@ const isTouchLikeDevice = () => const isMobileViewport = () => typeof window !== 'undefined' && window.matchMedia?.('(max-width: 767px)').matches +const getEditPopupHeight = (useMobileEditPopup: boolean, isPopupFullScreen: boolean) => + useMobileEditPopup && isPopupFullScreen ? '100%' : 'auto' + +const getEditPopupMaxHeight = ( + useMobileEditPopup: boolean, + isPopupFullScreen: boolean, + configuredHeight?: number, +) => { + if (useMobileEditPopup && isPopupFullScreen) { + return '100%' + } + + return configuredHeight && configuredHeight > 0 ? configuredHeight : '90vh' +} + const Grid = (props: GridProps) => { const { listFormCode, searchParams, isSubForm, level, gridDto: extGridDto } = props const { translate } = useLocalization() @@ -1566,10 +1581,12 @@ const Grid = (props: GridProps) => { width: useMobileEditPopup ? '100%' : gridDto.gridOptions.editingOptionDto?.popup?.width, - height: - useMobileEditPopup && isPopupFullScreen - ? '100%' - : gridDto.gridOptions.editingOptionDto?.popup?.height, + height: getEditPopupHeight(useMobileEditPopup, isPopupFullScreen), + maxHeight: getEditPopupMaxHeight( + useMobileEditPopup, + isPopupFullScreen, + gridDto.gridOptions.editingOptionDto?.popup?.height, + ), position: useMobileEditPopup ? { my: 'top center', diff --git a/ui/src/views/list/Tree.tsx b/ui/src/views/list/Tree.tsx index 6aa8fce..e9d1200 100644 --- a/ui/src/views/list/Tree.tsx +++ b/ui/src/views/list/Tree.tsx @@ -239,6 +239,21 @@ const isTouchLikeDevice = () => const isMobileViewport = () => typeof window !== 'undefined' && window.matchMedia?.('(max-width: 767px)').matches +const getEditPopupHeight = (useMobileEditPopup: boolean, isPopupFullScreen: boolean) => + useMobileEditPopup && isPopupFullScreen ? '100%' : 'auto' + +const getEditPopupMaxHeight = ( + useMobileEditPopup: boolean, + isPopupFullScreen: boolean, + configuredHeight?: number, +) => { + if (useMobileEditPopup && isPopupFullScreen) { + return '100%' + } + + return configuredHeight && configuredHeight > 0 ? configuredHeight : '90vh' +} + const Tree = (props: TreeProps) => { const { listFormCode, searchParams, isSubForm, level, gridDto: extGridDto } = props const { translate } = useLocalization() @@ -1220,9 +1235,12 @@ const Tree = (props: TreeProps) => { width: useMobileEditPopup ? '100%' : gridDto.gridOptions.editingOptionDto?.popup?.width, - height: useMobileEditPopup && isPopupFullScreen - ? '100%' - : gridDto.gridOptions.editingOptionDto?.popup?.height, + height: getEditPopupHeight(useMobileEditPopup, isPopupFullScreen), + maxHeight: getEditPopupMaxHeight( + useMobileEditPopup, + isPopupFullScreen, + gridDto.gridOptions.editingOptionDto?.popup?.height, + ), position: useMobileEditPopup ? { my: 'top center',