wdevs/oranguru
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Form interface and Loading menu

Browse Source
This commit is contained in:
Hein
2025-10-15 16:24:39 +02:00
parent f084cf70ae
commit 8d26d56599
7 changed files with 148 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
src/Gridler/stories/Examples.goapi.tsx
View File

@@ -1,4 +1,4 @@
import { Divider, Group, Stack, TagsInput, TextInput } from '@mantine/core';
import { Checkbox, Divider, Group, Stack, TagsInput, TextInput } from '@mantine/core';
import { useLocalStorage } from '@mantine/hooks';
import { useState } from 'react';
@@ -15,6 +15,7 @@ export const GridlerGoAPIExampleEventlog = () => {
const [apiKey, setApiKey] = useLocalStorage({ defaultValue: '', key: 'apikey' });
const [selectRow, setSelectRow] = useState<string | undefined>('');
const [values, setValues] = useState<Array<Record<string, any>>>([]);
const [sections, setSections] = useState<Record<string, unknown> | undefined>(undefined);
const columns: GridlerColumns = [
{
id: 'id_process',
@@ -49,6 +50,21 @@ export const GridlerGoAPIExampleEventlog = () => {
<TextInput label="API Url" onChange={(e) => setApiUrl(e.target.value)} value={apiUrl} />
<TextInput label="API Key" onChange={(e) => setApiKey(e.target.value)} value={apiKey} />
<Divider />
<Checkbox
label="Show Side Sections"
checked={!!sections}
onChange={(e) => {
e.target.checked
? setSections({
bottom: <div style={{ backgroundColor: 'teal', height: '25px' }}>bottom</div>,
left: <div style={{ backgroundColor: 'orange', width: '20px' }}>L</div>,
right: <div style={{ backgroundColor: 'green', width: '20px' }}>R</div>,
top: <div style={{ backgroundColor: 'purple', height: '20px' }}>top</div>,
})
: setSections(undefined);
}}
/>
<Divider />
<Gridler
height="100%"
columns={columns}
@@ -69,12 +85,7 @@ export const GridlerGoAPIExampleEventlog = () => {
//console.log('GridlerGoAPIExampleEventlog onChange', v);
setValues(v);
}}
sections={{
bottom: <div style={{ backgroundColor: 'teal', height: '25px' }}>bottom</div>,
left: <div style={{ backgroundColor: 'orange', width: '20px' }}>L</div>,
right: <div style={{ backgroundColor: 'green', width: '20px' }}>R</div>,
top: <div style={{ backgroundColor: 'purple', height: '20px' }}>top</div>,
}}
sections={sections}
selectedRow={selectRow ? parseInt(selectRow, 10) : undefined}
selectMode="row"
uniqueid="gridtest"