Grid ve Tree için Dinamik Heigth / Custom Button Width
This commit is contained in:
parent
a2a0d46488
commit
4f164f3289
3 changed files with 46 additions and 11 deletions
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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',
|
||||
|
|
|
|||
|
|
@ -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',
|
||||
|
|
|
|||
Loading…
Reference in a new issue