mirror of
https://github.com/crater-invoice/crater.git
synced 2025-10-31 05:31:10 -04:00
init crater
This commit is contained in:
Mohit Panjwani
83
resources/assets/js/views/layouts/LayoutBasic.vue
Normal file
83
resources/assets/js/views/layouts/LayoutBasic.vue
Normal file
@ -0,0 +1,83 @@
|
||||
<template>
|
||||
<div class="template-container" v-if="isAppLoaded">
|
||||
<base-modal />
|
||||
<site-header/>
|
||||
<site-sidebar type="basic"/>
|
||||
|
||||
<transition
|
||||
name="fade"
|
||||
mode="out-in">
|
||||
<router-view />
|
||||
</transition>
|
||||
<site-footer/>
|
||||
</div>
|
||||
<div v-else class="template-container">
|
||||
<font-awesome-icon icon="spinner" class="fa-spin"/>
|
||||
</div>
|
||||
</template>
|
||||
<script type="text/babel">
|
||||
import SiteHeader from './partials/TheSiteHeader.vue'
|
||||
import SiteFooter from './partials/TheSiteFooter.vue'
|
||||
import SiteSidebar from './partials/TheSiteSidebar.vue'
|
||||
import Layout from '../../helpers/layout'
|
||||
import BaseModal from '../../components/base/modal/BaseModal'
|
||||
import { mapActions, mapGetters } from 'vuex'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
SiteHeader, SiteSidebar, SiteFooter, BaseModal
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
'header': 'header'
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'isAppLoaded'
|
||||
]),
|
||||
|
||||
...mapGetters('company', {
|
||||
selectedCompany: 'getSelectedCompany',
|
||||
companies: 'getCompanies'
|
||||
}),
|
||||
|
||||
isShow () {
|
||||
return true
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
Layout.set('layout-default')
|
||||
},
|
||||
|
||||
created() {
|
||||
this.bootstrap().then((res) => {
|
||||
this.setInitialCompany()
|
||||
})
|
||||
},
|
||||
|
||||
methods: {
|
||||
...mapActions(['bootstrap']),
|
||||
...mapActions('company', ['setSelectedCompany']),
|
||||
setInitialCompany() {
|
||||
let selectedCompany = Ls.get('selectedCompany') !== null
|
||||
|
||||
if (selectedCompany) {
|
||||
let foundCompany = this.companies.find((company) => company.id === parseInt(selectedCompany))
|
||||
|
||||
if (foundCompany) {
|
||||
this.setSelectedCompany(foundCompany)
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
this.setSelectedCompany(this.companies[0])
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
body {
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
</style>
|
||||
55
resources/assets/js/views/layouts/LayoutLogin.vue
Normal file
55
resources/assets/js/views/layouts/LayoutLogin.vue
Normal file
@ -0,0 +1,55 @@
|
||||
<template>
|
||||
<div class="login-page login-3">
|
||||
<div class="site-wrapper">
|
||||
<div class="login-box">
|
||||
<div class="box-wrapper">
|
||||
<div class="logo-main">
|
||||
<a href="/admin">
|
||||
<img
|
||||
src="/assets/img/crater-logo.png"
|
||||
alt="Crater Logo">
|
||||
</a>
|
||||
</div>
|
||||
<router-view></router-view>
|
||||
<div class="page-copyright">
|
||||
<p>{{ $t('layout_login.copyright_crater') }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content-box">
|
||||
<h1>{{ $t('layout_login.super_simple_invoicing') }}<br>
|
||||
{{ $t('layout_login.for_freelancer') }}<br>
|
||||
{{ $t('layout_login.small_businesses') }} <br>
|
||||
</h1>
|
||||
|
||||
<p>
|
||||
{{ $t('layout_login.crater_help') }}<br>
|
||||
{{ $t('layout_login.invoices_and_estimates') }}<br>
|
||||
</p>
|
||||
|
||||
<div class="content-bottom"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script type="text/babel">
|
||||
export default {
|
||||
watch: {
|
||||
$route: 'onRouteChange'
|
||||
},
|
||||
mounted () {
|
||||
this.setLayoutClasses()
|
||||
},
|
||||
methods: {
|
||||
setLayoutClasses () {
|
||||
let body = $('body')
|
||||
body.removeClass()
|
||||
body.addClass('login-page login-1 skin-crater')
|
||||
}
|
||||
},
|
||||
onRouteChange () {
|
||||
$('body').removeClass('login-page')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
27
resources/assets/js/views/layouts/LayoutWizard.vue
Normal file
27
resources/assets/js/views/layouts/LayoutWizard.vue
Normal file
@ -0,0 +1,27 @@
|
||||
<template>
|
||||
<div class="site-wrapper">
|
||||
<div class="container">
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script type="text/babel">
|
||||
export default {
|
||||
watch: {
|
||||
$route: 'onRouteChange'
|
||||
},
|
||||
mounted () {
|
||||
this.setLayoutBackground()
|
||||
},
|
||||
|
||||
destroyed () {
|
||||
document.body.style.backgroundColor = '#EBF1FA'
|
||||
},
|
||||
methods: {
|
||||
setLayoutBackground () {
|
||||
document.body.style.backgroundColor = '#f9fbff'
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
21
resources/assets/js/views/layouts/partials/TheSiteFooter.vue
Normal file
21
resources/assets/js/views/layouts/partials/TheSiteFooter.vue
Normal file
@ -0,0 +1,21 @@
|
||||
<template>
|
||||
<footer class="site-footer">
|
||||
<div class="text-right">
|
||||
{{ $t('general.powered_by') }}
|
||||
<a
|
||||
href="http://bytefury.com/"
|
||||
target="_blank">{{ $t('general.bytefury') }}
|
||||
</a>
|
||||
</div>
|
||||
</footer>
|
||||
</template>
|
||||
|
||||
<script type="text/babel">
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
footer: 'footer'
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
98
resources/assets/js/views/layouts/partials/TheSiteHeader.vue
Normal file
98
resources/assets/js/views/layouts/partials/TheSiteHeader.vue
Normal file
@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<header class="site-header">
|
||||
<a href="/" class="brand-main">
|
||||
<img
|
||||
id="logo-white"
|
||||
src="/assets/img/logo-white.png"
|
||||
alt="Crater Logo"
|
||||
class="d-none d-md-inline"
|
||||
>
|
||||
<img
|
||||
id="logo-mobile"
|
||||
src="/assets/img/crater-white-small.png"
|
||||
alt="Laraspace Logo"
|
||||
class="d-md-none">
|
||||
</a>
|
||||
|
||||
<a
|
||||
href="#"
|
||||
class="nav-toggle"
|
||||
@click="onNavToggle"
|
||||
>
|
||||
<div class="hamburger hamburger--arrowturn">
|
||||
<div class="hamburger-box">
|
||||
<div class="hamburger-inner"/>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<ul class="action-list">
|
||||
<li>
|
||||
<v-dropdown :show-arrow="false">
|
||||
<a slot="activator" href="#">
|
||||
<font-awesome-icon icon="plus" />
|
||||
</a>
|
||||
<v-dropdown-item>
|
||||
<router-link class="dropdown-item" to="/admin/invoices/create">
|
||||
<font-awesome-icon icon="file-alt" class="dropdown-item-icon" /> <span> {{ $t('invoices.new_invoice') }} </span>
|
||||
</router-link>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<router-link class="dropdown-item" to="/admin/estimates/create">
|
||||
<font-awesome-icon class="dropdown-item-icon" icon="file" /> <span> {{ $t('estimates.new_estimate') }} </span>
|
||||
</router-link>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<router-link class="dropdown-item" to="/admin/customers/create">
|
||||
<font-awesome-icon class="dropdown-item-icon" icon="user" /> <span> {{ $t('customers.new_customer') }} </span>
|
||||
</router-link>
|
||||
</v-dropdown-item>
|
||||
</v-dropdown>
|
||||
</li>
|
||||
<li>
|
||||
<v-dropdown :show-arrow="false">
|
||||
<a
|
||||
slot="activator"
|
||||
href="#"
|
||||
data-toggle="dropdown"
|
||||
aria-haspopup="true"
|
||||
aria-expanded="false"
|
||||
class="avatar"
|
||||
>
|
||||
<img src="/images/avatar.png" alt="Avatar">
|
||||
</a>
|
||||
<v-dropdown-item>
|
||||
<router-link class="dropdown-item" to="/admin/settings">
|
||||
<font-awesome-icon icon="cogs" class="dropdown-item-icon"/> <span> {{ $t('navigation.settings') }} </span>
|
||||
</router-link>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<a
|
||||
href="#"
|
||||
class="dropdown-item"
|
||||
@click.prevent="logout"
|
||||
>
|
||||
<font-awesome-icon icon="sign-out-alt" class="dropdown-item-icon"/> <span> {{ $t('navigation.logout') }} </span>
|
||||
</a>
|
||||
</v-dropdown-item>
|
||||
</v-dropdown>
|
||||
</li>
|
||||
</ul>
|
||||
</header>
|
||||
</template>
|
||||
<script type="text/babel">
|
||||
import { mapGetters, mapActions } from 'vuex'
|
||||
|
||||
export default {
|
||||
methods: {
|
||||
...mapActions({
|
||||
companySelect: 'changeCompany'
|
||||
}),
|
||||
...mapActions('auth', [
|
||||
'logout'
|
||||
]),
|
||||
onNavToggle () {
|
||||
this.$utils.toggleSidebar()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,459 @@
|
||||
<template>
|
||||
<div class="header-bottom">
|
||||
<div class="header-nav vue-dropdown-menu">
|
||||
<v-dropdown active-url="/admin/dashboard">
|
||||
<template slot="title">
|
||||
<a href="#">
|
||||
<i class="icon-fa icon-fa-dashboard"/>{{ $t('navigation.dashboard') }}
|
||||
<span class="icon-fa arrow icon-fa-fw"/>
|
||||
</a>
|
||||
</template>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/dashboard/basic">
|
||||
Basic
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/dashboard/ecommerce">
|
||||
Ecommerce
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/dashboard/finance">
|
||||
Finance
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
</v-dropdown>
|
||||
<v-dropdown active-url="/admin/layouts">
|
||||
<template slot="title">
|
||||
<a href="#">
|
||||
<i class="icon-fa icon-fa-th-large"/>Layouts
|
||||
<span class="icon-fa arrow icon-fa-fw"/>
|
||||
</a>
|
||||
</template>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/layouts/sidebar">
|
||||
Sidebar
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/layouts/horizontal">
|
||||
Horizontal
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/layouts/icons-sidebar">
|
||||
Icon Sidebar
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
</v-dropdown>
|
||||
<v-dropdown active-url="/admin/basic-ui">
|
||||
<template slot="title">
|
||||
<a href="#">
|
||||
<i class="icon-fa icon-fa-star"/>Basic UI
|
||||
<span class="icon-fa arrow icon-fa-fw"/>
|
||||
</a>
|
||||
</template>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/basic-ui/buttons">
|
||||
Buttons
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/basic-ui/cards">
|
||||
Cards
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/basic-ui/tabs">
|
||||
Tabs & Accordians
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/basic-ui/typography">
|
||||
Typography
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/basic-ui/tables">
|
||||
Tables
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/basic-ui/modals">
|
||||
Modals
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/basic-ui/progress-bars">
|
||||
Progress Bar
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
</v-dropdown>
|
||||
<v-dropdown active-url="/admin/components">
|
||||
<template slot="title">
|
||||
<a href="#">
|
||||
<i class="icon-fa icon-fa-puzzle-piece"/>Components
|
||||
<span class="icon-fa arrow icon-fa-fw"/>
|
||||
</a>
|
||||
</template>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/components/calendar">
|
||||
Calendar
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/components/datatables">
|
||||
Jquery Datatables
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/components/mail-box">
|
||||
MailBox
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/components/calendar">
|
||||
Calendar
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/components/datatables">
|
||||
Jquery Datatables
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/components/image-cropper">
|
||||
ImageCropper
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/components/image-zoom">
|
||||
ImageZoom
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/components/nestable-list">
|
||||
Nestable List
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/components/nestable-tree">
|
||||
Nestable Tree
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/components/notifications">
|
||||
Notifications
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown active-url="/admin/layouts">
|
||||
<template slot="title">
|
||||
<a href="#">
|
||||
<i class="icon-fa icon-fa-th-large"/>Layouts
|
||||
<span class="icon-fa arrow icon-fa-fw"/>
|
||||
</a>
|
||||
</template>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/layouts/sidebar">
|
||||
Sidebar
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/layouts/horizontal">
|
||||
Horizontal
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
</v-dropdown>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/components/sweet-modals">
|
||||
Sweet Modals
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/components/image-zoom">
|
||||
ImageZoom
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/components/mail-box">
|
||||
MailBox
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
</v-dropdown>
|
||||
<v-dropdown active-url="/admin/chart">
|
||||
<template slot="title">
|
||||
<a href="#">
|
||||
<i class="icon-fa icon-fa-bar-chart"/>Charts
|
||||
<span class="icon-fa arrow icon-fa-fw"/>
|
||||
</a>
|
||||
</template>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/charts/amchart">
|
||||
AM Charts
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/charts/chartjs">
|
||||
Chart JS
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/charts/gauge">
|
||||
Gauges
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/charts/morris">
|
||||
Morris
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/charts/sparkline">
|
||||
Sparkline
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
</v-dropdown>
|
||||
<v-dropdown active-url="/admin/icons">
|
||||
<template slot="title">
|
||||
<a href="#">
|
||||
<i class="icon-fa icon-fa-eye"/>Icons
|
||||
<span class="icon-fa arrow icon-fa-fw"/>
|
||||
</a>
|
||||
</template>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/icons/icomoon">
|
||||
IcoMoon
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/icons/fontawesome">
|
||||
Font Awesome
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
</v-dropdown>
|
||||
<v-dropdown active-url="/admin/forms">
|
||||
<template slot="title">
|
||||
<a href="#">
|
||||
<i class="icon-fa icon-fa-rocket"/>Form
|
||||
<span class="icon-fa arrow icon-fa-fw"/>
|
||||
</a>
|
||||
</template>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/forms/general">
|
||||
General Elements
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/forms/advanced">
|
||||
Advanced Elements
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item><v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/forms/layouts">
|
||||
Form Layouts
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/forms/validation">
|
||||
Form Validation
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/forms/wizards">
|
||||
Form Wizard
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/forms/wizards-2">
|
||||
Form Wizard 2
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/forms/wizards-3">
|
||||
Form Wizard 3
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/forms/editors">
|
||||
Editors
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/forms/vee">
|
||||
Vee Validate
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/forms/vuelidate">
|
||||
Vuelidate
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
</v-dropdown>
|
||||
<v-dropdown active-url="/admin/gallery">
|
||||
<template slot="title">
|
||||
<a href="#">
|
||||
<i class="icon-fa icon-fa-image"/>Gallery
|
||||
<span class="icon-fa arrow icon-fa-fw"/>
|
||||
</a>
|
||||
</template>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/gallery/grid">
|
||||
Grid
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/gallery/masonry-grid">
|
||||
Masonry Grid
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
</v-dropdown>
|
||||
<v-dropdown active-url="/admin/users">
|
||||
<template slot="title">
|
||||
<a href="#">
|
||||
<i class="icon-fa icon-fa-user"/>Users
|
||||
<span class="icon-fa arrow icon-fa-fw"/>
|
||||
</a>
|
||||
</template>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/users/profile">
|
||||
Profile
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
<v-dropdown-item>
|
||||
<template slot="item-title">
|
||||
<router-link to="/admin/users">
|
||||
All Users
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown-item>
|
||||
</v-dropdown>
|
||||
<v-dropdown active-url="/admin/todo-item">
|
||||
<template slot="title">
|
||||
<router-link to="/admin/todo-item">
|
||||
<i class="icon-fa icon-fa-check"/>Todos
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown>
|
||||
<v-dropdown active-url="/admin/settings">
|
||||
<template slot="title">
|
||||
<router-link to="/admin/settings">
|
||||
<i class="icon-fa icon-fa-cogs"/>Settings
|
||||
</router-link>
|
||||
</template>
|
||||
</v-dropdown>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script type="text/babel">
|
||||
import VDropdown from '../../../components/dropdown/VDropdown'
|
||||
import VDropdownItem from '../../../components/dropdown/VDropdownItem'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
VDropdown,
|
||||
VDropdownItem
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
sidebar: 'sidebar'
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,96 @@
|
||||
<template>
|
||||
<div class="sidebar-left">
|
||||
<div class="sidebar-body scroll-pane">
|
||||
<div class="side-nav">
|
||||
<div
|
||||
v-for="(menuItems, index) in menu"
|
||||
:key="index"
|
||||
class="menu-group"
|
||||
>
|
||||
<router-link
|
||||
v-for="(item, index1) in menuItems"
|
||||
:key="index1"
|
||||
:to="item.route"
|
||||
class="menu-item"
|
||||
@click.native="Toggle"
|
||||
>
|
||||
<font-awesome-icon :icon="item.icon" class="icon menu-icon" /> <span class="ml-3 menu-text">{{ $t(item.title) }}</span>
|
||||
</router-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script type="text/babel">
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
sidebar: 'sidebar',
|
||||
menu: [
|
||||
|
||||
[
|
||||
{
|
||||
title: 'navigation.dashboard',
|
||||
icon: 'tachometer-alt',
|
||||
route: '/admin/dashboard'
|
||||
},
|
||||
{
|
||||
title: 'navigation.customers',
|
||||
icon: 'user',
|
||||
route: '/admin/customers'
|
||||
},
|
||||
{
|
||||
title: 'navigation.items',
|
||||
icon: 'star',
|
||||
route: '/admin/items'
|
||||
}
|
||||
],
|
||||
|
||||
[
|
||||
{
|
||||
title: 'navigation.estimates',
|
||||
icon: 'file',
|
||||
route: '/admin/estimates'
|
||||
},
|
||||
{
|
||||
title: 'navigation.invoices',
|
||||
icon: 'file-alt',
|
||||
route: '/admin/invoices'
|
||||
},
|
||||
{
|
||||
title: 'navigation.payments',
|
||||
icon: 'credit-card',
|
||||
route: '/admin/payments'
|
||||
},
|
||||
{
|
||||
title: 'navigation.expenses',
|
||||
icon: 'space-shuttle',
|
||||
route: '/admin/expenses'
|
||||
}
|
||||
],
|
||||
|
||||
[
|
||||
{
|
||||
title: 'navigation.reports',
|
||||
icon: 'signal',
|
||||
route: '/admin/reports'
|
||||
},
|
||||
{
|
||||
title: 'navigation.settings',
|
||||
icon: 'cog',
|
||||
route: '/admin/settings'
|
||||
}
|
||||
]
|
||||
|
||||
]
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
Toggle () {
|
||||
this.$utils.toggleSidebar()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user