Skip to content

Commit d5a0511

Browse files
woothuwoothu
committed
refactor: change v-model to .sync modifier, other small changes
1 parent 53a9f47 commit d5a0511

File tree

8 files changed

+124
-109
lines changed

8 files changed

+124
-109
lines changed

‎src/containers/DefaultHeaderDropdownAccnt.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
noPopper
77
addMenuClasses="dropdown-menu-right"
88
>
9-
<template #buttonContent>
9+
<template #button-content>
1010
<img
1111
src="img/avatars/6.jpg"
1212
class="img-avatar"

‎src/views/Dashboard.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@
5555
</CRow>
5656
</CCardFooter>
5757
</CCard>
58-
<Widgets04/>
58+
<WidgetsSocial/>
5959
<CRow>
6060
<CCol md="12">
6161
<CCard headerHtml="Traffic &amp; Sales" bodyWrapper>

‎src/views/base/Paginations.vue

Lines changed: 32 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,8 @@
33
<div class="animated fadeIn">
44
<CCard>
55
<CCardHeader>
6-
<i class="fa fa-align-justify"></i><strong> Bootstrap Pagination</strong>
6+
<i class="fa fa-align-justify"></i>
7+
<strong> Bootstrap Pagination</strong>
78
<!-- <div class="card-header-actions">
89
<a href="https://bootstrap-vue.js.org/docs/components/pagination" class="card-header-action" rel="noreferrer noopener" target="_blank">
910
<small class="text-muted">docs</small>
@@ -12,16 +13,26 @@
1213
</CCardHeader>
1314
<CCardBody>
1415
<h6>Default</h6>
15-
<CPagination v-model="currentPage" :pages="10"/>
16+
<CPagination
17+
:activePage.sync="currentPage"
18+
:pages="10"
19+
/>
1620
<br>
1721

1822
<h6>Small</h6>
19-
<CPagination size="sm" v-model="currentPage" :pages="10"/>
23+
<CPagination
24+
size="sm"
25+
:activePage.sync="currentPage"
26+
:pages="10"/>
2027
<br>
2128

2229
<div class="d-sm-down-none">
2330
<h6>Large</h6>
24-
<CPagination size="lg" v-model="currentPage" :pages="10"/>
31+
<CPagination
32+
size="lg"
33+
:activePage.sync="currentPage"
34+
:pages="10"
35+
/>
2536
<br>
2637
</div>
2738

@@ -30,20 +41,32 @@
3041
</CCard>
3142
<CCard>
3243
<CCardHeader>
33-
<i class="fa fa-align-justify"></i><strong> Pagination </strong>
44+
<i class="fa fa-align-justify"></i>
45+
<strong> Pagination </strong>
3446
<small>alignment</small>
3547
</CCardHeader>
3648
<CCardBody>
3749
<h6>Left alignment (default)</h6>
38-
<CPagination v-model="currentPage" :pages="10"/>
50+
<CPagination
51+
:activePage.sync="currentPage"
52+
:pages="10"
53+
/>
3954
<br>
4055

4156
<h6>Center alignment</h6>
42-
<CPagination align="center" :pages="10" v-model="currentPage"/>
57+
<CPagination
58+
align="center"
59+
:pages="10"
60+
:activePage.sync="currentPage"
61+
/>
4362
<br>
4463

4564
<h6>Right (end) alignment</h6>
46-
<CPagination align="end" v-model="currentPage" :pages="10"/>
65+
<CPagination
66+
align="end"
67+
:activePage.sync="currentPage"
68+
:pages="10"
69+
/>
4770
<br>
4871

4972
<div>currentPage: {{currentPage}}</div>
@@ -60,11 +83,6 @@ export default {
6083
return {
6184
currentPage: 3,
6285
}
63-
},
64-
// methods: {
65-
// linkGen (pageNum) {
66-
// return '#page/' + pageNum + '/foobar'
67-
// },
68-
// }
86+
}
6987
}
7088
</script>

‎src/views/base/Switches.vue

Lines changed: 6 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
</h5>
1313
</CCardHeader>
1414
<CCardBody>
15-
<!-- <CSwitch class="mx-1" variant="primary" shape="3d" outline="alt" v-bind="labelIcon" type="radio" name="radio" v-model="radio" trueValue="primary"/> -->
15+
<!-- <CSwitch class="mx-1" variant="primary" shape="3d" outline="alt" v-bind="labelIcon" type="radio" name="radio" checked.sync="radio" trueValue="primary"/> -->
1616
<CSwitch class="mx-1"
1717
:key="key"
1818
:variant="variant"
@@ -21,7 +21,7 @@
2121
v-bind="labelIcon"
2222
type="radio"
2323
name="radio"
24-
v-model="radio"
24+
:checked.sync="radio"
2525
:value="variant"
2626
v-for="(variant, key) in ['primary','secondary','warning','success','info','danger','light','dark']"
2727
/>
@@ -37,27 +37,19 @@
3737
<CBadge variant="primary">{{checker}}</CBadge>
3838
</CCardHeader>
3939
<CCardBody>
40-
<CSwitch class="mx-1"
40+
<CSwitch
41+
class="mx-1"
4142
variant="primary"
42-
checked
4343
name="switch1"
44-
v-model="checker"
45-
value="someValue"
44+
:checked.sync="checker"
4645
trueValue="yes"
4746
falseValue="no"
4847
/>
49-
<CSwitch class="mx-1"
50-
variant="primary"
51-
checked
52-
name="switch1"
53-
:checked="true"
54-
value="someValue"
55-
/>
5648
<CSwitch class="mx-1"
5749
:variant="variant"
5850
checked
5951
:key="key"
60-
v-for="(variant, key) in ['secondary', 'success','warning','info','danger','light','dark','primary']"
52+
v-for="(variant, key) in ['secondary', 'success','warning','info','danger','light','dark']"
6153
/>
6254
<CSwitch class="mx-1" variant="primary" disabled />
6355
</CCardBody>

‎src/views/base/Table.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
:dark="dark"
1313
noSorting
1414
>
15-
<template v-slot:status="{item}">
15+
<template #status="{item}">
1616
<td>
1717
<CBadge :variant="getBadge(item.status)">{{item.status}}</CBadge>
1818
</td>

‎src/views/base/Tables.vue

Lines changed: 37 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -14,44 +14,44 @@
1414
:defaultSorter="{ name:'username', direction:'desc'}"
1515
:defaultColumnFilter="{ role:'staff' }"
1616
>
17-
<template #index-col="{index}">
18-
<td
17+
<template #index-column="{index}">
18+
<td
19+
@click="toggleDetails(index)"
20+
style="cursor:pointer"
21+
class="text-center"
22+
>
23+
<i
24+
class="icons font-lg d-block cui-chevron-right"
25+
style="transition: transform 0.4s"
26+
:style="details.includes(index) ? 'transform:rotate(90deg)': ''"
27+
></i>
28+
</td>
29+
</template>
30+
<template #status="{item}">
31+
<td>
32+
<CBadge :variant="getBadge(item.status)">
33+
{{item.status}}
34+
</CBadge>
35+
</td>
36+
</template>
37+
<template #show_details="{item, index}">
38+
<td class="py-2">
39+
<CButton
40+
variant="outline-primary"
41+
square
42+
size="sm"
1943
@click="toggleDetails(index)"
20-
style="cursor:pointer"
21-
class="text-center"
22-
>
23-
<i
24-
class="icons font-lg d-block cui-chevron-right"
25-
style="transition: transform 0.4s"
26-
:style="details.includes(index) ? 'transform:rotate(90deg)': ''"
27-
></i>
28-
</td>
29-
</template>
30-
<template #status="{item}">
31-
<td>
32-
<CBadge :variant="getBadge(item.status)">
33-
{{item.status}}
34-
</CBadge>
35-
</td>
36-
</template>
37-
<template #show_details="{item, index}">
38-
<td class="py-2">
39-
<CButton
40-
variant="outline-primary"
41-
square
42-
size="sm"
43-
@click="toggleDetails(index)"
44-
:textHtml="details.includes(index) ? 'Hide' : 'Show'"
45-
/>
46-
</td>
47-
</template>
48-
<template #details="{item, index}">
49-
<CCollapse :show="details.includes(index)">
50-
<CCardBody>
51-
{{index + 1}} - {{item}}
52-
</CCardBody>
53-
</CCollapse>
54-
</template>
44+
:textHtml="details.includes(index) ? 'Hide' : 'Show'"
45+
/>
46+
</td>
47+
</template>
48+
<template #details="{item, index}">
49+
<CCollapse :show="details.includes(index)">
50+
<CCardBody>
51+
{{index + 1}} - {{item}}
52+
</CCardBody>
53+
</CCollapse>
54+
</template>
5555
</CTable>
5656
</CCard>
5757
</CCol>

‎src/views/base/Tabs.vue

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -163,7 +163,6 @@
163163
card
164164
pills
165165
vertical="4"
166-
v-model="tabIndex[1]"
167166
>
168167
<CTab active>
169168
<template slot="title">
@@ -208,7 +207,6 @@ export default {
208207
name: 'tabs',
209208
data () {
210209
return {
211-
tabIndex: [0, 0],
212210
tabs: [
213211
'Calculator',
214212
'Shopping cart',

0 commit comments

Comments
 (0)