v1.0.0
This commit is contained in:
@@ -9,14 +9,16 @@ export default {
|
||||
</script>
|
||||
|
||||
<style>
|
||||
// Import Font Awesome Icons Set
|
||||
$fa-font-path: "~font-awesome/fonts/";
|
||||
@import "~font-awesome/css/font-awesome.min.css";
|
||||
// Import Simple Line Icons Set
|
||||
$simple-line-font-path: "~simple-line-icons/fonts/";
|
||||
@import "~simple-line-icons/css/simple-line-icons.css";
|
||||
/* Import Font Awesome Icons Set */
|
||||
$fa-font-path: '~font-awesome/fonts/';
|
||||
@import '~font-awesome/css/font-awesome.min.css';
|
||||
/* Import Simple Line Icons Set */
|
||||
$simple-line-font-path: '~simple-line-icons/fonts/';
|
||||
@import '~simple-line-icons/css/simple-line-icons.css';
|
||||
/* Import Bootstrap Vue Styles */
|
||||
@import '~bootstrap-vue/dist/bootstrap-vue.css';
|
||||
</style>
|
||||
<style lang="scss">
|
||||
// Import Main styles for this application
|
||||
@import "./scss/style";
|
||||
@import './scss/style';
|
||||
</style>
|
||||
|
||||
@@ -1,9 +1,11 @@
|
||||
<template>
|
||||
<div class="sidebar">
|
||||
<SidebarHeader/>
|
||||
<SidebarForm/>
|
||||
<nav class="sidebar-nav">
|
||||
<div slot="header"></div>
|
||||
<ul class="nav">
|
||||
<li class="nav-item" v-for="(item, index) in navItems">
|
||||
<template v-for="(item, index) in navItems">
|
||||
<template v-if="item.title">
|
||||
<SidebarNavTitle :name="item.name" :classes="item.class" :wrapper="item.wrapper"/>
|
||||
</template>
|
||||
@@ -12,35 +14,42 @@
|
||||
</template>
|
||||
<template v-else>
|
||||
<template v-if="item.children">
|
||||
<!-- First level dropdown -->
|
||||
<SidebarNavDropdown :name="item.name" :url="item.url" :icon="item.icon">
|
||||
<template v-for="(child, index) in item.children">
|
||||
<template v-if="child.children">
|
||||
<SidebarNavDropdown :name="child.name" :url="child.url" :icon="child.icon">
|
||||
<li class="nav-item" v-for="(child, index) in item.children">
|
||||
<SidebarNavLink :name="child.name" :url="child.url" :icon="child.icon" :badge="child.badge"/>
|
||||
<template v-for="(childL1, index) in item.children">
|
||||
<template v-if="childL1.children">
|
||||
<!-- Second level dropdown -->
|
||||
<SidebarNavDropdown :name="childL1.name" :url="childL1.url" :icon="childL1.icon">
|
||||
<li class="nav-item" v-for="(childL2, index) in childL1.children">
|
||||
<SidebarNavLink :name="childL2.name" :url="childL2.url" :icon="childL2.icon" :badge="childL2.badge"/>
|
||||
</li>
|
||||
</SidebarNavDropdown>
|
||||
</template>
|
||||
<template v-else>
|
||||
<li class="nav-item">
|
||||
<SidebarNavLink :name="child.name" :url="child.url" :icon="child.icon" :badge="child.badge"/>
|
||||
<SidebarNavLink :name="childL1.name" :url="childL1.url" :icon="childL1.icon" :badge="childL1.badge"/>
|
||||
</li>
|
||||
</template>
|
||||
</template>
|
||||
</SidebarNavDropdown>
|
||||
</template>
|
||||
<template v-else>
|
||||
<SidebarNavLink :name="item.name" :url="item.url" :icon="item.icon" :badge="item.badge"/>
|
||||
<li class="nav-item">
|
||||
<SidebarNavLink :name="item.name" :url="item.url" :icon="item.icon" :badge="item.badge"/>
|
||||
</li>
|
||||
</template>
|
||||
</template>
|
||||
</li>
|
||||
</template>
|
||||
</ul>
|
||||
<slot></slot>
|
||||
<div slot="footer"></div>
|
||||
</nav>
|
||||
<SidebarFooter/>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import SidebarFooter from './SidebarFooter'
|
||||
import SidebarForm from './SidebarForm'
|
||||
import SidebarHeader from './SidebarHeader'
|
||||
import SidebarNavDropdown from './SidebarNavDropdown'
|
||||
import SidebarNavLink from './SidebarNavLink'
|
||||
import SidebarNavTitle from './SidebarNavTitle'
|
||||
@@ -54,6 +63,9 @@ export default {
|
||||
}
|
||||
},
|
||||
components: {
|
||||
SidebarFooter,
|
||||
SidebarForm,
|
||||
SidebarHeader,
|
||||
SidebarNavDropdown,
|
||||
SidebarNavLink,
|
||||
SidebarNavTitle
|
||||
|
||||
@@ -0,0 +1,9 @@
|
||||
<template>
|
||||
<!-- <div class="sidebar-footer"></div> -->
|
||||
</template>
|
||||
<script>
|
||||
|
||||
export default {
|
||||
name: 'sidebar-footer'
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,9 @@
|
||||
<template>
|
||||
<!-- <div class="sidebar-form"></div> -->
|
||||
</template>
|
||||
<script>
|
||||
|
||||
export default {
|
||||
name: 'sidebar-form'
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,9 @@
|
||||
<template>
|
||||
<!-- <div class="sidebar-header"></div> -->
|
||||
</template>
|
||||
<script>
|
||||
|
||||
export default {
|
||||
name: 'sidebar-header'
|
||||
}
|
||||
</script>
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<router-link :to="url" class="nav-link">
|
||||
<i :class="icon"></i> {{name}}
|
||||
<b-badge :variant="badge.variant">{{badge.text}}</b-badge>
|
||||
<b-badge v-if="badge.text" :variant="badge.variant">{{badge.text}}</b-badge>
|
||||
</router-link>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<div class="animated fadeIn">
|
||||
<div class="row">
|
||||
<div class="col-sm-6 col-lg-3">
|
||||
<b-card class="bg-primary" :no-block="true">
|
||||
<b-card class="bg-primary" :no-body="true">
|
||||
<div class="card-body pb-0">
|
||||
<b-dropdown class="float-right" variant="transparent p-0" right>
|
||||
<template slot="button-content">
|
||||
@@ -20,7 +20,7 @@
|
||||
</b-card>
|
||||
</div><!--/.col-->
|
||||
<div class="col-sm-6 col-lg-3">
|
||||
<b-card class="bg-info" :no-block="true">
|
||||
<b-card class="bg-info" :no-body="true">
|
||||
<div class="card-body pb-0">
|
||||
<b-dropdown class="float-right" variant="transparent p-0" right>
|
||||
<template slot="button-content">
|
||||
@@ -38,7 +38,7 @@
|
||||
</b-card>
|
||||
</div><!--/.col-->
|
||||
<div class="col-sm-6 col-lg-3">
|
||||
<b-card class="bg-warning" :no-block="true">
|
||||
<b-card class="bg-warning" :no-body="true">
|
||||
<div class="card-body pb-0">
|
||||
<b-dropdown class="float-right" variant="transparent p-0" right>
|
||||
<template slot="button-content">
|
||||
@@ -56,7 +56,7 @@
|
||||
</b-card>
|
||||
</div><!--/.col-->
|
||||
<div class="col-sm-6 col-lg-3">
|
||||
<b-card class="bg-danger" :no-block="true">
|
||||
<b-card class="bg-danger" :no-body="true">
|
||||
<div class="card-body pb-0">
|
||||
<b-dropdown class="float-right" variant="transparent p-0" right>
|
||||
<template slot="button-content">
|
||||
|
||||
@@ -70,7 +70,7 @@
|
||||
</div><!--/.row-->
|
||||
<div class="row">
|
||||
<div class="col-6 col-lg-3">
|
||||
<b-card no-block>
|
||||
<b-card :no-body="true">
|
||||
<div class="card-body p-3 clearfix">
|
||||
<i class="fa fa-cogs bg-primary p-3 font-2xl mr-3 float-left"></i>
|
||||
<div class="h5 text-primary mb-0 mt-2">$1.999,50</div>
|
||||
@@ -79,7 +79,7 @@
|
||||
</b-card>
|
||||
</div><!--/.col-->
|
||||
<div class="col-6 col-lg-3">
|
||||
<b-card no-block>
|
||||
<b-card :no-body="true">
|
||||
<div class="card-body p-3 clearfix">
|
||||
<i class="fa fa-laptop bg-info p-3 font-2xl mr-3 float-left"></i>
|
||||
<div class="h5 text-info mb-0 mt-2">$1.999,50</div>
|
||||
@@ -88,7 +88,7 @@
|
||||
</b-card>
|
||||
</div><!--/.col-->
|
||||
<div class="col-6 col-lg-3">
|
||||
<b-card no-block>
|
||||
<b-card :no-body="true">
|
||||
<div class="card-body p-3 clearfix">
|
||||
<i class="fa fa-moon-o bg-warning p-3 font-2xl mr-3 float-left"></i>
|
||||
<div class="h5 text-warning mb-0 mt-2">$1.999,50</div>
|
||||
@@ -97,7 +97,7 @@
|
||||
</b-card>
|
||||
</div><!--/.col-->
|
||||
<div class="col-6 col-lg-3">
|
||||
<b-card no-block>
|
||||
<b-card :no-body="true">
|
||||
<div class="card-body p-3 clearfix">
|
||||
<i class="fa fa-bell bg-danger p-3 font-2xl mr-3 float-left"></i>
|
||||
<div class="h5 text-danger mb-0 mt-2">$1.999,50</div>
|
||||
@@ -106,7 +106,7 @@
|
||||
</b-card>
|
||||
</div><!--/.col-->
|
||||
<div class="col-6 col-lg-3">
|
||||
<b-card no-block footer-class="px-3 py-2">
|
||||
<b-card :no-body="true" footer-class="px-3 py-2">
|
||||
<div class="card-body p-3 clearfix">
|
||||
<i class="fa fa-cogs bg-primary p-3 font-2xl mr-3 float-left"></i>
|
||||
<div class="h5 text-primary mb-0 mt-2">$1.999,50</div>
|
||||
@@ -118,7 +118,7 @@
|
||||
</b-card>
|
||||
</div><!--/.col-->
|
||||
<div class="col-6 col-lg-3">
|
||||
<b-card no-block footer-class="px-3 py-2">
|
||||
<b-card :no-body="true" footer-class="px-3 py-2">
|
||||
<div class="card-body p-3 clearfix">
|
||||
<i class="fa fa-laptop bg-info p-3 font-2xl mr-3 float-left"></i>
|
||||
<div class="h5 text-info mb-0 mt-2">$1.999,50</div>
|
||||
@@ -130,7 +130,7 @@
|
||||
</b-card>
|
||||
</div><!--/.col-->
|
||||
<div class="col-6 col-lg-3">
|
||||
<b-card no-block footer-class="px-3 py-2">
|
||||
<b-card :no-body="true" footer-class="px-3 py-2">
|
||||
<div class="card-body p-3 clearfix">
|
||||
<i class="fa fa-moon-o bg-warning p-3 font-2xl mr-3 float-left"></i>
|
||||
<div class="h5 text-warning mb-0 mt-2">$1.999,50</div>
|
||||
@@ -142,7 +142,7 @@
|
||||
</b-card>
|
||||
</div><!--/.col-->
|
||||
<div class="col-6 col-lg-3">
|
||||
<b-card no-block footer-class="px-3 py-2">
|
||||
<b-card :no-body="true" footer-class="px-3 py-2">
|
||||
<div class="card-body p-3 clearfix">
|
||||
<i class="fa fa-bell bg-danger p-3 font-2xl mr-3 float-left"></i>
|
||||
<div class="h5 text-danger mb-0 mt-2">$1.999,50</div>
|
||||
@@ -156,7 +156,7 @@
|
||||
</div><!--/.row-->
|
||||
<div class="row">
|
||||
<div class="col-6 col-lg-3">
|
||||
<b-card no-block>
|
||||
<b-card :no-body="true">
|
||||
<div class="card-body p-0 clearfix">
|
||||
<i class="fa fa-cogs bg-primary p-4 font-2xl mr-3 float-left"></i>
|
||||
<div class="h5 text-primary mb-0 pt-3">$1.999,50</div>
|
||||
@@ -165,7 +165,7 @@
|
||||
</b-card>
|
||||
</div><!--/.col-->
|
||||
<div class="col-6 col-lg-3">
|
||||
<b-card no-block>
|
||||
<b-card :no-body="true">
|
||||
<div class="card-body p-0 clearfix">
|
||||
<i class="fa fa-laptop bg-info p-4 font-2xl mr-3 float-left"></i>
|
||||
<div class="h5 text-info mb-0 pt-3">$1.999,50</div>
|
||||
@@ -174,7 +174,7 @@
|
||||
</b-card>
|
||||
</div><!--/.col-->
|
||||
<div class="col-6 col-lg-3">
|
||||
<b-card no-block>
|
||||
<b-card :no-body="true">
|
||||
<div class="card-body p-0 clearfix">
|
||||
<i class="fa fa-moon-o bg-warning p-4 font-2xl mr-3 float-left"></i>
|
||||
<div class="h5 text-warning mb-0 pt-3">$1.999,50</div>
|
||||
@@ -183,7 +183,7 @@
|
||||
</b-card>
|
||||
</div><!--/.col-->
|
||||
<div class="col-6 col-lg-3">
|
||||
<b-card no-block>
|
||||
<b-card :no-body="true">
|
||||
<div class="card-body p-0 clearfix">
|
||||
<i class="fa fa-bell bg-danger p-4 font-2xl mr-3 float-left"></i>
|
||||
<div class="h5 text-danger mb-0 pt-3">$1.999,50</div>
|
||||
@@ -192,7 +192,7 @@
|
||||
</b-card>
|
||||
</div><!--/.col-->
|
||||
<div class="col-6 col-lg-3">
|
||||
<b-card no-block>
|
||||
<b-card :no-body="true">
|
||||
<div class="card-body p-0 clearfix">
|
||||
<i class="fa fa-cogs bg-primary p-4 px-5 font-2xl mr-3 float-left"></i>
|
||||
<div class="h5 text-primary mb-0 pt-3">$1.999,50</div>
|
||||
@@ -201,7 +201,7 @@
|
||||
</b-card>
|
||||
</div><!--/.col-->
|
||||
<div class="col-6 col-lg-3">
|
||||
<b-card no-block>
|
||||
<b-card :no-body="true">
|
||||
<div class="card-body p-0 clearfix">
|
||||
<i class="fa fa-laptop bg-info p-4 px-5 font-2xl mr-3 float-left"></i>
|
||||
<div class="h5 text-info mb-0 pt-3">$1.999,50</div>
|
||||
@@ -210,7 +210,7 @@
|
||||
</b-card>
|
||||
</div><!--/.col-->
|
||||
<div class="col-6 col-lg-3">
|
||||
<b-card no-block>
|
||||
<b-card :no-body="true">
|
||||
<div class="card-body p-0 clearfix">
|
||||
<i class="fa fa-moon-o bg-warning p-4 px-5 font-2xl mr-3 float-left"></i>
|
||||
<div class="h5 text-warning mb-0 pt-3">$1.999,50</div>
|
||||
@@ -219,7 +219,7 @@
|
||||
</b-card>
|
||||
</div><!--/.col-->
|
||||
<div class="col-6 col-lg-3">
|
||||
<b-card no-block>
|
||||
<b-card :no-body="true">
|
||||
<div class="card-body p-0 clearfix">
|
||||
<i class="fa fa-bell bg-danger p-4 px-5 font-2xl mr-3 float-left"></i>
|
||||
<div class="h5 text-danger mb-0 pt-3">$1.999,50</div>
|
||||
|
||||
@@ -94,7 +94,7 @@
|
||||
label="Static"
|
||||
:label-cols="3"
|
||||
:horizontal="true">
|
||||
<b-form-input-static type="text" value="Username"></b-form-input-static>
|
||||
<b-form-input plaintext type="text" value="Username"></b-form-input>
|
||||
</b-form-fieldset>
|
||||
<b-form-fieldset
|
||||
description="This is a help text"
|
||||
|
||||
Reference in New Issue
Block a user