zenn/sori.studio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
zenn
2026-07-20 12:37:53 +09:00
parent cf7d6ca0de
commit ad38644171
19 changed files with 788 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files

95
pages/admin/index.vue
View File

@@ -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>

182
pages/admin/pages/index.vue
View File

@@ -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

62
pages/admin/posts/index.vue
View File

@@ -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>