sean/manja_ui_dev
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

Chore: v3-alpha.2 version merge

Browse Source
This commit is contained in:
woothu
2019-03-12 11:34:33 +01:00
parent 7253a904ff 6c7a636a9a
commit 5844f03dab
8 changed files with 368 additions and 234 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "@coreui/coreui-free-vue-admin-template", "name": "@coreui/coreui-free-vue-admin-template",
"version": "3.0.0-alpha.1", "version": "3.0.0-alpha.2",
"description": "Open Source Bootstrap Admin Template", "description": "Open Source Bootstrap Admin Template",
"author": "Łukasz Holeczek", "author": "Łukasz Holeczek",
"homepage": "http://coreui.io", "homepage": "http://coreui.io",
src/App.vue
-2
View File
@@ -19,8 +19,6 @@ export default {
@import '~simple-line-icons/scss/simple-line-icons.scss'; @import '~simple-line-icons/scss/simple-line-icons.scss';
/* Import Flag Icons Set */ /* Import Flag Icons Set */
@import '~flag-icon-css/css/flag-icon.min.css'; @import '~flag-icon-css/css/flag-icon.min.css';
/* Import Bootstrap Vue Styles */
@import '~bootstrap-vue/dist/bootstrap-vue.css';
// Import Main styles for this application // Import Main styles for this application
@import 'assets/scss/style'; @import 'assets/scss/style';
</style> </style>
src/router/index.js
+1 -1
View File
@@ -11,7 +11,7 @@ const Colors = () => import('@/views/theme/Colors')
const Typography = () => import('@/views/theme/Typography') const Typography = () => import('@/views/theme/Typography')
const Charts = () => import('@/views/Charts') const Charts = () => import('@/views/Charts')
const Widgets = () => import('@/views/Widgets') const Widgets = () => import('@/views/widgets/Widgets')
// Views - Components // Views - Components
const Cards = () => import('@/views/base/Cards') const Cards = () => import('@/views/base/Cards')
src/views/Dashboard.vue
+6 -127
View File
@@ -1,102 +1,6 @@
<template> <template>
<div class="animated fadeIn"> <div class="animated fadeIn">
<CRow> <Widgets06/>
<CCol sm="6" lg="3">
<CWidget06 header="9.823" text="Members online">
<template slot="dropdown">
<CDropdown class="float-right"
variant="transparent p-0"
right
buttonContent="<i class='icon-settings'></i>"
tag="div"
>
<!-- <template slot="buttonContent">
</template> -->
<CDropdownItem>Action</CDropdownItem>
<CDropdownItem>Another action</CDropdownItem>
<CDropdownItem>Something else here...</CDropdownItem>
<CDropdownItem disabled>Disabled action</CDropdownItem>
</CDropdown>
</template>
<CSimplePointedChart class='px-3' :data='[65, 59, 84, 84, 51, 55, 40]'
:labels="['January', 'February', 'March', 'April', 'May', 'June', 'July']"
style='height:70px' label='Members' pointHoverColor='primary'/>
</CWidget06>
</CCol>
<CCol sm="6" lg="3">
<CWidget06 variant="info" header="9.823" text="Members online">
<CDropdown slot="dropdown"
class="float-right"
variant="transparent p-0"
right
no-caret
buttonContent="<i class='icon-location-pin'></i>"
tag="div"
>
<!-- <i slot="buttonContent"
class="icon-location-pin"
></i> -->
<CDropdownItem>Action</CDropdownItem>
<CDropdownItem>Another action</CDropdownItem>
<CDropdownItem>Something else here...</CDropdownItem>
<CDropdownItem disabled>Disabled action</CDropdownItem>
</CDropdown>
<CSimplePointedChart class="px-3"
:data="[1, 18, 9, 17, 34, 22, 11]"
:labels="['January', 'February', 'March', 'April', 'May', 'June', 'July']"
style="height:70px"
label="Members"
:options="{ elements: { line: { tension: 0.00001 }}}"
pointHoverColor="info"
/>
</CWidget06>
</CCol>
<CCol sm="6" lg="3">
<CWidget06 variant="warning" header="9.823" text="Members online">
<template slot='dropdown'>
<CDropdown class="float-right"
variant="transparent p-0"
right
buttonContent="<i class='icon-settings'></i>"
tag="div"
>
<CDropdownItem>Action</CDropdownItem>
<CDropdownItem>Another action</CDropdownItem>
<CDropdownItem>Something else here...</CDropdownItem>
<CDropdownItem disabled>Disabled action</CDropdownItem>
</CDropdown>
</template>
<CSimpleLineChart chartId="CWidget06_3" :data='[78, 81, 80, 45, 34, 12, 40]'
:labels="['January', 'February', 'March', 'April', 'May', 'June', 'July']"
style='height:70px' color ='rgba(255,255,255,.2)' label='Members'
:options="{elements: {line: {borderWidth: 2.5}}}" pointHoverColor='warning'/>
</CWidget06>
</CCol>
<CCol sm="6" lg="3">
<CWidget06 variant="danger" header="9.823" text="Members online">
<template slot="dropdown">
<CDropdown class="float-right"
variant="transparent p-0"
right
buttonContent="<i class='icon-settings'></i>"
>
<!-- <template slot="buttonContent">
<i class="icon-settings"></i>
</template> -->
<CDropdownItem>Action</CDropdownItem>
<CDropdownItem>Another action</CDropdownItem>
<CDropdownItem>Something else here...</CDropdownItem>
<CDropdownItem disabled>Disabled action</CDropdownItem>
</CDropdown>
</template>
<CSimpleBarChart chartId="CWidget06_4" :data='[10, 22, 34, 46, 58, 70, 46, 23, 45, 78, 34, 12]'
label='Members' color='rgb(250, 152, 152)' style='height:70px' />
</CWidget06>
</CCol>
</CRow>
<CCard> <CCard>
<CCardBody> <CCardBody>
<CRow> <CRow>
@@ -151,36 +55,7 @@
</CRow> </CRow>
</CCardFooter> </CCardFooter>
</CCard> </CCard>
<CRow> <Widgets04/>
<CCol md="3" sm="6">
<CWidget04 variant="facebook" rightHeader="89k" rightFooter="friends" leftHeader="459" leftFooter="feeds">
<CSimpleLineChart :data='[65, 59, 84, 84, 51, 55, 40]' label='Friends'
:labels="['January', 'February', 'March', 'April', 'May', 'June', 'July']"
style='height:100px' color='rgba(255,255,255,.1)'/>
</CWidget04>
</CCol>
<CCol md="3" sm="6">
<CWidget04 variant="twitter" rightHeader="973k" rightFooter="followers" leftHeader="1.792" leftFooter="tweets">
<CSimpleLineChart :data='[1, 13, 9, 17, 34, 41, 38]' label='Followers'
:labels="['January', 'February', 'March', 'April', 'May', 'June', 'July']"
style='height:100px' color='rgba(255,255,255,.1)'/>
</CWidget04>
</CCol>
<CCol md="3" sm="6">
<CWidget04 variant="linkedin" rightHeader="500+" rightFooter="contracts" leftHeader="292" leftFooter="feeds">
<CSimpleLineChart :data='[78, 81, 80, 45, 34, 12, 40]' label='Contracts'
:labels="['January', 'February', 'March', 'April', 'May', 'June', 'July']"
style='height:100px' color='rgba(255,255,255,.1)'/>
</CWidget04>
</CCol>
<CCol md="3" sm="6">
<CWidget04 variant='google-plus' rightHeader='894' rightFooter='followers' leftHeader='92' leftFooter='circles'>
<CSimpleLineChart :data='[35, 23, 56, 22, 97, 23, 64]' label='Followers'
:labels="['January', 'February', 'March', 'April', 'May', 'June', 'July']"
style='height:100px' color='rgba(255,255,255,.1)'/>
</CWidget04>
</CCol>
</CRow><!--/.row-->
<CRow> <CRow>
<CCol md="12"> <CCol md="12">
<CCard header="Traffic &amp; Sales" bodyWrapper> <CCard header="Traffic &amp; Sales" bodyWrapper>
@@ -459,6 +334,8 @@
<script> <script>
import MainChartExample from './dashboard/MainChartExample' import MainChartExample from './dashboard/MainChartExample'
import Widgets06 from './widgets/Widgets06'
import Widgets04 from './widgets/Widgets04'
import SocialBoxChartExample from './dashboard/SocialBoxChartExample' import SocialBoxChartExample from './dashboard/SocialBoxChartExample'
import CalloutChartExample from './dashboard/CalloutChartExample' import CalloutChartExample from './dashboard/CalloutChartExample'
@@ -468,6 +345,8 @@ export default {
MainChartExample, MainChartExample,
SocialBoxChartExample, SocialBoxChartExample,
CalloutChartExample, CalloutChartExample,
Widgets06,
Widgets04
}, },
data: function () { data: function () {
return { return {
src/views/notifications/Alerts.vue
+71 -38
View File
@@ -90,39 +90,60 @@
<CCol cols="12" md="6"> <CCol cols="12" md="6">
<CCard> <CCard>
<CCardHeader> <CCardHeader>
<i class="fa fa-align-justify"></i> Alerts <small>dismissible</small> <i class="fa fa-align-justify"></i> Alerts
<small>dismissible</small>
</CCardHeader> </CCardHeader>
<CCardBody> <CCardBody>
<div> <CAlert
<CAlert :show="true" dismissible disabled> dismissible
Dismissible Alert! :show.sync="dismissibleAlerts[0]"
</CAlert>
<!-- :dismissible="{attrs: {disabled:'disabled', 'aria-label':'close it'}, class:'hehe' } -->
<CAlert :show="true"
dismissible>
Dismissible Alert!
<CButtonClose slot-scope="{ dismiss }"
@click="dismiss"
aria-label="close it"
style="color:red">
ok
</CButtonClose>
</CAlert>
<CAlert show dismissible>
Dismissible Alert!
</CAlert>
<CAlert variant="danger"
dismissible
fade
:show="showDismissibleAlert"
@dismissed="showDismissibleAlert=false"
> >
Dismissible Alert! Dismissible Alert!
</CAlert> </CAlert>
<CButton @click="showDismissibleAlert=true" variant="info" class="m-1">
Show dismissible alert ({{showDismissibleAlert?'visible':'hidden'}}) <CAlert
dismissible
fade
:show.sync="dismissibleAlerts[1]"
>
Dismissible Alert with fade effect!
</CAlert>
<CAlert
:show.sync="dismissibleAlerts[2]"
dismissible
iconHtml="<i>Close</i>"
>
Dismissible Alert with custom icon!
</CAlert>
<CAlert
:show.sync="dismissibleAlerts[3]"
class="alert-dismissible"
v-slot="{dismiss}"
>
Dismissible Alert with custom button!
<CButton
class="position-absolute bg-primary"
style="right:10px;top: 50%;transform: translateY(-50%);"
text="<i>Close</i>"
@click="dismiss"
/>
</CAlert>
<CAlert
:show.sync="dismissibleAlerts[4]"
dismissible="disabled"
>
Disabled dismissible Alert!
</CAlert>
<CButton
@click="showDismissibleAlerts"
variant="info"
class="m-1"
>
Show dismissible alerts
</CButton> </CButton>
</div>
</CCardBody> </CCardBody>
</CCard> </CCard>
<CCard> <CCard>
@@ -131,19 +152,20 @@
</CCardHeader> </CCardHeader>
<CCardBody> <CCardBody>
<div> <div>
<CAlert :show="dismissCountDown" <CAlert
dismissible :show.sync="dismissCountDown"
variant="warning" dismissible
@dismissed="dismissCountdown=0" variant="warning"
@dismiss-count-down="countDownChanged"> fade
Alert will dismiss after <strong>{{dismissCountDown}}</strong> seconds... >
Alert will dismiss after
<strong>{{dismissCountDown}}</strong> seconds...
</CAlert> </CAlert>
<CAlert :show="dismissCountDown" <CAlert :show.sync="dismissCountDown"
dismissible dismissible
variant="info" variant="info"
@dismissed="dismissCountdown=0" >
@dismiss-count-down="countDownChanged">
Alert will dismiss after {{dismissCountDown}} seconds... Alert will dismiss after {{dismissCountDown}} seconds...
<CProgress variant="info" <CProgress variant="info"
:max="dismissSecs" :max="dismissSecs"
@@ -169,8 +191,11 @@ export default {
data () { data () {
return { return {
dismissSecs: 10, dismissSecs: 10,
dismissCountDown: 0, dismissCountDown: 10,
showDismissibleAlert: false dismissibleAlerts: [true, true, true, true, true],
// dismissibleAlert: true,
// dismissibleAlert2: true,
// dismissibleAlert3: true
} }
}, },
methods: { methods: {
@@ -179,6 +204,14 @@ export default {
}, },
showAlert () { showAlert () {
this.dismissCountDown = this.dismissSecs this.dismissCountDown = this.dismissSecs
},
showDismissibleAlerts () {
// this.dismissibleAlert = true
// this.dismissibleAlert2 = true
// this.dismissibleAlert3 = true
this.dismissibleAlerts = this.dismissibleAlerts.map(
alert => alert = true
)
} }
} }
} }
src/views/Widgets.vue → src/views/widgets/Widgets.vue
+33 -65
View File
@@ -91,58 +91,8 @@
</CCol> </CCol>
</CRow><!--/.row--> </CRow><!--/.row-->
<CRow> <Widgets04 noCharts/>
<CCol md="3" sm="6"> <Widgets04/>
<CWidget04 variant="facebook" rightHeader="89k" rightFooter="friends" leftHeader="459" leftFooter="feeds"/>
</CCol>
<CCol md="3" sm="6">
<CWidget04 variant="twitter" rightHeader="973k" rightFooter="followers" leftHeader="1.792" leftFooter="tweets"/>
</CCol>
<CCol md="3" sm="6">
<CWidget04 variant="linkedin" rightHeader="500+" rightFooter="contracts" leftHeader="292" leftFooter="feeds"/>
</CCol>
<CCol md="3" sm="6" class="codeContainer">
<CWidget04 variant='warning' rightHeader='0:57' rightFooter='time' leftHeader='17' leftFooter='percentage'>
<i slot="icon" class="fa fa-battery-1"></i>
</CWidget04>
</CCol>
</CRow><!--/.row-->
<CRow>
<CCol md="3" sm="6">
<CWidget04 variant="facebook" rightHeader="89k" rightFooter="friends" leftHeader="459" leftFooter="feeds">
<CSimpleLineChart chartId="facebook" :data='[65, 59, 84, 84, 51, 55, 40]' label='Friends'
:labels="['January', 'February', 'March', 'April', 'May', 'June', 'July']"
style='height:100px' color='rgba(255,255,255,.1)'/>
</CWidget04>
</CCol>
<CCol md="3" sm="6">
<CWidget04 variant="twitter" rightHeader="973k" rightFooter="followers" leftHeader="1.792" leftFooter="tweets">
<CSimpleLineChart chartId="twitter" :data='[1, 13, 9, 17, 34, 41, 38]' label='Followers'
:labels="['January', 'February', 'March', 'April', 'May', 'June', 'July']"
style='height:100px' color='rgba(255,255,255,.1)'/>
</CWidget04>
</CCol>
<CCol md="3" sm="6">
<CWidget04 variant="linkedin" rightHeader="500+" rightFooter="contracts" leftHeader="292" leftFooter="feeds">
<CSimpleLineChart chartId="linkedIn" :data='[78, 81, 80, 45, 34, 12, 40]' label='Contracts'
:labels="['January', 'February', 'March', 'April', 'May', 'June', 'July']"
style='height:100px' color='rgba(255,255,255,.1)'/>
</CWidget04>
</CCol>
<CCol md="3" sm="6">
<CWidget04 variant='google-plus'
rightHeader='894'
rightFooter='followers'
leftHeader='92' leftFooter='circles'>
<CSimpleLineChart chartId="google-plus"
:data='[35, 23, 56, 22, 97, 23, 64]'
label='Followers'
:labels="['January', 'February', 'March', 'April', 'May', 'June', 'July']"
style='height:100px'
color='rgba(255,255,255,.1)'/>
</CWidget04>
</CCol>
</CRow><!--/.row-->
<CCardGroup class="mb-4"> <CCardGroup class="mb-4">
<CWidget05 iconClasses="icon-people" header="87.500" text="Visitors" variant="info"/> <CWidget05 iconClasses="icon-people" header="87.500" text="Visitors" variant="info"/>
<CWidget05 iconClasses="icon-user-follow" header="385" text="New Clients" variant="success"/> <CWidget05 iconClasses="icon-user-follow" header="385" text="New Clients" variant="success"/>
@@ -202,9 +152,13 @@
<CRow> <CRow>
<CCol sm="6" lg="3"> <CCol sm="6" lg="3">
<CWidget06 header="9.823" text="Members online"> <CWidget06 header="9.823" text="Members online">
<template slot='dropdown'> <template #dropdown>
<CDropdown class="float-right" variant="transparent p-0" right> <CDropdown
<template slot="buttonContent"> class="float-right"
variant="transparent p-0"
placement="bottom-end"
>
<template #buttonContent>
<i class="icon-settings"></i> <i class="icon-settings"></i>
</template> </template>
<CDropdownItem>Action</CDropdownItem> <CDropdownItem>Action</CDropdownItem>
@@ -219,16 +173,26 @@
</CWidget06> </CWidget06>
</CCol> </CCol>
<CCol sm="6" lg="3"> <CCol sm="6" lg="3">
<CWidget06 variant="info" header="9.823" text="Members online"> <CWidget06
<CDropdown slot="dropdown" class="float-right" variant="transparent p-0" right no-caret> variant="info"
<i slot="buttonContent" header="9.823"
class="icon-location-pin" text="Members online"
></i> >
<CDropdownItem>Action</CDropdownItem> <template #dropdown>
<CDropdownItem>Another action</CDropdownItem> <CDropdown
<CDropdownItem>Something else here...</CDropdownItem> class="float-right"
<CDropdownItem disabled>Disabled action</CDropdownItem> variant="transparent p-0"
</CDropdown> right no-caret>
<i slot="buttonContent"
class="icon-location-pin"
></i>
<CDropdownItem>Action</CDropdownItem>
<CDropdownItem>Another action</CDropdownItem>
<CDropdownItem>Something else here...</CDropdownItem>
<CDropdownItem disabled>Disabled action</CDropdownItem>
</CDropdown>
</template>
<CSimplePointedChart class="px-3" <CSimplePointedChart class="px-3"
:data="[1, 18, 9, 17, 34, 22, 11]" :data="[1, 18, 9, 17, 34, 22, 11]"
:labels="['January', 'February', 'March', 'April', 'May', 'June', 'July']" :labels="['January', 'February', 'March', 'April', 'May', 'June', 'July']"
@@ -350,7 +314,11 @@
</template> </template>
<script> <script>
import Widgets04 from './Widgets04'
export default { export default {
name: 'Widgets', name: 'Widgets',
components: {
Widgets04
}
} }
</script> </script>
src/views/widgets/Widgets04.vue
+126
View File
@@ -0,0 +1,126 @@
<template functional>
<CRow>
<template v-if="!props.noCharts">
<CCol md="3" sm="6">
<CWidget04
variant="facebook"
rightHeader="89k"
rightFooter="friends"
leftHeader="459"
leftFooter="feeds"
>
<CSimpleLineChart
chartId="facebook"
:data="[65, 59, 84, 84, 51, 55, 40]"
label="Friends"
:labels="['January', 'February', 'March', 'April', 'May', 'June', 'July']"
style="height:100px"
color="rgba(255,255,255,.1)"
/>
</CWidget04>
</CCol>
<CCol md="3" sm="6">
<CWidget04
variant="twitter"
rightHeader="973k"
rightFooter="followers"
leftHeader="1.792"
leftFooter="tweets"
>
<CSimpleLineChart
chartId="twitter"
:data="[1, 13, 9, 17, 34, 41, 38]"
label="Followers"
:labels="['January', 'February', 'March', 'April', 'May', 'June', 'July']"
style="height:100px"
color="rgba(255,255,255,.1)"
/>
</CWidget04>
</CCol>
<CCol md="3" sm="6">
<CWidget04
variant="linkedin"
rightHeader="500+"
rightFooter="contracts"
leftHeader="292"
leftFooter="feeds"
>
<CSimpleLineChart
chartId="linkedIn"
:data="[78, 81, 80, 45, 34, 12, 40]"
label="Contracts"
:labels="['January', 'February', 'March', 'April', 'May', 'June', 'July']"
style="height:100px"
color="rgba(255,255,255,.1)"
/>
</CWidget04>
</CCol>
<CCol md="3" sm="6">
<CWidget04
variant="google-plus"
rightHeader="894"
rightFooter="followers"
leftHeader="92"
leftFooter="circles"
>
<CSimpleLineChart
chartId="google-plus"
:data="[35, 23, 56, 22, 97, 23, 64]"
label="Followers"
:labels="['January', 'February', 'March', 'April', 'May', 'June', 'July']"
style="height:100px"
color="rgba(255,255,255,.1)"
/>
</CWidget04>
</CCol>
</template>
<template v-else>
<CCol md="3" sm="6">
<CWidget04
variant="facebook"
rightHeader="89k"
rightFooter="friends"
leftHeader="459"
leftFooter="feeds"
/>
</CCol>
<CCol md="3" sm="6">
<CWidget04
variant="twitter"
rightHeader="973k"
rightFooter="followers"
leftHeader="1.792"
leftFooter="tweets"
/>
</CCol>
<CCol md="3" sm="6">
<CWidget04
variant="linkedin"
rightHeader="500+"
rightFooter="contracts"
leftHeader="292"
leftFooter="feeds"
/>
</CCol>
<CCol md="3" sm="6">
<CWidget04
variant="warning"
iconClasses="fa fa-battery-1"
rightHeader="0:57"
rightFooter="time"
leftHeader="17"
leftFooter="percentage"
/>
</CCol>
</template>
</CRow>
</template>
<script>
export default {
name: 'Widgets04',
props: {
noCharts: Boolean
}
}
</script>
src/views/widgets/Widgets06.vue
+130
View File
@@ -0,0 +1,130 @@
<template>
<CRow>
<CCol sm="6" lg="3">
<CWidget06 header="9.823" text="Members online">
<template #dropdown>
<CDropdown
class="float-right"
variant="transparent p-0"
placement="bottom-end"
buttonContent="<i class='icon-settings'></i>"
>
<CDropdownItem>Action</CDropdownItem>
<CDropdownItem>Another action</CDropdownItem>
<CDropdownItem>Something else here...</CDropdownItem>
<CDropdownItem disabled>Disabled action</CDropdownItem>
</CDropdown>
</template>
<CSimplePointedChart
class="px-3"
:data="[65, 59, 84, 84, 51, 55, 40]"
:labels="months"
style="height:70px"
label="Members"
pointHoverColor="primary"
/>
</CWidget06>
</CCol>
<CCol sm="6" lg="3">
<CWidget06 variant="info" header="9.823" text="Members online">
<template #dropdown>
<CDropdown
class="float-right"
variant="transparent p-0"
placement="bottom-end"
noCaret
buttonContent="<i class='icon-location-pin'></i>"
>
<CDropdownItem>Action</CDropdownItem>
<CDropdownItem>Another action</CDropdownItem>
<CDropdownItem>Something else here...</CDropdownItem>
<CDropdownItem disabled>Disabled action</CDropdownItem>
</CDropdown>
</template>
<CSimplePointedChart
class="px-3"
:data="[1, 18, 9, 17, 34, 22, 11]"
:labels="months"
style="height:70px"
label="Members"
:options="{ elements: { line: { tension: 0.00001 }}}"
pointHoverColor="info"
/>
</CWidget06>
</CCol>
<CCol sm="6" lg="3">
<CWidget06
variant="warning"
header="9.823"
text="Members online"
>
<template #dropdown>
<CDropdown
class="float-right"
variant="transparent p-0"
placement="bottom-end"
buttonContent="<i class='icon-settings'></i>"
>
<CDropdownItem>Action</CDropdownItem>
<CDropdownItem>Another action</CDropdownItem>
<CDropdownItem>Something else here...</CDropdownItem>
<CDropdownItem disabled>Disabled action</CDropdownItem>
</CDropdown>
</template>
<CSimpleLineChart
chartId="CWidget06_3"
:data="[78, 81, 80, 45, 34, 12, 40]"
:labels="months"
style="height:70px"
color="rgba(255,255,255,.2)"
label="Members"
:options="{elements: {line: {borderWidth: 2.5}}}"
pointHoverColor="warning"
/>
</CWidget06>
</CCol>
<CCol sm="6" lg="3">
<CWidget06
variant="danger"
header="9.823"
text="Members online"
>
<template #dropdown>
<CDropdown
class="float-right"
variant="transparent p-0"
placement="bottom-end"
buttonContent="<i class='icon-settings'></i>"
>
<CDropdownItem>Action</CDropdownItem>
<CDropdownItem>Another action</CDropdownItem>
<CDropdownItem>Something else here...</CDropdownItem>
<CDropdownItem disabled>Disabled action</CDropdownItem>
</CDropdown>
</template>
<CSimpleBarChart
chartId="CWidget06_4"
:data="[10, 22, 34, 46, 58, 70, 46, 23, 45, 78, 34, 12]"
label="Members"
color="rgb(250, 152, 152)"
style="height:70px"
/>
</CWidget06>
</CCol>
</CRow>
</template>
<script>
export default {
name: 'Widgets06',
props: {
months: ['January', 'February', 'March', 'April', 'May', 'June', 'July']
}
}
</script>