fix: correção do scroll
This commit is contained in:
parent
0c14945d36
commit
bf567eabfa
|
|
@ -939,7 +939,7 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div style={{ height: "calc(100% - 2rem)", width: "100%", position: "relative" }}>
|
||||
<div style={{ height: "calc(100% - 2rem)", width: "100%", position: "relative", display: "flex", flexDirection: "column" }}>
|
||||
<DataGridPremium
|
||||
key={`datagrid-${sortedAndFilteredData.length}-${Object.keys(columnFilters).length}`}
|
||||
rows={sortedAndFilteredData}
|
||||
|
|
@ -955,19 +955,35 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
|
|||
getRowId={(row: any) => row.id || `row-${row.recnum || Math.random()}`}
|
||||
sx={{
|
||||
overflowAnchor: 'none',
|
||||
height: "100%",
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
"& .MuiDataGrid-root": {
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
height: "100%",
|
||||
flex: 1,
|
||||
overflow: "hidden",
|
||||
},
|
||||
"& .MuiDataGrid-main": {
|
||||
overflow: "visible",
|
||||
overflow: "hidden !important",
|
||||
position: "relative",
|
||||
height: "100%",
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
flex: 1,
|
||||
},
|
||||
// Container dos headers - DEVE FICAR FIXO (não rola)
|
||||
"& .MuiDataGrid-container--top": {
|
||||
overflow: "hidden !important",
|
||||
position: "relative",
|
||||
zIndex: 100,
|
||||
backgroundColor: "#f9fafb",
|
||||
flexShrink: 0,
|
||||
flexGrow: 0,
|
||||
},
|
||||
"& .MuiDataGrid-columnHeaders": {
|
||||
position: "sticky",
|
||||
top: 0,
|
||||
position: "relative !important",
|
||||
backgroundColor: "#f9fafb !important",
|
||||
zIndex: 100,
|
||||
borderBottom: "1px solid #e5e7eb",
|
||||
|
|
@ -976,31 +992,30 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
|
|||
backgroundColor: "#f9fafb !important",
|
||||
},
|
||||
"& .MuiDataGrid-columnHeaderRow": {
|
||||
position: "sticky",
|
||||
top: 0,
|
||||
zIndex: 100,
|
||||
backgroundColor: "#f9fafb !important",
|
||||
},
|
||||
"& .MuiDataGrid-columnHeadersInner": {
|
||||
position: "sticky",
|
||||
top: 0,
|
||||
zIndex: 100,
|
||||
backgroundColor: "#f9fafb !important",
|
||||
},
|
||||
// Garantir que o container dos headers não seja cortado
|
||||
"& .MuiDataGrid-container--top": {
|
||||
overflow: "visible",
|
||||
position: "relative",
|
||||
zIndex: 100,
|
||||
},
|
||||
"& .MuiDataGrid-cell": {
|
||||
borderBottom: "1px solid #f0f0f0",
|
||||
fontSize: "0.875rem",
|
||||
},
|
||||
// Container do virtualScroller - deve ter scroll e ocupar espaço restante
|
||||
"& .MuiDataGrid-container--bottom": {
|
||||
flex: 1,
|
||||
overflow: "hidden !important",
|
||||
position: "relative",
|
||||
minHeight: 0,
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
},
|
||||
// Apenas o virtualScroller deve ter scroll
|
||||
"& .MuiDataGrid-virtualScroller": {
|
||||
overflowY: "auto",
|
||||
overflowX: "auto",
|
||||
maxHeight: "calc(40vh - 120px)",
|
||||
overflowY: "auto !important",
|
||||
overflowX: "auto !important",
|
||||
height: "100% !important",
|
||||
flex: 1,
|
||||
overflowAnchor: 'none',
|
||||
// Garantir que a barra de scroll seja visível
|
||||
scrollbarWidth: "thin",
|
||||
|
|
@ -1030,9 +1045,6 @@ export default function AnaliticoComponent({ filtros }: AnaliticoProps) {
|
|||
borderBottom: "1px solid #e5e7eb",
|
||||
padding: "8px 16px",
|
||||
},
|
||||
"& .MuiDataGrid-container--bottom": {
|
||||
overflow: "hidden",
|
||||
},
|
||||
"& .MuiDataGrid-scrollbar": {
|
||||
display: "none",
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in New Issue