feat: 도착 버튼 아래 '이 시간대 자주 보이는 견종' 한 줄 표시

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

src/api/spots.ts

@@ -42,6 +42,8 @@ export const spotsApi = {
     http.get<Mate[]>(`/api/spots/${spotId}/mates${userId ? `?userId=${userId}` : ''}`),
   aiMates: (spotId: number, dogId: number) =>
     http.get<AiMate[]>(`/api/spots/${spotId}/ai-mates?dogId=${dogId}`),
+  frequentBreeds: (spotId: number) =>
+    http.get<{ breeds: string[] }>(`/api/spots/${spotId}/frequent-breeds`),
   reviews: (spotId: number) => http.get<Review[]>(`/api/spots/${spotId}/reviews`),
   checkIn: (spotId: number, userId: number, dogId: number) =>
     http.post<CheckInResult>(`/api/spots/${spotId}/checkins`, { userId, dogId }),

src/pages/HomePage.vue

@@ -23,6 +23,15 @@
       @click="onCheckIn"
     />
 
+    <!-- 이 시간대 자주 오는 견종 (통계) -->
+    <div
+      v-if="frequentBreeds.length"
+      class="text-caption text-grey-7 q-mt-sm row items-center no-wrap"
+    >
+      <q-icon name="pets" size="16px" color="primary" class="q-mr-xs" />
+      이 시간대 자주 보이는 견종 · {{ frequentBreeds.join(', ') }}
+    </div>
+
     <!-- AI 궁합 추천 (체크인 후, 이 스팟의 강아지 중 사이좋게 지낼 만한 목록) -->
     <div v-if="aiLoading || aiTried" class="q-mt-lg">
       <div class="text-subtitle1 text-weight-bold q-mb-sm">
@@ -131,6 +140,7 @@ const spots = ref<Spot[]>([])
 const currentSpot = ref<Spot | null>(null)
 const reviews = ref<Review[]>([])
 const mates = ref<Mate[]>([])
+const frequentBreeds = ref<string[]>([])
 const checkedIn = ref(false)
 const checkingIn = ref(false)
 const matchingDogId = ref<number | null>(null)
@@ -169,12 +179,14 @@ async function onSelectSpot(spotId: number) {
 }
 
 async function refreshSpot(spotId: number) {
-  const [r, m] = await Promise.all([
+  const [r, m, fb] = await Promise.all([
     spotsApi.reviews(spotId),
     spotsApi.mates(spotId, currentUserId()),
+    spotsApi.frequentBreeds(spotId),
   ])
   reviews.value = r
   mates.value = m
+  frequentBreeds.value = fb.breeds
 }
 
 async function onCheckIn() {