starred/windmill
1
0
Fork 0
mirror of https://github.com/windmill-labs/windmill.git synced 2026-08-20 00:02:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: make configurable footer for aggrid in apps

Browse Source
This commit is contained in:
Ruben Fiszel
2024-04-26 18:25:26 +02:00
parent 06aa0aa9f9
commit 41f6bcdaa1
3 changed files with 117 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/lib/components/apps/components/display/table/AppAggridExplorerTable.svelte
+22 -20
View File
@@ -424,27 +424,29 @@
>
<div bind:this={eGui} style:height="100%" />
</div>
<div class="flex gap-1 w-full justify-between items-center text-xs text-primary p-2">
<div>
<Popover>
<svelte:fragment slot="text">Download</svelte:fragment>
<Button
startIcon={{ icon: Download }}
color="light"
size="xs2"
on:click={() => {
api?.exportDataAsCsv()
}}
iconOnly
/>
</Popover>
{#if resolvedConfig && 'footer' in resolvedConfig && resolvedConfig.footer}
<div class="flex gap-1 w-full justify-between items-center text-xs text-primary p-2">
<div>
<Popover>
<svelte:fragment slot="text">Download</svelte:fragment>
<Button
startIcon={{ icon: Download }}
color="light"
size="xs2"
on:click={() => {
api?.exportDataAsCsv()
}}
iconOnly
/>
</Popover>
</div>
{#if datasource?.rowCount}
{firstRow}{'->'}{lastRow + 1} of {datasource?.rowCount} rows
{:else}
{firstRow}{'->'}{lastRow + 1}
{/if}
</div>
{#if datasource?.rowCount}
{firstRow}{'->'}{lastRow + 1} of {datasource?.rowCount} rows
{:else}
{firstRow}{'->'}{lastRow + 1}
{/if}
</div>
{/if}
</div>
{:else if resolvedConfig.columnDefs != undefined}
<Alert title="Parsing issues" type="error" size="xs">
frontend/src/lib/components/apps/components/display/table/AppAggridTable.svelte
+83 -80
View File
@@ -478,88 +478,91 @@
{/if}
{/key}
</div>
<div class="flex gap-1 w-full justify-between items-center text-sm text-secondary/80 p-2">
<div>
<Popover>
<svelte:fragment slot="text">Download</svelte:fragment>
<Button
startIcon={{ icon: Download }}
color="light"
size="xs2"
on:click={() => {
api?.exportDataAsCsv()
}}
iconOnly
/>
</Popover>
</div>
<div class="flex flex-row gap-1 items-center">
{#if resolvedConfig?.pagination}
{#key refreshCount}
<div class="text-xs mx-2 text-primary">
{(api?.paginationGetPageSize() ?? 0) * (api?.paginationGetCurrentPage() ?? 0) + 1}
to {Math.min(
api?.paginationGetRowCount() ?? 0,
((api?.paginationGetCurrentPage() ?? 0) + 1) *
(api?.paginationGetPageSize() ?? 0)
)}
of {api?.paginationGetRowCount()}
</div>
{#if resolvedConfig.footer}
<div class="flex gap-1 w-full justify-between items-center text-sm text-secondary/80 p-2">
<div>
<Popover>
<svelte:fragment slot="text">Download</svelte:fragment>
<Button
startIcon={{ icon: Download }}
color="light"
size="xs2"
on:click={() => {
api?.exportDataAsCsv()
}}
iconOnly
/>
</Popover>
</div>
<div class="flex flex-row gap-1 items-center">
{#if resolvedConfig?.pagination}
{#key refreshCount}
<div class="text-xs mx-2 text-primary">
{(api?.paginationGetPageSize() ?? 0) * (api?.paginationGetCurrentPage() ?? 0) +
1}
to {Math.min(
api?.paginationGetRowCount() ?? 0,
((api?.paginationGetCurrentPage() ?? 0) + 1) *
(api?.paginationGetPageSize() ?? 0)
)}
of {api?.paginationGetRowCount()}
</div>
<Button
iconOnly
startIcon={{ icon: SkipBack }}
color="light"
size="xs2"
disabled={api?.paginationGetCurrentPage() == 0}
on:click={() => {
api?.paginationGoToFirstPage()
refreshCount++
}}
/>
<Button
iconOnly
startIcon={{ icon: ChevronLeft }}
color="light"
size="xs2"
disabled={api?.paginationGetCurrentPage() == 0}
on:click={() => {
api?.paginationGoToPreviousPage()
refreshCount++
}}
/>
<div class="text-xs mx-2 text-primary">
Page {(api?.paginationGetCurrentPage() ?? 0) + 1} of {api?.paginationGetTotalPages() ??
0}
</div>
<Button
iconOnly
startIcon={{ icon: ChevronRight }}
color="light"
size="xs2"
disabled={(api?.paginationGetCurrentPage() ?? 0) + 1 ==
api?.paginationGetTotalPages()}
on:click={() => {
api?.paginationGoToNextPage()
refreshCount++
}}
/>
<Button
iconOnly
startIcon={{ icon: SkipForward }}
color="light"
size="xs2"
disabled={(api?.paginationGetCurrentPage() ?? 0) + 1 ==
api?.paginationGetTotalPages()}
on:click={() => {
api?.paginationGoToLastPage()
refreshCount++
}}
/>
{/key}
{/if}
<Button
iconOnly
startIcon={{ icon: SkipBack }}
color="light"
size="xs2"
disabled={api?.paginationGetCurrentPage() == 0}
on:click={() => {
api?.paginationGoToFirstPage()
refreshCount++
}}
/>
<Button
iconOnly
startIcon={{ icon: ChevronLeft }}
color="light"
size="xs2"
disabled={api?.paginationGetCurrentPage() == 0}
on:click={() => {
api?.paginationGoToPreviousPage()
refreshCount++
}}
/>
<div class="text-xs mx-2 text-primary">
Page {(api?.paginationGetCurrentPage() ?? 0) + 1} of {api?.paginationGetTotalPages() ??
0}
</div>
<Button
iconOnly
startIcon={{ icon: ChevronRight }}
color="light"
size="xs2"
disabled={(api?.paginationGetCurrentPage() ?? 0) + 1 ==
api?.paginationGetTotalPages()}
on:click={() => {
api?.paginationGoToNextPage()
refreshCount++
}}
/>
<Button
iconOnly
startIcon={{ icon: SkipForward }}
color="light"
size="xs2"
disabled={(api?.paginationGetCurrentPage() ?? 0) + 1 ==
api?.paginationGetTotalPages()}
on:click={() => {
api?.paginationGoToLastPage()
refreshCount++
}}
/>
{/key}
{/if}
</div>
</div>
</div>
{/if}
</div>
{:else if resolvedConfig.columnDefs != undefined}
<Alert title="Parsing issues" type="error" size="xs">
frontend/src/lib/components/apps/editor/component/components.ts
+12
View File
@@ -702,6 +702,12 @@ const aggridcomponentconst = {
value: false,
tooltip:
'When true, actions will wrap to the next line. Otherwise, the column will grow to fit the actions.'
},
footer: {
type: 'static',
fieldType: 'boolean',
value: true,
tooltip: 'Allow visible footer for pagination and download'
}
},
componentInput: {
@@ -803,6 +809,12 @@ const aggridinfinitecomponentconst = {
fieldType: 'boolean',
value: false,
tooltip: 'Enable search in the table'
},
footer: {
type: 'static',
fieldType: 'boolean',
value: true,
tooltip: 'Allow visible footer for pagination and download'
}
},
componentInput: {