add calculation module and fix many bugs
This commit is contained in:
Amir Mohamadi
+88
-88
@@ -1,96 +1,96 @@
|
||||
<template>
|
||||
<div class="page blog-details--page">
|
||||
<Hero :title="categoryName(post.category)"/>
|
||||
<section class="s1">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<div class="date-category">
|
||||
<div class="page blog-details--page latin-digits">
|
||||
<Hero :title="categoryName(post.category)"/>
|
||||
<section class="s1">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<div class="date-category">
|
||||
<span class="category">
|
||||
<span>{{staticData.t1}}</span>
|
||||
<span>{{categoryName(post.category)}}</span>
|
||||
<span>{{ staticData.t1 }}</span>
|
||||
<span>{{ categoryName(post.category) }}</span>
|
||||
</span>
|
||||
<span class="date">{{jDate(post.created_at)}}</span>
|
||||
</div>
|
||||
<div class="content" v-html="post.post_details[$route.params.lang].description"></div>
|
||||
<div class="share">
|
||||
<p>{{staticData.t2}}</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a target="_blank" title="Twitter" :href="'https://twitter.com/intent/tweet?url=' + domain + $route.fullPath">
|
||||
<i class="fab fa-twitter"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a target="_blank" title="WhatsApp" :href="'whatsapp://send?text=' + domain + $route.fullPath">
|
||||
<i class="fab fa-whatsapp"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a target="_blank" title="Linked In" :href="'https://www.linkedin.com/shareArticle?mini=true&url=' + domain + $route.fullPath">
|
||||
<i class="fab fa-linkedin-in"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a target="_blank" title="Facebook" :href="'https://www.facebook.com/sharer.php?u=' + domain + $route.fullPath">
|
||||
<i class="fab fa-facebook-f"></i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s2">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<h2 class="title">{{staticData.t3}}</h2>
|
||||
<nuxt-link :to="{name: 'lang-blog',params: {lang: $route.params.lang}}" class="btn btn-primary">{{staticData.t4}}</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<CustomersCommunication/>
|
||||
</div>
|
||||
<span class="date">{{ jDate(post.created_at) }}</span>
|
||||
</div>
|
||||
<div class="ck-content" v-html="post.post_details[$route.params.lang].description"></div>
|
||||
<div class="share">
|
||||
<p>{{ staticData.t2 }}</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a target="_blank" title="Twitter" :href="'https://twitter.com/intent/tweet?url=' + domain + $route.fullPath">
|
||||
<i class="fab fa-twitter"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a target="_blank" title="WhatsApp" :href="'whatsapp://send?text=' + domain + $route.fullPath">
|
||||
<i class="fab fa-whatsapp"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a target="_blank" title="Linked In" :href="'https://www.linkedin.com/shareArticle?mini=true&url=' + domain + $route.fullPath">
|
||||
<i class="fab fa-linkedin-in"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a target="_blank" title="Facebook" :href="'https://www.facebook.com/sharer.php?u=' + domain + $route.fullPath">
|
||||
<i class="fab fa-facebook-f"></i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s2">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<h2 class="title">{{ staticData.t3 }}</h2>
|
||||
<nuxt-link :to="{name: 'lang-blog',params: {lang: $route.params.lang}}" class="btn btn-primary">{{ staticData.t4 }}</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<CustomersCommunication/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import moment from "moment-jalaali"
|
||||
import moment from "moment-jalaali"
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
post: null,
|
||||
blogCategories: null,
|
||||
domain: 'https://www.arakrail.com'
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
staticData() {
|
||||
return this.$store.state.staticData.blog_details[this.$route.params.lang]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
categoryName(id) {
|
||||
return this.blogCategories.filter(item => item._id === id)[0].blogCategory_details[this.$route.params.lang].name
|
||||
},
|
||||
jDate(date) {
|
||||
if (this.$route.params.lang === 'fa') return moment(date).format('jYYYY/jMM/jDD')
|
||||
else return date.split(' ')[0]
|
||||
},
|
||||
},
|
||||
head() {
|
||||
return {
|
||||
title: this.post.post_details[this.$route.params.lang].title
|
||||
}
|
||||
},
|
||||
async asyncData({$axios, params}) {
|
||||
const post = await $axios.get(`/api/public/blog/${params.post}`)
|
||||
const blogCategories = await $axios.get(`/api/public/blogCategories`)
|
||||
return {
|
||||
post: post.data,
|
||||
blogCategories: blogCategories.data
|
||||
}
|
||||
}
|
||||
}
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
post: null,
|
||||
blogCategories: null,
|
||||
domain: 'https://www.arakrail.com'
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
staticData() {
|
||||
return this.$store.state.staticData.blog_details[this.$route.params.lang]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
categoryName(id) {
|
||||
return this.blogCategories.filter(item => item._id === id)[0].blogCategory_details[this.$route.params.lang].name
|
||||
},
|
||||
jDate(date) {
|
||||
if (this.$route.params.lang === 'fa') return moment(date).format('jYYYY/jMM/jDD')
|
||||
else return date.split(' ')[0]
|
||||
},
|
||||
},
|
||||
head() {
|
||||
return {
|
||||
title: this.post.post_details[this.$route.params.lang].title
|
||||
}
|
||||
},
|
||||
async asyncData({$axios, params}) {
|
||||
const post = await $axios.get(`/api/public/blog/${params.post}`)
|
||||
const blogCategories = await $axios.get(`/api/public/blogCategories`)
|
||||
return {
|
||||
post: post.data,
|
||||
blogCategories: blogCategories.data
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
+122
-122
@@ -1,131 +1,131 @@
|
||||
<template>
|
||||
<div class="page blog--page">
|
||||
<Hero :title="staticData.hero"/>
|
||||
<section class="s1">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<h2 class="title">{{staticData.t1}}</h2>
|
||||
<p>{{staticData.t2}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s2">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="filters anim-fadeIn">
|
||||
<h2 class="title">{{staticData.t3}}</h2>
|
||||
<ul>
|
||||
<li @click="filtering(false)">
|
||||
<p class="active">{{staticData.t7}}</p>
|
||||
</li>
|
||||
<li v-for="item in blogCategories" :key="item._id" @click="filtering(item._id)">
|
||||
<p>{{item.blogCategory_details[$route.params.lang].name}}</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="s3">
|
||||
<div class="container">
|
||||
<div class="row posts-container" v-if="filtered_posts.length">
|
||||
|
||||
<div class="col-12 col-sm-6 col-lg-12 clearfix post anim-fadeIn" v-for="item in filtered_posts" :key="item._id">
|
||||
<div class="panel">
|
||||
<div class="imgBox imgBox-reverse">
|
||||
<div class="img">
|
||||
<img :src="item.thumb" :alt="item.post_details[$route.params.lang].title">
|
||||
</div>
|
||||
</div>
|
||||
<div class="txtBox">
|
||||
<div class="date-category">
|
||||
<div class="page blog--page latin-digits">
|
||||
<Hero :title="staticData.hero"/>
|
||||
<section class="s1">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<h2 class="title">{{ staticData.t1 }}</h2>
|
||||
<p>{{ staticData.t2 }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s2">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="filters anim-fadeIn">
|
||||
<h2 class="title">{{ staticData.t3 }}</h2>
|
||||
<ul>
|
||||
<li @click="filtering(false)">
|
||||
<p class="active">{{ staticData.t7 }}</p>
|
||||
</li>
|
||||
<li v-for="item in blogCategories" :key="item._id" @click="filtering(item._id)">
|
||||
<p>{{ item.blogCategory_details[$route.params.lang].name }}</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="s3">
|
||||
<div class="container">
|
||||
<div class="row posts-container" v-if="filtered_posts.length">
|
||||
|
||||
<div class="col-12 col-md-6 col-lg-12 clearfix post anim-fadeIn" v-for="item in filtered_posts" :key="item._id">
|
||||
<div class="panel">
|
||||
<div class="imgBox imgBox-reverse">
|
||||
<div class="img">
|
||||
<img :src="item.thumb" :alt="item.post_details[$route.params.lang].title">
|
||||
</div>
|
||||
</div>
|
||||
<div class="txtBox">
|
||||
<div class="date-category">
|
||||
<span class="category">
|
||||
<span>{{staticData.t4}}</span>
|
||||
<span>{{categoryName(item.category)}}</span>
|
||||
<span>{{ staticData.t4 }}</span>
|
||||
<span>{{ categoryName(item.category) }}</span>
|
||||
</span>
|
||||
<span class="date">{{jDate(item.created_at)}}</span>
|
||||
</div>
|
||||
<h4>{{item.post_details[$route.params.lang].title}}</h4>
|
||||
<p>{{item.post_details[$route.params.lang].short_description}}</p>
|
||||
<nuxt-link :to="{name: 'lang-blog-post',params: {lang: $route.params.lang,post: item._id}}" class="btn btn-primary">{{staticData.t5}}</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="row" v-else>
|
||||
<div class="col-12">
|
||||
<p class="no-post posts-container anim-fadeIn">{{staticData.t6}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
<span class="date">{{ jDate(item.created_at) }}</span>
|
||||
</div>
|
||||
<h4>{{ item.post_details[$route.params.lang].title }}</h4>
|
||||
<p>{{ item.post_details[$route.params.lang].short_description }}</p>
|
||||
<nuxt-link :to="{name: 'lang-blog-post',params: {lang: $route.params.lang,post: item._id}}" class="btn btn-primary">{{ staticData.t5 }}</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="row" v-else>
|
||||
<div class="col-12">
|
||||
<p class="no-post posts-container anim-fadeIn">{{ staticData.t6 }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import moment from 'moment-jalaali'
|
||||
import {fadeInAnimation} from "~/mixins/animations"
|
||||
import moment from 'moment-jalaali'
|
||||
import {fadeInAnimation} from "~/mixins/animations"
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
posts: null,
|
||||
blogCategories: null,
|
||||
filter: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
staticData() {
|
||||
return this.$store.state.staticData.blog[this.$route.params.lang]
|
||||
},
|
||||
filtered_posts() {
|
||||
if (!this.filter) return this.posts
|
||||
else return this.posts.filter(item => item.category === this.filter)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
categoryName(id) {
|
||||
return this.blogCategories.filter(item => item._id === id)[0].blogCategory_details[this.$route.params.lang].name
|
||||
},
|
||||
jDate(date) {
|
||||
if (this.$route.params.lang === 'fa') return moment(date).format('jYYYY/jMM/jDD')
|
||||
else return date.split(' ')[0]
|
||||
},
|
||||
filtering(key) {
|
||||
$('.blog--page .filters p').removeClass('active')
|
||||
$(event.target).addClass('active')
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
posts: null,
|
||||
blogCategories: null,
|
||||
filter: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
staticData() {
|
||||
return this.$store.state.staticData.blog[this.$route.params.lang]
|
||||
},
|
||||
filtered_posts() {
|
||||
if (!this.filter) return this.posts
|
||||
else return this.posts.filter(item => item.category === this.filter)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
categoryName(id) {
|
||||
return this.blogCategories.filter(item => item._id === id)[0].blogCategory_details[this.$route.params.lang].name
|
||||
},
|
||||
jDate(date) {
|
||||
if (this.$route.params.lang === 'fa') return moment(date).format('jYYYY/jMM/jDD')
|
||||
else return date.split(' ')[0]
|
||||
},
|
||||
filtering(key) {
|
||||
$('.blog--page .filters p').removeClass('active')
|
||||
$(event.target).addClass('active')
|
||||
|
||||
this.$gsap.timeline({
|
||||
yoyo: true,
|
||||
repeat: 1
|
||||
})
|
||||
.to($('.blog--page .posts-container'),
|
||||
{
|
||||
opacity: 0,
|
||||
duration: 0.3,
|
||||
onComplete: () => {
|
||||
this.filter = key
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
mixins: [fadeInAnimation],
|
||||
head() {
|
||||
return {
|
||||
title: this.staticData.hero
|
||||
}
|
||||
},
|
||||
async asyncData({$axios, store}) {
|
||||
let posts = await $axios.get(`/api/public/blog`)
|
||||
const blogCategories = await $axios.get(`/api/public/blogCategories`)
|
||||
return {
|
||||
posts: posts.data,
|
||||
blogCategories: blogCategories.data
|
||||
}
|
||||
}
|
||||
}
|
||||
this.$gsap.timeline({
|
||||
yoyo: true,
|
||||
repeat: 1
|
||||
})
|
||||
.to($('.blog--page .posts-container'),
|
||||
{
|
||||
opacity: 0,
|
||||
duration: 0.3,
|
||||
onComplete: () => {
|
||||
this.filter = key
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
mixins: [fadeInAnimation],
|
||||
head() {
|
||||
return {
|
||||
title: this.staticData.hero
|
||||
}
|
||||
},
|
||||
async asyncData({$axios, store}) {
|
||||
let posts = await $axios.get(`/api/public/blog`)
|
||||
const blogCategories = await $axios.get(`/api/public/blogCategories`)
|
||||
return {
|
||||
posts: posts.data,
|
||||
blogCategories: blogCategories.data
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user