123 lines
3.6 KiB
Vue
123 lines
3.6 KiB
Vue
<template>
|
|
<div class="d-flex flex-column height-100">
|
|
<v-navigation-drawer
|
|
v-model="showMenu"
|
|
v-if="showMenu"
|
|
:clipped="$vuetify.display.mdAndUp"
|
|
app
|
|
color="header-background-color darken-3"
|
|
class="white--text pa-4"
|
|
>
|
|
<v-row>
|
|
<v-col cols="12" class="pa-0">
|
|
<v-hover v-slot:default="{ hover }">
|
|
<router-link
|
|
:class="hover ? 'primary--text darken-3 white' : 'white--text'"
|
|
class="my-account-link d-block text-decoration-none h4 pa-2 px-6 my-1"
|
|
:to="{name:'AccountDashboard'}"
|
|
>Account Dashboard</router-link>
|
|
</v-hover>
|
|
|
|
<v-hover v-slot:default="{ hover }">
|
|
<router-link
|
|
:class="hover ? 'primary--text darken-3 white' : 'white--text'"
|
|
class="my-account-link d-block text-decoration-none h4 pa-2 px-6 my-1"
|
|
:to="basicInfo.addresses&&basicInfo.addresses.length?{name:'AddressBook'}:{name:'EditAddressBook' ,params:{addressId:'new'}}"
|
|
>Address Book</router-link>
|
|
</v-hover>
|
|
<v-hover v-slot:default="{ hover }">
|
|
<router-link
|
|
:class="hover ? 'primary--text darken-3 white' : 'white--text'"
|
|
class="my-account-link d-block text-decoration-none h4 pa-2 px-6 my-1"
|
|
:to="{name:'EditAccountInfo',params:{value:'false'}}"
|
|
>Account Information</router-link>
|
|
</v-hover>
|
|
<v-hover v-slot:default="{ hover }">
|
|
<router-link
|
|
:class="hover ? 'primary--text darken-3 white' : 'white--text'"
|
|
class="d-block text-decoration-none h4 pa-2 px-6 my-1"
|
|
to
|
|
@click.native="goToLogout()"
|
|
>Logout</router-link>
|
|
</v-hover>
|
|
</v-col>
|
|
</v-row>
|
|
</v-navigation-drawer>
|
|
<Header @action="onAction" />
|
|
<v-content>
|
|
<router-view class="pa-4" />
|
|
</v-content>
|
|
<FooterComponent />
|
|
|
|
</div>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
import Header from "@/components/retailer/layout/header/Header.vue";
|
|
import FooterComponent from "@/components/retailer/layout/footer/FooterComponent.vue"
|
|
|
|
import { createHelpers } from "vuex-map-fields";
|
|
|
|
const { mapFields } = createHelpers({
|
|
getterType: "layout/getField",
|
|
mutationType: "layout/updateField"
|
|
});
|
|
|
|
export default {
|
|
name: "Layout",
|
|
|
|
components: {
|
|
Header,
|
|
FooterComponent
|
|
},
|
|
|
|
props: {
|
|
source: String
|
|
},
|
|
data: () => ({
|
|
showMenu: false
|
|
}),
|
|
computed: {
|
|
isDesktop: function() {
|
|
return this.$vuetify.display.xsOnly ? true : false;
|
|
},
|
|
basicInfo: function() {
|
|
return this.$store.state.accountOne.one;
|
|
},
|
|
orderProductsList() {
|
|
return this.$store.state.meProductList.orderProductsList;
|
|
},
|
|
...mapFields(["user", "user.userVisits"])
|
|
},
|
|
methods: {
|
|
goToLogout() {
|
|
localStorage.removeItem("cr_checkOutTab");
|
|
window.open("/logout-success", "_self");
|
|
},
|
|
onScroll() {
|
|
this.offsetTop = window.pageYOffset || document.documentElement.scrollTop;
|
|
},
|
|
onAction() {
|
|
this.showMenu = !this.showMenu;
|
|
},
|
|
OnResize() {}
|
|
},
|
|
created() {
|
|
this.$store.dispatch("userCartProduct/cartProductList");
|
|
this.$store.dispatch("headerCategoryList/fetchCategoryList");
|
|
this.$store.dispatch("layout/fetchCmsBlock");
|
|
this.$store.dispatch("layout/fetchPageContent");
|
|
}
|
|
};
|
|
</script>
|
|
<style>
|
|
.router-link-active.my-account-link {
|
|
color: #2850da !important;
|
|
caret-color: #2850da !important;
|
|
background-color: #fff !important;
|
|
border-color: #fff !important;
|
|
}
|
|
</style>
|
|
<style lang="scss">
|
|
</style> |