1
1
<template >
2
2
<div class =" animated fadeIn" >
3
- <CRow >
4
- <CCol sm =" 6" lg =" 3" >
5
- <CWidget06 header =" 9.823" text =" Members online" >
6
- <template slot="dropdown">
7
- <CDropdown class =" float-right"
8
- variant =" transparent p-0"
9
- right
10
- buttonContent =" <i class='icon-settings'></i>"
11
- tag =" div"
12
- >
13
- <!-- <template slot="buttonContent">
14
-
15
- </template> -->
16
- <CDropdownItem >Action</CDropdownItem >
17
- <CDropdownItem >Another action</CDropdownItem >
18
- <CDropdownItem >Something else here...</CDropdownItem >
19
- <CDropdownItem disabled >Disabled action</CDropdownItem >
20
- </CDropdown >
21
- </template >
22
- <CSimplePointedChart class =' px-3' :data =' [65, 59, 84, 84, 51, 55, 40]'
23
- :labels =" ['January', 'February', 'March', 'April', 'May', 'June', 'July']"
24
- style =' height :70px ' label =' Members' pointHoverColor =' primary' />
25
- </CWidget06 >
26
- </CCol >
27
- <CCol sm =" 6" lg =" 3" >
28
- <CWidget06 variant =" info" header =" 9.823" text =" Members online" >
29
- <CDropdown slot =" dropdown"
30
- class =" float-right"
31
- variant =" transparent p-0"
32
- right
33
- no-caret
34
- buttonContent =" <i class='icon-location-pin'></i>"
35
- tag =" div"
36
- >
37
- <!-- <i slot="buttonContent"
38
- class="icon-location-pin"
39
- ></i> -->
40
- <CDropdownItem >Action</CDropdownItem >
41
- <CDropdownItem >Another action</CDropdownItem >
42
- <CDropdownItem >Something else here...</CDropdownItem >
43
- <CDropdownItem disabled >Disabled action</CDropdownItem >
44
- </CDropdown >
45
- <CSimplePointedChart class =" px-3"
46
- :data =" [1, 18, 9, 17, 34, 22, 11]"
47
- :labels =" ['January', 'February', 'March', 'April', 'May', 'June', 'July']"
48
- style =" height :70px "
49
- label =" Members"
50
- :options =" { elements: { line: { tension: 0.00001 }}}"
51
- pointHoverColor =" info"
52
- />
53
- </CWidget06 >
54
- </CCol >
55
- <CCol sm =" 6" lg =" 3" >
56
- <CWidget06 variant =" warning" header =" 9.823" text =" Members online" >
57
- <template slot='dropdown'>
58
- <CDropdown class =" float-right"
59
- variant =" transparent p-0"
60
- right
61
- buttonContent =" <i class='icon-settings'></i>"
62
- tag =" div"
63
- >
64
-
65
- <CDropdownItem >Action</CDropdownItem >
66
- <CDropdownItem >Another action</CDropdownItem >
67
- <CDropdownItem >Something else here...</CDropdownItem >
68
- <CDropdownItem disabled >Disabled action</CDropdownItem >
69
- </CDropdown >
70
- </template >
71
- <CSimpleLineChart chartId =" CWidget06_3" :data =' [78, 81, 80, 45, 34, 12, 40]'
72
- :labels =" ['January', 'February', 'March', 'April', 'May', 'June', 'July']"
73
- style =' height :70px ' color =' rgba(255,255,255,.2)' label =' Members'
74
- :options =" {elements: {line: {borderWidth: 2.5}}}" pointHoverColor =' warning' />
75
- </CWidget06 >
76
- </CCol >
77
- <CCol sm =" 6" lg =" 3" >
78
- <CWidget06 variant =" danger" header =" 9.823" text =" Members online" >
79
- <template slot="dropdown">
80
- <CDropdown class =" float-right"
81
- variant =" transparent p-0"
82
- right
83
- buttonContent =" <i class='icon-settings'></i>"
84
- >
85
- <!-- <template slot="buttonContent">
86
- <i class="icon-settings"></i>
87
- </template> -->
88
- <CDropdownItem >Action</CDropdownItem >
89
- <CDropdownItem >Another action</CDropdownItem >
90
- <CDropdownItem >Something else here...</CDropdownItem >
91
- <CDropdownItem disabled >Disabled action</CDropdownItem >
92
- </CDropdown >
93
- </template >
94
- <CSimpleBarChart chartId =" CWidget06_4" :data =' [10, 22, 34, 46, 58, 70, 46, 23, 45, 78, 34, 12]'
95
- label =' Members' color =' rgb(250, 152, 152)' style =' height :70px ' />
96
- </CWidget06 >
97
- </CCol >
98
- </CRow >
99
-
3
+ <Widgets06 />
100
4
<CCard >
101
5
<CCardBody >
102
6
<CRow >
151
55
</CRow >
152
56
</CCardFooter >
153
57
</CCard >
154
- <CRow >
155
- <CCol md =" 3" sm =" 6" >
156
- <CWidget04 variant =" facebook" rightHeader =" 89k" rightFooter =" friends" leftHeader =" 459" leftFooter =" feeds" >
157
- <CSimpleLineChart :data =' [65, 59, 84, 84, 51, 55, 40]' label =' Friends'
158
- :labels =" ['January', 'February', 'March', 'April', 'May', 'June', 'July']"
159
- style =' height :100px ' color =' rgba(255,255,255,.1)' />
160
- </CWidget04 >
161
- </CCol >
162
- <CCol md =" 3" sm =" 6" >
163
- <CWidget04 variant =" twitter" rightHeader =" 973k" rightFooter =" followers" leftHeader =" 1.792" leftFooter =" tweets" >
164
- <CSimpleLineChart :data =' [1, 13, 9, 17, 34, 41, 38]' label =' Followers'
165
- :labels =" ['January', 'February', 'March', 'April', 'May', 'June', 'July']"
166
- style =' height :100px ' color =' rgba(255,255,255,.1)' />
167
- </CWidget04 >
168
- </CCol >
169
- <CCol md =" 3" sm =" 6" >
170
- <CWidget04 variant =" linkedin" rightHeader =" 500+" rightFooter =" contracts" leftHeader =" 292" leftFooter =" feeds" >
171
- <CSimpleLineChart :data =' [78, 81, 80, 45, 34, 12, 40]' label =' Contracts'
172
- :labels =" ['January', 'February', 'March', 'April', 'May', 'June', 'July']"
173
- style =' height :100px ' color =' rgba(255,255,255,.1)' />
174
- </CWidget04 >
175
- </CCol >
176
- <CCol md =" 3" sm =" 6" >
177
- <CWidget04 variant =' google-plus' rightHeader =' 894' rightFooter =' followers' leftHeader =' 92' leftFooter =' circles' >
178
- <CSimpleLineChart :data =' [35, 23, 56, 22, 97, 23, 64]' label =' Followers'
179
- :labels =" ['January', 'February', 'March', 'April', 'May', 'June', 'July']"
180
- style =' height :100px ' color =' rgba(255,255,255,.1)' />
181
- </CWidget04 >
182
- </CCol >
183
- </CRow ><!-- /.row-->
58
+ <Widgets04 />
184
59
<CRow >
185
60
<CCol md =" 12" >
186
61
<CCard header =" Traffic & ; Sales" bodyWrapper >
459
334
460
335
<script >
461
336
import MainChartExample from ' ./dashboard/MainChartExample'
337
+ import Widgets06 from ' ./widgets/Widgets06'
338
+ import Widgets04 from ' ./widgets/Widgets04'
462
339
import SocialBoxChartExample from ' ./dashboard/SocialBoxChartExample'
463
340
import CalloutChartExample from ' ./dashboard/CalloutChartExample'
464
341
@@ -468,6 +345,8 @@ export default {
468
345
MainChartExample,
469
346
SocialBoxChartExample,
470
347
CalloutChartExample,
348
+ Widgets06,
349
+ Widgets04
471
350
},
472
351
data : function () {
473
352
return {
0 commit comments