diff options
| author |  Corentin THOMASSET <corentin.thomasset74@gmail.com>
| 2023-10-15 00:45:14 +0200 |
|---|---|---|
| committer |  GitHub <noreply@github.com>
| 2023-10-14 22:45:14 +0000 |
| commit | ee4c853b9ff28f6678cc5980544ff956f3c2b106 (patch) | |
| tree | ce7dbcb16548913cf77b5958915dc10eaa279cbc /src/ui/c-table/c-table.demo.vue | |
| parent | cbf58fdd28fc88cde8179eec090a403a0f2a409f (diff) | |
| download | it-tools-ee4c853b9ff28f6678cc5980544ff956f3c2b106.tar.gz it-tools-ee4c853b9ff28f6678cc5980544ff956f3c2b106.tar.zst it-tools-ee4c853b9ff28f6678cc5980544ff956f3c2b106.zip | |
refactor(ui): new c-table ui component (#665)
Diffstat (limited to 'src/ui/c-table/c-table.demo.vue')
| -rw-r--r-- | src/ui/c-table/c-table.demo.vue | 20 |
1 files changed, 20 insertions, 0 deletions
diff --git a/src/ui/c-table/c-table.demo.vue b/src/ui/c-table/c-table.demo.vue new file mode 100644 index 0000000..b2cf8a7 --- /dev/null +++ b/src/ui/c-table/c-table.demo.vue @@ -0,0 +1,20 @@ +<script lang="ts" setup> +const data = ref([ + { name: 'John', age: 20 }, + { name: 'Jane', age: 24 }, + { name: 'Joe', age: 30 }, +]); +</script> + +<template> + <c-table :data="data" mb-2 /> + <c-table :data="data" hide-headers mb-2 /> + <c-table :data="data" :headers="['age', 'name']" mb-2 /> + <c-table :data="data" :headers="['age', { key: 'name', label: 'Full name' }]" mb-2 /> + <c-table :data="data" :headers="{ name: 'full name' }" mb-2 /> + <c-table :data="data" :headers="['age', 'name']"> + <template #age="{ value }"> + {{ value }}yo + </template> + </c-table> +</template> |