Files
yphsalumni.org/app/pages/index.vue
xiaomai 2ac1428c34 feat(members): add member ID to members list
This commit introduces a 'Member ID' column to the members table, making it the first column for easy reference.

- The member data schema and sample CSV have been updated to include the `memberId`.
- The members page now displays the `memberId` for each member.
- Additionally, a version query string has been added to the hero image URL to force a cache refresh.
2025-11-02 22:37:17 +08:00

74 lines
2.0 KiB
Vue

<template>
<UPage>
<!-- Hero Banner -->
<UPageHero
class="bg-cover bg-center"
style="
background-image: url(&quot;/hero-image-2.jpg?v=2&quot;);
background-position-y: -40px;
background-repeat: no-repeat;
background-color: rgba(255, 255, 255, 0.5); /* Semi-transparent black */
background-blend-mode: lighten;
"
title="连接校友 · 传承精神"
description="马来西亚柔佛永平中学校友会官方网站"
:links="heroCta"
/>
<!-- News Blog Posts -->
<UPageSection title="新闻与公告">
<UBlogPosts :posts="newsPost" />
</UPageSection>
<IndexEvents />
<IndexHallOfFame />
<!-- 捐赠模块 -->
<UPageCTA
class="bg-secondary"
title="支持与捐赠(功能暂未开放)"
description="您的捐赠将用于奖学金、校园建设及校友活动发展。感谢您对母校的支持!"
:links="donationLinks"
/>
</UPage>
</template>
<script lang="ts" setup>
import type { BlogPostProps } from "@nuxt/ui";
const heroCta = ref([
{
label: "立即加入我们",
to: "/join-us",
icon: "mdi:account-plus",
"data-umami-event": "Join Us Btn Click",
},
]);
// ========================================================
// 新闻模块
// ========================================================
const { data: news } = await useAsyncData("news", () =>
queryCollection("news").order("date", "DESC").limit(3).all()
);
// 将 news 数据转换成 UBlogPosts 可用格式
const newsPost = computed<BlogPostProps[]>(() =>
(news.value || []).map((n: any) => ({
title: n.title,
description: n.description,
image: n.cover,
date: n.date,
to: n.path, // ✅ 建议加路由跳转
variant: "subtle",
}))
);
// ========================================================
// 捐赠模块
// ========================================================
const donationLinks = ref([{ label: "立即捐赠", icon: "mdi:cash" }]);
</script>
<style></style>