image admin

apps/frontend/src/lib/interfaces/member.interface.ts

@@ -3,4 +3,5 @@ export interface Member {
   real_nick: string
   motto: string
   avatar_filename: string
+  image_url?: string | null
 }

apps/frontend/src/lib/interfaces/software.interface.ts

@@ -17,6 +17,7 @@ export interface Software {
   license?: string
   story?: string
   externalLinks?: { label: string; url: string }[]
+  imageUrl?: string | null
 }
 
 export interface SoftwareEntry {

apps/frontend/src/page/catalog/CatalogIndexPage.vue

@@ -23,6 +23,9 @@
         <div v-show="activeFilter === 'all' || software.status === activeFilter" class="software-card group">
           <div class="software-card-content">
             <div class="flex flex-col md:flex-row md:items-center justify-between gap-4">
+              <div v-if="software.imageUrl" class="flex-shrink-0">
+                <img :src="software.imageUrl" :alt="software.title" class="software-thumb" />
+              </div>
               <div class="flex-grow">
                 <div class="flex items-center gap-3 mb-2">
                   <RouterLink :to="`/catalog/${software.name}`" class="hover:text-purple-600 transition-colors">
@@ -116,4 +119,7 @@ onMounted(async () => {
 }
 .btn-play-sm { @apply btn-base-sm bg-purple-600 hover:bg-purple-700 text-white shadow-lg shadow-purple-600/20; }
 .btn-info-sm { @apply btn-base-sm bg-gray-100 hover:bg-gray-200 text-gray-700; }
+.software-thumb {
+  @apply w-24 h-24 object-cover rounded-xl border border-gray-100 shadow-sm;
+}
 </style>

apps/frontend/src/page/catalog/CatalogShowPage.vue

@@ -27,6 +27,9 @@
         <!-- Sidebar Info -->
         <div class="lg:col-span-1 space-y-6">
           <div class="bg-white rounded-3xl shadow-xl p-8 border border-gray-100">
+            <div v-if="software.imageUrl" class="mb-6">
+              <img :src="software.imageUrl" :alt="software.title" class="w-full rounded-2xl object-cover shadow-sm" />
+            </div>
             <h2 class="text-xl font-bold text-gray-900 mb-6 flex items-center gap-2">
               <span class="text-purple-600">ℹ</span> Project Info
             </h2>

apps/frontend/src/page/home/HomePage.vue

@@ -41,6 +41,9 @@
       <!-- Featured Software Section -->
       <section v-if="highlightedSoftware" class="mb-16">
         <div class="featured-card group">
+          <div v-if="highlightedSoftware.software.imageUrl" class="featured-image-panel">
+            <img :src="highlightedSoftware.software.imageUrl" :alt="highlightedSoftware.software.title" class="featured-image" />
+          </div>
           <div class="featured-content">
             <div class="flex items-center gap-2 mb-4">
               <span class="featured-badge">Featured Game</span>
@@ -319,6 +322,12 @@ onUnmounted(() => {
 .featured-btn-secondary {
   @apply px-8 py-4 bg-indigo-500/10 text-white border border-indigo-400/30 font-bold rounded-xl transition-all hover:bg-indigo-500/20;
 }
+.featured-image-panel {
+  @apply flex-shrink-0 w-full md:w-64 lg:w-80 overflow-hidden;
+}
+.featured-image {
+  @apply w-full h-full object-cover opacity-80 group-hover:opacity-100 transition-opacity;
+}
 .featured-version-badge {
   @apply px-2 py-0.5 rounded text-[10px] font-bold bg-white/10 text-white/70 border border-white/20;
 }

apps/frontend/src/page/team/TeamIndexPage.vue

@@ -12,7 +12,7 @@
     <div class="team-grid">
       <div v-for="member in members" :key="member.nick" class="team-card">
         <div class="team-card-image-container">
-          <img :src="avatarUrl(member.avatar_filename)" :alt="member.nick" class="team-card-image" />
+          <img :src="resolvedAvatarUrl(member)" :alt="member.nick" class="team-card-image" />
         </div>
         <div class="team-card-content">
           <h2 class="team-card-title">{{ member.nick }}: {{ member.real_nick }}</h2>
@@ -30,8 +30,9 @@ import type { Member } from '../../lib/interfaces/member.interface'
 
 const members = ref<Member[]>([])
 
-function avatarUrl(filename: string): string {
-  return new URL(`../../assets/team/${filename}`, import.meta.url).href
+function resolvedAvatarUrl(member: Member): string {
+  if (member.image_url) return member.image_url
+  return new URL(`../../assets/team/${member.avatar_filename}`, import.meta.url).href
 }
 
 onMounted(async () => {