53 lines
1.4 KiB
JavaScript
53 lines
1.4 KiB
JavaScript
import { useState, useMemo, useCallback, useEffect } from 'react'
|
|
import { AgGridReact } from 'ag-grid-react'
|
|
import 'ag-grid-community/styles/ag-grid.css'
|
|
import 'ag-grid-community/styles/ag-theme-quartz.css'
|
|
export default function StuffPlanQGrid(props) {
|
|
const { planGridData, planGridColumns, isPageable = true } = props
|
|
|
|
const [rowData, setRowData] = useState(null)
|
|
// const [gridApi, setGridApi] = useState(null)
|
|
const [colDefs, setColDefs] = useState(planGridColumns)
|
|
|
|
const defaultColDef = useMemo(() => {
|
|
return {
|
|
flex: 1,
|
|
minWidth: 100,
|
|
sortable: false,
|
|
suppressMovable: false,
|
|
resizable: false,
|
|
suppressSizeToFit: false,
|
|
}
|
|
}, [])
|
|
|
|
const rowBuffer = 10
|
|
|
|
useEffect(() => {
|
|
planGridData ? setRowData(planGridData) : ''
|
|
}, [planGridData])
|
|
|
|
// const onGridReady = useCallback(
|
|
// (params) => {
|
|
// setGridApi(params.api)
|
|
// planGridData ? setRowData(planGridData) : ''
|
|
// },
|
|
// [planGridData],
|
|
// )
|
|
|
|
return (
|
|
<div className="ag-theme-quartz" style={{ height: '100%' }}>
|
|
<AgGridReact
|
|
// onGridReady={onGridReady}
|
|
rowBuffer={rowBuffer}
|
|
rowData={rowData}
|
|
columnDefs={colDefs}
|
|
defaultColDef={defaultColDef}
|
|
rowSelection={'singleRow'}
|
|
pagination={isPageable}
|
|
domLayout="autoHeight"
|
|
suppressCellFocus={true}
|
|
/>
|
|
</div>
|
|
)
|
|
}
|