120 lines
3.0 KiB
Vue
120 lines
3.0 KiB
Vue
<script setup>
|
|
definePageMeta({
|
|
layout: 'admin'
|
|
})
|
|
|
|
const route = useRoute()
|
|
const id = computed(() => String(route.params.id || ''))
|
|
const saving = ref(false)
|
|
const deleting = ref(false)
|
|
const errorMessage = ref('')
|
|
const pageForm = ref(null)
|
|
const { toast, showToast } = useAdminToast()
|
|
|
|
const { data: page } = await useFetch(() => `/admin/api/pages/${id.value}`)
|
|
|
|
if (!page.value) {
|
|
throw createError({
|
|
statusCode: 404,
|
|
statusMessage: '페이지를 찾을 수 없습니다.'
|
|
})
|
|
}
|
|
|
|
const publicPageUrl = computed(() => page.value?.slug ? `/pages/${page.value.slug}` : '')
|
|
|
|
/**
|
|
* 이전 화면에서 전달한 토스트 표시
|
|
* @returns {void}
|
|
*/
|
|
const showStoredToast = () => {
|
|
const storedToast = sessionStorage.getItem('SORI_ADMIN_PAGE_TOAST')
|
|
|
|
if (!storedToast) {
|
|
return
|
|
}
|
|
|
|
try {
|
|
const parsedToast = JSON.parse(storedToast)
|
|
showToast(parsedToast.type || 'success', parsedToast.message || '저장되었습니다.')
|
|
} finally {
|
|
sessionStorage.removeItem('SORI_ADMIN_PAGE_TOAST')
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 고정 페이지 수정 저장
|
|
* @param {Object} payload - 페이지 입력값
|
|
* @returns {Promise<void>} 저장 결과
|
|
*/
|
|
const savePage = async (payload) => {
|
|
saving.value = true
|
|
errorMessage.value = ''
|
|
showToast('info', '변경 내용을 저장하는 중입니다.')
|
|
|
|
try {
|
|
const updatedPage = await $fetch(`/admin/api/pages/${id.value}`, {
|
|
method: 'PUT',
|
|
body: payload
|
|
})
|
|
|
|
page.value = updatedPage
|
|
pageForm.value?.markSaved(payload)
|
|
showToast('success', '변경 내용이 저장되었습니다.')
|
|
} catch (error) {
|
|
errorMessage.value = error?.data?.message || '페이지를 저장하지 못했습니다.'
|
|
showToast('error', errorMessage.value)
|
|
} finally {
|
|
saving.value = false
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 고정 페이지 삭제
|
|
* @returns {Promise<void>} 삭제 처리 결과
|
|
*/
|
|
const deletePage = async () => {
|
|
if (!confirm(`"${page.value.title}" 페이지를 삭제할까요?`)) {
|
|
return
|
|
}
|
|
|
|
deleting.value = true
|
|
errorMessage.value = ''
|
|
showToast('info', '페이지를 삭제하는 중입니다.')
|
|
|
|
try {
|
|
await $fetch(`/admin/api/pages/${id.value}`, {
|
|
method: 'DELETE'
|
|
})
|
|
pageForm.value?.allowNextRouteLeave()
|
|
await navigateTo('/admin/pages')
|
|
} catch (error) {
|
|
errorMessage.value = error?.data?.message || '페이지를 삭제하지 못했습니다.'
|
|
showToast('error', errorMessage.value)
|
|
} finally {
|
|
deleting.value = false
|
|
}
|
|
}
|
|
|
|
onMounted(showStoredToast)
|
|
</script>
|
|
|
|
<template>
|
|
<section class="admin-page-edit relative bg-white">
|
|
<p v-if="errorMessage" class="admin-page-edit__error mx-6 mt-6 rounded border border-red-200 bg-red-50 px-4 py-3 text-sm text-red-700">
|
|
{{ errorMessage }}
|
|
</p>
|
|
<AdminPageForm
|
|
ref="pageForm"
|
|
:initial-page="page"
|
|
:saving="saving"
|
|
:can-view-page="Boolean(page?.slug) && page?.status === 'published'"
|
|
:public-url="publicPageUrl"
|
|
:deleting="deleting"
|
|
show-delete
|
|
@submit="savePage"
|
|
@delete="deletePage"
|
|
/>
|
|
<AdminToast :toast="toast" />
|
|
</section>
|
|
</template>
|