Как получить сгруппированные столбцы в боковой панели и плоских колонндефах в сетке? ⇐ Javascript

[Anonymous]

Aggrid cdocumentiaion здесь показывает пользовательский макет Colum, но на щелчке кнопки https://www.ag-grid.com/react-data-grid ... umn-layout. Как я могу получить разные columlayouts в боковой панели и сетке. Я изучаю с Catgpt и Copilot, но не повезло. Это код, который я пытаюсь < /p>
function AgIndex() {
//const [isEditing, setIsEditing] = useState(true);
const gridRef = useRef(null);
const columnDefs = [
{ field: "salary", colId: "salary" },
{ field: "bonus", colId: "bonus" },
{ field: "name", colId: "name" },
{ field: "department", colId: "department" },
];

const groupedColumnLayout = [
{
headerName: "Salary Info",
groupId: "salary_info",
children: [{ colId: "salary" }, { colId: "bonus" }],
},
{
headerName: "Personal Info",
groupId: "personal_info",
children: [{ colId: "name" }, { colId: "department" }],
},
];

const rowData = [
{ salary: 50000, bonus: 5000, name: "Alice", department: "Engineering" },
{ salary: 60000, bonus: 7000, name: "Bob", department: "Marketing" },
{ salary: 55000, bonus: 6000, name: "Charlie", department: "HR" },
];
const apiRef = useRef(null);
const sideBar = {
toolPanels: [
{
id: "columns",
labelDefault: "Columns",
iconKey: "columns",
toolPanel: "agColumnsToolPanel",
toolPanelParams: {
suppressSyncLayoutWithGrid: true,
columnLayout: groupedColumnLayout,
suppressRowGroups: true,
suppressValues: true,
suppressPivots: true,
suppressPivotMode: true,
suppressColumnMove: true,
},
},
],
defaultToolPanel: "columns",
};

const setCustomGroupLayout = useCallback(() => {
const columnToolPanel = gridRef.current.api.getToolPanelInstance("columns");
if (columnToolPanel) {
columnToolPanel.setColumnLayout(groupedColumnLayout);
}
}, [groupedColumnLayout]);

// useEffect(() => {
// setCustomGroupLayout();
// }, []);

const onGridReady = useCallback((params) => {
apiRef.current = params.api;
params.api.openToolPanel("columns");
requestAnimationFrame(() => {
setCustomGroupLayout();
});

}, []);

return (





);
}````


Подробнее здесь: https://stackoverflow.com/questions/796 ... n-the-grid