simple-table.vue
1.58 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
<script setup>
import * as demoCode from '@/views/demos/forms/tables/simple-table/demoCodeSimpleTable'
</script>
<template>
<VRow>
<VCol cols="12">
<AppCardCode
title="Basic"
:code="demoCode.basic"
no-padding
>
<DemoSimpleTableBasic />
</AppCardCode>
</VCol>
<VCol cols="12">
<AppCardCode
title="Theme"
:code="demoCode.theme"
no-padding
>
<VCardText>
use <code>theme</code> prop to switch table to the dark theme.
</VCardText>
<DemoSimpleTableTheme />
</AppCardCode>
</VCol>
<VCol cols="12">
<AppCardCode
title="Density"
:code="demoCode.density"
no-padding
>
<VCardText>
You can show a dense version of the table by using the <code>density</code> prop.
</VCardText>
<DemoSimpleTableDensity />
</AppCardCode>
</VCol>
<VCol cols="12">
<AppCardCode
title="Height"
:code="demoCode.height"
no-padding
>
<VCardText>
You can set the height of the table by using the <code>height</code> prop.
</VCardText>
<DemoSimpleTableHeight />
</AppCardCode>
</VCol>
<VCol cols="12">
<AppCardCode
title="Fixed Header"
:code="demoCode.fixedHeader"
no-padding
>
<VCardText>
You can fix the header of table by using the <code>fixed-header</code> prop.
</VCardText>
<DemoSimpleTableFixedHeader />
</AppCardCode>
</VCol>
</VRow>
</template>