feat: add ci cd files dont edit those files
This commit is contained in:
mahyargdz
@@ -0,0 +1,197 @@
|
||||
<template>
|
||||
<div class="gallery-details">
|
||||
<section class="container">
|
||||
<div class="row">
|
||||
<div class="col-12 view-date">
|
||||
<p class="date">{{ jalali(info.customDate || info.created_at) }}</p>
|
||||
<p class="date">{{ jDate(info.customDate || info.created_at) }}</p>
|
||||
</div>
|
||||
<div v-if="info.summaryTitle" class="col-12 col-md-6">
|
||||
<h2 class="summry-title mt-3">
|
||||
{{ info.summaryTitle }}
|
||||
</h2>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<h1 class="title">
|
||||
{{ info.title }}
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<div v-if="info.leadTitle" class="col-12">
|
||||
<p class="summry-title mb-4">
|
||||
{{ info.leadTitle }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="col-12 user-info">
|
||||
<div class="row">
|
||||
<div class="col-12 col-md-6">
|
||||
<span>توسط {{ info._creator.firstName + ' ' + info._creator.lastName }}</span>
|
||||
<span class="date"> - {{ jDate2(info.customDate || info.created_at) }}</span>
|
||||
</div>
|
||||
<div class="col-12 col-md-6 item2">
|
||||
<el-popover
|
||||
placement="top-start"
|
||||
title=""
|
||||
trigger="hover"
|
||||
:value="autoPlayNotice"
|
||||
content="نمایش پشت سرهم تصاویر">
|
||||
<button class="btn btn-primary" slot="reference" @click="autoPlay"><i class="fas fa-play"></i></button>
|
||||
</el-popover>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 mb-4">
|
||||
<div class="row">
|
||||
<div class="col-12 img-gallery">
|
||||
<a :href="info.cover">
|
||||
<img style="width : 100%" :src="info.thumbCover" alt="">
|
||||
</a>
|
||||
</div>
|
||||
<template v-for="(item , index) in info.images">
|
||||
<div :key="item._id" class="col-12 col-md-2 mt-4 img-gallery">
|
||||
<a :href="item">
|
||||
<img style="width : 100%" :src="info.thumbImages[index]" alt="">
|
||||
</a>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="s2" v-if="related.length">
|
||||
<h3>مطالب مرتبط</h3>
|
||||
|
||||
<div id="slides">
|
||||
<nuxt-link
|
||||
class="slide"
|
||||
v-for="item in related"
|
||||
:key="item._id"
|
||||
:to="{name: 'portal-gallery-media',params: {portal: $route.params.portal,media: item._id}}"
|
||||
>
|
||||
<div class="view-txt">
|
||||
<div>
|
||||
<p class="h3">{{ item.title }}</p>
|
||||
<p>{{ item.summaryTitle }}</p>
|
||||
<div class="date">
|
||||
<span>{{ jalali(item.customDate || item.created_at) }}</span>
|
||||
<span>توسط {{ item._creator.firstName + ' ' + item._creator.lastName }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import moment from 'moment-jalaali'
|
||||
|
||||
if (process.client) require("slick-carousel")
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
info: null,
|
||||
galleryShown: false,
|
||||
autoPlayNotice: false,
|
||||
initialIndex: 0,
|
||||
related: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
setTimeout(() => this.autoPlayNotice = true, 4000)
|
||||
setTimeout(() => this.autoPlayNotice = false, 7000)
|
||||
$(document).ready(() => {
|
||||
new SimpleLightbox('.gallery-details .img-gallery a')
|
||||
// $('.img-gallery a').simpleLightbox({
|
||||
//
|
||||
// });
|
||||
|
||||
$("#slides").slick({
|
||||
dots: true,
|
||||
slidesToShow: this.related.length === 1 ? 1 : 2,
|
||||
rtl: true,
|
||||
responsive: [
|
||||
{
|
||||
breakpoint: 960,
|
||||
settings: {
|
||||
slidesToShow: 2,
|
||||
slidesToScroll: 1,
|
||||
infinite: true,
|
||||
dots: true
|
||||
}
|
||||
},
|
||||
{
|
||||
breakpoint: 720,
|
||||
settings: {
|
||||
slidesToShow: 2,
|
||||
slidesToScroll: 1
|
||||
}
|
||||
},
|
||||
{
|
||||
breakpoint: 540,
|
||||
settings: {
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1
|
||||
}
|
||||
}
|
||||
]
|
||||
})
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
jalali(date) {
|
||||
return moment(date).locale('fa').fromNow()
|
||||
},
|
||||
jDate(date) {
|
||||
return moment(date).locale('fa').format('LL')
|
||||
},
|
||||
jDate2(date) {
|
||||
return moment(date).locale('fa').format('a h:mm - jYYYY/jMM/jDD')
|
||||
},
|
||||
autoPlay() {
|
||||
let gallery = new SimpleLightbox('.gallery-details .img-gallery a')
|
||||
gallery.open()
|
||||
setInterval(() => gallery.next(), 3000)
|
||||
}
|
||||
|
||||
},
|
||||
head() {
|
||||
return {
|
||||
title: 'جزئیات تصویر',
|
||||
meta: [
|
||||
{
|
||||
hid: 'description',
|
||||
name: 'description',
|
||||
content: this.info.summaryTitle
|
||||
},
|
||||
{
|
||||
hid: 'keywords',
|
||||
name: 'keywords',
|
||||
content: this.info.keywords
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
async asyncData({params, error, $axios}) {
|
||||
try {
|
||||
let info = await $axios.get(`/api/public/getGallery/${encodeURIComponent(params.media)}`)
|
||||
let related = await $axios.get(`/api/public/getRelatedGallery`, {
|
||||
params: {
|
||||
type: 'image',
|
||||
title: params.media
|
||||
}
|
||||
})
|
||||
return {
|
||||
info: info.data,
|
||||
related: related.data
|
||||
}
|
||||
} catch (err) {
|
||||
error({status: 404, message: 'دریافت اطلاعات با مشکل مواجه شده است!'})
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,139 @@
|
||||
<template>
|
||||
<div class="gallery-page">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-12 col-md-9">
|
||||
<h3 class="gallery-title">عکس</h3>
|
||||
<div>
|
||||
<div class="row">
|
||||
<div class="col-12 mb-5 sectionStyle">
|
||||
<div class="gallery-item1" v-if="gallery && gallery.hero">
|
||||
<nuxt-link :to="{name: 'portal-gallery-media', params: {portal: currentPortal, media: gallery.hero._id}}" class="gallery-img-box1">
|
||||
<img :src="gallery.hero.thumbCover" alt="" class="gallery-img1">
|
||||
<div class="gallery-detail-item1">
|
||||
<h3 class="gallery-detail-title1">{{ gallery.hero.title }}</h3>
|
||||
<p class="gallery-detail-date1">{{ jDate(gallery.hero.customDate || gallery.hero.created_at) }}</p>
|
||||
</div>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
|
||||
<div class="gallery-item1" v-else-if="gallery && gallery.all && gallery.all.docs && gallery.all.docs.length">
|
||||
<nuxt-link :to="{name: 'portal-gallery-media', params: {portal: currentPortal, media: gallery.all.docs[0]._id}}" class="gallery-img-box1">
|
||||
<img :src="gallery.all.docs[0].thumbCover" alt="" class="gallery-img1">
|
||||
<div class="gallery-detail-item1">
|
||||
<h3 class="gallery-detail-title1">{{ gallery.all.docs[0].title }}</h3>
|
||||
<p class="gallery-detail-date1">{{ jDate(gallery.all.docs[0].customDate || gallery.all.docs[0].created_at) }}</p>
|
||||
</div>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12" v-if="gallery && gallery.all && gallery.all.docs && !gallery.all.docs.length">
|
||||
<div class="not-found">
|
||||
<p>موردی وجود ندارد!</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 col-sm-6 col-md-3 mb-3 sectionStyle" v-for="(item, index) in gallery.all.docs" :key="item._id" v-if="index > 0">
|
||||
<div class="gallery-item">
|
||||
<nuxt-link :to="{name: 'portal-gallery-media', params: {portal: currentPortal, media: item._id}}" class="gallery-img-box">
|
||||
<img :src="item.thumbCover" alt="" class="gallery-img">
|
||||
</nuxt-link>
|
||||
<div class="gallery-detail-item">
|
||||
<h3 class="gallery-detail-title">{{ item.title }}</h3>
|
||||
<p class="gallery-detail-date" id="gallery-detail-date">{{ jDate(item.customDate || item.created_at) }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 col-md-3">
|
||||
<h3 class="gallery-side">برگزیده ها</h3>
|
||||
<div class="sectionStyle" v-if="gallery && gallery.favorites && gallery.favorites.length">
|
||||
<div class="row">
|
||||
<div class="col-12 col-sm-6 col-md-12 mb-3" v-for="(item, index) in gallery.favorites" :key="item._id" v-if="index < 5">
|
||||
<div class="gallery-item ">
|
||||
<nuxt-link :to="{name: 'portal-gallery-media', params: {portal: currentPortal, media: item._id}}" class="gallery-img-box">
|
||||
<img :src="item.thumbCover" alt="" class="gallery-img">
|
||||
</nuxt-link>
|
||||
<div class="gallery-detail-item">
|
||||
<h3 class="gallery-detail-title">{{ item.title }}</h3>
|
||||
<p class="gallery-detail-date" id="gallery-detail-date2">{{ jDate(item.customDate || item.created_at) }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="not-found" v-if="gallery && gallery.favorites && !gallery.favorites.length">
|
||||
<p>موردی وجود ندارد!</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="paginate">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<el-pagination
|
||||
layout="next, pager, prev"
|
||||
v-if="gallery && gallery.all && gallery.all.totalPages > 1"
|
||||
class="el-pagination"
|
||||
@current-change="pageNumber"
|
||||
:current-page="Number($route.query.page)"
|
||||
:page-count="Number(gallery.all.totalPages)"
|
||||
>
|
||||
</el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import moment from "moment-jalaali"
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
gallery: null
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
currentPortal() {
|
||||
return this.$route.params.portal
|
||||
},
|
||||
pageQuery() {
|
||||
return this.$route.query.page
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
pageQuery(newVal, oldVal) {
|
||||
this.$nuxt.refresh()
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
jDate(date) {
|
||||
return moment(date).locale('fa').format('LL')
|
||||
},
|
||||
pageNumber(val) {
|
||||
this.$router.push({
|
||||
name: 'portal-gallery',
|
||||
params: {portal: this.currentPortal},
|
||||
query: {type: 'image', page: val}
|
||||
})
|
||||
$(window).scrollTop(0)
|
||||
},
|
||||
},
|
||||
async asyncData({params, query, error, $axios}) {
|
||||
try {
|
||||
const portalQuery = params.portal
|
||||
const data = await $axios.get(`/api/public/getAllGallery?portal=${portalQuery}&type=${query.type}&page=${query.page}`)
|
||||
return {
|
||||
gallery: data.data
|
||||
}
|
||||
} catch (e) {
|
||||
error({status: 404})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user