From 0d9b5dd7ad04ff100b9017231e338472cb0b98ae Mon Sep 17 00:00:00 2001
From: clkim <clkim@smilegate.com>
Date: Thu, 13 Nov 2025 17:18:44 +0900
Subject: [PATCH] =?UTF-8?q?fix.=20=ED=95=98=EC=9D=B4=EB=93=9C=EB=A0=88?=
 =?UTF-8?q?=EC=9D=B4=EC=85=98=20=EC=97=90=EB=9F=AC=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/app.vue                                |  1 -
 layers/assets/css/base/_transition.css     | 27 ++++++++-----
 layers/components/atoms/loading/Simple.vue | 47 ----------------------
 layers/components/layouts/Header.vue       | 12 +++---
 layers/templates/FxCoupon01/index.vue      |  4 +-
 layers/templates/FxDownload01/index.vue    |  2 +
 layers/templates/FxSecure01/index.vue      |  7 +++-
 layers/templates/FxVideo01/index.vue       |  3 +-
 8 files changed, 35 insertions(+), 68 deletions(-)
 delete mode 100644 layers/components/atoms/loading/Simple.vue

diff --git a/app/app.vue b/app/app.vue
index 263c680..ecb9d6d 100644
--- a/app/app.vue
+++ b/app/app.vue
@@ -194,7 +194,6 @@ onBeforeUnmount(() => {
   <BlocksModalToast />
 
   <!-- 로딩 컴포넌트 -->
-  <AtomsLoadingSimple />
   <AtomsLoadingFull />
   <AtomsLoadingLocal />
 </template>
diff --git a/layers/assets/css/base/_transition.css b/layers/assets/css/base/_transition.css
index 8cc9b36..59f1fb8 100644
--- a/layers/assets/css/base/_transition.css
+++ b/layers/assets/css/base/_transition.css
@@ -1,13 +1,3 @@
-/* page-fade */
-.page-fade-enter-active,
-.page-fade-leave-active {
-  transition: opacity 0.6s cubic-bezier(0.33, 1, 0.68, 1);
-}
-.page-fade-enter-from,
-.page-fade-leave-to {
-  opacity: 0;
-}
-
 /* fade */
 .fade-enter-active,
 .fade-leave-active {
@@ -18,6 +8,23 @@
   opacity: 0;
 }
 
+/* fade-out */
+.fade-out-enter-active,
+.fade-out-enter-from,
+.fade-out-enter-to {
+  transition: none;
+  opacity: 1;
+}
+.fade-out-leave-active {
+  transition: opacity 0.3s ease-out;
+}
+.fade-out-leave-from {
+  opacity: 1;
+}
+.fade-out-leave-to {
+  opacity: 0;
+}
+
 .slide-up-enter-active,
 .slide-up-leave-active {
   transition:
diff --git a/layers/components/atoms/loading/Simple.vue b/layers/components/atoms/loading/Simple.vue
deleted file mode 100644
index ec4eb87..0000000
--- a/layers/components/atoms/loading/Simple.vue
+++ /dev/null
@@ -1,47 +0,0 @@
-<script setup lang="ts">
-interface Props {
-  isLoading?: boolean
-}
-
-const isLoading = ref(true)
-
-const router = useRouter()
-
-// 페이지 전환 감지 및 로딩 상태 관리
-if (import.meta.client) {
-  router.beforeEach((to, from) => {
-    if (from.path !== to.path) {
-      isLoading.value = true
-    }
-  })
-
-  router.afterEach(() => {
-    isLoading.value = false
-  })
-}
-
-onMounted(() => {
-  isLoading.value = false
-})
-</script>
-
-<template>
-  <div v-if="isLoading" class="spinner-wrap">
-    <div class="spinner"></div>
-  </div>
-</template>
-
-<style scoped>
-.spinner-wrap {
-  @apply fixed inset-0 flex items-center justify-center bg-black z-[90];
-}
-.spinner {
-  @apply w-[80px] h-[80px] bg-cover bg-center bg-no-repeat bg-[url('/images/common/publisning_template_loader_black.png')];
-}
-
-[data-theme='light'] {
-  .spinner {
-    @apply bg-[url('/images/common/publisning_template_loader_white.png')];
-  }
-}
-</style>
diff --git a/layers/components/layouts/Header.vue b/layers/components/layouts/Header.vue
index c0f0caa..3b5350f 100644
--- a/layers/components/layouts/Header.vue
+++ b/layers/components/layouts/Header.vue
@@ -63,13 +63,11 @@ const hasActiveChild = (children?: GameDataMenuChildren) => {
 const isNavItemActive = (gnbItem: GameDataMenu): boolean => {
   const cur = currentPath.value
   const base = gnbItem?.url_path
-  if (import.meta.client) {
-    const selfActive =
-      !!base &&
-      isInternalUrl(base) &&
-      pathMatches(formatPathWithoutLocale(base), cur)
-    return selfActive || hasActiveChild(gnbItem.children)
-  }
+  const selfActive =
+    !!base &&
+    isInternalUrl(base) &&
+    pathMatches(formatPathWithoutLocale(base), cur)
+  return selfActive || hasActiveChild(gnbItem.children)
 }
 
 // navAreaRef의 넓이를 구하는 함수
diff --git a/layers/templates/FxCoupon01/index.vue b/layers/templates/FxCoupon01/index.vue
index 9aef765..8ac1c1c 100644
--- a/layers/templates/FxCoupon01/index.vue
+++ b/layers/templates/FxCoupon01/index.vue
@@ -16,6 +16,7 @@ import type { ReqCouponList } from '#layers/types/api/couponData'
 
 // Props
 interface Props {
+  id?: string
   components: PageDataTemplateComponents
   pageVerTmplSeq: number
 }
@@ -485,8 +486,9 @@ onMounted(async () => {
 
 <template>
   <WidgetsFixMainTitle
+    :id="props.id"
     :title="tm('Coupon_Page_Title')"
-    :resourcesData="backgroundData"
+    :resources-data="backgroundData"
   />
 
   <div class="section-container static">
diff --git a/layers/templates/FxDownload01/index.vue b/layers/templates/FxDownload01/index.vue
index e9c12bb..1e56131 100644
--- a/layers/templates/FxDownload01/index.vue
+++ b/layers/templates/FxDownload01/index.vue
@@ -6,6 +6,7 @@ import type { Platform } from '#layers/types/components/button'
 
 // Props
 interface Props {
+  id?: string
   components: PageDataTemplateComponents
   pageVerTmplSeq: number
 }
@@ -131,6 +132,7 @@ const handleMoveFocus = (target: 'pc' | 'mobile') => {
 
 <template>
   <WidgetsFixMainTitle
+    :id="props.id"
     :title="tm('Download_Page_Title')"
     :resources-data="backgroundData"
   />
diff --git a/layers/templates/FxSecure01/index.vue b/layers/templates/FxSecure01/index.vue
index e629c3f..e000a96 100644
--- a/layers/templates/FxSecure01/index.vue
+++ b/layers/templates/FxSecure01/index.vue
@@ -5,6 +5,7 @@ import { getImageHost } from '#layers/utils/styleUtil'
 
 // Props
 interface Props {
+  id?: string
   components: PageDataTemplateComponents
   pageVerTmplSeq: number
 }
@@ -47,7 +48,10 @@ const checkLoginValidation = async () => {
   const validateTokenResult = await handleTokenValidation(
     accessToken.value || ''
   )
-  console.log("🚀 ~ checkLoginValidation ~ validateTokenResult:", validateTokenResult)
+  console.log(
+    '🚀 ~ checkLoginValidation ~ validateTokenResult:',
+    validateTokenResult
+  )
   isLogin.value = validateTokenResult
 }
 
@@ -142,6 +146,7 @@ onMounted(() => {
 
 <template>
   <WidgetsFixMainTitle
+    :id="props.id"
     :title="tm('Secure_Page_Title') || '보안 강화 캠페인'"
     :resources-data="backgroundData"
     class="mx-auto"
diff --git a/layers/templates/FxVideo01/index.vue b/layers/templates/FxVideo01/index.vue
index b7b4935..5915a4d 100644
--- a/layers/templates/FxVideo01/index.vue
+++ b/layers/templates/FxVideo01/index.vue
@@ -11,6 +11,7 @@ import type { PageDataTemplateComponents } from '#layers/types/api/pageData'
 import type { OperateGroupItem } from '#layers/types/api/operateResources'
 
 interface Props {
+  id?: string
   components: PageDataTemplateComponents
   pageVerTmplSeq: number
 }
@@ -119,10 +120,10 @@ const handleLoadMoreRecent = () => {
 
 <template>
   <WidgetsFixMainTitle
+    :id="props.id"
     :title="tm('Video_Page_Title')"
     :resources-data="backgroundData"
   />
-
   <div class="section-container static">
     <section class="section-static">
       <WidgetsFixSubTitle