using table control with slots

This commit is contained in:
Jan Prochazka
2021-03-17 18:30:36 +01:00
parent 9c7df42948
commit eceab2dde9
3 changed files with 78 additions and 24 deletions

View File

@@ -33,14 +33,17 @@
{#each tabs as tab, index}
<div class="container" class:isInline class:tabVisible={index == value}>
<svelte:component this={tab.component} {...tab.props} />
{#if tab.slot == 0}<slot name="0" />{/if}
{#if tab.slot == 1}<slot name="1" />{/if}
{#if tab.slot == 2}<slot name="2" />{/if}
{#if tab.slot == 3}<slot name="3" />{/if}
{#if tab.slot == 4}<slot name="4" />{/if}
{#if tab.slot == 5}<slot name="5" />{/if}
{#if tab.slot == 6}<slot name="6" />{/if}
{#if tab.slot == 7}<slot name="7" />{/if}
{#if tab.slot != null}
{#if tab.slot == 0}<slot name="0" />
{:else if tab.slot == 1}<slot name="1" />
{:else if tab.slot == 2}<slot name="2" />
{:else if tab.slot == 3}<slot name="3" />
{:else if tab.slot == 4}<slot name="4" />
{:else if tab.slot == 5}<slot name="5" />
{:else if tab.slot == 6}<slot name="6" />
{:else if tab.slot == 7}<slot name="7" />
{/if}
{/if}
</div>
{/each}
</div>

View File

@@ -10,6 +10,7 @@
component?: any;
getProps?: any;
formatter?: any;
slot?: number;
}
export let columns: TableColumn[];
@@ -52,6 +53,16 @@
<svelte:component this={col.component} {...col.getProps(row)} />
{:else if col.formatter}
{col.formatter(row)}
{:else if col.slot != null}
{#if col.slot == 0}<slot name="0" {row} {index} />
{:else if col.slot == 1}<slot name="1" {row} {index} />
{:else if col.slot == 2}<slot name="2" {row} {index} />
{:else if col.slot == 3}<slot name="3" {row} {index} />
{:else if col.slot == 4}<slot name="4" {row} {index} />
{:else if col.slot == 5}<slot name="5" {row} {index} />
{:else if col.slot == 6}<slot name="6" {row} {index} />
{:else if col.slot == 7}<slot name="7" {row} {index} />
{/if}
{:else}
{row[col.fieldName]}
{/if}