Files
asan-service/pages/warranty-terms/index.vue
T
2023-08-17 13:05:51 +03:30

89 lines
2.5 KiB
Vue

<template>
<div class="warranty-terms--page page">
<hero title="شرایط گارانتی" />
<section class="s1">
<div class="container">
<div class="row">
<div v-for="item in warranties.docs" :key="item._id" class="col-12 col-xl-6 mb-3">
<div class="term fadeInAnim">
<div class="imgBox">
<img :src="item.image" :alt="item.title" />
</div>
<div class="txtBox">
<h2>{{ item.title }}</h2>
<p>{{ item.short_description }}</p>
<button class="btn btn-primary" @click.prevent="showTerms(item._id)">مشاهده</button>
</div>
</div>
</div>
<div v-if="!warranties.docs.length" class="col-12 no-post">
<h2>هیچ پستی در این صفحه وجود نداد.</h2>
</div>
</div>
</div>
</section>
<section v-if="warranties.totalPages > 1" class="s2">
<div class="row">
<div class="col-12">
<el-pagination
layout="prev, pager, next"
:current-page="Number($route.params.page)"
:page-count="Number(warranties.totalPages)"
@current-change="pageNumber"
>
</el-pagination>
</div>
</div>
</section>
<el-dialog v-if="modalContent" :title="modalContent.title" :visible.sync="termModal">
<div class="ck-content" v-html="modalContent.description"></div>
<span slot="footer" class="dialog-footer">
<el-button class="submit" type="primary" @click="termModal = false">بستن</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import FadeInAnimation from '~/mixins/FadeInAnimation'
export default {
name: 'WarrantyTermsPage',
mixins: [FadeInAnimation],
async asyncData({ $axios, query, error }) {
try {
const warranties = await $axios.get(`/api/public/warranty/page/${query.page}`)
return {
warranties: warranties.data
}
} catch (e) {
error({ status: 404, message: 'PAGE NOT FOUND' })
}
},
data() {
return {
termModal: false,
warranties: null,
modalContent: null
}
},
head() {
return {
title: 'آسان سرویس | شرایط گارانتی'
}
},
methods: {
showTerms(id) {
this.termModal = true
this.modalContent = this.warranties.docs.filter(item => item._id === id)[0]
},
pageNumber(val) {
this.$router.push({ name: 'warranty-terms-page', params: { page: val } })
}
}
}
</script>