nebula/components/announcement/list.vue
2021-07-01 10:14:04 +08:00

45 lines
1.3 KiB
Vue

<template>
<el-row class="wrapper">
<el-col :xs="24" :sm="24" :xl="24" style="margin: 0 auto;">
<el-carousel :interval="5000" height="210px" indicator-position="outside" arrow="always">
<el-carousel-item v-for="article in announcements.articles" :key="article.idArticle">
<el-card>
<div class="card-body d-flex flex-column">
<el-link :href="article.articleLink" style="margin-bottom: .7rem;">
<h4>
{{ article.articleTitle }}
<el-tag
style="margin-left: 0.5rem;"
size="mini"
effect="plain">
# 公告
</el-tag>
</h4>
</el-link>
<div class="text-muted article-summary-md">{{ article.articlePreviewContent }}</div>
<div style="margin-top: 1rem;">
<small class="d-block text-muted">发布于 {{ article.timeAgo }}</small>
</div>
</div>
</el-card>
</el-carousel-item>
</el-carousel>
</el-col>
</el-row>
</template>
<script>
export default {
name: "announcementList",
props: {
announcements: {
type: Object
}
}
}
</script>
<style scoped>
</style>