관리자 목록과 이미지 설정 개선

pages/admin/index.vue

@@ -36,6 +36,9 @@ const { data: analyticsSummary, refresh: refreshSummary } = await useFetch('/adm
   query: analyticsQuery,
   default: () => ({
     todayVisitors: 0,
+    totalVisitors: 0,
+    totalPageViews: 0,
+    totalPosts: 0,
     visitorsLast7Days: 0,
     pageViewsLast30Days: 0,
     onlineNow: 0,
@@ -106,6 +109,29 @@ const {
 const selectedTrendDetailLabel = computed(() => selectedTrendRange.value.label || '오늘')
 const trafficSources = computed(() => selectedTrendDetail.value?.sources || [])
 const trafficDevices = computed(() => selectedTrendDetail.value?.devices || [])
+const totalDeviceVisitors = computed(() => {
+  return trafficDevices.value.reduce((sum, row) => sum + Number(row.visitors || 0), 0)
+})
+const groupedTrafficDevices = computed(() => {
+  const groups = new Map()
+
+  for (const row of trafficDevices.value) {
+    const key = row.deviceType || '기타'
+    const existing = groups.get(key) || {
+      deviceType: key,
+      pageViews: 0,
+      visitors: 0,
+      rows: []
+    }
+
+    existing.pageViews += Number(row.pageViews || 0)
+    existing.visitors += Number(row.visitors || 0)
+    existing.rows.push(row)
+    groups.set(key, existing)
+  }
+
+  return [...groups.values()].sort((a, b) => b.pageViews - a.pageViews || b.visitors - a.visitors)
+})
 const topPosts = computed(() => selectedTrendDetail.value?.topPosts || [])
 const topPages = computed(() => selectedTrendDetail.value?.topPages || [])
 const trendDetailError = computed(() => selectedTrendDetailError.value ? '선택한 기간 통계 상세를 불러오지 못했습니다.' : '')
@@ -240,6 +266,21 @@ const formatTrafficPercent = (value) => {
   return `${Math.round((Number(value || 0) / total) * 100)}%`
 }
 
+/**
+ * 디바이스 방문자 비율을 표시한다.
+ * @param {number} value - 방문자 수
+ * @returns {string} 비율
+ */
+const formatDeviceVisitorPercent = (value) => {
+  const total = totalDeviceVisitors.value
+
+  if (!total) {
+    return '0%'
+  }
+
+  return `${Math.round((Number(value || 0) / total) * 100)}%`
+}
+
 const chartMetrics = computed(() => [
   {
     key: 'visitors',
@@ -487,9 +528,13 @@ watch(trendRows, () => {
           <strong class="ml-2 text-lg text-ink">{{ realtime.summary.onlineNow }}</strong>
         </p>
         <p class="admin-dashboard__summary-item text-muted">
-          오늘 접속자
+          오늘 방문자
           <strong class="ml-2 text-lg text-ink">{{ analyticsSummary.todayVisitors }}</strong>
         </p>
+        <p class="admin-dashboard__summary-item text-muted">
+          누적 방문자
+          <strong class="ml-2 text-lg text-ink">{{ analyticsSummary.totalVisitors }}</strong>
+        </p>
         <p class="admin-dashboard__summary-item text-muted">
           게시물 수
           <strong class="ml-2 text-lg text-ink">{{ posts.length }}</strong>
@@ -832,27 +877,39 @@ watch(trendRows, () => {
                   디바이스
                 </h3>
                 <ul
-                  v-if="trafficDevices.length"
+                  v-if="groupedTrafficDevices.length"
                   class="mt-3 space-y-2"
                 >
                   <li
-                    v-for="row in trafficDevices"
-                    :key="`${row.deviceType}-${row.osName}`"
-                    class="flex items-center justify-between gap-3 border-b border-line pb-2 text-xs last:border-b-0 last:pb-0"
+                    v-for="group in groupedTrafficDevices"
+                    :key="group.deviceType"
+                    class="border-b border-line pb-2 text-xs last:border-b-0 last:pb-0"
                   >
-                    <div>
-                      <p class="font-medium text-ink">
-                        {{ row.deviceType }}
-                      </p>
-                      <p class="mt-0.5 text-[11px] text-muted">
-                        {{ row.osName }}
+                    <div class="flex items-start justify-between gap-3">
+                      <div>
+                        <p class="font-medium text-ink">
+                          {{ group.deviceType }}
+                        </p>
+                        <p class="mt-0.5 text-[11px] text-muted">
+                          {{ group.rows.map((row) => row.osName).filter(Boolean).join(' / ') || '-' }}
+                        </p>
+                      </div>
+                      <p class="text-right text-muted">
+                        <span class="font-semibold text-ink">{{ group.pageViews }}</span>회
+                        <br>
+                        {{ group.visitors }}명 · {{ formatDeviceVisitorPercent(group.visitors) }}
                       </p>
                     </div>
-                    <p class="text-right text-muted">
-                      <span class="font-semibold text-ink">{{ row.pageViews }}</span>회
-                      <br>
-                      {{ row.visitors }}명
-                    </p>
+                    <ul class="mt-2 space-y-1 border-t border-line pt-2 text-[11px] text-muted">
+                      <li
+                        v-for="row in group.rows"
+                        :key="`${group.deviceType}-${row.osName}`"
+                        class="flex items-center justify-between gap-2"
+                      >
+                        <span>{{ row.osName || '-' }}</span>
+                        <span>{{ row.visitors }}명 · {{ formatDeviceVisitorPercent(row.visitors) }}</span>
+                      </li>
+                    </ul>
                   </li>
                 </ul>
                 <p
@@ -926,9 +983,9 @@ watch(trendRows, () => {
               </p>
               <p class="mt-1 text-[11px] leading-snug text-muted">
                 IP {{ session.ipAddress || '-' }}
-                <span v-if="Number(session.pageCount || 0) > 1">
-                  · 열린 페이지 {{ session.pageCount }}개
-                </span>
+              </p>
+              <p v-if="Number(session.pageCount || 0) > 1" class="mt-0.5 text-[11px] leading-snug text-muted">
+                열린 페이지 {{ session.pageCount }}개
               </p>
             </div>
           </li>

pages/admin/pages/index.vue

@@ -5,6 +5,10 @@ definePageMeta({
 
 const deletingId = ref('')
 const errorMessage = ref('')
+const searchQuery = ref('')
+const statusFilter = ref('all')
+const listedFilter = ref('all')
+const sortOrder = ref('newest')
 const analyticsModalPage = ref(null)
 const analyticsModalData = ref(createDefaultPageAnalytics())
 const analyticsModalPeriod = ref('daily')
@@ -19,6 +23,12 @@ const { data: pages, refresh } = await useFetch('/admin/api/pages', {
   default: () => []
 })
 
+const {
+  displayValue: searchInput,
+  onInput: onSearchInput,
+  onCompositionEnd: onSearchCompositionEnd
+} = useImeSearchInput(searchQuery, { debounce: 200 })
+
 const analyticsPeriodOptions = [
   { label: '일간', value: 'daily', days: 14 },
   { label: '주간', value: 'weekly', days: 84 },
@@ -59,6 +69,58 @@ function createDefaultPageAnalytics() {
 
 /** 페이지 통계 모달이 열려 있는지 */
 const isAnalyticsModalOpen = computed(() => Boolean(analyticsModalPage.value))
+/** 전체 페이지 수 */
+const totalPageCount = computed(() => pages.value.length)
+/** 홈 표시 페이지 수 */
+const listedPageCount = computed(() => pages.value.filter((page) => page.isListed).length)
+/** 추천 페이지 수 */
+const featuredPageCount = computed(() => pages.value.filter((page) => page.isFeatured).length)
+/** 페이지 목록 필터가 적용되어 있는지 */
+const hasActiveListFilters = computed(() => {
+  return searchQuery.value.trim()
+    || statusFilter.value !== 'all'
+    || listedFilter.value !== 'all'
+    || sortOrder.value !== 'newest'
+})
+/** 검색·필터·정렬이 적용된 페이지 목록 */
+const filteredPages = computed(() => {
+  const keyword = searchQuery.value.trim().toLowerCase()
+  const filtered = pages.value.filter((page) => {
+    const matchesStatus = statusFilter.value === 'all'
+      || page.status === statusFilter.value
+    const matchesListed = listedFilter.value === 'all'
+      || (listedFilter.value === 'listed' && page.isListed)
+      || (listedFilter.value === 'featured' && page.isFeatured)
+
+    if (!matchesStatus || !matchesListed) {
+      return false
+    }
+
+    if (!keyword) {
+      return true
+    }
+
+    return [
+      page.title,
+      page.slug,
+      page.listingTitle,
+      page.listingDescription,
+      page.status,
+      page.listingSection
+    ].some((value) => String(value || '').toLowerCase().includes(keyword))
+  })
+
+  return [...filtered].sort((a, b) => {
+    const firstTime = new Date(sortOrder.value === 'oldest' ? a.createdAt : a.updatedAt).getTime() || 0
+    const secondTime = new Date(sortOrder.value === 'oldest' ? b.createdAt : b.updatedAt).getTime() || 0
+
+    return sortOrder.value === 'oldest'
+      ? firstTime - secondTime
+      : secondTime - firstTime
+  })
+})
+/** 현재 필터 기준 표시 페이지 수 */
+const filteredPageCount = computed(() => filteredPages.value.length)
 
 /**
  * 숫자를 관리자 목록 표시 형식으로 변환한다.
@@ -166,6 +228,15 @@ const getPageStatusClass = (page) => {
  */
 const isPublicPage = (page) => page.status === 'published'
 
+/**
+ * 페이지 목록 썸네일 URL을 반환한다.
+ * @param {Object} page - 페이지
+ * @returns {string} 썸네일 URL
+ */
+const getPageThumbnailSrc = (page) => {
+  return page.listingImageThumbnail || page.featuredImage || ''
+}
+
 /**
  * 날짜 표시 형식 변환
  * @param {string | null} value - ISO 날짜 문자열
@@ -277,7 +348,7 @@ const deletePage = async (page) => {
 
 <template>
   <section class="admin-pages bg-paper p-6">
-    <div class="admin-pages__header flex items-center justify-between gap-4">
+    <div class="admin-pages__header flex flex-col gap-4 lg:flex-row lg:items-center lg:justify-between">
       <div>
         <p class="admin-pages__eyebrow text-xs font-semibold uppercase text-muted">
           Pages
@@ -285,10 +356,78 @@ const deletePage = async (page) => {
         <h1 class="admin-pages__title mt-2 text-3xl font-semibold">
           페이지 목록
         </h1>
+        <p class="admin-pages__count mt-2 text-sm text-muted">
+          총 {{ formatAdminNumber(totalPageCount) }}개
+          <template v-if="listedPageCount > 0">
+            <span class="admin-pages__count-separator text-[#c8ced3]"> · </span>
+            <span class="admin-pages__count-listed">홈 표시 {{ formatAdminNumber(listedPageCount) }}개</span>
+          </template>
+          <template v-if="featuredPageCount > 0">
+            <span class="admin-pages__count-separator text-[#c8ced3]"> · </span>
+            <span class="admin-pages__count-featured">추천 {{ formatAdminNumber(featuredPageCount) }}개</span>
+          </template>
+          <template v-if="hasActiveListFilters && filteredPageCount !== totalPageCount">
+            <span class="admin-pages__count-separator text-[#c8ced3]"> · </span>
+            <span class="admin-pages__count-filtered">표시 {{ formatAdminNumber(filteredPageCount) }}개</span>
+          </template>
+        </p>
+      </div>
+      <div class="admin-pages__header-actions flex min-w-0 flex-1 flex-wrap items-center justify-start gap-2 lg:flex-nowrap lg:justify-end">
+        <div class="admin-pages__filters flex min-w-0 flex-wrap items-center gap-2">
+          <label class="admin-pages__search relative">
+            <span class="sr-only">페이지 검색</span>
+            <svg class="pointer-events-none absolute left-3 top-1/2 size-4 -translate-y-1/2 text-[#8e9cac]" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+              <path d="m21 21-4.34-4.34" />
+              <circle cx="11" cy="11" r="8" />
+            </svg>
+            <input
+              :value="searchInput"
+              class="admin-pages__search-input h-10 w-52 rounded border border-line bg-white pl-9 pr-3 text-sm text-[#394047] outline-none transition-colors placeholder:text-[#8e9cac] hover:border-[#c8ced3] focus:border-[#8e9cac]"
+              type="search"
+              placeholder="페이지 검색"
+              @input="onSearchInput"
+              @compositionupdate="onSearchInput"
+              @compositionend="onSearchCompositionEnd"
+            >
+          </label>
+          <label class="admin-pages__filter">
+            <span class="sr-only">상태 필터</span>
+            <span class="admin-pages__filter-select-wrap relative block">
+              <select v-model="statusFilter" class="admin-pages__filter-select h-10 appearance-none rounded border border-line bg-white pl-3 pr-9 text-sm text-[#394047] outline-none transition-colors hover:border-[#c8ced3] focus:border-[#8e9cac]">
+                <option value="all">전체 상태</option>
+                <option value="published">공개</option>
+                <option value="draft">초안</option>
+                <option value="private">비공개</option>
+              </select>
+              <svg class="pointer-events-none absolute right-3 top-1/2 size-4 -translate-y-1/2 text-[#394047]" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6" /></svg>
+            </span>
+          </label>
+          <label class="admin-pages__filter">
+            <span class="sr-only">노출 필터</span>
+            <span class="admin-pages__filter-select-wrap relative block">
+              <select v-model="listedFilter" class="admin-pages__filter-select h-10 appearance-none rounded border border-line bg-white pl-3 pr-9 text-sm text-[#394047] outline-none transition-colors hover:border-[#c8ced3] focus:border-[#8e9cac]">
+                <option value="all">전체 페이지</option>
+                <option value="listed">홈 표시</option>
+                <option value="featured">추천만</option>
+              </select>
+              <svg class="pointer-events-none absolute right-3 top-1/2 size-4 -translate-y-1/2 text-[#394047]" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6" /></svg>
+            </span>
+          </label>
+          <label class="admin-pages__filter">
+            <span class="sr-only">정렬</span>
+            <span class="admin-pages__filter-select-wrap relative block">
+              <select v-model="sortOrder" class="admin-pages__filter-select h-10 appearance-none rounded border border-line bg-white pl-3 pr-9 text-sm text-[#394047] outline-none transition-colors hover:border-[#c8ced3] focus:border-[#8e9cac]">
+                <option value="newest">최신순</option>
+                <option value="oldest">오래된순</option>
+              </select>
+              <svg class="pointer-events-none absolute right-3 top-1/2 size-4 -translate-y-1/2 text-[#394047]" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6" /></svg>
+            </span>
+          </label>
+        </div>
+        <NuxtLink class="admin-pages__new shrink-0 rounded bg-[#15171a] px-4 py-2 text-sm font-semibold text-white" to="/admin/pages/new">
+          새 페이지
+        </NuxtLink>
       </div>
-      <NuxtLink class="admin-pages__new rounded bg-[#15171a] px-4 py-2 text-sm font-semibold text-white" to="/admin/pages/new">
-        새 페이지
-      </NuxtLink>
     </div>
 
     <p v-if="errorMessage" class="admin-pages__error mt-6 rounded border border-red-200 bg-red-50 px-4 py-3 text-sm text-red-700">
@@ -299,6 +438,13 @@ const deletePage = async (page) => {
       <table class="admin-pages__table-inner w-full border-collapse text-left text-sm">
         <thead class="admin-pages__table-head bg-[#f5f5f2] text-xs uppercase text-muted">
           <tr>
+            <th class="admin-pages__cell admin-pages__cell-featured w-10 px-2 py-3 text-center">
+              <span class="sr-only">추천</span>
+              <span class="inline-flex size-4 items-center justify-center text-[#f5a623]" aria-hidden="true">★</span>
+            </th>
+            <th class="admin-pages__cell admin-pages__cell-thumbnail w-16 px-2 py-3">
+              <span class="sr-only">썸네일</span>
+            </th>
             <th class="admin-pages__cell px-4 py-3">제목</th>
             <th class="admin-pages__cell px-4 py-3">상태</th>
             <th class="admin-pages__cell px-4 py-3">조회수</th>
@@ -309,7 +455,30 @@ const deletePage = async (page) => {
           </tr>
         </thead>
         <tbody class="admin-pages__table-body divide-y divide-line bg-white">
-          <tr v-for="page in pages" :key="page.id" class="admin-pages__row group">
+          <tr v-for="page in filteredPages" :key="page.id" class="admin-pages__row group">
+            <td class="admin-pages__cell admin-pages__cell-featured w-10 px-2 py-4 text-center">
+              <span
+                v-if="page.isFeatured"
+                class="admin-pages__featured-star inline-flex size-8 items-center justify-center text-[#f5a623]"
+                title="추천 페이지"
+                aria-label="추천 페이지"
+              >
+                <svg class="size-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+                  <path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z" />
+                </svg>
+              </span>
+            </td>
+            <td class="admin-pages__cell admin-pages__cell-thumbnail w-16 px-2 py-4">
+              <span class="admin-pages__thumbnail block h-9 w-12 overflow-hidden rounded bg-[#eef1f4]">
+                <img
+                  v-if="getPageThumbnailSrc(page)"
+                  class="h-full w-full object-cover"
+                  :src="getPageThumbnailSrc(page)"
+                  :alt="page.title || '페이지 썸네일'"
+                  loading="lazy"
+                >
+              </span>
+            </td>
             <td class="admin-pages__cell px-4 py-4">
               <NuxtLink class="admin-pages__title-link font-semibold hover:opacity-70" :to="`/admin/pages/${page.id}`">
                 {{ page.title }}
@@ -395,6 +564,9 @@ const deletePage = async (page) => {
     <p v-if="pages.length === 0" class="admin-pages__empty mt-6 text-sm text-muted">
       아직 작성된 페이지가 없습니다.
     </p>
+    <p v-else-if="filteredPages.length === 0" class="admin-pages__empty mt-6 text-sm text-muted">
+      검색 결과가 없습니다.
+    </p>
 
     <Teleport to="body">
       <div

pages/admin/posts/index.vue

@@ -130,12 +130,13 @@ function createDefaultPostAnalytics() {
 
 /**
  * 게시물 참조 목록 기본값을 생성한다.
- * @returns {{ target: null, posts: Array }} 게시물 참조 목록 기본값
+ * @returns {{ target: null, posts: Array, pages: Array }} 게시물 참조 목록 기본값
  */
 function createDefaultPostReferences() {
   return {
     target: null,
-    posts: []
+    posts: [],
+    pages: []
   }
 }
 
@@ -470,22 +471,31 @@ const isReferenceModalOpen = computed(() => Boolean(referenceModalPost.value))
 
 /** 게시물 참조 목록 */
 const referenceModalPosts = computed(() => referenceModalData.value?.posts || [])
+/** 페이지 참조 목록 */
+const referenceModalPages = computed(() => referenceModalData.value?.pages || [])
+/** 게시물·페이지 통합 참조 목록 */
+const referenceModalItems = computed(() => [
+  ...referenceModalPosts.value.map((item) => ({ ...item, referenceType: 'post' })),
+  ...referenceModalPages.value.map((item) => ({ ...item, referenceType: 'page' }))
+])
 
 /** 게시물 참조 모달 검색어 */
 const normalizedReferenceModalSearchQuery = computed(() => referenceModalSearchQuery.value.trim().toLowerCase())
 
-/** 검색어가 적용된 게시물 참조 목록 */
+/** 검색어가 적용된 콘텐츠 참조 목록 */
 const filteredReferenceModalPosts = computed(() => {
   const keyword = normalizedReferenceModalSearchQuery.value
 
   if (!keyword) {
-    return referenceModalPosts.value
+    return referenceModalItems.value
   }
 
-  return referenceModalPosts.value.filter((post) => {
+  return referenceModalItems.value.filter((post) => {
     return [
       post.title,
-      post.slug
+      post.slug,
+      post.status,
+      post.referenceType
     ].some((value) => String(value || '').toLowerCase().includes(keyword))
   })
 })
@@ -658,33 +668,38 @@ const closeReferenceModal = () => {
 /**
  * 삭제 확인 메시지를 생성한다.
  * @param {Object} post - 삭제 대상 게시물
- * @param {{ posts?: Array }} references - 참조 목록
+ * @param {{ posts?: Array, pages?: Array }} references - 참조 목록
  * @param {boolean} didReferenceCheckFail - 참조 확인 실패 여부
  * @returns {string} 삭제 확인 메시지
  */
 const createDeletePostMessage = (post, references, didReferenceCheckFail = false) => {
   const title = post.title || '(제목 없음)'
   const referencePosts = references?.posts || []
+  const referencePages = references?.pages || []
+  const referenceItems = [
+    ...referencePosts.map((item) => ({ ...item, referenceType: 'post' })),
+    ...referencePages.map((item) => ({ ...item, referenceType: 'page' }))
+  ]
 
   if (didReferenceCheckFail) {
-    return `"${title}" 글을 삭제할까요?\n\n이 글을 링크한 게시물 목록은 확인하지 못했습니다.`
+    return `"${title}" 글을 삭제할까요?\n\n이 글을 링크한 콘텐츠 목록은 확인하지 못했습니다.`
   }
 
-  if (!referencePosts.length) {
+  if (!referenceItems.length) {
     return `"${title}" 글을 삭제할까요?`
   }
 
-  const referenceList = referencePosts
+  const referenceList = referenceItems
     .slice(0, 5)
-    .map((item) => `- ${item.title || '(제목 없음)'}`)
+    .map((item) => `- ${item.referenceType === 'page' ? '페이지' : '게시물'}: ${item.title || '(제목 없음)'}`)
     .join('\n')
-  const moreCount = Math.max(referencePosts.length - 5, 0)
+  const moreCount = Math.max(referenceItems.length - 5, 0)
   const moreText = moreCount ? `\n- 외 ${moreCount}개` : ''
 
   return [
     `"${title}" 글을 삭제할까요?`,
     '',
-    `이 글을 링크한 게시물 ${referencePosts.length}개가 있습니다.`,
+    `이 글을 링크한 콘텐츠 ${referenceItems.length}개가 있습니다.`,
     referenceList + moreText
   ].join('\n')
 }
@@ -1529,7 +1544,7 @@ watch(postPageCount, (pageCount) => {
 
           <div class="admin-posts__reference-modal-body flex min-h-0 flex-1 flex-col p-5">
             <p v-if="referenceModalLoading" class="text-sm text-muted">
-              이 글을 링크한 게시물을 확인하는 중입니다.
+              이 글을 링크한 콘텐츠를 확인하는 중입니다.
             </p>
             <p v-else-if="referenceModalError" class="text-sm text-red-600">
               {{ referenceModalError }}
@@ -1537,7 +1552,7 @@ watch(postPageCount, (pageCount) => {
             <template v-else>
               <div class="flex flex-wrap items-center justify-between gap-3">
                 <p class="text-sm text-muted">
-                  이 글을 링크한 게시물 {{ referenceModalPosts.length }}개
+                  이 글을 링크한 콘텐츠 {{ referenceModalItems.length }}개
                 </p>
                 <label class="admin-posts__reference-search relative w-full sm:w-60">
                   <span class="sr-only">백링크 검색</span>
@@ -1549,7 +1564,7 @@ watch(postPageCount, (pageCount) => {
                     v-model="referenceModalSearchQuery"
                     class="admin-posts__reference-search-input h-9 w-full rounded border border-line bg-white pl-9 pr-3 text-sm text-[#394047] outline-none transition-colors placeholder:text-[#8e9cac] hover:border-[#c8ced3] focus:border-[#8e9cac]"
                     type="search"
-                    placeholder="게시물 검색"
+                    placeholder="콘텐츠 검색"
                   >
                 </label>
               </div>
@@ -1561,14 +1576,17 @@ watch(postPageCount, (pageCount) => {
                 >
                   <div class="flex flex-wrap items-center justify-between gap-3">
                     <span class="min-w-0 font-semibold text-ink">
+                      <span class="mr-2 inline-flex h-5 items-center rounded bg-paper px-2 text-[11px] font-semibold text-muted">
+                        {{ item.referenceType === 'page' ? '페이지' : '게시물' }}
+                      </span>
                       {{ item.title || '(제목 없음)' }}
                     </span>
                     <div class="flex shrink-0 items-center gap-2">
                       <NuxtLink
                         class="admin-posts__reference-move inline-flex size-7 items-center justify-center rounded text-[#8e9cac] transition-colors hover:bg-paper hover:text-[#394047]"
-                        :to="`/admin/posts/${item.id}`"
-                        aria-label="게시물로 이동"
-                        title="게시물로 이동"
+                        :to="item.referenceType === 'page' ? `/admin/pages/${item.id}` : `/admin/posts/${item.id}`"
+                        aria-label="콘텐츠로 이동"
+                        title="콘텐츠로 이동"
                         @click="closeReferenceModal"
                       >
                         <svg class="h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
@@ -1581,17 +1599,17 @@ watch(postPageCount, (pageCount) => {
                   <div class="mt-1 flex flex-wrap items-center gap-2 text-xs text-muted">
                     <span>{{ getPostStatusLabel(item) }}</span>
                     <span class="text-[#d7dce0]">|</span>
-                    <span class="truncate">/post/{{ item.slug }}</span>
+                    <span class="truncate">/{{ item.referenceType === 'page' ? 'pages' : 'post' }}/{{ item.slug }}</span>
                     <span class="text-[#d7dce0]">|</span>
                     <span>수정 {{ formatAdminDateTimeLabel(item.updatedAt) }}</span>
                   </div>
                 </li>
               </ul>
-              <p v-else-if="referenceModalPosts.length" class="mt-4 border border-line bg-paper px-4 py-5 text-sm text-muted">
+              <p v-else-if="referenceModalItems.length" class="mt-4 border border-line bg-paper px-4 py-5 text-sm text-muted">
                 검색 결과가 없습니다.
               </p>
               <p v-else class="mt-4 border border-line bg-paper px-4 py-5 text-sm text-muted">
-                이 게시물을 링크한 다른 게시물이 없습니다.
+                이 게시물을 링크한 다른 콘텐츠가 없습니다.
               </p>
             </template>
           </div>