メンバーの更新

src/components/organisms/Member.vue

@@ -5,88 +5,27 @@
       <div class="member__content">
         <div class="member__content-cards">
           <ParticleMemberItem
-            imagePath="takonasu"
-            name="たこなす"
-            desc="発起人。iOS、総務担当。大学院情報理工所属。"
-            :link="{ text: 'takonasu.net', href: 'https://takonasu.net' }"
-            :iconLinks="{
-              github: 'https://github.com/takonasu',
-              twitter: 'https://twitter.com/ITF_tako',
-            }"
-          ></ParticleMemberItem>
-          <ParticleMemberItem
-            imagePath="siy1121"
-            name="SIY1121"
-            desc="バックエンド・Android担当。大学院情報理工所属。"
-            :link="{ text: 'siy.space', href: 'https://siy.space/' }"
-            :iconLinks="{
-              github: 'https://github.com/SIY1121',
-              twitter: 'https://twitter.com/SIY1121',
-            }"
-          ></ParticleMemberItem>
-          <ParticleMemberItem
-            imagePath="takonomura"
-            name="takonomura"
-            desc="インフラ担当。情報科学類所属。"
-            :link="{ text: '', href: '' }"
-            :iconLinks="{
-              github: 'https://github.com/takonomura',
-              twitter: '',
+            v-for="(member, index) in activeMembers"
+            :key="index"
+            :imagePath="member.imagePath"
+            :name="member.name"
+            :desc="member.description"
+            :link="{
+              text: member.links.website?.label || '',
+              href: member.links.website?.url || '',
             }"
-          ></ParticleMemberItem>
-          <ParticleMemberItem
-            imagePath="hosokawar"
-            name="HosokawaR"
-            desc="フロントエンド担当。情報科学類所属。"
-            :link="{ text: '', href: '' }"
-            :iconLinks="{
-              github: 'https://github.com/HosokawaR',
-              twitter: '',
-            }"
-          ></ParticleMemberItem>
-          <ParticleMemberItem
-            imagePath="hayatoshishido"
-            name="Hayato Shishido"
-            desc="フロントエンド担当。社会工学類所属。"
-            :link="{ text: '', href: '' }"
-            :iconLinks="{
-              github: 'https://github.com/hayato24s',
-              twitter: '',
-            }"
-          ></ParticleMemberItem>
-          <ParticleMemberItem
-            imagePath="raspi0124"
-            name="raspi0124"
-            desc="知識情報・図書館学類所属。"
-            :link="{ text: 'raspi0124.dev', href: 'https://raspi0124.dev' }"
-            :iconLinks="{
-              github: 'https://github.com/raspi0124',
-              twitter: 'https://twitter.com/raspi0124',
-            }"
-          ></ParticleMemberItem>
-          <ParticleMemberItem
-            imagePath="kichi2004"
-            name="Takayuki Ueno (kichi2004)"
-            desc="情報科学類所属。"
-            :link="{ text: 'kichi2004.jp', href: 'https://kichi2004.jp/' }"
-            :iconLinks="{
-              github: 'https://github.com/kichi2004',
-              twitter: 'https://twitter.com/kichi2004_',
-            }"
-          ></ParticleMemberItem>
-          <ParticleMemberItem
-            imagePath="azarashi"
-            name="あざらし"
-            desc="情報科学類所属。ブラウザ拡張機能担当。"
-            :link="{ text: 'azr.sh', href: 'https://azr.sh/' }"
             :iconLinks="{
-              github: 'https://github.com/azarashi2931',
-              twitter: 'https://twitter.com/azarashi_uni',
+              github: member.links.githubId
+                ? `https://github.com/${member.links.githubId}`
+                : '',
+              twitter: member.links.twitterId
+                ? `https://x.com/${member.links.twitterId}`
+                : '',
             }"
           ></ParticleMemberItem>
         </div>
         <div class="member__content-link opacity2">
-          <NuxtLink to="./othermember">その他のメンバー &gt;</NuxtLink>
+          <NuxtLink to="./othermember">OB / OG &gt;</NuxtLink>
         </div>
       </div>
     </Suspense>
@@ -95,9 +34,15 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
+import { members } from './members';
 
 export default defineComponent({
   setup: () => {},
+  data() {
+    return {
+      activeMembers: members.filter((member) => member.isActive),
+    };
+  },
 });
 </script>
 

src/components/organisms/OtherMember.vue

@@ -1,54 +1,26 @@
 <template>
   <section id="other-member" class="other-member">
-    <ParticleSectionTitle title="その他のメンバー" />
+    <ParticleSectionTitle title="OB / OG" />
     <Suspense>
       <div class="other-member__content">
         <div class="other-member__content-cards">
           <ParticleMemberItem
-            imagePath="hikaruegashira"
-            name="Hikaru Egashira"
-            desc="元フロントエンド担当。情報科学類出身。"
-            :link="{ text: 'egahika.dev', href: 'https://egahika.dev' }"
-            :iconLinks="{
-              github: 'https://github.com/HikaruEgashira',
-              twitter: 'https://twitter.com/ITF_hikary',
-            }"
-          ></ParticleMemberItem>
-
-          <ParticleMemberItem
-            imagePath="kanadenishizawa"
-            name="Kanade Nishizawa"
-            desc="元デザイン担当。芸術専門学群出身。"
+            v-for="(member, index) in otherMembers"
+            :key="index"
+            :imagePath="member.imagePath"
+            :name="member.name"
+            :desc="member.description"
             :link="{
-              text: 'kanade-works.web.app',
-              href: 'https://kanade-works.web.app',
-            }"
-            :iconLinks="{
-              github: 'https://github.com/KanadeNishizawa',
-              twitter: '',
+              text: member.links.website?.label || '',
+              href: member.links.website?.url || '',
             }"
-          ></ParticleMemberItem>
-          <ParticleMemberItem
-            imagePath="kensukesuzuki"
-            name="Kensuke Suzuki"
-            desc="寄付ページ担当。情報科学類出身。"
-            :link="{
-              text: 'momokichi.github.io',
-              href: 'https://momokichi.github.io/',
-            }"
-            :iconLinks="{
-              github: 'https://github.com/momokichi',
-              twitter: '',
-            }"
-          ></ParticleMemberItem>
-          <ParticleMemberItem
-            imagePath="yuku"
-            name="ゆうく"
-            desc="バックエンド担当。無職。"
-            :link="{ text: '', href: '' }"
             :iconLinks="{
-              github: 'https://github.com/Monchi',
-              twitter: 'https://twitter.com/LOST_JINKEN',
+              github: member.links.githubId
+                ? `https://github.com/${member.links.githubId}`
+                : '',
+              twitter: member.links.twitterId
+                ? `https://x.com/${member.links.twitterId}`
+                : '',
             }"
           ></ParticleMemberItem>
         </div>
@@ -62,9 +34,15 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
+import { members } from './members';
 
 export default defineComponent({
   setup: () => {},
+  data() {
+    return {
+      otherMembers: members.filter((member) => !member.isActive),
+    };
+  },
 });
 </script>
 

src/components/organisms/members.ts

@@ -0,0 +1,191 @@
+export type Member = {
+  name: string;
+  imagePath: string;
+  description: string;
+  isActive: boolean;
+  links: {
+    githubId?: string;
+    twitterId?: string;
+    website?: {
+      label: string;
+      url: string;
+    };
+  };
+};
+
+export const members: Member[] = [
+  {
+    isActive: false,
+    name: 'たこなす',
+    imagePath: 'takonasu',
+    description: '発起人。iOS、総務担当。大学院情報理工所属。',
+    links: {
+      website: {
+        label: 'https://takonasu.net',
+        url: 'https://takonasu.net',
+      },
+      githubId: 'takonasu',
+      twitterId: 'ITF_tako',
+    },
+  },
+  {
+    isActive: false,
+    name: 'SIY1121',
+    imagePath: 'siy1121',
+    description: 'バックエンド・Android担当。大学院情報理工所属。',
+    links: {
+      website: {
+        label: 'siy.space',
+        url: 'https://siy.space/',
+      },
+      githubId: 'SIY1121',
+      twitterId: 'SIY1121',
+    },
+  },
+  {
+    isActive: false,
+    name: 'Kanade Nishizawa',
+    imagePath: 'kanadenishizawa',
+    description: '元デザイン担当。芸術専門学群出身。',
+    links: {
+      website: {
+        label: 'kanade-works.web.app',
+        url: 'https://kanade-works.web.app',
+      },
+      githubId: 'KanadeNishizawa',
+    },
+  },
+  {
+    isActive: false,
+    name: 'Kensuke Suzuki',
+    imagePath: 'kensukesuzuki',
+    description: '寄付ページ担当。情報科学類出身。',
+    links: {
+      website: {
+        label: 'momokichi.github.io',
+        url: 'https://momokichi.github.io/',
+      },
+    },
+  },
+  {
+    isActive: false,
+    name: 'ゆうく',
+    imagePath: 'yuku',
+    description: 'バックエンド担当。無職。',
+    links: {
+      githubId: 'Monchi',
+      twitterId: 'LOST_JINKEN',
+    },
+  },
+  {
+    isActive: true,
+    name: 'takonomura',
+    imagePath: 'takonomura',
+    description: 'インフラ担当。情報科学類所属。',
+    links: {},
+  },
+  {
+    isActive: true,
+    name: 'HosokawaR',
+    imagePath: 'hosokawar',
+    description: 'フロントエンド担当。情報科学類所属。',
+    links: {
+      githubId: 'HosokawaR',
+    },
+  },
+  {
+    isActive: true,
+    name: 'Hayato Shishido',
+    imagePath: 'hayatoshishido',
+    description: 'フロントエンド担当。社会工学類所属。',
+    links: {
+      githubId: 'hayato24s',
+    },
+  },
+  {
+    isActive: true,
+    imagePath: 'raspi0124',
+    name: 'raspi0124',
+    description: '知識情報・図書館学類所属。',
+    links: {
+      website: {
+        label: 'raspi0124.dev',
+        url: 'https://raspi0124.dev/',
+      },
+      githubId: 'raspi0124',
+      twitterId: 'raspi0124',
+    },
+  },
+  {
+    isActive: true,
+    name: 'Takayuki Ueno (kichi2004)',
+    imagePath: 'kichi2004',
+    description: '情報科学類所属。',
+    links: {
+      website: {
+        label: 'kichi2004.jp',
+        url: 'https://kichi2004.jp/',
+      },
+      githubId: 'kichi2004',
+      twitterId: 'kichi2004_',
+    },
+  },
+  {
+    isActive: false,
+    name: 'あざらし',
+    imagePath: 'azarashi',
+    description: '情報科学類出身。ブラウザ拡張機能担当。',
+    links: {
+      website: {
+        label: 'azr.sh',
+        url: 'https://azr.sh/',
+      },
+      githubId: 'azarashi2931',
+      twitterId: 'azarashi_uni',
+    },
+  },
+  {
+    isActive: true,
+    name: 'Arata',
+    imagePath: 'arata',
+    description: '',
+    links: {},
+  },
+  {
+    isActive: true,
+    name: 'public_yusuke',
+    imagePath: 'public_yusuke',
+    description: 'Android 担当',
+    links: {
+      website: {
+        label: 'www.yusuke.pub',
+        url: 'https://www.yusuke.pub/',
+      },
+      twitterId: 'public_yusuke',
+      githubId: 'private-yusuke',
+    },
+  },
+  {
+    isActive: true,
+    name: 'Ryoga',
+    imagePath: 'ryoga',
+    description: '',
+    links: {
+      website: {
+        label: 'ryoga.dev',
+        url: 'https://ryoga.dev',
+      },
+      githubId: 'Ryoga-exe',
+      twitterId: 'Ryoga_exe',
+    },
+  },
+  {
+    isActive: true,
+    name: '🍏',
+    imagePath: 'ao_ringo',
+    description: '',
+    links: {
+      twitterId: 'ao_ringo_uni',
+    },
+  },
+];