front-end almost done | started back-end
This commit is contained in:
Amir Mohamadi
+70
-17
@@ -1,53 +1,110 @@
|
||||
<template>
|
||||
<div class="page about--page">
|
||||
<hero :title="staticData.hero"/>
|
||||
<Hero :title="staticData.hero"/>
|
||||
<section class="s1">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<div class="parts p1">
|
||||
<logo/>
|
||||
<span>{{staticData.s1.p1}}</span>
|
||||
<span>{{staticData.s1.t1}}</span>
|
||||
<p>{{staticData.s1.t2}}</p>
|
||||
</div>
|
||||
<div class="parts p2 row">
|
||||
<div class="col-6">
|
||||
<p>{{staticData.s1.p2}}</p>
|
||||
<p>{{staticData.s1.t3}}</p>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="imgBox">
|
||||
<img src="~/assets/img/about-s1-i1.jpg" alt="">
|
||||
<div class="img">
|
||||
<div class="shape"></div>
|
||||
<img src="~/assets/img/about/about-s1-i1.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="parts p3 row">
|
||||
<div class="col-6">
|
||||
<div class="imgBox imgBox-reverse">
|
||||
<img src="~/assets/img/about-s1-i2.jpg" alt="">
|
||||
<div class="img">
|
||||
<div class="shape reverse"></div>
|
||||
<img src="~/assets/img/about/about-s1-i2.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<p v-html="staticData.s1.p3"></p>
|
||||
<p>{{staticData.s1.t4}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="parts p4 row">
|
||||
<div class="col-12">
|
||||
<p v-html="staticData.s1.p4"></p>
|
||||
<p>{{staticData.s1.t5}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="s2">
|
||||
<div class="container">
|
||||
<h2 class="title title-shape">{{staticData.s2.p1}}</h2>
|
||||
<p v-html="staticData.s2.p2"></p>
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<h2 class="title title-shape-center">{{staticData.s2.t1}}</h2>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div class="timeline">
|
||||
<div class="circle active">
|
||||
<span>1370</span>
|
||||
</div>
|
||||
<div class="line active"></div>
|
||||
<div class="circle active">
|
||||
<span>1375</span>
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<div class="circle">
|
||||
<span>1385</span>
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<div class="circle">
|
||||
<span>1395</span>
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<div class="circle">
|
||||
<span>1396</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="timeline-content">
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<div class="txtBox">
|
||||
<h5>{{staticData.s2.t2}}</h5>
|
||||
<p>{{staticData.s2.t3}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="imgBox">
|
||||
<img src="~/assets/img/about/timeline-i1.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="s3">
|
||||
<div class="container">
|
||||
<div v-for="(item , index) in staticData.s3" class="panel" :class="'p'+(index+1)">
|
||||
<h2 class="title title-shape">{{staticData.s3.t1}}</h2>
|
||||
<p v-html="staticData.s3.t2"></p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="s4">
|
||||
<div class="container">
|
||||
<div v-for="(item , index) in staticData.s4" class="panel" :class="'p'+(index+1)">
|
||||
<div class="row">
|
||||
<div class="col-5 img">
|
||||
<img :src="require('~/assets/img/'+ item.img)" alt="">
|
||||
<img :src="require('~/assets/img/about/'+ item.img)" alt="">
|
||||
</div>
|
||||
<div class="col-7 txt">
|
||||
<p>{{item.title}}</p>
|
||||
@@ -57,7 +114,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<customersCommunication/>
|
||||
<CustomersCommunication/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -66,11 +123,7 @@
|
||||
export default {
|
||||
computed: {
|
||||
staticData() {
|
||||
if (this.$route.params.lang === 'fa') {
|
||||
return this.$store.state.staticData.about.fa
|
||||
} else if (this.$route.params.lang === 'en') {
|
||||
return this.$store.state.staticData.about.en
|
||||
}
|
||||
return this.$store.state.staticData.about[this.$route.params.lang]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,3 +1,75 @@
|
||||
<template>
|
||||
<div class="page blog-details--page"></div>
|
||||
<div class="page blog-details--page">
|
||||
<Hero :title="staticData.hero"/>
|
||||
<section class="s1">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<div class="date-category">
|
||||
<span class="category">
|
||||
<span>{{staticData.t1}}</span>
|
||||
<span>News</span>
|
||||
</span>
|
||||
<span class="date">30/05/2020</span>
|
||||
</div>
|
||||
<div class="content">
|
||||
<h2>لیست مقالات و اخبار</h2>
|
||||
<br>
|
||||
<br>
|
||||
<p>ما می خواهیم اطلاعات بیشتری در مورد ما بدانید ، بنابراین ما اخبار ، رویدادها یا تحولات گریتینگ اراک ریل و صنعتی را که ما به آن تعلق داریم برای شما ارسال می کنیم ،بنابراین شما می دانید که چگونه ما در جای خود قرار گرفته ایم.</p>
|
||||
</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>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
domain: 'https://www.arakrail.com/'
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
staticData() {
|
||||
return this.$store.state.staticData.blog_details[this.$route.params.lang]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -1,3 +1,90 @@
|
||||
<template>
|
||||
<div class="page blog--page"></div>
|
||||
<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">
|
||||
<h2 class="title">{{staticData.t3}}</h2>
|
||||
<ul>
|
||||
<li>همه</li>
|
||||
<li>مقالات</li>
|
||||
<li>اخبار</li>
|
||||
<li>آموزش ها</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="s3">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-12 clearfix post">
|
||||
<div class="panel">
|
||||
<div class="imgBox imgBox-reverse">
|
||||
<div class="img">
|
||||
<img src="~/assets/img/blog/blog-post.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="txtBox">
|
||||
<div class="date-category">
|
||||
<span class="category">
|
||||
<span>{{staticData.t4}}</span>
|
||||
<span>News</span>
|
||||
</span>
|
||||
<span class="date">30/05/2020</span>
|
||||
</div>
|
||||
<h4>گریتینگ چیست</h4>
|
||||
<p>گریتینگ چیست در این نوشته به پاسخ به سوال گریتینگ چیست خواهیم پرداخت گریتینگ در اصل به صفحات مشبکی گفته میشود که به دلیل داشتن خصوصیات بارزی مانند وزن پایین تر, امکان عبور هوا و نور, قیمت تمام شده پایین تر, ظاهری زیباتر و مزایای بسیار دیگری نسبت به سایر محصولات مشابه خود امروزه جایگاه ویژه ای در صنایع گوناگون و همچنین شهرسازی بدست آورده است و هر روزه بر کاربرد آن افزوده میشود. با توجه به این افزایش کاربرد امروز گریتینگ ها را در […]</p>
|
||||
<nuxt-link :to="{name: 'lang-blog-post',params: {lang: $route.params.lang,post: 1}}" class="btn btn-primary">{{staticData.t5}}</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 clearfix post">
|
||||
<div class="panel">
|
||||
<div class="imgBox imgBox-reverse">
|
||||
<div class="img">
|
||||
<img src="~/assets/img/blog/blog-post.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="txtBox">
|
||||
<div class="date-category">
|
||||
<span class="category">
|
||||
<span>Category /</span>
|
||||
<span>News</span>
|
||||
</span>
|
||||
<span class="date">30/05/2020</span>
|
||||
</div>
|
||||
<h4>گریتینگ چیست</h4>
|
||||
<p>گریتینگ چیست در این نوشته به پاسخ به سوال گریتینگ چیست خواهیم پرداخت گریتینگ در اصل به صفحات مشبکی گفته میشود که به دلیل داشتن خصوصیات بارزی مانند وزن پایین تر, امکان عبور هوا و نور, قیمت تمام شده پایین تر, ظاهری زیباتر و مزایای بسیار دیگری نسبت به سایر محصولات مشابه خود امروزه جایگاه ویژه ای در صنایع گوناگون و همچنین شهرسازی بدست آورده است و هر روزه بر کاربرد آن افزوده میشود. با توجه به این افزایش کاربرد امروز گریتینگ ها را در […]</p>
|
||||
<nuxt-link :to="{name: 'lang-blog-post',params: {lang: $route.params.lang,post: 2}}" class="btn btn-primary">{{staticData.t5}}</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
computed: {
|
||||
staticData() {
|
||||
return this.$store.state.staticData.blog[this.$route.params.lang]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -1,3 +1,171 @@
|
||||
<template>
|
||||
<div class="page contact--page"></div>
|
||||
<div class="page contact--page">
|
||||
<Hero :title="staticData.hero"/>
|
||||
<section class="s1">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<div class="row">
|
||||
<div class="col-12 p1">
|
||||
<h2 class="title">{{staticData.t1}}</h2>
|
||||
<p>{{staticData.t2}}</p>
|
||||
</div>
|
||||
<div class="col-12 p2">
|
||||
<ul>
|
||||
<li>
|
||||
<i class="fas fa-map-marker-alt"></i>
|
||||
<span>{{staticData.t3}}</span>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fas fa-phone"></i>
|
||||
<a href="tel: +988634132704">Tell: +98 86 3 413 2704 - 7</a>
|
||||
-
|
||||
<a href="tel: +988634132703">Fax: +98 86 3 413 27 03</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fas fa-envelope"></i>
|
||||
<a href="mailto: info@arakrail.com">info@arakrail.com</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-12 p3">
|
||||
<hr>
|
||||
<b>{{staticData.t4}}</b>
|
||||
<p>{{staticData.t5}}</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="" target="_blank">
|
||||
<i class="fab fa-facebook-f"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="" target="_blank">
|
||||
<i class="fab fa-twitter"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="" target="_blank">
|
||||
<i class="fab fa-telegram-plane"></i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-12 p4">
|
||||
<div class="mapouter">
|
||||
<div class="gmap_canvas">
|
||||
<iframe id="gmap_canvas"
|
||||
src="https://maps.google.com/maps?q=%D8%A7%D8%B1%D8%A7%DA%A9%20%D8%B1%DB%8C%D9%84%20%D8%8C%D8%A7%D8%B3%D8%AA%D8%A7%D9%86%20%D9%85%D8%B1%DA%A9%D8%B2%DB%8C%D8%8C%20%D8%A7%D8%B1%D8%A7%DA%A9%D8%8C%20%D8%B4%D9%87%D8%B1%DA%A9%20%D9%82%D8%B7%D8%A8%20%D8%B5%D9%86%D8%B9%D8%AA%DB%8C%D8%8C%20%D8%AE%DB%8C%D8%A7%D8%A8%D8%A7%D9%86%20%D8%AA%D9%84%D8%A7%D8%B4%D8%8C%20%D9%87%D9%85%D8%AA&t=&z=13&ie=UTF8&iwloc=&output=embed"
|
||||
frameborder="0" scrolling="no" marginheight="0" marginwidth="0">
|
||||
</iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s2">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<h2>{{staticData.t6}}</h2>
|
||||
<form class="form">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="formRow center-align">
|
||||
<select name="reason" v-model="formData.reason">
|
||||
<option disabled selected :value="false">{{staticData.t7}}</option>
|
||||
<option value="wtf">دلیل خاصی ندارم والا هوثلم سر رفته بود</option>
|
||||
<option value="">2</option>
|
||||
<option value="">3</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="formRow err">
|
||||
<input type="text" :placeholder="staticData.t8" name="first_name" v-model="formData.first_name">
|
||||
<p>err</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="formRow">
|
||||
<input type="text" :placeholder="staticData.t9" name="last_name" v-model="formData.last_name">
|
||||
<p>err</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="formRow">
|
||||
<input type="text" :placeholder="staticData.t10" name="phone_number" v-model="formData.phone_number">
|
||||
<p>err</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="formRow">
|
||||
<input type="text" :placeholder="staticData.t11" name="email" v-model="formData.email">
|
||||
<p>err</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div class="formRow">
|
||||
<textarea :placeholder="staticData.t12" name="message" v-model="formData.message"></textarea>
|
||||
<p>err</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div class="formRow center-align">
|
||||
<button type="submit" class="btn btn-primary-fill">{{staticData.t13}}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
reason: false,
|
||||
first_name: '',
|
||||
last_name: '',
|
||||
phone_number: '',
|
||||
email: '',
|
||||
message: '',
|
||||
locale: this.$route.params.lang
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
staticData() {
|
||||
return this.$store.state.staticData.contact[this.$route.params.lang]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.mapouter{
|
||||
position: relative;
|
||||
text-align: right;
|
||||
height: 500px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.gmap_canvas{
|
||||
overflow: hidden;
|
||||
background: none !important;
|
||||
height: 500px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#gmap_canvas{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
+117
-94
@@ -1,13 +1,30 @@
|
||||
<template>
|
||||
<div class="page home--page">
|
||||
<div class="hero clearfix">
|
||||
<div class="bg"></div>
|
||||
<div class="txt--home">
|
||||
<h1>{{staticData.hero.t1}}</h1>
|
||||
<p>{{staticData.hero.t2}}</p>
|
||||
<nuxt-link :to="{name: staticData.hero.link.url}" class="btn btn-reverse-fill">{{staticData.hero.link.txt}}</nuxt-link>
|
||||
|
||||
<div id="slider">
|
||||
<div class="hero clearfix">
|
||||
<div class="bg"></div>
|
||||
<div class="txt--home">
|
||||
<h1>{{staticData.hero.t1}}</h1>
|
||||
<p>{{staticData.hero.t2}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero clearfix">
|
||||
<div class="bg"></div>
|
||||
<div class="txt--home">
|
||||
<h1>{{staticData.hero.t1}}</h1>
|
||||
<p>{{staticData.hero.t2}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero clearfix">
|
||||
<div class="bg"></div>
|
||||
<div class="txt--home">
|
||||
<h1>{{staticData.hero.t1}}</h1>
|
||||
<p>{{staticData.hero.t2}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<section class="s1">
|
||||
<div class="go-down-btn">
|
||||
<em class="fa fa-angle-double-down"></em>
|
||||
@@ -19,139 +36,106 @@
|
||||
</div>
|
||||
<div class="col-6 caption-side">
|
||||
<p>{{staticData.s1.caption}}</p>
|
||||
<nuxt-link :to="{name: staticData.s1.link.url}" class="btn btn-primary">{{staticData.s1.link.txt}}</nuxt-link>
|
||||
<nuxt-link :to="{name: 'lang-about',params:{lang: $route.params.lang}}" class="btn btn-primary">{{staticData.s1.link}}</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s1-2">
|
||||
<img src="~/assets/img/home/hp-s1-i2.jpg" alt="" class="section-bg">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<h2 class="title title-shape-center">{{staticData.s1_2.t1}}</h2>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<p>{{staticData.s1_2.t2}}</p>
|
||||
<p>{{staticData.s1_2.t3}}</p>
|
||||
<nuxt-link :to="{name: 'lang-about',params: {lang: $route.params.lang}}" class="btn btn-primary">{{staticData.s1_2.link}}</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s2">
|
||||
<img src="~/assets/img/hp-s2-i1.jpg" alt="" class="section-bg">
|
||||
<img src="~/assets/img/home/hp-s2-i1.jpg" alt="" class="section-bg">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<div class="parts p1">
|
||||
<h2 class="title title-shape-center">{{staticData.s2.part1.t1}}</h2>
|
||||
<h2 class="title title-shape-center">{{staticData.s2.t1}}</h2>
|
||||
<div>
|
||||
<p>{{staticData.s2.part1.t2}}</p>
|
||||
<p>{{staticData.s2.t2}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="parts p2 row">
|
||||
<div class="col-6">
|
||||
<h2 class="title title-subtitle">{{staticData.s2.part2.t1}}</h2>
|
||||
<p>{{staticData.s2.part2.t2}}</p>
|
||||
<nuxt-link :to="{name: staticData.s2.part2.link.url}" class="btn btn-primary">{{staticData.s2.part2.link.txt}}</nuxt-link>
|
||||
<div class="txtBox">
|
||||
<h2 class="title title-subtitle">{{staticData.s2.t5}}</h2>
|
||||
<p>{{staticData.s2.t6}}</p>
|
||||
<nuxt-link :to="{name: 'lang-services',params: {lang: $route.params.lang}}" class="btn btn-primary">{{staticData.s2.link1}}</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="imgBox imgBox-shape">
|
||||
<img src="~/assets/img/hp-s2-i2.jpg" alt="">
|
||||
<img src="~/assets/img/home/hp-s2-i2.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="parts p3 row">
|
||||
<div class="col-6">
|
||||
<div class="imgBox imgBox-reverse imgBox-shape-reverse">
|
||||
<img src="~/assets/img/hp-s2-i3.jpg" alt="">
|
||||
<img src="~/assets/img/home/hp-s2-i3.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<h2 class="title title-subtitle">{{staticData.s2.part3.t1}}</h2>
|
||||
<p>{{staticData.s2.part3.t2}}</p>
|
||||
<nuxt-link :to="{name: staticData.s2.part3.link.url}" class="btn btn-primary">{{staticData.s2.part3.link.txt}}</nuxt-link>
|
||||
<div class="txtBox">
|
||||
<h2 class="title title-subtitle">{{staticData.s2.t3}}</h2>
|
||||
<p>{{staticData.s2.t4}}</p>
|
||||
<nuxt-link :to="{name: 'lang-tech-gStandard',params: {lang: $route.params.lang}}" class="btn btn-primary">{{staticData.s2.link2}}</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s3">
|
||||
<img src="~/assets/img/hp-s3-i1.jpg" alt="" class="section-bg">
|
||||
<img src="~/assets/img/home/hp-s3-i1.jpg" alt="" class="section-bg">
|
||||
<div class="container clearfix">
|
||||
<div class="panel panel1">
|
||||
<div class="panel">
|
||||
<div class="parts p1">
|
||||
<h2 class="title title-shape-center">{{staticData.s3.part1.t1}}</h2>
|
||||
</div>
|
||||
<div class="parts p2 row">
|
||||
<div class="col-4" v-for="item in staticData.s3.part1.projects">
|
||||
<div class="imgBox">
|
||||
<img :src="require(`~/assets/img/${item.img}`)" alt="">
|
||||
<p>{{item.txt}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<h2 class="title title-shape-center">{{staticData.s3.t1}}</h2>
|
||||
<div class="col-12">
|
||||
<nuxt-link :to="{name: staticData.s3.part1.link.url}" class="btn btn-primary">{{staticData.s3.part1.link.txt}}</nuxt-link>
|
||||
<p>{{staticData.s3.t2}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel2">
|
||||
<div class="parts p3 row">
|
||||
<div class="col-12">
|
||||
<h2 class="title title-shape-center">{{staticData.s3.part2.t1}}</h2>
|
||||
</div>
|
||||
<div class="col-4" v-for="item in staticData.s3.part2.products">
|
||||
<nuxt-link :to="{name: 'lang-products-product',params: {product: item.url}}">
|
||||
<div class="products">
|
||||
<div class="parts p2 row">
|
||||
<div class="col-4" v-for="item in products">
|
||||
<nuxt-link :to="{name: 'lang-products-product',params: {lang: $route.params.lang,product: item.url}}">
|
||||
<div class="imgBox">
|
||||
<img :src="require(`~/assets/img/${item.img}`)" alt="">
|
||||
<img :src="require(`~/assets/img/home/${item.img}`)" alt="">
|
||||
<p>{{item.txt}}</p>
|
||||
</div>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<nuxt-link :to="{name: staticData.s3.part2.link.url}" class="btn btn-primary">{{staticData.s3.part2.link.txt}}</nuxt-link>
|
||||
<nuxt-link :to="{name: 'lang-products',params: {lang: $route.params.lang}}" class="btn btn-primary">{{staticData.s3.link}}</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s4">
|
||||
<img src="~/assets/img/hp-s4-i1.jpg" alt="" class="section-bg">
|
||||
<img src="~/assets/img/home/hp-s4-i1.jpg" alt="" class="section-bg">
|
||||
<div class="txt">
|
||||
<h2 class="title title-shape">{{staticData.s4.t1}} <span>{{staticData.s4.t2}}</span></h2>
|
||||
<p>{{staticData.s4.t3}}</p>
|
||||
<a :href="staticData.s4.link.url" target="_blank" class="btn btn-reverse-fill">{{staticData.s4.link.txt}}</a>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s5">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<div class="p1">
|
||||
<h2 class="title title-shape-center">{{staticData.s5.t1}}</h2>
|
||||
<p>{{staticData.s5.t2}}</p>
|
||||
</div>
|
||||
|
||||
<form action="" class="form">
|
||||
<div class="formRow" :class="validation.first_name ? 'err' : ''">
|
||||
<input type="text" :placeholder="staticData.s5.t3">
|
||||
<p v-if="validation.first_name">{{validation.first_name[0]}}</p>
|
||||
</div>
|
||||
|
||||
<div class="formRow" :class="validation.last_name ? 'err' : ''">
|
||||
<input type="text" :placeholder="staticData.s5.t4">
|
||||
<p v-if="validation.last_name">{{validation.last_name[0]}}</p>
|
||||
</div>
|
||||
|
||||
<div class="formRow" :class="validation.phone_number ? 'err' : ''">
|
||||
<input type="text" :placeholder="staticData.s5.t5">
|
||||
<p v-if="validation.phone_number">{{validation.phone_number[0]}}</p>
|
||||
</div>
|
||||
|
||||
<div class="formRow" :class="validation.email ? 'err' : ''">
|
||||
<input type="text" :placeholder="staticData.s5.t6">
|
||||
<p v-if="validation.email">{{validation.email[0]}}</p>
|
||||
</div>
|
||||
|
||||
<div class="formRow formRow-wide" :class="validation.message ? 'err' : ''">
|
||||
<textarea :placeholder="staticData.s5.t7"></textarea>
|
||||
<p v-if="validation.message">{{validation.message[0]}}</p>
|
||||
</div>
|
||||
|
||||
<div class="formRow buttonRow">
|
||||
<button class="btn btn-reverse-fill">{{staticData.s5.t8}}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="watermark">
|
||||
<logo/>
|
||||
</div>
|
||||
<a :href="catalog_link" target="_blank" download="catalog.pdf" class="btn btn-reverse-fill">{{staticData.s4.link}}</a>
|
||||
</div>
|
||||
</section>
|
||||
<CustomersCommunication/>
|
||||
<section class="s6">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
@@ -159,11 +143,11 @@
|
||||
<div class="col-6">
|
||||
<h2 class="title title-shape">{{staticData.s6.t1}}</h2>
|
||||
<p>{{staticData.s6.t2}}</p>
|
||||
<nuxt-link :to="{name: staticData.s6.link1.url}" class="btn btn-primary">{{staticData.s6.link1.txt}}</nuxt-link>
|
||||
<a :href="staticData.s6.link2.url" class="btn btn-primary-fill">{{staticData.s6.link2.txt}}</a>
|
||||
<nuxt-link :to="{name: staticData.s6.link1.url}" class="btn btn-primary">{{staticData.s6.link1}}</nuxt-link>
|
||||
<a :href="calc_app_link" target="_blank" class="btn btn-primary-fill">{{staticData.s6.link2}}</a>
|
||||
</div>
|
||||
<div class="col-2 img-side">
|
||||
<img src="~/assets/img/hp-s6-i1.png" alt="">
|
||||
<img src="~/assets/img/home/hp-s6-i1.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -172,19 +156,50 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
if (process.client) require('slick-carousel')
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
products: [
|
||||
{
|
||||
img: 'hp-s3-i5.jpg',
|
||||
txt: 'گریتینگ پله',
|
||||
url: '1'
|
||||
},
|
||||
{
|
||||
img: 'hp-s3-i6.jpg',
|
||||
txt: 'گریتینگ گالوانیزه',
|
||||
url: '2'
|
||||
},
|
||||
{
|
||||
img: 'hp-s3-i7.jpg',
|
||||
txt: 'گریتینگ آلومینیوم',
|
||||
url: '3'
|
||||
},
|
||||
{
|
||||
img: 'hp-s3-i8.jpg',
|
||||
txt: 'گریتینگ الکتروفورج',
|
||||
url: '4'
|
||||
},
|
||||
{
|
||||
img: 'hp-s3-i9.jpg',
|
||||
txt: 'پنل گریتینگ',
|
||||
url: '5'
|
||||
},
|
||||
{
|
||||
img: 'hp-s3-i10.jpg',
|
||||
txt: 'گریتینگ تسمه در تسمه',
|
||||
url: '6'
|
||||
}
|
||||
],
|
||||
catalog_link: this.$store.state.staticData.catalog_link,
|
||||
calc_app_link: this.$store.state.staticData.calc_app_link,
|
||||
validation: []
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
staticData() {
|
||||
if (this.$route.params.lang === 'fa') {
|
||||
return this.$store.state.staticData.homePage.fa
|
||||
} else if (this.$route.params.lang === 'en') {
|
||||
return this.$store.state.staticData.homePage.en
|
||||
}
|
||||
return this.$store.state.staticData.homePage[this.$route.params.lang]
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
@@ -208,6 +223,15 @@
|
||||
//
|
||||
// this.$scrollmagic.addScene(titleScene[i])
|
||||
// }
|
||||
|
||||
/////////////////////////////////////// carousel
|
||||
$('#slider').slick({
|
||||
slidesToShow: 1,
|
||||
rtl: this.$route.params.lang === 'fa',
|
||||
dots: true,
|
||||
autoplay: true,
|
||||
autoplaySpeed: 6000
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -218,4 +242,3 @@
|
||||
background: #F0F0F0 !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
@@ -1,3 +1,161 @@
|
||||
<template>
|
||||
<div class="page product-details--page"></div>
|
||||
<div class="page product-details--page">
|
||||
<Hero :title="staticData.hero"/>
|
||||
<section class="s1">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<h2 class="title">گریتینگ تولید شده به روش الکتروفورج با چهار پهلوی تابیده</h2>
|
||||
<p>استفاده از تجهیزات مدرن تولید و تیم مهندسی قوی موجب شده تا شرکت اراک ریل دارای گسترده ترین رنج محصولات گریتینگ را داشته باشد و همچنین ما را قادر می سازد تا در صورت نیاز، محصول را مطابق با نیاز شما طراحی کرده و مطابق با استانداردهای بین اللملی تولید کنیم</p>
|
||||
<div class="image-preview">
|
||||
<img src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="images-carousel">
|
||||
<div id="images">
|
||||
<div class="imgBox">
|
||||
<img src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
<div class="imgBox">
|
||||
<img src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
<div class="imgBox">
|
||||
<img src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
<div class="imgBox">
|
||||
<img src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
<div class="imgBox">
|
||||
<img src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
<div class="imgBox">
|
||||
<img src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
<div class="imgBox">
|
||||
<img src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="s2">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<div class="parts p1">
|
||||
<h2 class="title title-shape-center">جزییات بیشتر</h2>
|
||||
</div>
|
||||
|
||||
<!-- image left -->
|
||||
<div class="parts row align-items-center">
|
||||
<div class="col-6">
|
||||
<h2 class="title title-subtitle">خط برش تسمه</h2>
|
||||
<p>خط برش اولین مرحله از فرآیند تولید است که در آن ، کویل های فولادی به صورت طولی مطابق با الزامات گریتینگهای فلزی تولید می شوند ، تسمه از کویلهای برش خورده آماده شده و به صورت ساده و یا دندانه دار برای استفاده در مرحله بعدی بسته بندی می گردد.</p>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="imgBox imgBox-shape">
|
||||
<img src="~/assets/img/services/s2-i1.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- image right -->
|
||||
<div class="parts row align-items-center">
|
||||
<div class="col-6">
|
||||
<div class="imgBox imgBox-reverse imgBox-shape-reverse">
|
||||
<img src="~/assets/img/services/s2-i2.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<h2 class="title title-subtitle">تولید پنل گریتینگ الکتروفورج</h2>
|
||||
<p>در این مرحله تسمه ها به همراه چهار پهلوی تابیده شده در سیستم قرارداده شده و دستگاه الکتروفورج با ایجاد همزمان جریان بالای الکتریکی و فشار مکانیکی، سبب می شود تا تسمه های باربر و رابط در نقاط اتصال به دمای ذوب نزدیک شده و دو قطعه کاملا در هم فرو رفته و اتصال کاملا یکنواخت و یک پارچه ای ایجاد گردد.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="s3">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<div class="parts p1">
|
||||
<h2 class="title">نمایش گرافیکی مشخصات</h2>
|
||||
<p>در شماتیک زیر مشخصات اولیه گریتینگ نمایش داده شده است</p>
|
||||
</div>
|
||||
|
||||
<div class="row parts p2">
|
||||
<div class="col-6 mb-5">
|
||||
<img src="~/assets/img/products/pd-s3-i1.jpg" alt="">
|
||||
<p>نمایش ایزومتریک گریتینگ الکتروفورج</p>
|
||||
</div>
|
||||
<div class="col-6 mb-5">
|
||||
<img src="~/assets/img/products/pd-s3-i2.jpg" alt="">
|
||||
<p>نمای روبرو از گریتینگ الکتروفورج</p>
|
||||
</div>
|
||||
<div class="col-12 mb-5">
|
||||
<img src="~/assets/img/products/chart.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row parts p3">
|
||||
<div class="col-12">
|
||||
<h2 class="title">جدول مشخصات گامها و ضخامتهای گریتینگها قابل تولید</h2>
|
||||
<p>با توجه به شماتیک گریتینگ ارائه شده در نمای بالا، تنوع گسترده ای از گریتینگها به روش الکتروفورج قابل تولید می باشد.
|
||||
مشخصات زیر گریتینگهای متداول به لحاظ تولید در شرکت اراک ریل بوده و در صورت نیاز کارشناسان این شرکت آماده مشاوره در این زمینه باشند.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row parts p4">
|
||||
<div class="col-12">
|
||||
<h2>فایل های قابل دانلود</h2>
|
||||
<div class="files">
|
||||
<div class="file">
|
||||
<pdf-icon/>
|
||||
<p>نام فایل</p>
|
||||
<a href="" target="_blank" class="btn btn-primary-fill">دانلود</a>
|
||||
</div>
|
||||
<div class="file">
|
||||
<pdf-icon/>
|
||||
<p>نام فایل</p>
|
||||
<a href="" target="_blank" class="btn btn-primary-fill">دانلود</a>
|
||||
</div>
|
||||
<div class="file">
|
||||
<pdf-icon/>
|
||||
<p>نام فایل</p>
|
||||
<a href="" target="_blank" class="btn btn-primary-fill">دانلود</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="s4">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<nuxt-link :to="{name: 'lang-products',params: {lang: $route.params.lang}}" class="btn btn-primary">مشاهده تمام محصولات</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
if (process.client) require('slick-carousel')
|
||||
export default {
|
||||
computed: {
|
||||
staticData() {
|
||||
return this.$store.state.staticData.products_details[this.$route.params.lang]
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
$('#images').slick({
|
||||
slidesToShow: 4,
|
||||
rtl: this.$route.params.lang === 'fa'
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -1,26 +1,82 @@
|
||||
<template>
|
||||
<div class="page products--page">
|
||||
<hero :title="staticData.hero"/>
|
||||
<Hero :title="staticData.hero"/>
|
||||
<section class="s1">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<h2 class="title title-shape-center">{{staticData.s1.t1}}</h2>
|
||||
<h2 class="title">{{staticData.s1.t1}}</h2>
|
||||
<p>{{staticData.s1.t2}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s2">
|
||||
<div class="container">
|
||||
<div class="filters">
|
||||
<h2 class="title title-subtitle">{{staticData.s2.t1}}</h2>
|
||||
<ul>
|
||||
<li
|
||||
v-for="item in staticData.s2.filters"
|
||||
:key="item.key"
|
||||
@click="filter(item.key)">
|
||||
<p>{{item.txt}}</p>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- <div class="filters">-->
|
||||
<!-- <h2 class="title title-subtitle">{{staticData.s2.t1}}</h2>-->
|
||||
<!-- <ul>-->
|
||||
<!-- <li-->
|
||||
<!-- v-for="item in staticData.s2.filters"-->
|
||||
<!-- :key="item.key"-->
|
||||
<!-- @click="filter(item.key)">-->
|
||||
<!-- <p>{{item.txt}}</p>-->
|
||||
<!-- </li>-->
|
||||
<!-- </ul>-->
|
||||
<!-- </div>-->
|
||||
<div class="row">
|
||||
<div class="col-3 mb-5">
|
||||
<nuxt-link :to="{name: 'lang-products-product',params: {lang: $route.params.lang,product: 1}}" class="product">
|
||||
<img src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<h4>گریتینگ</h4>
|
||||
<p>توضیحات کوتاه</p>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
<div class="col-3 mb-5">
|
||||
<nuxt-link :to="{name: 'lang-products-product',params: {lang: $route.params.lang,product: 2}}" class="product">
|
||||
<img src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<h4>گریتینگ</h4>
|
||||
<p>توضیحات کوتاه</p>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
<div class="col-3 mb-5">
|
||||
<nuxt-link :to="{name: 'lang-products-product',params: {lang: $route.params.lang,product: 3}}" class="product">
|
||||
<img src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<h4>گریتینگ</h4>
|
||||
<p>توضیحات کوتاه</p>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
<div class="col-3 mb-5">
|
||||
<nuxt-link :to="{name: 'lang-products-product',params: {lang: $route.params.lang,product: 4}}" class="product">
|
||||
<img src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<h4>گریتینگ</h4>
|
||||
<p>توضیحات کوتاه</p>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
<div class="col-3 mb-5">
|
||||
<nuxt-link :to="{name: 'lang-products-product',params: {lang: $route.params.lang,product: ''}}" class="product">
|
||||
<img src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<h4>گریتینگ</h4>
|
||||
<p>توضیحات کوتاه</p>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
<div class="col-3 mb-5">
|
||||
<nuxt-link :to="{name: 'lang-products-product',params: {lang: $route.params.lang,product: ''}}" class="product">
|
||||
<img src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<h4>گریتینگ</h4>
|
||||
<p>توضیحات کوتاه</p>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s3">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<h2 class="title title-shape-center">
|
||||
{{staticData.s3.t1}}
|
||||
<span class="subtitle">{{staticData.s3.t2}}</span>
|
||||
</h2>
|
||||
<p>{{staticData.s3.t3}}</p>
|
||||
<a href="" target="_blank" class="btn btn-reverse-fill">{{staticData.s3.t4}}</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -31,11 +87,7 @@
|
||||
export default {
|
||||
computed: {
|
||||
staticData() {
|
||||
if (this.$route.params.lang === 'fa') {
|
||||
return this.$store.state.staticData.products.fa
|
||||
} else if (this.$route.params.lang === 'en') {
|
||||
return this.$store.state.staticData.products.en
|
||||
}
|
||||
return this.$store.state.staticData.products[this.$route.params.lang]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
@@ -1,3 +1,148 @@
|
||||
<template>
|
||||
<div class="page projects--page"></div>
|
||||
<div class="page projects--page">
|
||||
<Hero :title="staticData.hero"/>
|
||||
<section class="s1">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<h2 class="title">{{staticData.t1}}</h2>
|
||||
<p>{{staticData.t2}}</p>
|
||||
<p>{{staticData.t3}}</p>
|
||||
|
||||
<div class="projects">
|
||||
|
||||
<div class="project">
|
||||
<div id="project1">
|
||||
<div class="imgBox">
|
||||
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
<div class="imgBox">
|
||||
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
<div class="imgBox">
|
||||
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
<div class="imgBox">
|
||||
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
<div class="imgBox">
|
||||
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="caption">
|
||||
<h4>پروژه ی فلان جا</h4>
|
||||
<p>1399/07/04</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="project">
|
||||
<div id="project2">
|
||||
<div class="imgBox">
|
||||
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
<div class="imgBox">
|
||||
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
<div class="imgBox">
|
||||
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
<div class="imgBox">
|
||||
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
<div class="imgBox">
|
||||
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="caption">
|
||||
<h4>پروژه ی فلان جا</h4>
|
||||
<p>1399/07/04</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="project">
|
||||
<div id="project3">
|
||||
<div class="imgBox">
|
||||
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
<div class="imgBox">
|
||||
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
<div class="imgBox">
|
||||
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
<div class="imgBox">
|
||||
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
<div class="imgBox">
|
||||
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="caption">
|
||||
<h4>پروژه ی فلان جا</h4>
|
||||
<p>1399/07/04</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s2">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<h2 class="title">{{staticData.t4}}</h2>
|
||||
<nuxt-link :to="{name: 'lang-contact',params:{lang: $route.params.lang}}" class="btn btn-reverse-fill">{{staticData.t5}}</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
if (process.client) require('slick-carousel')
|
||||
export default {
|
||||
computed: {
|
||||
staticData() {
|
||||
return this.$store.state.staticData.projects[this.$route.params.lang]
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
$('#project1').slick({
|
||||
slidesToShow: 1,
|
||||
centerMode: true,
|
||||
centerPadding: '150px',
|
||||
infinite: true,
|
||||
arrows: true
|
||||
})
|
||||
$('#project2').slick({
|
||||
slidesToShow: 1,
|
||||
centerMode: true,
|
||||
centerPadding: '150px',
|
||||
infinite: true,
|
||||
arrows: true
|
||||
})
|
||||
$('#project3').slick({
|
||||
slidesToShow: 1,
|
||||
centerMode: true,
|
||||
centerPadding: '150px',
|
||||
infinite: true,
|
||||
arrows: true
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
+139
-37
@@ -1,58 +1,164 @@
|
||||
<template>
|
||||
<div class="page services--page">
|
||||
<hero :title="staticData.hero"/>
|
||||
<Hero :title="staticData.hero"/>
|
||||
<section class="s1">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<h2 class="title">{{staticData.s1.t1}}</h2>
|
||||
<p>{{staticData.s1.t2}}</p>
|
||||
<div class="top">
|
||||
<h2 class="title">{{staticData.t1}}</h2>
|
||||
<p class="subtitle">{{staticData.t2}}</p>
|
||||
</div>
|
||||
<div class="content">
|
||||
<p>{{staticData.t3}}</p>
|
||||
<h4>{{staticData.t4}}</h4>
|
||||
<ul>
|
||||
<li>
|
||||
<p>{{staticData.t5}}</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>{{staticData.t6}}</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>{{staticData.t7}}</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>{{staticData.t8}}</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>{{staticData.t9}}</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>{{staticData.t10}}</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>{{staticData.t11}}</p>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="images">
|
||||
<img src="~/assets/img/services/autodesk.png" alt="">
|
||||
<img src="~/assets/img/services/tekla.png" alt="">
|
||||
<img src="~/assets/img/services/solid_works.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s2">
|
||||
<img src="~/assets/img/services-s2-i1.jpg" alt="" class="section-bg">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<h2 class="title title-subtitle">{{staticData.s2.t1}}</h2>
|
||||
<ol>
|
||||
<li v-for="item in staticData.s2.t2">
|
||||
<p>{{item.txt}}</p>
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s3">
|
||||
<img src="~/assets/img/services-s3-i1.jpg" alt="" class="section-bg">
|
||||
<img src="~/assets/img/services/services-s3-i1.jpg" alt="" class="section-bg">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<div class="parts p1">
|
||||
<h2 class="title title-shape-center">{{staticData.s3.part1.t1}}</h2>
|
||||
<p>{{staticData.s3.part1.t2}}</p>
|
||||
<h2 class="title title-shape-center">{{staticData.t12}}</h2>
|
||||
<p>{{staticData.t13}}</p>
|
||||
</div>
|
||||
<div class="parts row align-items-center" v-for="(item, index) in staticData.s3.dynamicPart">
|
||||
<div class="col-6" v-if="index%2 === 0">
|
||||
<h2 class="title title-subtitle">{{item.t1}}</h2>
|
||||
<p>{{item.t2}}</p>
|
||||
|
||||
<!-- image left -->
|
||||
<div class="parts row align-items-center">
|
||||
<div class="col-6">
|
||||
<h2 class="title title-subtitle">{{staticData.t14}}</h2>
|
||||
<p>{{staticData.t15}}</p>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="imgBox" :class="index%2 === 0 ? 'imgBox-shape' : 'imgBox-reverse imgBox-shape-reverse'">
|
||||
<img :src="require(`~/assets/img/${item.img}`)" alt="">
|
||||
<div class="imgBox imgBox-shape">
|
||||
<img src="~/assets/img/services/s2-i1.jpg" :alt="staticData.t14">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 align-items-center" v-if="index%2 !== 0">
|
||||
<h2 class="title title-subtitle">{{item.t1}}</h2>
|
||||
<p>{{item.t2}}</p>
|
||||
</div>
|
||||
|
||||
<!-- image right -->
|
||||
<div class="parts row align-items-center">
|
||||
<div class="col-6">
|
||||
<div class="imgBox imgBox-reverse imgBox-shape-reverse">
|
||||
<img src="~/assets/img/services/s2-i2.jpg" :alt="staticData.t16">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<h2 class="title title-subtitle">{{staticData.t16}}</h2>
|
||||
<p>{{staticData.t17}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="parts lastPart">
|
||||
<h2 class="title title-subtitle">{{staticData.s3.lastPart.t1}}</h2>
|
||||
<p>{{staticData.s3.lastPart.t2}}</p>
|
||||
|
||||
<!-- image left -->
|
||||
<div class="parts row align-items-center">
|
||||
<div class="col-6">
|
||||
<h2 class="title title-subtitle">{{staticData.t18}}</h2>
|
||||
<p>{{staticData.t19}}</p>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="imgBox imgBox-shape">
|
||||
<img src="~/assets/img/services/s2-i3.jpg" :alt="staticData.t18">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- image right -->
|
||||
<div class="parts row align-items-center">
|
||||
<div class="col-6">
|
||||
<div class="imgBox imgBox-reverse imgBox-shape-reverse">
|
||||
<img src="~/assets/img/services/s2-i4.jpg" :alt="staticData.t20">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<h2 class="title title-subtitle">{{staticData.t20}}</h2>
|
||||
<p>{{staticData.t21}}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- image left -->
|
||||
<div class="parts row align-items-center">
|
||||
<div class="col-6">
|
||||
<h2 class="title title-subtitle">{{staticData.t22}}</h2>
|
||||
<p>{{staticData.t23}}</p>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="imgBox imgBox-shape">
|
||||
<img src="~/assets/img/services/s2-i5.jpg" :alt="staticData.t22">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- image right -->
|
||||
<div class="parts row align-items-center">
|
||||
<div class="col-6">
|
||||
<div class="imgBox imgBox-reverse imgBox-shape-reverse">
|
||||
<img src="~/assets/img/services/s2-i6.jpg" :alt="staticData.t24">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<h2 class="title title-subtitle">{{staticData.t24}}</h2>
|
||||
<p>{{staticData.t25}}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- image left -->
|
||||
<div class="parts row align-items-center">
|
||||
<div class="col-6">
|
||||
<h2 class="title title-subtitle">{{staticData.t26}}</h2>
|
||||
<p>{{staticData.t27}}</p>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="imgBox imgBox-shape">
|
||||
<img src="~/assets/img/services/s2-i7.jpg" :alt="staticData.t26">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- image right -->
|
||||
<div class="parts row align-items-center">
|
||||
<div class="col-6">
|
||||
<div class="imgBox imgBox-reverse imgBox-shape-reverse">
|
||||
<img src="~/assets/img/services/s2-i8.jpg" :alt="staticData.t28">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<h2 class="title title-subtitle">{{staticData.t28}}</h2>
|
||||
<p>{{staticData.t29}}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<customersCommunication/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -61,11 +167,7 @@
|
||||
export default {
|
||||
computed: {
|
||||
staticData() {
|
||||
if (this.$route.params.lang === 'fa') {
|
||||
return this.$store.state.staticData.services.fa
|
||||
} else if (this.$route.params.lang === 'en') {
|
||||
return this.$store.state.staticData.services.en
|
||||
}
|
||||
return this.$store.state.staticData.services[this.$route.params.lang]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,41 @@
|
||||
<template>
|
||||
<div class="page tech-info--page">
|
||||
<Hero :title="staticData.title"/>
|
||||
<section class="s1">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<div class="content gDesign">
|
||||
<h2 class="first">{{staticData.t1}}</h2>
|
||||
<p>{{staticData.t2}}</p>
|
||||
<p v-html="staticData.t3"></p>
|
||||
<p>{{staticData.t4}}</p>
|
||||
<br>
|
||||
<br>
|
||||
<p>{{staticData.t5}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s2">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<h2 class="title">{{staticData.t6}}</h2>
|
||||
<nuxt-link :to="{name: 'lang-products',params: {lang: $route.params.lang}}" class="btn btn-primary">{{staticData.t7}}</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<CustomersCommunication/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
computed: {
|
||||
staticData() {
|
||||
return this.$store.state.staticData.gDesign[this.$route.params.lang]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,71 @@
|
||||
<template>
|
||||
<div class="page tech-info--page">
|
||||
<Hero :title="staticData.title"/>
|
||||
<section class="s1">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<div class="content gStandard">
|
||||
<h2 class="first">{{staticData.t1}}</h2>
|
||||
<p>{{staticData.t2}}</p>
|
||||
|
||||
<h2>{{staticData.t3}}</h2>
|
||||
<p>{{staticData.t4}}</p>
|
||||
<p>{{staticData.t5}}</p>
|
||||
|
||||
<h2>{{staticData.t6}}</h2>
|
||||
<p>{{staticData.t7}}</p>
|
||||
<img src="~/assets/img/tech-info/g-standard.png" alt="">
|
||||
|
||||
<h2>{{staticData.t8}}</h2>
|
||||
<p>{{staticData.t9}}</p>
|
||||
<img src="~/assets/img/tech-info/DIN24537.png" alt="">
|
||||
|
||||
<h2>{{staticData.t10}}</h2>
|
||||
<p>{{staticData.t11}}</p>
|
||||
<p>{{staticData.t12}}</p>
|
||||
<p>{{staticData.t13}}</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p>{{staticData.t14}}</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>{{staticData.t15}}</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>{{staticData.t16}}</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>{{staticData.t17}}</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>{{staticData.t18}}</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s2">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<h2 class="title">{{staticData.t19}}</h2>
|
||||
<nuxt-link :to="{name: 'lang-products',params: {lang: $route.params.lang}}" class="btn btn-primary">{{staticData.t20}}</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<CustomersCommunication/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
computed: {
|
||||
staticData() {
|
||||
return this.$store.state.staticData.gStandard[this.$route.params.lang]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,85 @@
|
||||
<template>
|
||||
<div class="page tech-info--page">
|
||||
<Hero :title="staticData.title"/>
|
||||
<section class="s1">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<div class="content gTech">
|
||||
<h2 class="first">{{staticData.t1}}</h2>
|
||||
<p>{{staticData.t2}}</p>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<p>
|
||||
<b>{{staticData.t3}}</b>
|
||||
<span>{{staticData.t4}}</span>
|
||||
</p>
|
||||
<p>
|
||||
<b>{{staticData.t5}}</b>
|
||||
<span>{{staticData.t6}}</span>
|
||||
</p>
|
||||
<p>
|
||||
<b>{{staticData.t7}}</b>
|
||||
<span>{{staticData.t8}}</span>
|
||||
</p>
|
||||
<p>
|
||||
<b>{{staticData.t9}}</b>
|
||||
<span>{{staticData.t10}}</span>
|
||||
</p>
|
||||
<p>
|
||||
<b>{{staticData.t11}}</b>
|
||||
<span>{{staticData.t12}}</span>
|
||||
</p>
|
||||
<p>
|
||||
<b>{{staticData.t13}}</b>
|
||||
<span>{{staticData.t14}}</span>
|
||||
</p>
|
||||
<p>
|
||||
<b>{{staticData.t15}}</b>
|
||||
<span>{{staticData.t16}}</span>
|
||||
</p>
|
||||
<p>
|
||||
<b>{{staticData.t17}}</b>
|
||||
<span>{{staticData.t18}}</span>
|
||||
</p>
|
||||
<p>
|
||||
<b>{{staticData.t19}}</b>
|
||||
<span>{{staticData.t20}}</span>
|
||||
</p>
|
||||
<p>
|
||||
<b>{{staticData.t21}}</b>
|
||||
<span>{{staticData.t22}}</span>
|
||||
</p>
|
||||
<p>{{staticData.t23}}</p>
|
||||
|
||||
<div class="imgBox">
|
||||
<img src="~/assets/img/tech-info/ti-Model-4.jpg" alt="">
|
||||
<p>{{staticData.t24}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s2">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<h2 class="title">{{staticData.t25}}</h2>
|
||||
<nuxt-link :to="{name: 'lang-products',params: {lang: $route.params.lang}}" class="btn btn-primary">{{staticData.t26}}</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<CustomersCommunication/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
computed: {
|
||||
staticData() {
|
||||
return this.$store.state.staticData.gTech[this.$route.params.lang]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,69 @@
|
||||
<template>
|
||||
<div class="page tech-info--page">
|
||||
<Hero :title="staticData.title"/>
|
||||
<section class="s1">
|
||||
<div class="container">
|
||||
<div class="panel">
|
||||
<div class="content gUsage">
|
||||
<h2 class="first">{{staticData.t1}}</h2>
|
||||
<p v-html="staticData.t2"></p>
|
||||
<p>{{staticData.t3}}</p>
|
||||
<p>{{staticData.t4}}</p>
|
||||
<p>{{staticData.t5}}</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p>{{staticData.t6}}</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>{{staticData.t7}}</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>{{staticData.t8}}</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>{{staticData.t9}}</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>{{staticData.t10}}</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>{{staticData.t11}}</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>{{staticData.t12}}</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>{{staticData.t13}}</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>{{staticData.t14}}</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s2">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<h2 class="title">{{staticData.t15}}</h2>
|
||||
<nuxt-link :to="{name: 'lang-products',params: {lang: $route.params.lang}}" class="btn btn-primary">{{staticData.t16}}</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<CustomersCommunication/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
computed: {
|
||||
staticData() {
|
||||
return this.$store.state.staticData.gUsage[this.$route.params.lang]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user