Swift
78 lines
1.9 KiB
Vue
78 lines
1.9 KiB
Vue
<template>
|
|
<div class="bg-img-in" >
|
|
<user-dashboard-container page-class="announcements" panel-title="اعلانات" class="panelx">
|
|
<div v-for="item in userAnnouncements" :key="item._id" class="item" >
|
|
<el-collapse :key="item._id + 'co_parent'" accordion >
|
|
<el-collapse-item :key="item._id + 'co_item'" :name="item._id" >
|
|
<template slot="title">
|
|
<h3>{{ item.title }}</h3>
|
|
</template>
|
|
<div v-if="!item.image" class="col-12">
|
|
<p>{{ item.caption }}</p>
|
|
|
|
</div>
|
|
<div v-if="item.image" class="row">
|
|
<div class="col-md-6 col-sm-12">
|
|
<p>{{ item.caption }}</p>
|
|
|
|
</div>
|
|
<div class="col-md-6 col-sm-12">
|
|
<div class="fr-image">
|
|
<img :src="'/uploads/images/announcement/'+item.image" alt="">
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</el-collapse-item>
|
|
</el-collapse>
|
|
</div>
|
|
<h3 v-if="!userAnnouncements.length" style="text-align: center; margin-top: 50px">هیچ اعلانی موجود نیست</h3>
|
|
</user-dashboard-container>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'PublicAnnouncements',
|
|
|
|
data() {
|
|
return {
|
|
userAnnouncements:''
|
|
}
|
|
},
|
|
mounted(){
|
|
this.$axios.get('/api/public/announcement').then((res)=>{
|
|
|
|
this.userAnnouncements = res.data
|
|
|
|
})
|
|
}
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.bg-img-in{
|
|
background: url(@/static/assets/img/home/bg2.jpg);
|
|
background-size: cover;
|
|
background-repeat: no-repeat;
|
|
border-top: groove;
|
|
}
|
|
.panelx{
|
|
margin-top: 20%;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
width: 80% !important;
|
|
}
|
|
.fr-image{
|
|
width: 17rem;
|
|
height: 11rem;
|
|
margin: auto;
|
|
img{
|
|
width: 100%;
|
|
height:100%;
|
|
object-fit: cover;
|
|
border-radius: .5rem;
|
|
}
|
|
}
|
|
</style>
|
|
|