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

back-end done

Browse Source
This commit is contained in:
Amir Mohamadi
2020-12-10 16:36:48 +03:30
parent 80a7abafb7
commit bc5e617778
92 changed files with 5217 additions and 3379 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/_lang/projects/index.vue
+39 -101
View File
@@ -10,92 +10,23 @@
<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 class="project" v-for="(item,index) in projects" :key="item._id">
<div :id="`project_${index}`">
<div class="imgBox" v-for="image in item.images" :key="image._id">
<img class="bg" :src="image.image" alt="">
<img class="img" :src="image.image" 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>
<h4>{{item.project_details[$route.params.lang].name}}</h4>
<p class="description">{{item.project_details[$route.params.lang].description}}</p>
<p>
<span>{{staticData.t6}}</span>
<span>{{jDate(item.date)}}</span>
</p>
</div>
</div>
</div>
</div>
</div>
@@ -114,35 +45,42 @@
</template>
<script>
import moment from "moment-jalaali"
if (process.client) require('slick-carousel')
export default {
data() {
return {
projects: null
}
},
computed: {
staticData() {
return this.$store.state.staticData.projects[this.$route.params.lang]
}
},
methods: {
jDate(date) {
if (this.$route.params.lang === 'fa') return moment(date).format('jYYYY/jMM/jDD')
else return date.split(' ')[0]
}
},
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
this.projects.forEach((item, index) => {
$(`#project_${index}`).slick({
slidesToShow: 1,
centerMode: true,
centerPadding: '150px',
infinite: true,
arrows: true
})
})
},
async asyncData({$axios}) {
const projects = await $axios.get(`/api/public/projects`)
return {
projects: projects.data
}
}
}
</script>