mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-15 10:21:05 +00:00
test: add DataTable
generics test
This commit is contained in:
parent
38df04e69e
commit
25274520c6
1 changed files with 63 additions and 0 deletions
|
@ -285,3 +285,66 @@
|
||||||
<DataTableSkeleton showHeader="{false}" showToolbar="{false}" size="short" />
|
<DataTableSkeleton showHeader="{false}" showToolbar="{false}" size="short" />
|
||||||
|
|
||||||
<DataTableSkeleton showHeader="{false}" showToolbar="{false}" size="compact" />
|
<DataTableSkeleton showHeader="{false}" showToolbar="{false}" size="compact" />
|
||||||
|
|
||||||
|
<DataTable
|
||||||
|
rows="{[
|
||||||
|
{
|
||||||
|
name: 'Load Balancer 3',
|
||||||
|
protocol: 'HTTP',
|
||||||
|
port: 3000,
|
||||||
|
rule: 'Round robin',
|
||||||
|
id: '-',
|
||||||
|
},
|
||||||
|
]}"
|
||||||
|
headers="{[
|
||||||
|
{
|
||||||
|
key: 'name',
|
||||||
|
value: 'Name',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'protocol',
|
||||||
|
value: 'Protocol',
|
||||||
|
display: (value) => {
|
||||||
|
return value + ' Protocol';
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'port',
|
||||||
|
value: 'Port',
|
||||||
|
display: (value, row) => {
|
||||||
|
return value + ' €';
|
||||||
|
},
|
||||||
|
sort: (a, b) => {
|
||||||
|
if (a > b) return 1;
|
||||||
|
return 0;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'rule',
|
||||||
|
value: 'Rule',
|
||||||
|
},
|
||||||
|
]}"
|
||||||
|
sortKey="name"
|
||||||
|
on:click:row="{(e) => {
|
||||||
|
const detail = e.detail;
|
||||||
|
detail.name;
|
||||||
|
detail.port;
|
||||||
|
}}"
|
||||||
|
on:click:cell="{(e) => {
|
||||||
|
const detail = e.detail;
|
||||||
|
switch (detail.key) {
|
||||||
|
case 'name':
|
||||||
|
detail.value;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}}"
|
||||||
|
on:click="{(e) => {
|
||||||
|
e.detail.cell;
|
||||||
|
e.detail.row.name;
|
||||||
|
}}"
|
||||||
|
on:click:row--expand="{(e) => {
|
||||||
|
const detail = e.detail;
|
||||||
|
detail.row.id;
|
||||||
|
detail.row.name;
|
||||||
|
}}"
|
||||||
|
/>
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue