小说小程序前端代码仓库(小程序)
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

84 lines
1.7 KiB

<template>
<view class="announcements-container">
<navbar title="全部公告" leftClick @leftClick="$utils.navigateBack" />
<view class="announcements-list">
<view class="announcement-item" v-for="(item, index) in list" :key="index"
@click="$utils.navigateTo(`/pages_order/announcement/announcementDetail?id=${item.id}`)">
<view class="item-left">
<text class="tag">{{ item.title }}</text>
<text class="title">{{ item.titleText }}</text>
</view>
<view class="item-right">
<uv-icon name="arrow-right" color="#C8C8C8" size="28rpx"></uv-icon>
</view>
</view>
</view>
</view>
</template>
<script>
import mixinsList from '@/mixins/list.js'
export default {
mixins: [mixinsList],
data() {
return {
mixinsListApi : 'getNoticePage',
}
},
methods: {
}
}
</script>
<style lang="scss">
.announcements-container {
min-height: 100vh;
background-color: #F8F8F8;
.announcements-list {
padding: 20rpx;
.announcement-item {
display: flex;
justify-content: space-between;
align-items: center;
background-color: #FFFFFF;
padding: 30rpx;
margin-bottom: 20rpx;
border-radius: 12rpx;
.item-left {
flex: 1;
margin-right: 20rpx;
.tag {
display: inline-block;
font-size: 24rpx;
color: #666666;
background-color: #F5F5F5;
padding: 4rpx 12rpx;
border-radius: 6rpx;
margin-bottom: 16rpx;
}
.title {
display: block;
font-size: 28rpx;
color: #333333;
line-height: 1.4;
}
}
.item-right {
display: flex;
align-items: center;
}
&:active {
background-color: #F9F9F9;
}
}
}
}
</style>