danak/arakrail
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

front-end almost done | started back-end

Browse Source
This commit is contained in:
Amir Mohamadi
2020-11-23 19:39:26 +03:30
parent 95149f0e72
commit 80a7abafb7
191 changed files with 60163 additions and 950 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/SiteHeader.vue
+125
View File
@@ -0,0 +1,125 @@
<template>
<header class="header">
<div class="lang-bar">
<a :href="catalog_link" download="catalog.pdf" target="_blank" class="catalog-download">
<span>{{staticData.catalog}}</span>
<span>&nbsp;</span>
<i class="fas fa-download"></i>
</a>
<div class="dropdown" @mouseenter="drop" @mouseleave="drop">
<div class="title">
<p class="current-lang">
<span>FA / EN</span>
<i class="fas fa-sort-down"></i>
</p>
</div>
<div class="dropMenu">
<div class="drop-item">
<nuxt-link :to="{to: this.$route.fullPath, params: {lang: 'fa'}}">FA</nuxt-link>
</div>
<div class="drop-item">
<nuxt-link :to="{to: this.$route.fullPath, params: {lang: 'en'}}">EN</nuxt-link>
</div>
</div>
</div>
</div>
<div class="container-fluid">
<nav class="row align-items-center">
<div class="col-12 links">
<div class="container-fluid">
<ul class="row justify-content-start">
<nuxt-link :to="{name: 'lang',params: {lang: $route.params.lang}}" tag="li" exact class="">
<a class="logo">
<Logo/>
</a>
</nuxt-link>
<nuxt-link :to="{name: 'lang',params: {lang: $route.params.lang}}" tag="li" exact class="">
<a>{{staticData.home}}</a>
</nuxt-link>
<nuxt-link :to="{name: 'lang-about',params: {lang: $route.params.lang}}" tag="li" exact class="">
<a>{{staticData.about}}</a>
</nuxt-link>
<nuxt-link :to="{name: 'lang-services',params: {lang: $route.params.lang}}" tag="li" exact class="">
<a>{{staticData.services}}</a>
</nuxt-link>
<nuxt-link :to="{name: 'lang-products',params: {lang: $route.params.lang}}" tag="li" class="">
<a>{{staticData.products}}</a>
</nuxt-link>
<nuxt-link :to="{name: 'lang-projects',params: {lang: $route.params.lang}}" tag="li" exact class="">
<a>{{staticData.projects}}</a>
</nuxt-link>
<li class="tech_info" @mouseenter="tech_info" @mouseleave="tech_info"
:class="$route.name === 'lang-tech-gDesign' ||
$route.name === 'lang-tech-gStandard' ||
$route.name === 'lang-tech-gTech' ||
$route.name === 'lang-tech-gUsage' ? 'active' : null">
<a>{{staticData.tech_info}}</a>
<div class="drop-down">
<ul>
<li>
<nuxt-link :to="{name: 'lang-tech-gTech',params: {lang: $route.params.lang}}">{{staticData.ti_1}}</nuxt-link>
</li>
<li>
<nuxt-link :to="{name: 'lang-tech-gStandard',params: {lang: $route.params.lang}}">{{staticData.ti_2}}</nuxt-link>
</li>
<li>
<nuxt-link :to="{name: 'lang-tech-gDesign',params: {lang: $route.params.lang}}">{{staticData.ti_3}}</nuxt-link>
</li>
<li>
<nuxt-link :to="{name: 'lang-tech-gUsage',params: {lang: $route.params.lang}}">{{staticData.ti_4}}</nuxt-link>
</li>
</ul>
</div>
</li>
<nuxt-link :to="{name: 'lang-blog',params: {lang: $route.params.lang}}" tag="li" class="">
<a>{{staticData.blog}}</a>
</nuxt-link>
<nuxt-link :to="{name: 'lang-contact',params: {lang: $route.params.lang}}" tag="li" exact class="">
<a>{{staticData.contact}}</a>
</nuxt-link>
</ul>
</div>
</div>
</nav>
</div>
</header>
</template>
<script>
export default {
data() {
return {
catalog_link: this.$store.state.staticData.catalog_link
}
},
computed: {
staticData() {
return this.$store.state.staticData.header[this.$route.params.lang]
}
},
methods: {
drop() {
$('.dropdown').toggleClass('dropdown-active')
},
tech_info() {
const el = $('.tech_info .drop-down')
if (el.height() === 0) {
el.css({height: $('.tech_info .drop-down ul').height() + 10})
} else {
el.css({height: 0})
}
}
},
mounted() {
/////////////////////////////////////////////////////////// small header
$(window).scroll(function (e) {
if ($(window).scrollTop() > 50) {
$('.header').addClass('header-small')
} else {
$('.header').removeClass('header-small')
}
})
}
}
</script>