Skip to content

Commit dc177cd

Browse files
luisDanielRoviraContrerasluisDanielRoviraContreras
committed
add table documents
1 parent d8b6ca0 commit dc177cd

File tree

33 files changed

+2748
-38
lines changed

33 files changed

+2748
-38
lines changed

‎docs/.vuepress/components/Demos/Table/Default.vue‎

Lines changed: 124 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,124 @@
1+
<template lang="html">
2+
<div>
3+
<vs-table :data="users">
4+
<template slot="header">
5+
<h3>
6+
Users
7+
</h3>
8+
</template>
9+
<template slot="thead">
10+
<vs-th>
11+
Email
12+
</vs-th>
13+
<vs-th>
14+
Name
15+
</vs-th>
16+
<vs-th>
17+
Website
18+
</vs-th>
19+
<vs-th>
20+
Nro
21+
</vs-th>
22+
</template>
23+
24+
<template slot-scope="{data}">
25+
<vs-tr :key="indextr" v-for="(tr, indextr) in data" >
26+
<vs-td :data="data[indextr].email">
27+
{{data[indextr].email}}
28+
</vs-td>
29+
30+
<vs-td :data="data[indextr].username">
31+
{{data[indextr].name}}
32+
</vs-td>
33+
34+
<vs-td :data="data[indextr].id">
35+
{{data[indextr].website}}
36+
</vs-td>
37+
38+
<vs-td :data="data[indextr].id">
39+
{{data[indextr].id}}
40+
</vs-td>
41+
</vs-tr>
42+
</template>
43+
</vs-table>
44+
</div>
45+
</template>
46+
47+
<script>
48+
export default {
49+
data:()=>({
50+
users:[
51+
{
52+
"id": 1,
53+
"name": "Leanne Graham",
54+
"username": "Bret",
55+
"email": "Sincere@april.biz",
56+
"website": "hildegard.org",
57+
},
58+
{
59+
"id": 2,
60+
"name": "Ervin Howell",
61+
"username": "Antonette",
62+
"email": "Shanna@melissa.tv",
63+
"website": "anastasia.net",
64+
},
65+
{
66+
"id": 3,
67+
"name": "Clementine Bauch",
68+
"username": "Samantha",
69+
"email": "Nathan@yesenia.net",
70+
"website": "ramiro.info",
71+
},
72+
{
73+
"id": 4,
74+
"name": "Patricia Lebsack",
75+
"username": "Karianne",
76+
"email": "Julianne.OConner@kory.org",
77+
"website": "kale.biz",
78+
},
79+
{
80+
"id": 5,
81+
"name": "Chelsey Dietrich",
82+
"username": "Kamren",
83+
"email": "Lucio_Hettinger@annie.ca",
84+
"website": "demarco.info",
85+
},
86+
{
87+
"id": 6,
88+
"name": "Mrs. Dennis Schulist",
89+
"username": "Leopoldo_Corkery",
90+
"email": "Karley_Dach@jasper.info",
91+
"website": "ola.org",
92+
},
93+
{
94+
"id": 7,
95+
"name": "Kurtis Weissnat",
96+
"username": "Elwyn.Skiles",
97+
"email": "Telly.Hoeger@billy.biz",
98+
"website": "elvis.io",
99+
},
100+
{
101+
"id": 8,
102+
"name": "Nicholas Runolfsdottir V",
103+
"username": "Maxime_Nienow",
104+
"email": "Sherwood@rosamond.me",
105+
"website": "jacynthe.com",
106+
},
107+
{
108+
"id": 9,
109+
"name": "Glenna Reichert",
110+
"username": "Delphine",
111+
"email": "Chaim_McDermott@dana.io",
112+
"website": "conrad.com",
113+
},
114+
{
115+
"id": 10,
116+
"name": "Clementina DuBuque",
117+
"username": "Moriah.Stanton",
118+
"email": "Rey.Padberg@karina.biz",
119+
"website": "ambrose.net",
120+
}
121+
]
122+
})
123+
}
124+
</script>

‎docs/.vuepress/components/Demos/Table/Edit.vue‎

Lines changed: 143 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,143 @@
1+
<template lang="html">
2+
<div>
3+
<vs-table >
4+
<template slot="thead">
5+
<vs-th>
6+
Email - Input
7+
</vs-th>
8+
<vs-th>
9+
Name - Select
10+
</vs-th>
11+
<vs-th>
12+
Nro - Input-number
13+
</vs-th>
14+
<vs-th>
15+
Nro - Slider
16+
</vs-th>
17+
</template>
18+
<vs-tr :key="indextr" v-for="(tr, indextr) in dataTable" >
19+
<vs-td :data="dataTable[indextr].email">
20+
{{dataTable[indextr].email}}
21+
22+
<template slot="edit">
23+
<vs-input v-model="dataTable[indextr].email" class="inputx" placeholder="Email"/>
24+
</template>
25+
</vs-td>
26+
27+
<vs-td :data="dataTable[indextr].username">
28+
{{dataTable[indextr].username}}
29+
30+
<template slot="edit">
31+
<!-- <vs-input v-model="dataTable[indextr].username" class="inputx" placeholder="Email"/> -->
32+
<vs-select
33+
label="Users"
34+
v-model="dataTable[indextr].username"
35+
>
36+
<vs-select-item :key="index" :vs-value="item.value" :vs-text="item.text" v-for="(item,index) in users" />
37+
</vs-select>
38+
</template>
39+
</vs-td>
40+
41+
<vs-td :data="dataTable[indextr].id">
42+
{{dataTable[indextr].id}}
43+
44+
<template slot="edit">
45+
<vs-input-number v-model="dataTable[indextr].id"/>
46+
</template>
47+
</vs-td>
48+
49+
<vs-td :data="dataTable[indextr].id">
50+
{{dataTable[indextr].id}}
51+
52+
<template slot="edit">
53+
<!-- <vs-input-number v-model="dataTable[indextr].id"/> -->
54+
<vs-slider :max="20" v-model="dataTable[indextr].id"/>
55+
</template>
56+
</vs-td>
57+
58+
</vs-tr>
59+
</vs-table>
60+
</div>
61+
</template>
62+
63+
<script>
64+
export default {
65+
data:()=>({
66+
users:[
67+
{
68+
"id": 1,
69+
"name": "Leanne Graham",
70+
"username": "Bret",
71+
"email": "Sincere@april.biz",
72+
"website": "hildegard.org",
73+
},
74+
{
75+
"id": 2,
76+
"name": "Ervin Howell",
77+
"username": "Antonette",
78+
"email": "Shanna@melissa.tv",
79+
"website": "anastasia.net",
80+
},
81+
{
82+
"id": 3,
83+
"name": "Clementine Bauch",
84+
"username": "Samantha",
85+
"email": "Nathan@yesenia.net",
86+
"website": "ramiro.info",
87+
},
88+
{
89+
"id": 4,
90+
"name": "Patricia Lebsack",
91+
"username": "Karianne",
92+
"email": "Julianne.OConner@kory.org",
93+
"website": "kale.biz",
94+
},
95+
{
96+
"id": 5,
97+
"name": "Chelsey Dietrich",
98+
"username": "Kamren",
99+
"email": "Lucio_Hettinger@annie.ca",
100+
"website": "demarco.info",
101+
},
102+
{
103+
"id": 6,
104+
"name": "Mrs. Dennis Schulist",
105+
"username": "Leopoldo_Corkery",
106+
"email": "Karley_Dach@jasper.info",
107+
"website": "ola.org",
108+
},
109+
{
110+
"id": 7,
111+
"name": "Kurtis Weissnat",
112+
"username": "Elwyn.Skiles",
113+
"email": "Telly.Hoeger@billy.biz",
114+
"website": "elvis.io",
115+
},
116+
{
117+
"id": 8,
118+
"name": "Nicholas Runolfsdottir V",
119+
"username": "Maxime_Nienow",
120+
"email": "Sherwood@rosamond.me",
121+
"website": "jacynthe.com",
122+
},
123+
{
124+
"id": 9,
125+
"name": "Glenna Reichert",
126+
"username": "Delphine",
127+
"email": "Chaim_McDermott@dana.io",
128+
"website": "conrad.com",
129+
},
130+
{
131+
"id": 10,
132+
"name": "Clementina DuBuque",
133+
"username": "Moriah.Stanton",
134+
"email": "Rey.Padberg@karina.biz",
135+
"website": "ambrose.net",
136+
}
137+
]
138+
}),
139+
}
140+
</script>
141+
142+
<style lang="stylus">
143+
</style>

‎docs/.vuepress/components/Demos/Table/Expandable.vue‎

Lines changed: 110 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,110 @@
1+
<template lang="html">
2+
<div>
3+
<vs-table>
4+
<template slot="thead">
5+
<vs-th>
6+
Date
7+
</vs-th>
8+
<vs-th>
9+
Name
10+
</vs-th>
11+
<vs-th>
12+
Nro
13+
</vs-th>
14+
</template>
15+
<vs-tr :key="indextr" v-for="(tr, indextr) in dataTable" >
16+
<vs-td :key="indextd" v-for="(td, indextd) in tr" >
17+
{{td}}
18+
</vs-td>
19+
20+
<template v-if="indextr == 2" slot="expand">
21+
<p><b>Date:</b> {{ tr.date }}</p>
22+
<p><b>Name:</b> {{ tr.name }}</p>
23+
<p><b>Address:</b> {{ tr.address }}</p>
24+
</template>
25+
</vs-tr>
26+
</vs-table>
27+
</div>
28+
</template>
29+
30+
<script>
31+
export default {
32+
data:()=>({
33+
users:[
34+
{
35+
"id": 1,
36+
"name": "Leanne Graham",
37+
"username": "Bret",
38+
"email": "Sincere@april.biz",
39+
"website": "hildegard.org",
40+
},
41+
{
42+
"id": 2,
43+
"name": "Ervin Howell",
44+
"username": "Antonette",
45+
"email": "Shanna@melissa.tv",
46+
"website": "anastasia.net",
47+
},
48+
{
49+
"id": 3,
50+
"name": "Clementine Bauch",
51+
"username": "Samantha",
52+
"email": "Nathan@yesenia.net",
53+
"website": "ramiro.info",
54+
},
55+
{
56+
"id": 4,
57+
"name": "Patricia Lebsack",
58+
"username": "Karianne",
59+
"email": "Julianne.OConner@kory.org",
60+
"website": "kale.biz",
61+
},
62+
{
63+
"id": 5,
64+
"name": "Chelsey Dietrich",
65+
"username": "Kamren",
66+
"email": "Lucio_Hettinger@annie.ca",
67+
"website": "demarco.info",
68+
},
69+
{
70+
"id": 6,
71+
"name": "Mrs. Dennis Schulist",
72+
"username": "Leopoldo_Corkery",
73+
"email": "Karley_Dach@jasper.info",
74+
"website": "ola.org",
75+
},
76+
{
77+
"id": 7,
78+
"name": "Kurtis Weissnat",
79+
"username": "Elwyn.Skiles",
80+
"email": "Telly.Hoeger@billy.biz",
81+
"website": "elvis.io",
82+
},
83+
{
84+
"id": 8,
85+
"name": "Nicholas Runolfsdottir V",
86+
"username": "Maxime_Nienow",
87+
"email": "Sherwood@rosamond.me",
88+
"website": "jacynthe.com",
89+
},
90+
{
91+
"id": 9,
92+
"name": "Glenna Reichert",
93+
"username": "Delphine",
94+
"email": "Chaim_McDermott@dana.io",
95+
"website": "conrad.com",
96+
},
97+
{
98+
"id": 10,
99+
"name": "Clementina DuBuque",
100+
"username": "Moriah.Stanton",
101+
"email": "Rey.Padberg@karina.biz",
102+
"website": "ambrose.net",
103+
}
104+
]
105+
})
106+
}
107+
</script>
108+
109+
<style lang="stylus">
110+
</style>

0 commit comments

Comments
 (0)