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.
117 lines
2.4 KiB
117 lines
2.4 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 announcements" :key="index"
|
|
@click="$utils.navigateTo(`/pages_order/announcement/announcementDetail?id=${item.id}`)">
|
|
<view class="item-left">
|
|
<text class="tag">通讯</text>
|
|
<text class="title">{{ item.title }}</text>
|
|
</view>
|
|
<view class="item-right">
|
|
<uv-icon name="arrow-right" color="#C8C8C8" size="28rpx"></uv-icon>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
announcements: [{
|
|
id: 1,
|
|
title: '2025年2月平台福利活动拟获奖作品公示',
|
|
type: '通讯'
|
|
},
|
|
{
|
|
id: 2,
|
|
title: '2025年2月平台福利活动拟获奖作品公示',
|
|
type: '通讯'
|
|
},
|
|
{
|
|
id: 3,
|
|
title: '2025年2月平台福利活动拟获奖作品公示',
|
|
type: '通讯'
|
|
},
|
|
{
|
|
id: 4,
|
|
title: '2025年2月平台福利活动拟获奖作品公示',
|
|
type: '通讯'
|
|
},
|
|
{
|
|
id: 5,
|
|
title: '2025年2月平台福利活动拟获奖作品公示',
|
|
type: '通讯'
|
|
},
|
|
{
|
|
id: 6,
|
|
title: '2025年2月平台福利活动拟获奖作品公示',
|
|
type: '通讯'
|
|
},
|
|
{
|
|
id: 7,
|
|
title: '2025年2月平台福利活动拟获奖作品公示',
|
|
type: '通讯'
|
|
}
|
|
]
|
|
}
|
|
},
|
|
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>
|