feat(ui): implement responsive header and update content
Adds a responsive header with a mobile navigation menu to improve usability on small screens. This also includes adding a new event page, updating an existing event with a schedule, and refactoring the 'Donate' CTA by inlining it on the homepage.
This commit is contained in:
@@ -1,14 +0,0 @@
|
|||||||
<template>
|
|
||||||
<UPageCTA
|
|
||||||
class="bg-secondary"
|
|
||||||
title="支持与捐赠"
|
|
||||||
description="您的捐赠将用于奖学金、校园建设及校友活动发展。感谢您对母校的支持!"
|
|
||||||
:links="donationLinks"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script lang="ts" setup>
|
|
||||||
const donationLinks = ref([{ label: "立即捐赠", icon: "mdi:cash" }]);
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style></style>
|
|
||||||
@@ -1,28 +1,31 @@
|
|||||||
<template>
|
<template>
|
||||||
<!-- 活动模块 -->
|
<!-- 活动模块 -->
|
||||||
<UPageSection title="校友活动" class="bg-gray-100">
|
<UPageSection title="校友活动" class="bg-gray-100">
|
||||||
<div class="grid md:grid-cols-3 gap-6">
|
<UPageGrid>
|
||||||
<div
|
<div
|
||||||
v-for="event in events"
|
v-for="event in events"
|
||||||
:key="event.id"
|
:key="event.id"
|
||||||
class="bg-white shadow rounded-xl"
|
class="bg-white shadow rounded-xl"
|
||||||
>
|
>
|
||||||
<img :src="event.cover" :alt="event.title" class="rounded-xl" />
|
<img
|
||||||
|
:src="event.cover"
|
||||||
|
:alt="event.title"
|
||||||
|
class="w-full aspect-[16/9] object-cover rounded-t-xl"
|
||||||
|
/>
|
||||||
<div class="p-6">
|
<div class="p-6">
|
||||||
<h4 class="font-semibold text-lg mb-2">{{ event.title }}</h4>
|
<h4 class="font-semibold text-lg mb-2">{{ event.title }}</h4>
|
||||||
<p class="text-sm text-gray-600 mb-1">
|
<p class="text-sm text-gray-600 mb-1">
|
||||||
日期:{{ useChineseDateFormat(event.date) }}
|
日期:{{ useChineseDateFormat(event.date) }}
|
||||||
</p>
|
</p>
|
||||||
<p class="text-sm text-gray-600 mb-4">地点:{{ event.location }}</p>
|
<p class="text-sm text-gray-600 mb-4">地点:{{ event.location }}</p>
|
||||||
<!-- <a
|
<UButton
|
||||||
:href="event.path"
|
label="阅读详情"
|
||||||
class="bg-primary text-white px-5 py-2 rounded-lg hover:opacity-90"
|
:to="event.path"
|
||||||
>阅读详情</a
|
trailing-icon="mdi:book-open-blank-variant-outline"
|
||||||
> -->
|
/>
|
||||||
<UButton label="阅读详情" :to="event.path" trailing-icon="mdi:glasses"/>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</UPageGrid>
|
||||||
</UPageSection>
|
</UPageSection>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
@@ -2,11 +2,18 @@
|
|||||||
<UPage>
|
<UPage>
|
||||||
<UHeader>
|
<UHeader>
|
||||||
<template #left>
|
<template #left>
|
||||||
|
<NuxtLink to="/">
|
||||||
|
<div class="flex gap-4 items-center">
|
||||||
<img class="inline h-12 w-auto" src="/Logo.svg" alt="YPHS Alumni" />
|
<img class="inline h-12 w-auto" src="/Logo.svg" alt="YPHS Alumni" />
|
||||||
<h1 class="inline text-xl font-bold text-gray-900">
|
<h1
|
||||||
<a href="/" class="ml-4 hover:text-primary">永平中学校友会</a>
|
class="inline text-xl font-bold text-gray-900 hover:text-primary"
|
||||||
|
>
|
||||||
|
永平中学校友会
|
||||||
</h1>
|
</h1>
|
||||||
|
</div>
|
||||||
|
</NuxtLink>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<template #right>
|
<template #right>
|
||||||
<nav class="space-x-6 hidden md:flex items-center">
|
<nav class="space-x-6 hidden md:flex items-center">
|
||||||
<UNavigationMenu :items="items" />
|
<UNavigationMenu :items="items" />
|
||||||
@@ -19,10 +26,20 @@
|
|||||||
</a>
|
</a>
|
||||||
</nav>
|
</nav>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
<template #body>
|
||||||
|
<UNavigationMenu
|
||||||
|
:items="items"
|
||||||
|
orientation="vertical"
|
||||||
|
class="-mx-2.5"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
</UHeader>
|
</UHeader>
|
||||||
|
|
||||||
<UMain>
|
<UMain>
|
||||||
<slot />
|
<slot />
|
||||||
</UMain>
|
</UMain>
|
||||||
|
|
||||||
<UFooter>
|
<UFooter>
|
||||||
<template #left>
|
<template #left>
|
||||||
<p>© 2025 永平中学校友会. 保留所有权利.</p>
|
<p>© 2025 永平中学校友会. 保留所有权利.</p>
|
||||||
@@ -39,9 +56,7 @@
|
|||||||
>
|
>
|
||||||
Tootaio Studio
|
Tootaio Studio
|
||||||
</a>
|
</a>
|
||||||
<span class="mt-1 text-sm"
|
<span class="mt-1 text-sm">2018 级毕业学长(麦祖奕)</span>
|
||||||
>2018 级毕业学长(麦祖奕)</span
|
|
||||||
>
|
|
||||||
</p>
|
</p>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
@@ -20,13 +20,21 @@
|
|||||||
|
|
||||||
<IndexEvents />
|
<IndexEvents />
|
||||||
<IndexHallOfFame />
|
<IndexHallOfFame />
|
||||||
<IndexDonate />
|
|
||||||
|
<!-- 捐赠模块 -->
|
||||||
|
<UPageCTA
|
||||||
|
class="bg-secondary"
|
||||||
|
title="支持与捐赠(功能暂未开放)"
|
||||||
|
description="您的捐赠将用于奖学金、校园建设及校友活动发展。感谢您对母校的支持!"
|
||||||
|
:links="donationLinks"
|
||||||
|
/>
|
||||||
|
|
||||||
<IndexAbout />
|
<IndexAbout />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import type { BlogPostProps, PageCardProps } from "@nuxt/ui";
|
import type { BlogPostProps } from "@nuxt/ui";
|
||||||
|
|
||||||
const heroCta = ref([
|
const heroCta = ref([
|
||||||
{
|
{
|
||||||
@@ -56,11 +64,9 @@ const newsPost = computed<BlogPostProps[]>(() =>
|
|||||||
);
|
);
|
||||||
|
|
||||||
// ========================================================
|
// ========================================================
|
||||||
// 活动模块
|
// 捐赠模块
|
||||||
// ========================================================
|
// ========================================================
|
||||||
const { data: events } = await useAsyncData("events", () =>
|
const donationLinks = ref([{ label: "立即捐赠", icon: "mdi:cash" }]);
|
||||||
queryCollection("events").order("date", "DESC").limit(3).all()
|
|
||||||
);
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style></style>
|
<style></style>
|
||||||
|
|||||||
@@ -42,6 +42,31 @@ cover: "/events/20250927-return-to-school/event-photo-1.jpg"
|
|||||||
|
|
||||||
午宴当天,永中二十四节令鼓队与舞蹈社学员带来精彩表演,“永中之星 1.0”歌唱赛校友组冠军 **黄秋慧** 与学生组冠军 **林妤桐** 亦倾情献唱。现场欢声笑语不断,气氛热烈温馨,为会庆增添了浓厚的节日色彩。
|
午宴当天,永中二十四节令鼓队与舞蹈社学员带来精彩表演,“永中之星 1.0”歌唱赛校友组冠军 **黄秋慧** 与学生组冠军 **林妤桐** 亦倾情献唱。现场欢声笑语不断,气氛热烈温馨,为会庆增添了浓厚的节日色彩。
|
||||||
|
|
||||||
|
## 午宴 • 流程表
|
||||||
|
|
||||||
|
| 时间 | 流程 |
|
||||||
|
| ------- | ----------------------------------------------------------------------- |
|
||||||
|
| 12.30pm | 二十四节令鼓迎宾/校友交流 |
|
||||||
|
| 01.00pm | 仪式开始 |
|
||||||
|
| 01.02pm | 唱国歌州歌 |
|
||||||
|
| 01.05pm | 大会主席李煜斌致欢迎词 |
|
||||||
|
| 01.10pm | 大会开幕嘉宾-投资贸易及工业部副部长暨伊斯干达公主城国会议员YB刘镇东致词 |
|
||||||
|
| | 赠送纪念品给予大会开幕嘉宾 |
|
||||||
|
| 01.20pm | 大会荣誉嘉宾-亚依淡区国会议员拿督斯里YB魏家祥博士工程师致辞 |
|
||||||
|
| | 赠送纪念品给予大会荣誉嘉宾 |
|
||||||
|
| 01.25pm | 大会荣誉嘉宾-柔佛州行政议员暨永平区州议员 YB 林添顺致词 |
|
||||||
|
| | 赠送纪念品给予大会荣誉嘉宾 |
|
||||||
|
| 01.40pm | 永平中学-舞蹈团表演 |
|
||||||
|
| 01.50pm | 永平中学张嘉群校长致词 |
|
||||||
|
| 01.55pm | 切生日蛋糕 |
|
||||||
|
| 02.00pm | 播放上午校友回校活动 |
|
||||||
|
| 02.05pm | 永中之星1.0冠军得主表演(校友组-黄秋慧,及在籍学生组-林妤桐) |
|
||||||
|
| 02.35pm | 工委会主席蓝宜宏学长致谢词 |
|
||||||
|
| 02.40pm | 永中校友会理事会带领唱校歌 |
|
||||||
|
| 02.45pm | 欢送嘉宾离席 |
|
||||||
|
|
||||||
|
我们 40 周年庆再会!感谢大家的莅临!感恩!
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
<iframe
|
<iframe
|
||||||
|
|||||||
79
content/events/20251009-roulian-xiaoyouhui-20th.md
Normal file
79
content/events/20251009-roulian-xiaoyouhui-20th.md
Normal file
@@ -0,0 +1,79 @@
|
|||||||
|
---
|
||||||
|
title: "柔联校友会 20 届历史就职典礼"
|
||||||
|
subtitle: "中学生写作比赛颁奖"
|
||||||
|
date: "2025-10-09"
|
||||||
|
location: "富华冷气酒家 2 楼"
|
||||||
|
cover: "/events/20251009-roulian-xiaoyouhui-20th/event-photo-1.jpg"
|
||||||
|
---
|
||||||
|
# 柔联校友会 20 届历史就职典礼
|
||||||
|
|
||||||
|
柔佛州华校校友联合会日前举办第 20 届理事就职典礼与 2025 年 “林赛花教育基金” 柔佛州中学生现场写作比赛颁奖典礼,由马来西亚华校校友会联合总会会长萧成兴担任监誓人。
|
||||||
|
|
||||||
|
联合会主席陈星和在致词时强调,华教事业的发展离不开团结与传承,新一届理事会将继续致力于推动华文教育,弘扬中华文化。
|
||||||
|
|
||||||
|
## 柔佛州华校校友会联合会
|
||||||
|
|
||||||
|
### 第20届理事会
|
||||||
|
|
||||||
|
| 职位 | 姓名 |
|
||||||
|
| ---------- | ---------------------------------------------- |
|
||||||
|
| 主席 | 陈星和 |
|
||||||
|
| 副主席 | 陈月丽、陈重存、颜青积 |
|
||||||
|
| 总务 | 李秀琴 |
|
||||||
|
| 副总务 | 李煜斌 |
|
||||||
|
| 财政 | 陈保妤 |
|
||||||
|
| 副财政 | 吴沺成 |
|
||||||
|
| 文书 | 莫文豪 |
|
||||||
|
| 副文书 | 林道民 |
|
||||||
|
| 教育主任 | 姚理介 |
|
||||||
|
| 副教育主任 | 陈成祖 |
|
||||||
|
| 文娱主任 | 郑臻董 |
|
||||||
|
| 副文娱主任 | 梁德荣 |
|
||||||
|
| 联络主任 | 郑伟亮 |
|
||||||
|
| 副联络主任 | 郑清华 |
|
||||||
|
| 查账 | 涂馨尹、谢祥庆 |
|
||||||
|
| 理事 | 何国光、吕哲明、罗升隆、黄如龙、郑明裕、温维华 |
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
赞助金移交仪式上,妙妙机构执行董事荘坡政将赞助金移交给峇株文艺协会,以支持文艺出版与推广工作,随后颁发奖状与奖金给 26 名获奖学生。
|
||||||
|
|
||||||
|
## 🏆 2025年“林賽花教育基金”柔佛州中學生現場寫作比賽得獎名單
|
||||||
|
|
||||||
|
### 🥇 初中组
|
||||||
|
|
||||||
|
| 奖项 | 姓名 | 学校 |
|
||||||
|
| ------ | ------ | ------------------ |
|
||||||
|
| 特优奖 | 彭艺元 | 居銮中华中学 |
|
||||||
|
| 特优奖 | 黄守蒽 | 居銮中华中学 |
|
||||||
|
| 特优奖 | 方乐颖 | 居銮中华中学 |
|
||||||
|
| 优秀奖 | 余姿亿 | 永平中学 |
|
||||||
|
| 优秀奖 | 廖玮乐 | 永平中学 |
|
||||||
|
| 优秀奖 | 卓婧琳 | 峇株吧辖华仁中学 |
|
||||||
|
| 优秀奖 | 叶贯均 | 峇株吧辖华仁中学 |
|
||||||
|
| 优秀奖 | 董清清 | 峇株吧辖华仁中学 |
|
||||||
|
| 优秀奖 | 林婉仪 | 峇株吧辖华仁中学 |
|
||||||
|
| 优秀奖 | 陈惠敏 | 峇株吧辖华仁中学 |
|
||||||
|
| 优秀奖 | 曾愉峻 | 居銮中华中学 |
|
||||||
|
| 优秀奖 | 曾佳滢 | 利丰港培华独立中学 |
|
||||||
|
| 优秀奖 | 陆颖霏 | 新山宽柔中学 |
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### 🥈 高中组
|
||||||
|
|
||||||
|
| 奖项 | 姓名 | 学校 |
|
||||||
|
| ------ | ------ | ---------------- |
|
||||||
|
| 特优奖 | 王祺齐 | 永平中学 |
|
||||||
|
| 特优奖 | 汤滢菲 | 居銮中华中学 |
|
||||||
|
| 特优奖 | 陈思宇 | 居銮中华中学 |
|
||||||
|
| 优秀奖 | 黄婉芯 | 拿督国中 |
|
||||||
|
| 优秀奖 | 林欣慧 | 拿督国中 |
|
||||||
|
| 优秀奖 | 蔡欣艳 | 拿督国中 |
|
||||||
|
| 优秀奖 | 许恩芮 | 永平中学 |
|
||||||
|
| 优秀奖 | 陈佳萱 | 宽柔中学古来分校 |
|
||||||
|
| 优秀奖 | 苏新致 | 永平中学 |
|
||||||
|
| 优秀奖 | 刘祈悦 | 峇株吧辖华仁中学 |
|
||||||
|
| 优秀奖 | 林淳希 | 峇株吧辖华仁中学 |
|
||||||
|
| 优秀奖 | 黄子宸 | 新山宽柔中学 |
|
||||||
|
| 优秀奖 | 苏祐萱 | 新山宽柔中学 |
|
||||||
BIN
public/events/20251009-roulian-xiaoyouhui-20th/event-photo-1.jpg
Normal file
BIN
public/events/20251009-roulian-xiaoyouhui-20th/event-photo-1.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 58 KiB |
Reference in New Issue
Block a user