2ac1428c34
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.
117 lines
3.0 KiB
Vue
117 lines
3.0 KiB
Vue
<template>
|
|
<UPage>
|
|
<UContainer>
|
|
<UPageHeader title="会员总览" description="查询每个会员的信息" />
|
|
<UPageBody>
|
|
<UTable :data="members" :columns="columns" />
|
|
</UPageBody>
|
|
</UContainer>
|
|
</UPage>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import type { TableColumn } from "@nuxt/ui";
|
|
import { z } from "zod";
|
|
|
|
useSeoMeta({
|
|
title: "会员总览",
|
|
description:
|
|
"永平中学校友会会员总览，查询每位校友的毕业年份、届别、加入年份与现居国家。",
|
|
keywords: "永平中学校友会, 校友会员, 毕业届别, 会员名录, 校友查询",
|
|
ogTitle: "永平中学校友会会员总览",
|
|
ogDescription: "浏览永平中学校友会会员资料，了解各届校友的分布与加入年份。",
|
|
// ogImage: "/members/ogImage.png",
|
|
ogType: "website",
|
|
});
|
|
|
|
const MemberSchema = z.object({
|
|
memberId: z.string(),
|
|
chineseName: z.string(),
|
|
englishName: z.string(),
|
|
// ic: z.string(),
|
|
// mobile: z.string(),
|
|
// home: z.string(),
|
|
// email: z.string(),
|
|
graduateLevel: z.string(),
|
|
graduateYear: z.string(),
|
|
// marriageNtatus: z.string(),
|
|
livingCountry: z.string(),
|
|
// addressLine1: z.string(),
|
|
// addressLine2: z.string(),
|
|
// addressLine3: z.string(),
|
|
joinedYear: z.string(),
|
|
// receiptNumber: z.string(),
|
|
});
|
|
|
|
type Member = z.infer<typeof MemberSchema>;
|
|
|
|
const { data: members } = await useAsyncData("members", async () => {
|
|
const file = await queryCollection("members").first();
|
|
// ✅ 关键点：取 meta.body
|
|
return MemberSchema.array().parse(file?.meta.body);
|
|
});
|
|
|
|
const columns: TableColumn<Member>[] = [
|
|
{
|
|
accessorKey: "memberId",
|
|
header: "会员编号",
|
|
},
|
|
{
|
|
accessorKey: "chineseName",
|
|
header: "中文姓名",
|
|
},
|
|
{
|
|
accessorKey: "englishName",
|
|
header: "英文姓名",
|
|
},
|
|
{
|
|
accessorKey: "graduateYear",
|
|
header: "毕业/离校年份",
|
|
},
|
|
{
|
|
accessorKey: "graduateLevel",
|
|
header: "毕业/离校届别",
|
|
cell: ({ row }) => {
|
|
switch (row.original.graduateLevel) {
|
|
case "j":
|
|
// 初中毕业
|
|
// 如果 row.original.graduateYear 不能转换成数字，就写成初中毕业
|
|
// 否则计算届别
|
|
return isNaN(Number(row.original.graduateYear))
|
|
? "初中毕业"
|
|
: `初中第 ${Number(row.original.graduateYear) - 1958} 届`;
|
|
case "s":
|
|
// 高中毕业
|
|
return isNaN(Number(row.original.graduateYear))
|
|
? "高中毕业"
|
|
: `高中第 ${Number(row.original.graduateYear) - 1965} 届`;
|
|
case "dj1":
|
|
return "初一肆业";
|
|
case "dj2":
|
|
return "初二肆业";
|
|
case "dj3":
|
|
return "初三肆业";
|
|
case "ds1":
|
|
return "高一肆业";
|
|
case "ds2":
|
|
return "高二肆业";
|
|
case "ds3":
|
|
return "高三肆业";
|
|
default:
|
|
break;
|
|
}
|
|
},
|
|
},
|
|
{
|
|
accessorKey: "joinedYear",
|
|
header: "加入年份",
|
|
},
|
|
{
|
|
accessorKey: "livingCountry",
|
|
header: "现居国家",
|
|
},
|
|
];
|
|
</script>
|
|
|
|
<style></style>
|