@timus-networks/theme 1.0.23 → 1.0.25
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components-js/ThemeAlert.vue +76 -0
- package/components-js/ThemeAvatar.vue +55 -0
- package/components-js/ThemeBadge.vue +86 -0
- package/components-js/ThemeCascader.vue +337 -0
- package/components-js/ThemeLink.vue +98 -148
- package/components-js/ThemeLogo.vue +57 -0
- package/components-js/ThemeRadio.vue +20 -41
- package/components-js/ThemeTable.vue +228 -194
- package/components-js/TimusSamples.vue +33 -28
- package/components-js/exporter.js +5 -5
- package/components-ts/ThemeAlert.vue +76 -0
- package/components-ts/ThemeAvatar.vue +55 -0
- package/components-ts/ThemeBadge.vue +86 -0
- package/components-ts/ThemeCascader.vue +337 -0
- package/components-ts/ThemeLink.vue +98 -148
- package/components-ts/ThemeLogo.vue +57 -0
- package/components-ts/ThemeRadio.vue +20 -41
- package/components-ts/ThemeTable.vue +228 -194
- package/components-ts/TimusSamples.vue +33 -28
- package/components-ts/exporter.js +5 -5
- package/logo/timus-icon.svg +17 -0
- package/logo/timus-logo.svg +22 -0
- package/module.js +6 -2
- package/output/main.css +1 -1
- package/package.json +40 -40
|
@@ -1,211 +1,245 @@
|
|
|
1
1
|
<template>
|
|
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
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
2
|
+
<div class="pt-8 pb-16 flex gap-12 flex-col">
|
|
3
|
+
<section>
|
|
4
|
+
<h1>Fixed Height</h1>
|
|
5
|
+
<p class="p-md-c my-6">
|
|
6
|
+
This example demonstrates the basic usage of creating a data table using the `el-table` component provided by Element UI. Please note
|
|
7
|
+
that the outer border is applied with `table-container`.
|
|
8
|
+
</p>
|
|
9
|
+
<div class="grid flex-column">
|
|
10
|
+
<div class="table-container mb-4">
|
|
11
|
+
<el-table
|
|
12
|
+
:data="tableData"
|
|
13
|
+
:default-sort="{ prop: 'date', order: 'descending' }"
|
|
14
|
+
@selection-change="handleSelectionChange"
|
|
15
|
+
ref="multipleTable"
|
|
16
|
+
height="360px"
|
|
17
|
+
style="width: 100%"
|
|
18
|
+
>
|
|
19
|
+
<el-table-column type="selection" width="55"> </el-table-column>
|
|
20
|
+
<el-table-column
|
|
21
|
+
fixed
|
|
22
|
+
prop="date"
|
|
23
|
+
label="Date"
|
|
24
|
+
sortable
|
|
25
|
+
column-key="date"
|
|
26
|
+
:filters="[
|
|
27
|
+
{ text: '2016-05-01', value: '2016-05-01' },
|
|
28
|
+
{ text: '2016-05-02', value: '2016-05-02' },
|
|
29
|
+
{ text: '2016-05-03', value: '2016-05-03' },
|
|
30
|
+
{ text: '2016-05-04', value: '2016-05-04' },
|
|
31
|
+
]"
|
|
32
|
+
:filter-method="filterHandler"
|
|
33
|
+
>
|
|
34
|
+
</el-table-column>
|
|
35
|
+
<el-table-column prop="name" label="Name" width="180"> </el-table-column>
|
|
36
|
+
<el-table-column prop="address" label="Address" :formatter="formatter"> </el-table-column>
|
|
37
|
+
<el-table-column
|
|
38
|
+
prop="tag"
|
|
39
|
+
label="Tag"
|
|
40
|
+
:filters="[
|
|
41
|
+
{ text: 'Home', value: 'Home' },
|
|
42
|
+
{ text: 'Office', value: 'Office' },
|
|
43
|
+
{ text: 'Potato', value: 'Potato' },
|
|
44
|
+
]"
|
|
45
|
+
:filter-method="filterTag"
|
|
46
|
+
filter-placement="top-start"
|
|
47
|
+
>
|
|
48
|
+
</el-table-column>
|
|
49
|
+
<el-table-column prop="name" label="Name" width="120"> </el-table-column>
|
|
50
|
+
<el-table-column prop="state" label="State" width="120"> </el-table-column>
|
|
51
|
+
<el-table-column prop="city" label="City" width="120"> </el-table-column>
|
|
52
|
+
<el-table-column prop="address" label="Address" width="300"> </el-table-column>
|
|
53
|
+
<el-table-column prop="zip" label="Zip" width="120"> </el-table-column>
|
|
54
|
+
<el-table-column fixed="right" label="Operations" width="120">
|
|
55
|
+
<template slot-scope="scope">
|
|
56
|
+
<el-button @click.native.prevent="deleteRow(scope.$index, tableData)" type="text" size="small"> Remove </el-button>
|
|
57
|
+
</template>
|
|
58
|
+
</el-table-column>
|
|
59
|
+
</el-table>
|
|
60
|
+
</div>
|
|
61
|
+
<el-pagination
|
|
62
|
+
@size-change="handleSizeChange"
|
|
63
|
+
@current-change="handleCurrentChange"
|
|
64
|
+
:current-page.sync="currentPage4"
|
|
65
|
+
:page-sizes="[100, 200, 300, 400]"
|
|
66
|
+
:page-size="100"
|
|
67
|
+
layout="total, prev, pager, next, jumper, sizes"
|
|
68
|
+
:total="400"
|
|
69
|
+
>
|
|
70
|
+
</el-pagination>
|
|
71
|
+
</div>
|
|
72
|
+
<div class="my-4 p-4 border-l-4 border-blue-600 bg-blue-100">
|
|
73
|
+
<p class="text-xs">
|
|
74
|
+
<code>
|
|
75
|
+
<div class="table-container"><el-table :data="tableData" :default-sort="{ prop: 'date', order: 'descending'
|
|
76
|
+
}"></el-table></div>
|
|
77
|
+
</code>
|
|
78
|
+
</p>
|
|
79
|
+
</div>
|
|
80
|
+
</section>
|
|
81
|
+
|
|
82
|
+
<section>
|
|
83
|
+
<h1>Expandable Row</h1>
|
|
84
|
+
<p class="p-md-c my-6">
|
|
85
|
+
When the row content is too long and you do not want to display the horizontal scroll bar, you can use the expandable row feature.
|
|
86
|
+
Activate expandable row by adding type="expand" and scoped slot. The template for el-table-column will be rendered as the contents of
|
|
87
|
+
the expanded row, and you can access the same attributes as when you are using Scoped slot in custom column templates.
|
|
88
|
+
</p>
|
|
89
|
+
<div class="grid grid-flow-col auto-cols-max gap-4">
|
|
90
|
+
<div class="table-container mb-4">
|
|
91
|
+
<el-table :data="tableData" style="width: 100%">
|
|
92
|
+
<el-table-column type="expand">
|
|
93
|
+
<template slot-scope="props">
|
|
94
|
+
<p>State: {{ props.row.state }}</p>
|
|
95
|
+
<p>City: {{ props.row.city }}</p>
|
|
96
|
+
<p>Address: {{ props.row.address }}</p>
|
|
97
|
+
<p>Zip: {{ props.row.zip }}</p>
|
|
98
|
+
</template>
|
|
99
|
+
</el-table-column>
|
|
100
|
+
<el-table-column label="Date" prop="date"> </el-table-column>
|
|
101
|
+
<el-table-column label="Name" prop="name"> </el-table-column>
|
|
102
|
+
</el-table>
|
|
103
|
+
</div>
|
|
104
|
+
</div>
|
|
105
|
+
<div class="my-4 p-4 border-l-4 border-blue-600 bg-blue-100">
|
|
106
|
+
<p class="text-xs">
|
|
107
|
+
<code>
|
|
108
|
+
<el-table :data="tableData"> <el-table-column type="expand"> <template v-slot="props"> <p>State: {
|
|
109
|
+
props.row.state } </p> </template> </el-table-column> </el-table>
|
|
110
|
+
</code>
|
|
111
|
+
</p>
|
|
112
|
+
</div>
|
|
113
|
+
</section>
|
|
114
|
+
</div>
|
|
82
115
|
</template>
|
|
116
|
+
|
|
83
117
|
<script>
|
|
84
118
|
import Vue from 'vue';
|
|
85
119
|
|
|
86
120
|
export default Vue.extend({
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
121
|
+
name: 'ThemeTable',
|
|
122
|
+
computed: {
|
|
123
|
+
gridSize() {
|
|
124
|
+
const grids = {
|
|
125
|
+
5: 'grid-cols-5',
|
|
126
|
+
6: 'grid-cols-6',
|
|
127
|
+
7: 'grid-cols-7',
|
|
128
|
+
8: 'grid-cols-8',
|
|
129
|
+
};
|
|
130
|
+
return grids;
|
|
131
|
+
},
|
|
132
|
+
},
|
|
133
|
+
data() {
|
|
134
|
+
return {
|
|
135
|
+
multipleSelection: [],
|
|
136
|
+
currentPage1: 5,
|
|
137
|
+
currentPage2: 5,
|
|
138
|
+
currentPage3: 5,
|
|
139
|
+
currentPage4: 4,
|
|
140
|
+
tableData: [
|
|
141
|
+
{
|
|
142
|
+
date: '2016-05-03',
|
|
143
|
+
name: 'Tom',
|
|
144
|
+
state: 'California',
|
|
145
|
+
city: 'Los Angeles',
|
|
146
|
+
address: 'No. 189, Grove St, Los Angeles',
|
|
147
|
+
zip: 'CA 90036',
|
|
148
|
+
tag: 'Home',
|
|
149
|
+
},
|
|
150
|
+
{
|
|
151
|
+
date: '2016-05-02',
|
|
152
|
+
name: 'Tom',
|
|
153
|
+
state: 'California',
|
|
154
|
+
city: 'Los Angeles',
|
|
155
|
+
address: 'No. 189, Grove St, Los Angeles',
|
|
156
|
+
zip: 'CA 90036',
|
|
157
|
+
tag: 'Office',
|
|
158
|
+
},
|
|
159
|
+
{
|
|
160
|
+
date: '2016-05-04',
|
|
161
|
+
name: 'Tom',
|
|
162
|
+
state: 'California',
|
|
163
|
+
city: 'Los Angeles',
|
|
164
|
+
address: 'No. 189, Grove St, Los Angeles',
|
|
165
|
+
zip: 'CA 90036',
|
|
166
|
+
tag: 'Home',
|
|
167
|
+
},
|
|
168
|
+
{
|
|
169
|
+
date: '2016-05-01',
|
|
170
|
+
name: 'Tom',
|
|
171
|
+
state: 'California',
|
|
172
|
+
city: 'Los Angeles',
|
|
173
|
+
address: 'No. 189, Grove St, Los Angeles',
|
|
174
|
+
zip: 'CA 90036',
|
|
175
|
+
tag: 'Office',
|
|
176
|
+
},
|
|
177
|
+
{
|
|
178
|
+
date: '2016-05-08',
|
|
179
|
+
name: 'Tom',
|
|
180
|
+
state: 'California',
|
|
181
|
+
city: 'Los Angeles',
|
|
182
|
+
address: 'No. 189, Grove St, Los Angeles',
|
|
183
|
+
zip: 'CA 90036',
|
|
184
|
+
tag: 'Office',
|
|
185
|
+
},
|
|
186
|
+
{
|
|
187
|
+
date: '2016-05-06',
|
|
188
|
+
name: 'Tom',
|
|
189
|
+
state: 'California',
|
|
190
|
+
city: 'Los Angeles',
|
|
191
|
+
address: 'No. 189, Grove St, Los Angeles',
|
|
192
|
+
zip: 'CA 90036',
|
|
193
|
+
tag: 'Home',
|
|
194
|
+
},
|
|
195
|
+
{
|
|
196
|
+
date: '2016-05-07',
|
|
197
|
+
name: 'Tom',
|
|
198
|
+
state: 'California',
|
|
199
|
+
city: 'Los Angeles',
|
|
200
|
+
address: 'No. 189, Grove St, Los Angeles',
|
|
201
|
+
zip: 'CA 90036',
|
|
202
|
+
tag: 'Office',
|
|
203
|
+
},
|
|
204
|
+
],
|
|
205
|
+
};
|
|
97
206
|
},
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
{
|
|
108
|
-
date: '2016-05-03',
|
|
109
|
-
name: 'Tom',
|
|
110
|
-
state: 'California',
|
|
111
|
-
city: 'Los Angeles',
|
|
112
|
-
address: 'No. 189, Grove St, Los Angeles',
|
|
113
|
-
zip: 'CA 90036',
|
|
114
|
-
tag: 'Home',
|
|
207
|
+
methods: {
|
|
208
|
+
toggleSelection(rows) {
|
|
209
|
+
if (rows) {
|
|
210
|
+
rows.forEach((row) => {
|
|
211
|
+
this.$refs.multipleTable.toggleRowSelection(row);
|
|
212
|
+
});
|
|
213
|
+
} else {
|
|
214
|
+
this.$refs.multipleTable.clearSelection();
|
|
215
|
+
}
|
|
115
216
|
},
|
|
116
|
-
{
|
|
117
|
-
|
|
118
|
-
name: 'Tom',
|
|
119
|
-
state: 'California',
|
|
120
|
-
city: 'Los Angeles',
|
|
121
|
-
address: 'No. 189, Grove St, Los Angeles',
|
|
122
|
-
zip: 'CA 90036',
|
|
123
|
-
tag: 'Office',
|
|
217
|
+
handleSelectionChange(val) {
|
|
218
|
+
this.multipleSelection = val;
|
|
124
219
|
},
|
|
125
|
-
{
|
|
126
|
-
|
|
127
|
-
name: 'Tom',
|
|
128
|
-
state: 'California',
|
|
129
|
-
city: 'Los Angeles',
|
|
130
|
-
address: 'No. 189, Grove St, Los Angeles',
|
|
131
|
-
zip: 'CA 90036',
|
|
132
|
-
tag: 'Home',
|
|
220
|
+
resetDateFilter() {
|
|
221
|
+
this.$refs.filterTable.clearFilter('date');
|
|
133
222
|
},
|
|
134
|
-
{
|
|
135
|
-
|
|
136
|
-
name: 'Tom',
|
|
137
|
-
state: 'California',
|
|
138
|
-
city: 'Los Angeles',
|
|
139
|
-
address: 'No. 189, Grove St, Los Angeles',
|
|
140
|
-
zip: 'CA 90036',
|
|
141
|
-
tag: 'Office',
|
|
223
|
+
clearFilter() {
|
|
224
|
+
this.$refs.filterTable.clearFilter();
|
|
142
225
|
},
|
|
143
|
-
{
|
|
144
|
-
|
|
145
|
-
name: 'Tom',
|
|
146
|
-
state: 'California',
|
|
147
|
-
city: 'Los Angeles',
|
|
148
|
-
address: 'No. 189, Grove St, Los Angeles',
|
|
149
|
-
zip: 'CA 90036',
|
|
150
|
-
tag: 'Office',
|
|
226
|
+
formatter(row, column) {
|
|
227
|
+
return row.address;
|
|
151
228
|
},
|
|
152
|
-
{
|
|
153
|
-
|
|
154
|
-
name: 'Tom',
|
|
155
|
-
state: 'California',
|
|
156
|
-
city: 'Los Angeles',
|
|
157
|
-
address: 'No. 189, Grove St, Los Angeles',
|
|
158
|
-
zip: 'CA 90036',
|
|
159
|
-
tag: 'Home',
|
|
229
|
+
filterTag(value, row) {
|
|
230
|
+
return row.tag === value;
|
|
160
231
|
},
|
|
161
|
-
{
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
232
|
+
filterHandler(value, row, column) {
|
|
233
|
+
console.log(row, column, value);
|
|
234
|
+
const property = column['property'];
|
|
235
|
+
return row[property] === value;
|
|
236
|
+
},
|
|
237
|
+
handleSizeChange(val) {
|
|
238
|
+
console.log(`${val} items per page`);
|
|
239
|
+
},
|
|
240
|
+
handleCurrentChange(val) {
|
|
241
|
+
console.log(`current page: ${val}`);
|
|
169
242
|
},
|
|
170
|
-
],
|
|
171
|
-
};
|
|
172
|
-
},
|
|
173
|
-
methods: {
|
|
174
|
-
toggleSelection(rows) {
|
|
175
|
-
if (rows) {
|
|
176
|
-
rows.forEach((row) => {
|
|
177
|
-
this.$refs.multipleTable.toggleRowSelection(row);
|
|
178
|
-
});
|
|
179
|
-
} else {
|
|
180
|
-
this.$refs.multipleTable.clearSelection();
|
|
181
|
-
}
|
|
182
|
-
},
|
|
183
|
-
handleSelectionChange(val) {
|
|
184
|
-
this.multipleSelection = val;
|
|
185
|
-
},
|
|
186
|
-
resetDateFilter() {
|
|
187
|
-
this.$refs.filterTable.clearFilter('date');
|
|
188
|
-
},
|
|
189
|
-
clearFilter() {
|
|
190
|
-
this.$refs.filterTable.clearFilter();
|
|
191
|
-
},
|
|
192
|
-
formatter(row, column) {
|
|
193
|
-
return row.address;
|
|
194
|
-
},
|
|
195
|
-
filterTag(value, row) {
|
|
196
|
-
return row.tag === value;
|
|
197
|
-
},
|
|
198
|
-
filterHandler(value, row, column) {
|
|
199
|
-
console.log(row, column, value);
|
|
200
|
-
const property = column['property'];
|
|
201
|
-
return row[property] === value;
|
|
202
|
-
},
|
|
203
|
-
handleSizeChange(val) {
|
|
204
|
-
console.log(`${val} items per page`);
|
|
205
|
-
},
|
|
206
|
-
handleCurrentChange(val) {
|
|
207
|
-
console.log(`current page: ${val}`);
|
|
208
243
|
},
|
|
209
|
-
},
|
|
210
244
|
});
|
|
211
245
|
</script>
|
|
@@ -1,38 +1,43 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
2
|
+
<div class="container">
|
|
3
|
+
<el-tabs v-model="activeName" @tab-click="handleClick">
|
|
4
|
+
<el-tab-pane label="Button" name="first"><ThemeButtons></ThemeButtons></el-tab-pane>
|
|
5
|
+
<el-tab-pane label="Typo" name="second"><ThemeTypo></ThemeTypo></el-tab-pane>
|
|
6
|
+
<el-tab-pane label="Input" name="third"><ThemeInputs></ThemeInputs></el-tab-pane>
|
|
7
|
+
<el-tab-pane label="Checkbox" name="fourth"><ThemeCheckbox></ThemeCheckbox></el-tab-pane>
|
|
8
|
+
<el-tab-pane label="Radio" name="five"><ThemeRadio></ThemeRadio></el-tab-pane>
|
|
9
|
+
<el-tab-pane label="Number" name="six"><ThemeInputNumbers></ThemeInputNumbers></el-tab-pane>
|
|
10
|
+
<el-tab-pane label="Picker" name="seven"><ThemeTimePicker></ThemeTimePicker></el-tab-pane>
|
|
11
|
+
<el-tab-pane label="Select" name="eight"><ThemeSelect></ThemeSelect></el-tab-pane>
|
|
12
|
+
<el-tab-pane label="Form" name="nine"><ThemeForm></ThemeForm></el-tab-pane>
|
|
13
|
+
<el-tab-pane label="Link" name="ten"><ThemeLink></ThemeLink></el-tab-pane>
|
|
14
|
+
<el-tab-pane label="Tag" name="eleven"><ThemeTag></ThemeTag></el-tab-pane>
|
|
15
|
+
<el-tab-pane label="Switch" name="twelve"><ThemeToggle></ThemeToggle></el-tab-pane>
|
|
16
|
+
<el-tab-pane label="Table" name="thirteen"><ThemeTable></ThemeTable></el-tab-pane>
|
|
17
|
+
<el-tab-pane label="Tooltip" name="fourteen"><ThemeTooltip></ThemeTooltip></el-tab-pane>
|
|
18
|
+
<el-tab-pane label="Alert" name="fifteen"><ThemeAlert></ThemeAlert></el-tab-pane>
|
|
19
|
+
<el-tab-pane label="Cascader" name="sixteen"><ThemeCascader></ThemeCascader></el-tab-pane>
|
|
20
|
+
<el-tab-pane label="Badge" name="seventeen"><ThemeBadge></ThemeBadge></el-tab-pane>
|
|
21
|
+
<el-tab-pane label="Avatar" name="eighteen"><ThemeAvatar></ThemeAvatar></el-tab-pane>
|
|
22
|
+
<el-tab-pane label="Logo" name="nineteen"><ThemeLogo></ThemeLogo></el-tab-pane>
|
|
23
|
+
</el-tabs>
|
|
24
|
+
</div>
|
|
20
25
|
</template>
|
|
21
26
|
<script>
|
|
22
27
|
import ThemeInputNumbers from './ThemeInputNumbers.vue';
|
|
23
28
|
import ThemeInputs from './ThemeInputs.vue';
|
|
24
29
|
|
|
25
30
|
export default {
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
},
|
|
31
|
-
methods: {
|
|
32
|
-
handleClick(tab, event) {
|
|
33
|
-
console.log(tab, event);
|
|
31
|
+
data() {
|
|
32
|
+
return {
|
|
33
|
+
activeName: 'first',
|
|
34
|
+
};
|
|
34
35
|
},
|
|
35
|
-
|
|
36
|
-
|
|
36
|
+
methods: {
|
|
37
|
+
handleClick(tab, event) {
|
|
38
|
+
console.log(tab, event);
|
|
39
|
+
},
|
|
40
|
+
},
|
|
41
|
+
components: { ThemeInputs, ThemeInputNumbers },
|
|
37
42
|
};
|
|
38
43
|
</script>
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
const components = {};
|
|
2
2
|
const requireComponent = require.context(
|
|
3
|
-
'.', //
|
|
4
|
-
false, //
|
|
5
|
-
/[A-Z]\w+\.(vue)$/, // Vue
|
|
6
|
-
// EXPERIMENTAL: /[A-Z]\w+\.(vue|js)$/, // Vue
|
|
3
|
+
'.', // read from current directory
|
|
4
|
+
false, // don't look in subdirectories
|
|
5
|
+
/[A-Z]\w+\.(vue)$/, // only look for Vue files
|
|
6
|
+
// EXPERIMENTAL: /[A-Z]\w+\.(vue|js)$/, // only look for Vue or JS files
|
|
7
7
|
);
|
|
8
8
|
|
|
9
9
|
requireComponent.keys().forEach((fileName) => {
|
|
@@ -11,7 +11,7 @@ requireComponent.keys().forEach((fileName) => {
|
|
|
11
11
|
const componentName = fileName
|
|
12
12
|
.split('/')
|
|
13
13
|
.pop()
|
|
14
|
-
.replace(/\.\w+$/, ''); //
|
|
14
|
+
.replace(/\.\w+$/, ''); // remove file extension and set file name as component name
|
|
15
15
|
|
|
16
16
|
components[componentName] = componentConfig.default || componentConfig;
|
|
17
17
|
});
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
<svg width="26" height="30" viewBox="0 0 26 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path d="M4.24756 4.90382V9.80874L0.000854492 12.2611V7.35619L4.24756 4.90382Z" fill="#5737D6"/>
|
|
3
|
+
<path d="M12.7428 0.000907898V9.80782C12.7424 9.80802 8.4959 7.35507 8.49512 7.35624V2.45132L8.49609 2.4523L12.7428 0.000907898Z" fill="#5737D6"/>
|
|
4
|
+
<path d="M16.9904 2.45139V7.35631L12.7436 9.80867H12.7427V0.000974574L12.7436 0L16.9904 2.45139Z" fill="#AEECD4"/>
|
|
5
|
+
<path d="M21.2379 4.90382V9.80874C19.1201 11.0314 14.8615 13.492 12.7438 14.7127V9.80874L16.9903 7.35619H16.9913L21.2379 4.90382Z" fill="#5737D6"/>
|
|
6
|
+
<path d="M25.4867 7.35625V12.2612L21.239 9.80862H21.238V4.90389L25.4857 7.35625H25.4867Z" fill="#AEECD4"/>
|
|
7
|
+
<path d="M8.49419 17.165C6.37708 18.3869 2.11712 20.8467 0.000974761 22.0689H0V17.165L0.000974761 17.166C0.000974761 17.1642 4.24807 14.7154 4.24846 14.7137L8.49419 17.165Z" fill="#5737D6"/>
|
|
8
|
+
<path d="M8.49517 17.165V22.0689L4.24846 24.5213H4.24749V24.5203L0.000976562 22.0689C2.11887 20.846 6.37727 18.3857 8.49517 17.165Z" fill="#8280F4"/>
|
|
9
|
+
<path d="M12.7437 9.80868V14.7126H12.7418C10.6248 13.4903 6.36487 11.0306 4.24853 9.80868H4.24756V4.90376L8.49505 7.35631H8.49602V7.35729C8.49641 7.3569 12.7429 9.80984 12.7437 9.80868Z" fill="#AEECD4"/>
|
|
10
|
+
<path d="M12.7419 14.7126C12.7417 14.7132 8.49517 17.163 8.49517 17.164L4.24963 14.7126H4.24671L0.000976562 12.2612L4.24768 9.80866H4.24866C6.36558 11.0309 10.6255 13.4905 12.7419 14.7126Z" fill="#8280F4"/>
|
|
11
|
+
<path d="M16.9913 22.0689V26.9739L12.7436 24.5213H12.7427V14.7146L12.7436 14.7136L16.9894 17.165H16.9904V22.0689H16.9913Z" fill="#AEECD4"/>
|
|
12
|
+
<path d="M25.4857 17.165V22.0689C23.3687 20.8467 19.1088 18.3871 16.9924 17.165C16.9924 17.1644 21.2392 14.7146 21.239 14.7137L25.4847 17.165H25.4857Z" fill="#AEECD4"/>
|
|
13
|
+
<path d="M25.4858 22.0689L21.2391 24.5213H21.2381V24.5203C21.2377 24.5207 16.9912 22.0677 16.9906 22.0689V17.165L16.9916 17.1659L16.9926 17.165C19.1093 18.3873 23.3693 20.847 25.4858 22.0689Z" fill="#8280F4"/>
|
|
14
|
+
<path d="M25.4866 12.2611C23.368 13.4856 19.108 15.9399 16.9905 17.164L12.7448 14.7125C14.8619 13.4906 19.1218 11.031 21.238 9.80876H21.239L25.4866 12.2611Z" fill="#8280F4"/>
|
|
15
|
+
<path d="M12.7428 14.7146V24.5213L8.49609 26.9739V22.0689H8.49512V17.165L8.49609 17.166C8.49531 17.1654 12.7428 14.715 12.7428 14.7146Z" fill="#5737D6"/>
|
|
16
|
+
<path d="M16.9914 26.9738C16.9902 26.9727 12.7439 29.4289 12.7418 29.4252L8.49622 26.9738L12.7427 24.5215H12.7437L16.9914 26.9738Z" fill="#8280F4"/>
|
|
17
|
+
</svg>
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
<svg width="137" height="32" viewBox="0 0 137 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path d="M4.24756 7.47858V12.3835L0.000854492 14.8359V9.93094L4.24756 7.47858Z" fill="#5737D6"/>
|
|
3
|
+
<path d="M12.7428 2.57567V12.3826C12.7424 12.3828 8.4959 9.92983 8.49512 9.931V5.02608L8.49609 5.02706L12.7428 2.57567Z" fill="#5737D6"/>
|
|
4
|
+
<path d="M16.9904 5.02614V9.93106L12.7436 12.3834H12.7427V2.57573L12.7436 2.57475L16.9904 5.02614Z" fill="#AEECD4"/>
|
|
5
|
+
<path d="M21.2379 7.47858V12.3835C19.1201 13.6062 14.8615 16.0667 12.7438 17.2874V12.3835L16.9903 9.93094H16.9913L21.2379 7.47858Z" fill="#5737D6"/>
|
|
6
|
+
<path d="M25.4867 9.93101V14.8359L21.239 12.3834H21.238V7.47865L25.4857 9.93101H25.4867Z" fill="#AEECD4"/>
|
|
7
|
+
<path d="M8.49419 19.7398C6.37708 20.9616 2.11712 23.4214 0.000974761 24.6437H0V19.7398L0.000974761 19.7407C0.000974761 19.739 4.24807 17.2902 4.24846 17.2884L8.49419 19.7398Z" fill="#5737D6"/>
|
|
8
|
+
<path d="M8.49517 19.7397V24.6437L4.24846 27.096H4.24749V27.0951L0.000976562 24.6437C2.11887 23.4208 6.37727 20.9605 8.49517 19.7397Z" fill="#8280F4"/>
|
|
9
|
+
<path d="M12.7437 12.3834V17.2874H12.7418C10.6248 16.0651 6.36487 13.6053 4.24853 12.3834H4.24756V7.47852L8.49505 9.93107H8.49602V9.93205C8.49641 9.93166 12.7429 12.3846 12.7437 12.3834Z" fill="#AEECD4"/>
|
|
10
|
+
<path d="M12.7419 17.2874C12.7417 17.288 8.49517 19.7378 8.49517 19.7388L4.24963 17.2874H4.24671L0.000976562 14.836L4.24768 12.3834H4.24866C6.36558 13.6057 10.6255 16.0653 12.7419 17.2874Z" fill="#8280F4"/>
|
|
11
|
+
<path d="M16.9913 24.6437V29.5486L12.7436 27.0961H12.7427V17.2894L12.7436 17.2884L16.9894 19.7398H16.9904V24.6437H16.9913Z" fill="#AEECD4"/>
|
|
12
|
+
<path d="M25.4857 19.7398V24.6437C23.3687 23.4214 19.1088 20.9618 16.9924 19.7398C16.9924 19.7392 21.2392 17.2894 21.239 17.2884L25.4847 19.7398H25.4857Z" fill="#AEECD4"/>
|
|
13
|
+
<path d="M25.4858 24.6437L21.2391 27.096H21.2381V27.0951C21.2377 27.0955 16.9912 24.6425 16.9906 24.6437V19.7397L16.9916 19.7407L16.9926 19.7397C19.1093 20.962 23.3693 23.4218 25.4858 24.6437Z" fill="#8280F4"/>
|
|
14
|
+
<path d="M25.4866 14.8359C23.368 16.0603 19.108 18.5146 16.9905 19.7388L12.7448 17.2873C14.8619 16.0654 19.1218 13.6058 21.238 12.3835H21.239L25.4866 14.8359Z" fill="#8280F4"/>
|
|
15
|
+
<path d="M12.7428 17.2893V27.0961L8.49609 29.5486V24.6437H8.49512V19.7398L8.49609 19.7407C8.49531 19.7401 12.7428 17.2897 12.7428 17.2893Z" fill="#5737D6"/>
|
|
16
|
+
<path d="M16.9914 29.5486C16.9902 29.5474 12.7439 32.0037 12.7418 32L8.49622 29.5486L12.7427 27.0962H12.7437L16.9914 29.5486Z" fill="#8280F4"/>
|
|
17
|
+
<path d="M35.9172 12.1022H33.396V8.49479H35.9172V3.18036H40.3779V8.49479H45.5756V12.1022H40.3779V23.9325C40.3779 25.5229 40.9985 26.1825 42.8603 26.1825H45.5756V29.8673H42.0847C38.2832 29.8673 35.9172 28.2768 35.9172 23.9325V12.1022Z" fill="#5737D6"/>
|
|
18
|
+
<path d="M48.1349 8.49478H52.5568V29.8673H48.1349V8.49478ZM47.5531 2.83146C47.5531 1.24099 48.7943 0 50.3846 0C51.9362 0 53.1774 1.24099 53.1774 2.83146C53.1774 4.42193 51.9362 5.66293 50.3846 5.66293C48.7943 5.66293 47.5531 4.42193 47.5531 2.83146Z" fill="#5737D6"/>
|
|
19
|
+
<path d="M87.5399 17.9205C87.5399 14.0024 85.4065 11.9855 82.1869 11.9855C78.9286 11.9855 76.7953 14.0024 76.7953 17.9205V29.8673H72.4122V17.9205C72.4122 14.0024 70.2789 11.9855 67.0591 11.9855C63.801 11.9855 61.6675 14.0024 61.6675 17.9205V29.8673H57.2456V8.49481H61.6675V10.9382C63.1029 9.19279 65.4301 8.14534 67.9902 8.14534C71.3647 8.14534 74.1964 9.58047 75.6705 12.3737C76.9892 9.7746 80.0148 8.14534 83.118 8.14534C88.1217 8.14534 91.9231 11.2875 91.9231 17.2607V29.8673H87.5399V17.9205Z" fill="#5737D6"/>
|
|
20
|
+
<path d="M115.752 29.8673H111.33V27.3073C109.934 29.1301 107.529 30.1776 105.008 30.1776C100.004 30.1776 96.2029 27.0358 96.2029 21.0622V8.49484H100.586V20.4028C100.586 24.3205 102.719 26.3374 105.939 26.3374C109.197 26.3374 111.33 24.3205 111.33 20.4028V8.49484H115.752V29.8673Z" fill="#5737D6"/>
|
|
21
|
+
<path d="M128.253 30.2164C123.132 30.2164 119.525 27.1908 119.331 23.3119H123.908C124.063 25.0577 125.731 26.4928 128.175 26.4928C130.735 26.4928 132.093 25.4068 132.093 23.9325C132.093 19.7432 119.68 22.1484 119.68 14.3132C119.68 10.8994 122.861 8.14548 127.904 8.14548C132.752 8.14548 135.933 10.7446 136.166 15.0112H131.744C131.589 13.1492 130.153 11.8694 127.749 11.8694C125.382 11.8694 124.141 12.8389 124.141 14.274C124.141 18.5798 136.204 16.1746 136.437 23.8937C136.437 27.5011 133.295 30.2164 128.253 30.2164Z" fill="#5737D6"/>
|
|
22
|
+
</svg>
|
package/module.js
CHANGED
|
@@ -21,12 +21,16 @@ async function copyDirectory(src, dest) {
|
|
|
21
21
|
|
|
22
22
|
export default function (moduleOptions) {
|
|
23
23
|
this.nuxt.hook('ready', (_nuxt) => {
|
|
24
|
-
this.options.tailwindcss.config.darkMode = 'class';
|
|
24
|
+
// this.options.tailwindcss.config.darkMode = 'class';
|
|
25
25
|
console.log(`#### ${PackageJson.name} has been prepared with version: ${PackageJson.version}`);
|
|
26
26
|
});
|
|
27
27
|
|
|
28
28
|
this.nuxt.hook('build:before', async (nuxt) => {
|
|
29
|
-
const directories = [
|
|
29
|
+
const directories = [
|
|
30
|
+
{source: 'output', target: 'static/'},
|
|
31
|
+
{source: 'fonts', target: 'static/fonts'},
|
|
32
|
+
{source: 'logo', target: 'assets/logo'}
|
|
33
|
+
];
|
|
30
34
|
|
|
31
35
|
// Kopyalama işlemlerini Promise.all ile sarmalayın
|
|
32
36
|
await Promise.all(directories.map(async (directory) => {
|