Skip to content

Commit 1f5cad7

Browse files
mrholekmrholek
committed
refactor: update example views
1 parent a759550 commit 1f5cad7

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

42 files changed

+2492
-2103
lines changed

‎src/views/Dashboard.vue

Lines changed: 110 additions & 131 deletions
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,15 @@
22
<div>
33
<WidgetsStatsA />
44
<CRow>
5-
<CCol md="12">
5+
<CCol :md="12">
66
<CCard class="mb-4">
77
<CCardBody>
88
<CRow>
9-
<CCol sm="5">
9+
<CCol :sm="5">
1010
<h4 id="traffic" class="card-title mb-0">Traffic</h4>
1111
<div class="small text-medium-emphasis">January 2021</div>
1212
</CCol>
13-
<CCol sm="7" class="d-none d-md-block">
13+
<CCol :sm="7" class="d-none d-md-block">
1414
<CButton color="primary" class="float-end">
1515
<CIcon icon="cil-cloud-download" />
1616
</CButton>
@@ -91,14 +91,14 @@
9191
</CRow>
9292
<WidgetsStatsD />
9393
<CRow>
94-
<CCol md="12">
94+
<CCol :md="12">
9595
<CCard class="mb-4">
9696
<CCardHeader> Traffic &amp; Sales </CCardHeader>
9797
<CCardBody>
9898
<CRow>
99-
<CCol sm="12" lg="6">
99+
<CCol :sm="12" :lg="6">
100100
<CRow>
101-
<CCol sm="6">
101+
<CCol :sm="6">
102102
<div
103103
class="
104104
border-start border-start-4 border-start-info
@@ -111,7 +111,7 @@
111111
<div class="fs-5 fw-semibold">9,123</div>
112112
</div>
113113
</CCol>
114-
<CCol sm="6">
114+
<CCol :sm="6">
115115
<div
116116
class="
117117
border-start border-start-4 border-start-danger
@@ -192,9 +192,9 @@
192192
</div>
193193
</div>
194194
</CCol>
195-
<CCol sm="12" lg="6">
195+
<CCol :sm="12" :lg="6">
196196
<CRow>
197-
<CCol sm="6">
197+
<CCol :sm="6">
198198
<div
199199
class="
200200
border-start border-start-4 border-start-warning
@@ -207,7 +207,7 @@
207207
<div class="fs-5 fw-semibold">78,623</div>
208208
</div>
209209
</CCol>
210-
<CCol sm="6">
210+
<CCol :sm="6">
211211
<div
212212
class="
213213
border-start border-start-4 border-start-success
@@ -341,7 +341,7 @@
341341
<CTableDataCell>
342342
<div>{{ item.user.name }}</div>
343343
<div class="small text-medium-emphasis">
344-
<span>{{ item.user.new ? "New" : "Recurring" }}</span> |
344+
<span>{{ item.user.new ? 'New' : 'Recurring' }}</span> |
345345
{{ item.user.registered }}
346346
</div>
347347
</CTableDataCell>
@@ -388,139 +388,118 @@
388388
</template>
389389

390390
<script>
391-
import avatar1 from "./../assets/images/avatars/1.jpg";
392-
import avatar2 from "./../assets/images/avatars/2.jpg";
393-
import avatar3 from "./../assets/images/avatars/3.jpg";
394-
import avatar4 from "./../assets/images/avatars/4.jpg";
395-
import avatar5 from "./../assets/images/avatars/5.jpg";
396-
import avatar6 from "./../assets/images/avatars/6.jpg";
397-
import MainChartExample from "./charts/MainChartExample";
391+
import avatar1 from './../assets/images/avatars/1.jpg'
392+
import avatar2 from './../assets/images/avatars/2.jpg'
393+
import avatar3 from './../assets/images/avatars/3.jpg'
394+
import avatar4 from './../assets/images/avatars/4.jpg'
395+
import avatar5 from './../assets/images/avatars/5.jpg'
396+
import avatar6 from './../assets/images/avatars/6.jpg'
397+
import MainChartExample from './charts/MainChartExample'
398398
import WidgetsStatsA from './widgets/WidgetsStatsTypeA.vue'
399399
import WidgetsStatsD from './widgets/WidgetsStatsTypeD.vue'
400+
400401
export default {
401-
name: "Dashboard",
402+
name: 'Dashboard',
402403
components: {
403404
MainChartExample,
404405
WidgetsStatsA,
405406
WidgetsStatsD,
406407
},
407-
data() {
408-
return {
409-
selected: "Month",
410-
tableItems: [
411-
{
412-
avatar: { src: avatar1, status: "success" },
413-
user: {
414-
name: "Yiorgos Avraamu",
415-
new: true,
416-
registered: "Jan 1, 2021",
417-
},
418-
country: { name: "USA", flag: "cif-us" },
419-
usage: {
420-
value: 50,
421-
period: "Jun 11, 2021 - Jul 10, 2021",
422-
color: "success",
423-
},
424-
payment: { name: "Mastercard", icon: "cib-cc-mastercard" },
425-
activity: "10 sec ago",
408+
setup() {
409+
const tableItems = [
410+
{
411+
avatar: { src: avatar1, status: 'success' },
412+
user: {
413+
name: 'Yiorgos Avraamu',
414+
new: true,
415+
registered: 'Jan 1, 2021',
426416
},
427-
{
428-
avatar: { src: avatar2, status: "danger" },
429-
user: {
430-
name: "Avram Tarasios",
431-
new: false,
432-
registered: "Jan 1, 2021",
433-
},
434-
country: { name: "Brazil", flag: "cif-br" },
435-
usage: {
436-
value: 22,
437-
period: "Jun 11, 2021 - Jul 10, 2021",
438-
color: "info",
439-
},
440-
payment: { name: "Visa", icon: "cib-cc-visa" },
441-
activity: "5 minutes ago",
417+
country: { name: 'USA', flag: 'cif-us' },
418+
usage: {
419+
value: 50,
420+
period: 'Jun 11, 2021 - Jul 10, 2021',
421+
color: 'success',
442422
},
443-
{
444-
avatar: { src: avatar3, status: "warning" },
445-
user: { name: "Quintin Ed", new: true, registered: "Jan 1, 2021" },
446-
country: { name: "India", flag: "cif-in" },
447-
usage: {
448-
value: 74,
449-
period: "Jun 11, 2021 - Jul 10, 2021",
450-
color: "warning",
451-
},
452-
payment: { name: "Stripe", icon: "cib-cc-stripe" },
453-
activity: "1 hour ago",
423+
payment: { name: 'Mastercard', icon: 'cib-cc-mastercard' },
424+
activity: '10 sec ago',
425+
},
426+
{
427+
avatar: { src: avatar2, status: 'danger' },
428+
user: {
429+
name: 'Avram Tarasios',
430+
new: false,
431+
registered: 'Jan 1, 2021',
454432
},
455-
{
456-
avatar: { src: avatar4, status: "secondary" },
457-
user: { name: "Enéas Kwadwo", new: true, registered: "Jan 1, 2021" },
458-
country: { name: "France", flag: "cif-fr" },
459-
usage: {
460-
value: 98,
461-
period: "Jun 11, 2021 - Jul 10, 2021",
462-
color: "danger",
463-
},
464-
payment: { name: "PayPal", icon: "cib-cc-paypal" },
465-
activity: "Last month",
433+
country: { name: 'Brazil', flag: 'cif-br' },
434+
usage: {
435+
value: 22,
436+
period: 'Jun 11, 2021 - Jul 10, 2021',
437+
color: 'info',
466438
},
467-
{
468-
avatar: { src: avatar5, status: "success" },
469-
user: {
470-
name: "Agapetus Tadeáš",
471-
new: true,
472-
registered: "Jan 1, 2021",
473-
},
474-
country: { name: "Spain", flag: "cif-es" },
475-
usage: {
476-
value: 22,
477-
period: "Jun 11, 2021 - Jul 10, 2021",
478-
color: "primary",
479-
},
480-
payment: { name: "Google Wallet", icon: "cib-cc-apple-pay" },
481-
activity: "Last week",
439+
payment: { name: 'Visa', icon: 'cib-cc-visa' },
440+
activity: '5 minutes ago',
441+
},
442+
{
443+
avatar: { src: avatar3, status: 'warning' },
444+
user: { name: 'Quintin Ed', new: true, registered: 'Jan 1, 2021' },
445+
country: { name: 'India', flag: 'cif-in' },
446+
usage: {
447+
value: 74,
448+
period: 'Jun 11, 2021 - Jul 10, 2021',
449+
color: 'warning',
482450
},
483-
{
484-
avatar: { src: avatar6, status: "danger" },
485-
user: {
486-
name: "Friderik Dávid",
487-
new: true,
488-
registered: "Jan 1, 2021",
489-
},
490-
country: { name: "Poland", flag: "cif-pl" },
491-
usage: {
492-
value: 43,
493-
period: "Jun 11, 2021 - Jul 10, 2021",
494-
color: "success",
495-
},
496-
payment: { name: "Amex", icon: "cib-cc-amex" },
497-
activity: "Last week",
451+
payment: { name: 'Stripe', icon: 'cib-cc-stripe' },
452+
activity: '1 hour ago',
453+
},
454+
{
455+
avatar: { src: avatar4, status: 'secondary' },
456+
user: { name: 'Enéas Kwadwo', new: true, registered: 'Jan 1, 2021' },
457+
country: { name: 'France', flag: 'cif-fr' },
458+
usage: {
459+
value: 98,
460+
period: 'Jun 11, 2021 - Jul 10, 2021',
461+
color: 'danger',
498462
},
499-
],
500-
tableFields: [
501-
{ key: "avatar", label: "", _classes: "text-center" },
502-
{ key: "user" },
503-
{ key: "country", _classes: "text-center" },
504-
{ key: "usage" },
505-
{ key: "payment", label: "Payment method", _classes: "text-center" },
506-
{ key: "activity" },
507-
],
508-
};
509-
},
510-
methods: {
511-
color(value) {
512-
let $color;
513-
if (value <= 25) {
514-
$color = "info";
515-
} else if (value > 25 && value <= 50) {
516-
$color = "success";
517-
} else if (value > 50 && value <= 75) {
518-
$color = "warning";
519-
} else if (value > 75 && value <= 100) {
520-
$color = "danger";
521-
}
522-
return $color;
523-
},
463+
payment: { name: 'PayPal', icon: 'cib-cc-paypal' },
464+
activity: 'Last month',
465+
},
466+
{
467+
avatar: { src: avatar5, status: 'success' },
468+
user: {
469+
name: 'Agapetus Tadeáš',
470+
new: true,
471+
registered: 'Jan 1, 2021',
472+
},
473+
country: { name: 'Spain', flag: 'cif-es' },
474+
usage: {
475+
value: 22,
476+
period: 'Jun 11, 2021 - Jul 10, 2021',
477+
color: 'primary',
478+
},
479+
payment: { name: 'Google Wallet', icon: 'cib-cc-apple-pay' },
480+
activity: 'Last week',
481+
},
482+
{
483+
avatar: { src: avatar6, status: 'danger' },
484+
user: {
485+
name: 'Friderik Dávid',
486+
new: true,
487+
registered: 'Jan 1, 2021',
488+
},
489+
country: { name: 'Poland', flag: 'cif-pl' },
490+
usage: {
491+
value: 43,
492+
period: 'Jun 11, 2021 - Jul 10, 2021',
493+
color: 'success',
494+
},
495+
payment: { name: 'Amex', icon: 'cib-cc-amex' },
496+
activity: 'Last week',
497+
},
498+
]
499+
500+
return {
501+
tableItems,
502+
}
524503
},
525-
};
504+
}
526505
</script>

‎src/views/base/Accordion.vue

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
:collapsed="activeKey !== 1"
2121
@click="
2222
() => {
23-
activeKey === 1 ? (activeKey = 0) : (activeKey = 1);
23+
activeKey === 1 ? (activeKey = 0) : (activeKey = 1)
2424
}
2525
"
2626
>
@@ -47,7 +47,7 @@
4747
:collapsed="activeKey !== 2"
4848
@click="
4949
() => {
50-
activeKey === 2 ? (activeKey = 0) : (activeKey = 2);
50+
activeKey === 2 ? (activeKey = 0) : (activeKey = 2)
5151
}
5252
"
5353
>
@@ -74,7 +74,7 @@
7474
:collapsed="activeKey !== 3"
7575
@click="
7676
() => {
77-
activeKey === 3 ? (activeKey = 0) : (activeKey = 3);
77+
activeKey === 3 ? (activeKey = 0) : (activeKey = 3)
7878
}
7979
"
8080
>
@@ -120,7 +120,7 @@
120120
() => {
121121
flushActiveKey === 1
122122
? (flushActiveKey = 0)
123-
: (flushActiveKey = 1);
123+
: (flushActiveKey = 1)
124124
}
125125
"
126126
>
@@ -149,7 +149,7 @@
149149
() => {
150150
flushActiveKey === 2
151151
? (flushActiveKey = 0)
152-
: (flushActiveKey = 2);
152+
: (flushActiveKey = 2)
153153
}
154154
"
155155
>
@@ -178,7 +178,7 @@
178178
() => {
179179
flushActiveKey === 3
180180
? (flushActiveKey = 0)
181-
: (flushActiveKey = 3);
181+
: (flushActiveKey = 3)
182182
}
183183
"
184184
>
@@ -210,15 +210,15 @@
210210
<script>
211211
import { ref } from 'vue'
212212
export default {
213-
name: "Accordion",
213+
name: 'Accordion',
214214
setup() {
215215
const activeKey = ref(1)
216216
const flushActiveKey = ref(1)
217217
218218
return {
219-
activeKey,
220-
flushActiveKey,
219+
activeKey,
220+
flushActiveKey,
221221
}
222-
}
223-
};
222+
},
223+
}
224224
</script>

‎src/views/base/Breadcrumbs.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -60,6 +60,6 @@
6060

6161
<script>
6262
export default {
63-
name: "Breadcrumbs",
64-
};
63+
name: 'Breadcrumbs',
64+
}
6565
</script>

0 commit comments

Comments
 (0)