<template>
  <view class="container">
    <view v-for="item in announcementList" :key="item.id" class="item">
      <uni-card :extra="item.createTime" :title="item.title" @click="detail(item)"></uni-card>
    </view>
  </view>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import { getArticleList } from '@/api/article/article.js'

const announcementList = ref([])

// 获取公告列表
const fetchAnnouncementList = async () => {
  try {
    const res = await getArticleList({
      pageNum: '1',
      pageSize: '10',
    })
    console.log('文章列表:', res.rows)
    announcementList.value = res.rows || []
  } catch (error) {
    console.error('获取公告列表失败:', error)
  }
}

const detail = (item) => {
  uni.navigateTo({ 
    url: `/pages/announcementList/announcementDetail?id=${item.id}&title=${encodeURIComponent(item.title)}&content=${encodeURIComponent(item.content)}&createTime=${encodeURIComponent(item.createTime)}` 
  })
}

// 页面加载时获取数据
onMounted(() => {
  fetchAnnouncementList()
})
</script>

<style lang="scss" scoped>
.container {
  overflow: hidden;
  padding: 20rpx;
}

.item {
  margin-bottom: 20rpx;
}

.uni-body {
  font-size: 28rpx;
  line-height: 1.6;
  color: #666;
}
</style>
