fix: fix aggrid initialization

This commit is contained in:
Ruben Fiszel
2023-10-06 20:00:01 +02:00
parent 9d250c8c0c
commit e98144ff07
@@ -14,6 +14,7 @@
import 'ag-grid-community/styles/ag-grid.css'
import 'ag-grid-community/styles/ag-theme-alpine.css'
import { Loader2 } from 'lucide-svelte'
// import 'ag-grid-community/dist/styles/ag-theme-alpine-dark.css'
export let id: string
@@ -24,17 +25,18 @@
let result: any[] | undefined = undefined
$: result && setValues()
let value: any[] = Array.isArray(result)
? (result as any[]).map((x, i) => ({ ...x, __index: i.toString() }))
: [{ error: 'input was not an array' }]
$: result && setValues()
let loaded = false
async function setValues() {
value = Array.isArray(result)
? (result as any[]).map((x, i) => ({ ...x, __index: i.toString() }))
: [{ error: 'input was not an array' }]
if (api) {
if (api && loaded) {
let selected = api.getSelectedNodes()
if (selected.length > 0) {
let data = { ...selected[0].data }
@@ -42,6 +44,9 @@
outputs?.selectedRow?.set(data)
}
}
if (!loaded) {
loaded = true
}
}
const { worldStore, selectedComponent, componentControl, darkMode } =
@@ -148,54 +153,58 @@
>
{#key extraConfig}
{#key resolvedConfig?.pagination}
<AgGridSvelte
rowData={value}
columnDefs={resolvedConfig?.columnDefs}
pagination={resolvedConfig?.pagination}
paginationAutoPageSize={resolvedConfig?.pagination}
defaultColDef={{
flex: resolvedConfig.flex ? 1 : 0,
editable: resolvedConfig?.allEditable,
onCellValueChanged
}}
onPaginationChanged={(event) => {
outputs?.page.set(event.api.paginationGetCurrentPage())
}}
rowSelection={resolvedConfig?.multipleSelectable ? 'multiple' : 'single'}
suppressRowDeselection={true}
rowMultiSelectWithClick={resolvedConfig?.multipleSelectable
? resolvedConfig.rowMultiselectWithClick
: undefined}
onSelectionChanged={(e) => {
if (resolvedConfig?.multipleSelectable) {
const rows = e.api.getSelectedNodes()
if (rows != undefined) {
toggleRows(rows)
{#if loaded}
<AgGridSvelte
rowData={value}
columnDefs={resolvedConfig?.columnDefs}
pagination={resolvedConfig?.pagination}
paginationAutoPageSize={resolvedConfig?.pagination}
defaultColDef={{
flex: resolvedConfig.flex ? 1 : 0,
editable: resolvedConfig?.allEditable,
onCellValueChanged
}}
onPaginationChanged={(event) => {
outputs?.page.set(event.api.paginationGetCurrentPage())
}}
rowSelection={resolvedConfig?.multipleSelectable ? 'multiple' : 'single'}
suppressRowDeselection={true}
rowMultiSelectWithClick={resolvedConfig?.multipleSelectable
? resolvedConfig.rowMultiselectWithClick
: undefined}
onSelectionChanged={(e) => {
if (resolvedConfig?.multipleSelectable) {
const rows = e.api.getSelectedNodes()
if (rows != undefined) {
toggleRows(rows)
}
} else {
const row = e.api.getSelectedNodes()?.[0]
if (row != undefined) {
toggleRow(row)
}
}
} else {
const row = e.api.getSelectedNodes()?.[0]
if (row != undefined) {
toggleRow(row)
}}
getRowId={(data) => data.data['__index']}
{...resolvedConfig.extraConfig}
onGridReady={(e) => {
outputs?.ready.set(true)
value = value
if (result && result.length > 0) {
e.api.getRowNode('0')?.setSelected(true)
}
}
}}
getRowId={(data) => data.data['__index']}
{...resolvedConfig.extraConfig}
onGridReady={(e) => {
outputs?.ready.set(true)
value = value
if (result && result.length > 0) {
e.api.getRowNode('0')?.setSelected(true)
}
$componentControl[id] = {
agGrid: { api: e.api, columnApi: e.columnApi },
setSelectedIndex: (index) => {
e.api.getRowNode(index.toString())?.setSelected(true)
$componentControl[id] = {
agGrid: { api: e.api, columnApi: e.columnApi },
setSelectedIndex: (index) => {
e.api.getRowNode(index.toString())?.setSelected(true)
}
}
}
api = e.api
}}
/>
api = e.api
}}
/>
{:else}
<Loader2 class="animate-spin" />
{/if}
{/key}
{/key}
</div>