<template>
  <UPage>
    <UPageHeader
      :title="`第 ${generation} 届组织架构`"
      description="精英汇聚，携手共创卓越未来"
    />
    <UPageBody>
      <UPageSection
        v-for="category in categories"
        :key="category"
        :title="category"
      >
        <!-- <h2 class="text-3xl font-extrabold text-center mb-10">领导团队</h2> -->
        <UPageGrid class="!grid-cols-1 sm:!grid-cols-2 lg:!grid-cols-4">
          <UCard
            v-for="person in orgStructure.filter((p) => p.category == category)"
            :key="person.name"
          >
            <template #header>
              <h3 class="text-xl font-semibold mb-2">{{ person.position }}</h3>
              <div class="text-2xl font-bold">{{ person.name }}</div>
            </template>
            <template #default>
              <div class="text-center">
                <img
                  class="h-40 w-auto object-contain inline rounded-md"
                  :src="person.photo"
                  :alt="person.name"
                />
              </div>
            </template>
            <template #footer
              ><p class="text-muted">{{ person.description }}</p></template
            >
          </UCard>
        </UPageGrid>
      </UPageSection>
    </UPageBody>
  </UPage>
</template>

<script lang="ts" setup>
useSeoMeta({
  title: "组织架构",
  description:
    "永平中学校友会组织架构，领导团队、职能部门与专项部门精英汇聚，携手共创卓越未来。",
  keywords:
    "永平中学校友会, 校友会组织架构, 领导团队, 职能部门, 专项部门, 理事会成员",
  ogTitle: "永平中学校友会组织架构",
  ogDescription:
    "了解永平中学校友会的领导团队、职能与专项部门，见证校友情谊与组织力量。",
  ogImage: "/org-structure/ogImage.png",
  ogType: "website",
});

const route = useRoute();
const generation = route.params.slug;

const categories = ref(["领导团队", "职能部门", "专项部门"]);

// TODO: Fetch from api
const orgStructure = ref([
  {
    name: "李煜斌",
    position: "主席",
    category: "领导团队",
    photo: "/org-structure/李煜斌.png",
    description:
      "全面领导与战略决策，统筹理事会整体工作，确保组织愿景与使命的实现。",
  },
  {
    name: "郑惠忠",
    position: "副主席",
    category: "领导团队",
    photo: "/org-structure/郑惠忠.png",
    description: "协助主席制定战略方向，分管外部关系与合作伙伴发展。",
  },
  {
    name: "陈月丽",
    position: "副主席",
    category: "领导团队",
    photo: "/org-structure/陈月丽.png",
    description: "协助主席处理内部事务，分管人力资源与组织文化建设。",
  },
  {
    name: "余东照",
    position: "副主席",
    category: "领导团队",
    photo: "/org-structure/余东照.png",
    description: "协助主席推动重点项目，分管创新业务与发展规划。",
  },
  {
    name: "蓝宜宏",
    position: "秘书",
    category: "职能部门",
    photo: "/org-structure/蓝宜宏.png",
    description: "文件管理、会议组织、行政协调与日常事务处理。",
  },
  {
    name: "陈冠宇",
    position: "副秘书",
    category: "职能部门",
    photo: "/org-structure/陈冠宇.png",
    description: "协助秘书处理文档、会议安排与行政支持工作。",
  },
  {
    name: "余粝栎",
    position: "财政",
    category: "职能部门",
    photo: "/org-structure/余粝栎.png",
    description: "全面财务管理、预算控制、资金运作与财务报告。",
  },
  {
    name: "曾国书",
    position: "副财政",
    category: "职能部门",
    photo: "/org-structure/曾国书.jpg",
    description: "协助财政处理账务、报销与日常财务管理工作。",
  },
  {
    name: "颜志宝",
    position: "总务",
    category: "职能部门",
    photo: "/org-structure/颜志宝.png",
    description: "物资采购、资产管理、场地协调与后勤保障服务。",
  },
  {
    name: "温敬富",
    position: "副总务",
    category: "职能部门",
    photo: "/org-structure/温敬富.png",
    description: "协助总务处理物资管理、设备维护与后勤支持。",
  },
  {
    name: "胡少菲",
    position: "康乐",
    category: "职能部门",
    photo: "/org-structure/胡少菲.png",
    description: "文化活动策划、康乐项目组织与会员联谊活动。",
  },
  {
    name: "林剑宝",
    position: "副康乐",
    category: "职能部门",
    photo: "/org-structure/林剑宝.png",
    description: "协助文康组织文体活动、兴趣小组与社交聚会。",
  },
  {
    name: "余美枫",
    position: "福利主任",
    category: "专项部门",
    photo: "/org-structure/余美枫.png",
    description: "会员福利规划、实施与评估，提升会员满意度。",
  },
  {
    name: "郑惠国",
    position: "副福利主任",
    category: "专项部门",
    photo: "/org-structure/郑惠国.png",
    description: "协助会员福利规划、实施与评估，提升会员满意度。",
  },
  {
    name: "程靖原",
    position: "会员籍暨咨询管理",
    category: "专项部门",
    photo: "/org-structure/程靖原.png",
    description: "会员信息管理、咨询服务提供与会员关系维护。",
  },
  {
    name: "许福源",
    position: "副会员籍暨咨询管理",
    category: "专项部门",
    photo: "/org-structure/许福源.png",
    description: "协助会员管理、咨询响应与信息系统维护。",
  },
  {
    name: "麦祖奕",
    position: "副会员籍暨咨询管理",
    category: "专项部门",
    photo: "/org-structure/麦祖奕.png",
    description: "协助会员管理、咨询响应与信息系统开发。",
  },
  {
    name: "许浩铭",
    position: "奖励金主任",
    category: "专项部门",
    photo: "/org-structure/许浩铭.png",
    description: "奖励金制度设计、评审组织与发放管理。",
  },
  {
    name: "黄楚茵",
    position: "副奖励金主任",
    category: "专项部门",
    photo: "/org-structure/黄楚茵.png",
    description: "协助奖励金评审、资料审核与发放流程管理。",
  },
  {
    name: "陈廷添",
    position: "理事",
    category: "专项部门",
    photo: "/org-structure/陈廷添.png",
    description: "参与理事会决策、专项工作推进与建议提出。",
  },
  {
    name: "邱康勤",
    position: "理事",
    category: "专项部门",
    photo: "/org-structure/邱康勤.png",
    description: "参与理事会决策、专项工作推进与建议提出。",
  },
  {
    name: "张键国",
    position: "稽查",
    category: "专项部门",
    photo: "/org-structure/张键国.png",
    description: "内部审计、合规监督与风险控制管理。",
  },
  {
    name: "许皓杰",
    position: "稽查",
    category: "专项部门",
    photo: "/org-structure/许皓杰.png",
    description: "内部审计、合规监督与风险控制管理。",
  },
]);
</script>

<style></style>
