From 5af62adefd5442cef7c7d6a0a5d3f586cc4a200b Mon Sep 17 00:00:00 2001
From: clkim <clkim@smilegate.com>
Date: Mon, 15 Dec 2025 16:48:11 +0900
Subject: [PATCH] =?UTF-8?q?fix.=20=EB=A1=9C=EA=B7=B8=20=EC=A0=84=EC=86=A1?=
 =?UTF-8?q?=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 layers/components/blocks/Button/Launcher.vue  |  8 +-----
 layers/components/blocks/{Button => }/Sns.vue | 12 +++------
 layers/components/layouts/Main.vue            |  2 +-
 layers/components/widgets/modal/Preregist.vue |  5 ++--
 layers/templates/FxDownload01/index.vue       | 18 +++++++++----
 layers/templates/FxPreregist01/index.vue      | 11 +++-----
 layers/templates/FxSecure01/index.vue         |  6 ++---
 layers/utils/formatUtil.ts                    | 26 +++++++++++++++++++
 8 files changed, 53 insertions(+), 35 deletions(-)
 rename layers/components/blocks/{Button => }/Sns.vue (94%)

diff --git a/layers/components/blocks/Button/Launcher.vue b/layers/components/blocks/Button/Launcher.vue
index f56376f..97edbc5 100644
--- a/layers/components/blocks/Button/Launcher.vue
+++ b/layers/components/blocks/Button/Launcher.vue
@@ -31,12 +31,6 @@ const { isProcessing, validateLauncher } = useCheckGameStart()
 
 const { gameData } = storeToRefs(gameDataStore)
 
-const PLATFORM_LABEL_KEY: Record<PlatformTransformType, string> = {
-  pc: 'PC',
-  google_play: 'Google Play',
-  app_store: 'App Store',
-} as const
-
 const PLATFORM_ICON_MAP: Record<Platform, string> = {
   google_play: 'AtomsIconsLogoGoogle',
   app_store: 'AtomsIconsLogoApple',
@@ -93,7 +87,7 @@ const tmWithGameName = (key: string): string => {
   )
 
   const platformLines = supportedPlatforms.value
-    .map(platform => highlight(PLATFORM_LABEL_KEY[platform] as string))
+    .map(platform => highlight(formatSnakeToTitle(platform)))
     .filter(Boolean)
 
   return platformLines.length
diff --git a/layers/components/blocks/Button/Sns.vue b/layers/components/blocks/Sns.vue
similarity index 94%
rename from layers/components/blocks/Button/Sns.vue
rename to layers/components/blocks/Sns.vue
index 3a4bdc7..f6d5e91 100644
--- a/layers/components/blocks/Button/Sns.vue
+++ b/layers/components/blocks/Sns.vue
@@ -26,12 +26,8 @@ const snsList = computed(() => {
   return gameData.value?.sns_json
 })
 
-const handleMouseEnter = () => {
-  showSnsList.value = true
-}
-
-const handleForceClose = () => {
-  showSnsList.value = false
+const handleControlForce = (state: boolean) => {
+  showSnsList.value = state
 }
 
 const handleCopy = async () => {
@@ -56,7 +52,7 @@ const handleCopy = async () => {
         class="btn-sns"
         sr-only="sns"
         :style="{ backgroundColor: snsBackgroundColor }"
-        @click="handleMouseEnter"
+        @click="handleControlForce(true)"
       >
         <AtomsIconsShareLine class="icon-share" />
       </AtomsButtonCircle>
@@ -96,7 +92,7 @@ const handleCopy = async () => {
           <button
             type="button"
             class="opacity-50 z-[1] hover:opacity-100"
-            @click="handleForceClose"
+            @click="handleControlForce(false)"
           >
             <span class="sr-only">close</span>
             <AtomsIconsCloseLine size="24" />
diff --git a/layers/components/layouts/Main.vue b/layers/components/layouts/Main.vue
index 20f2423..f09070b 100644
--- a/layers/components/layouts/Main.vue
+++ b/layers/components/layouts/Main.vue
@@ -105,7 +105,7 @@ onMounted(() => {
       :class="['utile-wrap', { 'is-stop': pinToMain }]"
     >
       <BlocksButtonScrollTop v-if="isShowTopBtn" />
-      <BlocksButtonSns v-if="isShowSnsBtn" />
+      <BlocksSns v-if="isShowSnsBtn" />
     </div>
   </ClientOnly>
 </template>
diff --git a/layers/components/widgets/modal/Preregist.vue b/layers/components/widgets/modal/Preregist.vue
index 6328564..ee7d08c 100644
--- a/layers/components/widgets/modal/Preregist.vue
+++ b/layers/components/widgets/modal/Preregist.vue
@@ -387,10 +387,9 @@ defineExpose({
         <!-- STOVE App Download -->
         <div class="flex flex-col gap-5">
           <p
+            v-dompurify-html="tmWithGameName('Preregist_Stove_Download')"
             class="text-left text-sm font-medium leading-6 tracking-[-0.42px] text-[#ebebeb] md:text-center md:text-base md:leading-[26px] md:tracking-[-0.48px]"
-          >
-            {{ tm('Preregist_Stove_Download') }}
-          </p>
+          />
           <div class="flex items-center gap-3">
             <div
               v-if="device.isDesktop"
diff --git a/layers/templates/FxDownload01/index.vue b/layers/templates/FxDownload01/index.vue
index 86bff6c..e9bc2a4 100644
--- a/layers/templates/FxDownload01/index.vue
+++ b/layers/templates/FxDownload01/index.vue
@@ -32,7 +32,7 @@ const resultGetMultilingual = await useGetMultilingual({
   baseApiUrl: dataResourcesUrl,
   fileName: multilingualFileName,
 })
-const { tm, locale }: any = useI18n({
+const { t, tm, locale }: any = useI18n({
   useScope: 'local',
   messages: Object(resultGetMultilingual?.value?.multilingual),
 })
@@ -230,7 +230,11 @@ const handleMoveFocus = (target: 'pc' | 'mobile') => {
               v-else-if="breakpoints.isMd || breakpoints.isDesktop"
               platform="pc"
               class="!w-full !max-w-[300px]"
-              @click="handleSendLog('PC 버전 다운로드')"
+              @click="
+                handleSendLog(
+                  t('Download_Button_PC_Download', {}, { locale: 'ko' })
+                )
+              "
             >
               <span>{{ tm('Download_Button_PC') }}</span>
             </BlocksButtonLauncher>
@@ -249,7 +253,11 @@ const handleMoveFocus = (target: 'pc' | 'mobile') => {
                 target="_self"
                 rel="noopener noreferrer"
                 class="inline-flex items-center justify-start gap-[4px] text-[#3C75FF] text-[16px] font-[500] reading-[24px] tracking-[-0.48px]"
-                @click="handleSendLog('스토브 PC 클라이언트 다운로드')"
+                @click="
+                  handleSendLog(
+                    t('Download_Button_STOVE', {}, { locale: 'ko' })
+                  )
+                "
               >
                 <span>{{ tm('Download_Button_STOVE') }}</span>
                 <AtomsIconsDownloadLine color="#3C75FF" />
@@ -304,7 +312,7 @@ const handleMoveFocus = (target: 'pc' | 'mobile') => {
                   "
                   :platform="`${os.platformCode as Platform}`"
                   class="!w-full"
-                  @click="handleSendLog(os.platformCode)"
+                  @click="handleSendLog(formatSnakeToTitle(os.platformCode))"
                 >
                   <span>{{ os.platformText }}</span>
                 </BlocksButtonLauncher>
@@ -388,7 +396,7 @@ const handleMoveFocus = (target: 'pc' | 'mobile') => {
               gameNo: gameData?.game_code?.toString(),
               locale: locale as string,
             }),
-            handleSendLog('내 PC 사양 확인하기'),
+            handleSendLog(t('Download_Button_SpecCheck', {}, { locale: 'ko' })),
           ]"
         >
           <em
diff --git a/layers/templates/FxPreregist01/index.vue b/layers/templates/FxPreregist01/index.vue
index 2628bc9..5c62752 100644
--- a/layers/templates/FxPreregist01/index.vue
+++ b/layers/templates/FxPreregist01/index.vue
@@ -223,17 +223,12 @@ const handleSendLog = (item: string) => {
     click_item: item,
     click_sarea: props.pageVerTmplNameEn,
   }
-  sendLog(locale.value, analytics)
+  sendLog(locale.value, analytics, { useGA: true })
 }
 
 const handlePreregistClick = () => {
   preregistModalRef.value?.handleOpenPreregist()
-  handleSendLog(`STOVE_${t('Preregist_Btn_Preegist', {}, { locale: 'ko' })}`)
-}
-
-const handleSnsButtonClick = (btn: { id: string; link: string }) => {
-  csrGoExternalLink(btn.link)
-  handleSendLog(btn.id)
+  handleSendLog(`STOVE ${t('Preregist_Btn_Preegist', {}, { locale: 'ko' })}`)
 }
 </script>
 
@@ -324,7 +319,7 @@ const handleSnsButtonClick = (btn: { id: string; link: string }) => {
                 :text-color="buttonColors.textColor"
                 @click="
                   handleSendLog(
-                    `${sns}_${t('Preregist_Btn_Preegist', {}, { locale: 'ko' })}`
+                    `${formatSnakeToTitle(sns)} ${t('Preregist_Btn_Preegist', {}, { locale: 'ko' })}`
                   )
                 "
               >
diff --git a/layers/templates/FxSecure01/index.vue b/layers/templates/FxSecure01/index.vue
index 1644639..b146873 100644
--- a/layers/templates/FxSecure01/index.vue
+++ b/layers/templates/FxSecure01/index.vue
@@ -54,7 +54,7 @@ const secureCards = computed(() => {
       benefitIcon: '/images/common/img_OTP.png',
       buttonDisabled: false,
       url: tm('Secure_OtpLogin_Url'),
-      analyticsItem: '스토브 인증기',
+      analyticsItem: t('Secure_Stove_otp', {}, { locale: 'ko' }),
     },
     {
       id: 'SECURE_CARD_1',
@@ -68,7 +68,7 @@ const secureCards = computed(() => {
       benefitIcon: '',
       buttonDisabled: false,
       url: tm('Secure_AbroadLogin_Url'),
-      analyticsItem: '해외 로그인 차단',
+      analyticsItem: t('Secure_Block_foreign_login', {}, { locale: 'ko' }),
     },
     {
       id: 'SECURE_CARD_2',
@@ -82,7 +82,7 @@ const secureCards = computed(() => {
       benefitIcon: '',
       buttonDisabled: false,
       url: tm('Secure_PcRegister_Url'),
-      analyticsItem: '지정 PC 관리',
+      analyticsItem: t('Secure_Trusted_pc_management', {}, { locale: 'ko' }),
     },
   ]
 
diff --git a/layers/utils/formatUtil.ts b/layers/utils/formatUtil.ts
index 604b0cd..c04d5e0 100644
--- a/layers/utils/formatUtil.ts
+++ b/layers/utils/formatUtil.ts
@@ -75,3 +75,29 @@ export const formatPathHost = (
 
   return `${basePath}${path}`
 }
+
+/**
+ * snake_case 문자열을 Title Case로 변환합니다.
+ * 짧은 단어(pc, stove 등)는 전체 대문자로 표시됩니다.
+ * @param str 변환할 문자열 (예: "google_play", "pc", "stove")
+ * @returns Title Case로 변환된 문자열 (예: "Google Play", "PC", "STOVE")
+ */
+export const formatSnakeToTitle = (str: string): string => {
+  if (!str) return ''
+
+  // 전체 대문자로 표시할 단어 목록
+  const uppercaseWords = ['pc', 'stove']
+
+  return str
+    .split('_')
+    .map(word => {
+      const lowerWord = word.toLowerCase()
+      // 특정 단어는 전체 대문자로 표시
+      if (uppercaseWords.includes(lowerWord)) {
+        return word.toUpperCase()
+      }
+      // 일반 단어는 첫 글자만 대문자
+      return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase()
+    })
+    .join(' ')
+}