@burh/nuxt-core 1.0.197 → 1.0.199
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.
|
@@ -1,134 +1,169 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
2
|
+
<div
|
|
3
|
+
:class="{ 'card-footer-bottom': length <= 3 }"
|
|
4
|
+
class="card-footer py-4 d-flex justify-content-center"
|
|
5
|
+
>
|
|
6
|
+
<ul
|
|
7
|
+
class="pagination"
|
|
8
|
+
:class="[
|
|
9
|
+
size && `pagination-${size}`,
|
|
10
|
+
align && `justify-content-${align}`
|
|
11
|
+
]"
|
|
12
|
+
>
|
|
13
|
+
<li class="page-item prev-page" :class="{ disabled: value === 1 }">
|
|
14
|
+
<a class="page-link" aria-label="Previous" @click="prevPage">
|
|
15
|
+
<span aria-hidden="true"
|
|
16
|
+
><i class="fa fa-angle-left" aria-hidden="true"></i
|
|
17
|
+
></span>
|
|
18
|
+
</a>
|
|
19
|
+
</li>
|
|
20
|
+
<li
|
|
21
|
+
class="page-item"
|
|
22
|
+
:class="{ active: value === item }"
|
|
23
|
+
:key="item"
|
|
24
|
+
v-for="item in range(minPage, maxPage)"
|
|
25
|
+
>
|
|
26
|
+
<a class="page-link" @click="changePage(item)">{{ item }}</a>
|
|
27
|
+
</li>
|
|
28
|
+
<li
|
|
29
|
+
class="page-item next-page"
|
|
30
|
+
:class="{ disabled: value === totalPages }"
|
|
31
|
+
>
|
|
32
|
+
<a class="page-link" aria-label="Next" @click="nextPage">
|
|
33
|
+
<span aria-hidden="true"
|
|
34
|
+
><i class="fa fa-angle-right" aria-hidden="true"></i
|
|
35
|
+
></span>
|
|
36
|
+
</a>
|
|
37
|
+
</li>
|
|
38
|
+
</ul>
|
|
39
|
+
</div>
|
|
19
40
|
</template>
|
|
20
41
|
<script>
|
|
21
42
|
export default {
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
43
|
+
name: 'base-pagination',
|
|
44
|
+
props: {
|
|
45
|
+
pageCount: {
|
|
46
|
+
type: Number,
|
|
47
|
+
default: 0,
|
|
48
|
+
description:
|
|
49
|
+
'Pagination page count. This should be specified in combination with perPage'
|
|
50
|
+
},
|
|
51
|
+
perPage: {
|
|
52
|
+
type: Number,
|
|
53
|
+
default: 10,
|
|
54
|
+
description:
|
|
55
|
+
'Pagination per page. Should be specified with total or pageCount'
|
|
56
|
+
},
|
|
57
|
+
total: {
|
|
58
|
+
type: Number,
|
|
59
|
+
default: 0,
|
|
60
|
+
description:
|
|
61
|
+
'Can be specified instead of pageCount. The page count in this case will be total/perPage'
|
|
62
|
+
},
|
|
63
|
+
value: {
|
|
64
|
+
type: Number,
|
|
65
|
+
default: 1,
|
|
66
|
+
description: 'Pagination value'
|
|
67
|
+
},
|
|
68
|
+
size: {
|
|
69
|
+
type: String,
|
|
70
|
+
default: '',
|
|
71
|
+
description: 'Pagination size'
|
|
72
|
+
},
|
|
73
|
+
align: {
|
|
74
|
+
type: String,
|
|
75
|
+
default: '',
|
|
76
|
+
description: 'Pagination alignment (e.g center|start|end)'
|
|
77
|
+
},
|
|
78
|
+
length: Number
|
|
29
79
|
},
|
|
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
|
-
|
|
80
|
+
computed: {
|
|
81
|
+
totalPages() {
|
|
82
|
+
if (this.pageCount > 0) return this.pageCount;
|
|
83
|
+
if (this.total > 0) {
|
|
84
|
+
return Math.ceil(this.total / this.perPage);
|
|
85
|
+
}
|
|
86
|
+
return 1;
|
|
87
|
+
},
|
|
88
|
+
pagesToDisplay() {
|
|
89
|
+
if (
|
|
90
|
+
this.totalPages > 0 &&
|
|
91
|
+
this.totalPages < this.defaultPagesToDisplay
|
|
92
|
+
) {
|
|
93
|
+
return this.totalPages;
|
|
94
|
+
}
|
|
95
|
+
return this.defaultPagesToDisplay;
|
|
96
|
+
},
|
|
97
|
+
minPage() {
|
|
98
|
+
if (this.value >= this.pagesToDisplay) {
|
|
99
|
+
const pagesToAdd = Math.floor(this.pagesToDisplay / 2);
|
|
100
|
+
const newMaxPage = pagesToAdd + this.value;
|
|
101
|
+
if (newMaxPage > this.totalPages) {
|
|
102
|
+
return this.totalPages - this.pagesToDisplay + 1;
|
|
103
|
+
}
|
|
104
|
+
return this.value - pagesToAdd;
|
|
105
|
+
} else {
|
|
106
|
+
return 1;
|
|
107
|
+
}
|
|
108
|
+
},
|
|
109
|
+
maxPage() {
|
|
110
|
+
if (this.value >= this.pagesToDisplay) {
|
|
111
|
+
const pagesToAdd = Math.floor(this.pagesToDisplay / 2);
|
|
112
|
+
const newMaxPage = pagesToAdd + this.value;
|
|
113
|
+
if (newMaxPage < this.totalPages) {
|
|
114
|
+
return newMaxPage;
|
|
115
|
+
} else {
|
|
116
|
+
return this.totalPages;
|
|
117
|
+
}
|
|
118
|
+
} else {
|
|
119
|
+
return this.pagesToDisplay;
|
|
120
|
+
}
|
|
121
|
+
}
|
|
65
122
|
},
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
return this.defaultPagesToDisplay;
|
|
123
|
+
data() {
|
|
124
|
+
return {
|
|
125
|
+
defaultPagesToDisplay: 5
|
|
126
|
+
};
|
|
71
127
|
},
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
128
|
+
methods: {
|
|
129
|
+
range(min, max) {
|
|
130
|
+
let arr = [];
|
|
131
|
+
for (let i = min; i <= max; i++) {
|
|
132
|
+
arr.push(i);
|
|
133
|
+
}
|
|
134
|
+
return arr;
|
|
135
|
+
},
|
|
136
|
+
changePage(item) {
|
|
137
|
+
this.$emit('input', item);
|
|
138
|
+
},
|
|
139
|
+
nextPage() {
|
|
140
|
+
if (this.value < this.totalPages) {
|
|
141
|
+
this.$emit('input', this.value + 1);
|
|
142
|
+
}
|
|
143
|
+
},
|
|
144
|
+
prevPage() {
|
|
145
|
+
if (this.value > 1) {
|
|
146
|
+
this.$emit('input', this.value - 1);
|
|
147
|
+
}
|
|
78
148
|
}
|
|
79
|
-
return this.value - pagesToAdd;
|
|
80
|
-
} else {
|
|
81
|
-
return 1;
|
|
82
|
-
}
|
|
83
149
|
},
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
} else {
|
|
91
|
-
return this.totalPages;
|
|
150
|
+
watch: {
|
|
151
|
+
perPage() {
|
|
152
|
+
this.$emit('input', 1);
|
|
153
|
+
},
|
|
154
|
+
total() {
|
|
155
|
+
this.$emit('input', 1);
|
|
92
156
|
}
|
|
93
|
-
} else {
|
|
94
|
-
return this.pagesToDisplay;
|
|
95
|
-
}
|
|
96
157
|
}
|
|
97
|
-
},
|
|
98
|
-
data() {
|
|
99
|
-
return {
|
|
100
|
-
defaultPagesToDisplay: 5
|
|
101
|
-
};
|
|
102
|
-
},
|
|
103
|
-
methods: {
|
|
104
|
-
range(min, max) {
|
|
105
|
-
let arr = [];
|
|
106
|
-
for (let i = min; i <= max; i++) {
|
|
107
|
-
arr.push(i);
|
|
108
|
-
}
|
|
109
|
-
return arr;
|
|
110
|
-
},
|
|
111
|
-
changePage(item) {
|
|
112
|
-
this.$emit("input", item);
|
|
113
|
-
},
|
|
114
|
-
nextPage() {
|
|
115
|
-
if (this.value < this.totalPages) {
|
|
116
|
-
this.$emit("input", this.value + 1);
|
|
117
|
-
}
|
|
118
|
-
},
|
|
119
|
-
prevPage() {
|
|
120
|
-
if (this.value > 1) {
|
|
121
|
-
this.$emit("input", this.value - 1);
|
|
122
|
-
}
|
|
123
|
-
}
|
|
124
|
-
},
|
|
125
|
-
watch: {
|
|
126
|
-
perPage() {
|
|
127
|
-
this.$emit("input", 1);
|
|
128
|
-
},
|
|
129
|
-
total() {
|
|
130
|
-
this.$emit("input", 1);
|
|
131
|
-
}
|
|
132
|
-
}
|
|
133
158
|
};
|
|
134
159
|
</script>
|
|
160
|
+
|
|
161
|
+
<style lang="scss" scoped>
|
|
162
|
+
@media (min-height: 667.59px) {
|
|
163
|
+
.card-footer-bottom {
|
|
164
|
+
bottom: 5px;
|
|
165
|
+
position: fixed;
|
|
166
|
+
width: 87%;
|
|
167
|
+
}
|
|
168
|
+
}
|
|
169
|
+
</style>
|
|
@@ -4,6 +4,7 @@
|
|
|
4
4
|
v-for="(item, index) in collapseItems"
|
|
5
5
|
:key="index"
|
|
6
6
|
class="collapse__container__item"
|
|
7
|
+
:class="customItemClass"
|
|
7
8
|
>
|
|
8
9
|
<h6 slot="title">{{ item.title }}</h6>
|
|
9
10
|
<div class="collapse__container__item__description">{{ item.description }}</div>
|
|
@@ -22,7 +23,11 @@ export default {
|
|
|
22
23
|
CollapseItem
|
|
23
24
|
},
|
|
24
25
|
props: {
|
|
25
|
-
collapseItems: {}
|
|
26
|
+
collapseItems: {},
|
|
27
|
+
customItemClass:{
|
|
28
|
+
type: String,
|
|
29
|
+
default: ''
|
|
30
|
+
},
|
|
26
31
|
}
|
|
27
32
|
};
|
|
28
33
|
</script>
|