설정 섹션 저장 흐름 정리

2026-07-24 11:07:19 +09:00
parent aa01be3688
commit 5bd85a100a
6 changed files with 103 additions and 129 deletions
--- a/pages/admin/settings/index.vue
+++ b/pages/admin/settings/index.vue
@@ -111,6 +111,19 @@ const postExportDateRangeModeOptions = [
  { value: 'month', label: '특정월' },
  { value: 'custom', label: '직접 지정' }
 ]
+const titleDescFields = ['title', 'description']
+const miscFields = ['siteUrl', 'logoText', 'logoUrl', 'faviconUrl', 'copyrightText']
+const homeCoverFields = ['homeCoverImageUrl', 'homeCoverDarkImageUrl', 'homeCoverTitle', 'homeCoverText']
+const siteCodeFields = ['adsTxt', 'customHeadCode', 'customFooterCode']
+const adsFields = [
+  'adHomeFeedCode',
+  'adHomeInfeedCode',
+  'adSidebarCode',
+  'adPostSidebarCode',
+  'adPostTopCode',
+  'adPostInArticleCode',
+  'adPostBottomCode'
+]

 /** 블로그 제목·설명 카드 편집 모드 여부 */
 const editTitleDesc = ref(false)
@@ -1279,13 +1292,56 @@ const persistSiteSettings = async (options) => {
  }
 }

+/**
+ * 지정한 필드를 원본 객체에서 대상 객체로 복사한다.
+ * @param {Object} target - 값을 받을 객체
+ * @param {Object} source - 값을 제공할 객체
+ * @param {Array<string>} fields - 복사할 필드 목록
+ * @returns {void}
+ */
+const copySettingsFields = (target, source, fields) => {
+  fields.forEach((field) => {
+    target[field] = source[field]
+  })
+}
+
+/**
+ * 단순 설정 섹션 저장 후 스냅샷 갱신과 편집 종료를 처리한다.
+ * @param {{ hasChanges: import('vue').ComputedRef<boolean>, savingFlag: import('vue').Ref<boolean>, editingFlag: import('vue').Ref<boolean>, snapshot: Object, fields: Array<string>, successToast: string, beforeSave?: Function, afterSnapshot?: Function }} options - 섹션 저장 옵션
+ * @returns {Promise<void>}
+ */
+const saveSimpleSettingsSection = async (options) => {
+  if (typeof options.beforeSave === 'function') {
+    options.beforeSave()
+  }
+
+  if (!options.hasChanges.value) {
+    return
+  }
+
+  const ok = await persistSiteSettings({
+    successToast: options.successToast,
+    savingFlag: options.savingFlag,
+    fields: options.fields
+  })
+
+  if (!ok) {
+    return
+  }
+
+  copySettingsFields(options.snapshot, form, options.fields)
+  if (typeof options.afterSnapshot === 'function') {
+    options.afterSnapshot()
+  }
+  options.editingFlag.value = false
+}
+
 /**
 * 블로그 제목·설명 편집 모드 진입
 * @returns {void}
 */
 const beginEditTitleDesc = () => {
-  titleDescSnapshot.title = form.title
-  titleDescSnapshot.description = form.description
+  copySettingsFields(titleDescSnapshot, form, titleDescFields)
  editTitleDesc.value = true
 }

@@ -1294,8 +1350,7 @@ const beginEditTitleDesc = () => {
 * @returns {void}
 */
 const cancelEditTitleDesc = () => {
-  form.title = titleDescSnapshot.title
-  form.description = titleDescSnapshot.description
+  copySettingsFields(form, titleDescSnapshot, titleDescFields)
  editTitleDesc.value = false
 }

@@ -1304,19 +1359,14 @@ const cancelEditTitleDesc = () => {
 * @returns {Promise<void>}
 */
 const saveTitleDescSection = async () => {
-  if (!hasTitleDescChanges.value) {
-    return
-  }
-
-  const ok = await persistSiteSettings({
+  await saveSimpleSettingsSection({
+    hasChanges: hasTitleDescChanges,
    successToast: '블로그 제목·설명이 저장되었습니다.',
    savingFlag: savingTitleDesc,
-    fields: ['title', 'description']
+    editingFlag: editTitleDesc,
+    snapshot: titleDescSnapshot,
+    fields: titleDescFields
  })
-
-  if (ok) {
-    editTitleDesc.value = false
-  }
 }

 /**
@@ -1324,11 +1374,7 @@ const saveTitleDescSection = async () => {
 * @returns {void}
 */
 const beginEditMisc = () => {
-  miscSnapshot.siteUrl = form.siteUrl
-  miscSnapshot.logoText = form.logoText
-  miscSnapshot.logoUrl = form.logoUrl
-  miscSnapshot.faviconUrl = form.faviconUrl
-  miscSnapshot.copyrightText = form.copyrightText
+  copySettingsFields(miscSnapshot, form, miscFields)
  editMisc.value = true
 }

@@ -1337,11 +1383,7 @@ const beginEditMisc = () => {
 * @returns {void}
 */
 const cancelEditMisc = () => {
-  form.siteUrl = miscSnapshot.siteUrl
-  form.logoText = miscSnapshot.logoText
-  form.logoUrl = miscSnapshot.logoUrl
-  form.faviconUrl = miscSnapshot.faviconUrl
-  form.copyrightText = miscSnapshot.copyrightText
+  copySettingsFields(form, miscSnapshot, miscFields)
  editMisc.value = false
 }

@@ -1350,24 +1392,14 @@ const cancelEditMisc = () => {
 * @returns {Promise<void>}
 */
 const saveMiscSection = async () => {
-  if (!hasMiscChanges.value) {
-    return
-  }
-
-  const ok = await persistSiteSettings({
+  await saveSimpleSettingsSection({
+    hasChanges: hasMiscChanges,
    successToast: '사이트 정보가 저장되었습니다.',
    savingFlag: savingMisc,
-    fields: ['siteUrl', 'logoText', 'logoUrl', 'faviconUrl', 'copyrightText']
+    editingFlag: editMisc,
+    snapshot: miscSnapshot,
+    fields: miscFields
  })
-
-  if (ok) {
-    miscSnapshot.siteUrl = form.siteUrl
-    miscSnapshot.logoText = form.logoText
-    miscSnapshot.logoUrl = form.logoUrl
-    miscSnapshot.faviconUrl = form.faviconUrl
-    miscSnapshot.copyrightText = form.copyrightText
-    editMisc.value = false
-  }
 }

 /**
@@ -1597,10 +1629,7 @@ const clearHomeCoverImage = (variant = 'light') => {
 * @returns {void}
 */
 const beginEditHomeCover = () => {
-  homeCoverSnapshot.homeCoverImageUrl = form.homeCoverImageUrl
-  homeCoverSnapshot.homeCoverDarkImageUrl = form.homeCoverDarkImageUrl
-  homeCoverSnapshot.homeCoverTitle = form.homeCoverTitle
-  homeCoverSnapshot.homeCoverText = form.homeCoverText
+  copySettingsFields(homeCoverSnapshot, form, homeCoverFields)
  editHomeCover.value = true
 }

@@ -1609,10 +1638,7 @@ const beginEditHomeCover = () => {
 * @returns {void}
 */
 const cancelEditHomeCover = () => {
-  form.homeCoverImageUrl = homeCoverSnapshot.homeCoverImageUrl
-  form.homeCoverDarkImageUrl = homeCoverSnapshot.homeCoverDarkImageUrl
-  form.homeCoverTitle = homeCoverSnapshot.homeCoverTitle
-  form.homeCoverText = homeCoverSnapshot.homeCoverText
+  copySettingsFields(form, homeCoverSnapshot, homeCoverFields)
  editHomeCover.value = false
 }

@@ -1621,28 +1647,14 @@ const cancelEditHomeCover = () => {
 * @returns {Promise<void>}
 */
 const saveHomeCoverSection = async () => {
-  if (!hasHomeCoverChanges.value) {
-    return
-  }
-
-  const ok = await persistSiteSettings({
+  await saveSimpleSettingsSection({
+    hasChanges: hasHomeCoverChanges,
    successToast: '메인 화면 설정이 저장되었습니다.',
    savingFlag: savingHomeCover,
-    fields: [
-      'homeCoverImageUrl',
-      'homeCoverDarkImageUrl',
-      'homeCoverTitle',
-      'homeCoverText'
-    ]
+    editingFlag: editHomeCover,
+    snapshot: homeCoverSnapshot,
+    fields: homeCoverFields
  })
-
-  if (ok) {
-    homeCoverSnapshot.homeCoverImageUrl = form.homeCoverImageUrl
-    homeCoverSnapshot.homeCoverDarkImageUrl = form.homeCoverDarkImageUrl
-    homeCoverSnapshot.homeCoverTitle = form.homeCoverTitle
-    homeCoverSnapshot.homeCoverText = form.homeCoverText
-    editHomeCover.value = false
-  }
 }

 /**
@@ -1796,9 +1808,7 @@ const saveSpamSection = async () => {
 * @returns {void}
 */
 const beginEditSiteCode = () => {
-  siteCodeSnapshot.adsTxt = form.adsTxt
-  siteCodeSnapshot.customHeadCode = form.customHeadCode
-  siteCodeSnapshot.customFooterCode = form.customFooterCode
+  copySettingsFields(siteCodeSnapshot, form, siteCodeFields)
  editSiteCode.value = true
 }

@@ -1807,9 +1817,7 @@ const beginEditSiteCode = () => {
 * @returns {void}
 */
 const cancelEditSiteCode = () => {
-  form.adsTxt = siteCodeSnapshot.adsTxt
-  form.customHeadCode = siteCodeSnapshot.customHeadCode
-  form.customFooterCode = siteCodeSnapshot.customFooterCode
+  copySettingsFields(form, siteCodeSnapshot, siteCodeFields)
  editSiteCode.value = false
 }

@@ -1818,22 +1826,14 @@ const cancelEditSiteCode = () => {
 * @returns {Promise<void>}
 */
 const saveSiteCodeSection = async () => {
-  if (!hasSiteCodeChanges.value) {
-    return
-  }
-
-  const ok = await persistSiteSettings({
+  await saveSimpleSettingsSection({
+    hasChanges: hasSiteCodeChanges,
    successToast: '사이트 코드 설정이 저장되었습니다.',
    savingFlag: savingSiteCode,
-    fields: ['adsTxt', 'customHeadCode', 'customFooterCode']
+    editingFlag: editSiteCode,
+    snapshot: siteCodeSnapshot,
+    fields: siteCodeFields
  })
-
-  if (ok) {
-    siteCodeSnapshot.adsTxt = form.adsTxt
-    siteCodeSnapshot.customHeadCode = form.customHeadCode
-    siteCodeSnapshot.customFooterCode = form.customFooterCode
-    editSiteCode.value = false
-  }
 }

 /**
@@ -1841,13 +1841,7 @@ const saveSiteCodeSection = async () => {
 * @returns {void}
 */
 const beginEditAds = () => {
-  adsSnapshot.adHomeFeedCode = form.adHomeFeedCode
-  adsSnapshot.adHomeInfeedCode = form.adHomeInfeedCode
-  adsSnapshot.adSidebarCode = form.adSidebarCode
-  adsSnapshot.adPostSidebarCode = form.adPostSidebarCode
-  adsSnapshot.adPostTopCode = form.adPostTopCode
-  adsSnapshot.adPostInArticleCode = form.adPostInArticleCode
-  adsSnapshot.adPostBottomCode = form.adPostBottomCode
+  copySettingsFields(adsSnapshot, form, adsFields)
  editAds.value = true
 }

@@ -1856,13 +1850,7 @@ const beginEditAds = () => {
 * @returns {void}
 */
 const cancelEditAds = () => {
-  form.adHomeFeedCode = adsSnapshot.adHomeFeedCode
-  form.adHomeInfeedCode = adsSnapshot.adHomeInfeedCode
-  form.adSidebarCode = adsSnapshot.adSidebarCode
-  form.adPostSidebarCode = adsSnapshot.adPostSidebarCode
-  form.adPostTopCode = adsSnapshot.adPostTopCode
-  form.adPostInArticleCode = adsSnapshot.adPostInArticleCode
-  form.adPostBottomCode = adsSnapshot.adPostBottomCode
+  copySettingsFields(form, adsSnapshot, adsFields)
  editAds.value = false
 }

@@ -1871,34 +1859,14 @@ const cancelEditAds = () => {
 * @returns {Promise<void>}
 */
 const saveAdsSection = async () => {
-  if (!hasAdsChanges.value) {
-    return
-  }
-
-  const ok = await persistSiteSettings({
+  await saveSimpleSettingsSection({
+    hasChanges: hasAdsChanges,
    successToast: '광고 슬롯 설정이 저장되었습니다.',
    savingFlag: savingAds,
-    fields: [
-      'adHomeFeedCode',
-      'adHomeInfeedCode',
-      'adSidebarCode',
-      'adPostSidebarCode',
-      'adPostTopCode',
-      'adPostInArticleCode',
-      'adPostBottomCode'
-    ]
+    editingFlag: editAds,
+    snapshot: adsSnapshot,
+    fields: adsFields
  })
-
-  if (ok) {
-    adsSnapshot.adHomeFeedCode = form.adHomeFeedCode
-    adsSnapshot.adHomeInfeedCode = form.adHomeInfeedCode
-    adsSnapshot.adSidebarCode = form.adSidebarCode
-    adsSnapshot.adPostSidebarCode = form.adPostSidebarCode
-    adsSnapshot.adPostTopCode = form.adPostTopCode
-    adsSnapshot.adPostInArticleCode = form.adPostInArticleCode
-    adsSnapshot.adPostBottomCode = form.adPostBottomCode
-    editAds.value = false
-  }
 }

 /**