129 lines
4.5 KiB
Vue
129 lines
4.5 KiB
Vue
<template>
|
|
<header class="site--header">
|
|
<div class="container-fluid">
|
|
<div class="row">
|
|
<nav class="col-6 col-lg-2 logo">
|
|
<nuxt-link :to="{ name: 'index' }">
|
|
<logo />
|
|
</nuxt-link>
|
|
</nav>
|
|
<nav class="col-8 d-none d-lg-block">
|
|
<ul class="links">
|
|
<nuxt-link :to="{ name: 'announcements' }" tag="li">
|
|
<a>اطلاعیه ها </a>
|
|
</nuxt-link>
|
|
<li
|
|
class="dropDown-container help"
|
|
:class="helpDropDownActiveClass && 'active'"
|
|
@mouseenter="openDrop('help')"
|
|
@mouseleave="closeDrop('help')"
|
|
>
|
|
<a>
|
|
<span>راهنما</span>
|
|
<i class="fas fa-angle-down"></i>
|
|
</a>
|
|
<div class="drop-down">
|
|
<nuxt-link
|
|
:to="{ name: 'learning', query: { page: 1 } }"
|
|
:class="$route.name.includes('learning') && 'active'"
|
|
>آموزش</nuxt-link
|
|
>
|
|
<nuxt-link :to="{ name: 'FAQ' }">سوالات متداول</nuxt-link>
|
|
</div>
|
|
</li>
|
|
<nuxt-link :to="{ name: 'index' }" exact tag="li">
|
|
<a>استعلام گارانتی</a>
|
|
</nuxt-link>
|
|
<nuxt-link :to="{ name: 'warranty-terms', query: { page: 1 } }" tag="li">
|
|
<a>شرایط گارانتی</a>
|
|
</nuxt-link>
|
|
|
|
<li
|
|
class="dropDown-container agents"
|
|
:class="agentsDropDownActiveClass && 'active'"
|
|
@mouseenter="openDrop('agents')"
|
|
@mouseleave="closeDrop('agents')"
|
|
>
|
|
<a>
|
|
<span>نمایندگان</span>
|
|
<i class="fas fa-angle-down"></i>
|
|
</a>
|
|
<div class="drop-down">
|
|
<nuxt-link :to="{ name: 'agents' }">لیست نمایندگان</nuxt-link>
|
|
<nuxt-link :to="{ name: 'agent-benefits' }">مزایای نمایندگی</nuxt-link>
|
|
<nuxt-link :to="{ name: 'representation' }" :exact="false">اخذ نمایندگی</nuxt-link>
|
|
</div>
|
|
</li>
|
|
|
|
<nuxt-link
|
|
:to="{ name: 'download', query: { category: 'all', page: 1 } }"
|
|
:class="$route.name.includes('download') && 'active'"
|
|
tag="li"
|
|
>
|
|
<a>دانلود</a>
|
|
</nuxt-link>
|
|
<nuxt-link :to="{ name: 'about' }" tag="li">
|
|
<a>درباره ما</a>
|
|
</nuxt-link>
|
|
<nuxt-link :to="{ name: 'contact' }" tag="li">
|
|
<a>ارتباط با ما</a>
|
|
</nuxt-link>
|
|
</ul>
|
|
</nav>
|
|
<nav class="col-2 d-none d-lg-flex account">
|
|
<nuxt-link :to="isUser ? { name: 'account' } : { name: 'auth-login-register' }">
|
|
<span v-if="isUser" class="singleLineTxt" :title="fullName">{{ fullName }}</span>
|
|
<span v-else>ورود</span>
|
|
<i v-if="isUser && userHasNotification" class="notificationAnim fas fa-bell"></i>
|
|
<i v-else class="fal fa-user"></i>
|
|
</nuxt-link>
|
|
</nav>
|
|
<div class="col-6 d-flex d-lg-none align-items-center justify-content-end menu">
|
|
<i id="menu" class="far" :class="!mobileMenu ? 'fa-bars' : 'fa-chevron-left'"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
</template>
|
|
|
|
<script>
|
|
import WS_User from '@/mixins/WS_User'
|
|
import WS_Agent from '@/mixins/WS_Agent'
|
|
export default {
|
|
|
|
mixins: [WS_User, WS_Agent],
|
|
data() {
|
|
return {}
|
|
},
|
|
computed: {
|
|
mobileMenu() {
|
|
return this.$store.state.front.mobileMenu
|
|
},
|
|
isUser() {
|
|
return this.$auth.loggedIn && this.$auth.user.scope.includes('user')
|
|
},
|
|
userHasNotification() {
|
|
const store = this.$store.state.front
|
|
return store.unreadTickets + store.agentInbox + store.newUserAnnosCount + store.newAgentAnnosCount
|
|
},
|
|
helpDropDownActiveClass() {
|
|
return this.$route.name === 'learning' || this.$route.name === 'learning-post+' || this.$route.name === 'FAQ'
|
|
},
|
|
agentsDropDownActiveClass() {
|
|
return this.$route.name === 'representation' || this.$route.name === 'agent-benefits'
|
|
},
|
|
fullName() {
|
|
return this.$auth.user.first_name + ' ' + this.$auth.user.last_name
|
|
}
|
|
},
|
|
methods: {
|
|
openDrop(name) {
|
|
$(`.dropDown-container.${name}`).addClass('d-active')
|
|
},
|
|
closeDrop(name) {
|
|
$(`.dropDown-container.${name}`).removeClass('d-active')
|
|
}
|
|
}
|
|
}
|
|
</script>
|