gil/web-temp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 다국어 json 호출 추가

Browse Source
This commit is contained in:
“hyeonggkim”
2025-10-24 14:14:54 +09:00
parent 76fc7a68c0
commit f7a292808f
13 changed files with 196 additions and 561 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
i18n/locales/de.ts
View File

@@ -1,49 +1,24 @@
// import { TRANSLATION_ITEMS } from '../i18n.config'
// common.json 파일을 직접 import
// @ts-ignore
import commonData from '../../layers/assets/data/common.json'
export default defineI18nLocale(async (locale: string) => {
const runtimeConfig = useRuntimeConfig()
const baseType = runtimeConfig.public.baseType
const translationItems = runtimeConfig.public.translationItems
const translationItemsArr = translationItems.split(',')
const staticUrl = runtimeConfig.public.staticUrl
const translationApi = translationItemsArr.map((item: string): string => {
return `${staticUrl}/${baseType}/tmp/${item}.json`
})
//https://static-pubcomm.gate8.com/dev/test/multilingual/test_common_template.json?20251021185116
const config = useRuntimeConfig()
const rootPath = config.public.staticUrl
const runType = config.public.runType
// API 데이터 가져오기
const fetchDataPromises = translationApi.map(apiUrl => {
return useFetch(apiUrl, {
method: 'GET',
headers: {
'Content-Type': 'application/json;charset=UTF-8',
},
})
})
const translationApi = `${rootPath}/${runType}/test/multilingual/test_common_template.json`
try {
const fetchResults = await Promise.all(fetchDataPromises)
// 각 결과에서 locale에 맞는 데이터를 추출
const apiData = fetchResults.map(result => {
return result.data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
const { data } = await useFetch(translationApi, {
method: 'GET',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
}
})
// apiData를 이용해 자동으로 병합
const mergedResult = apiData.reduce((acc, data) => {
return { ...acc, ...data }
}, {})
// common.json에서 해당 locale의 데이터를 가져와서 병합
const commonLocaleData = commonData[locale] || {}
// API 데이터에서 locale에 맞는 데이터를 추출
const apiData = data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
// API 데이터와 common.json 데이터를 병합 (common.json이 우선순위)
const finalResult = { ...mergedResult, ...commonLocaleData }
// 병합된 결과 출력
// console.log('finalResult:', finalResult)
const finalResult = { ...apiData }
return finalResult
} catch (error) {

61
i18n/locales/en.ts
View File

@@ -1,57 +1,24 @@
// import { TRANSLATION_ITEMS } from '../i18n.config'
// common.json 파일을 직접 import
// @ts-ignore
import commonData from '../../layers/assets/data/common.json'
export default defineI18nLocale(async (locale: string) => {
// const config = useRuntimeConfig()
// const baseType = config.public.baseType
// const translationItems = config.public.translationItems
// const translationItemsArr = translationItems.split(',')
// const staticUrl = config.public.staticUrl
// const translationPaths = translationItemsArr.map((item) => {
// 경로를 생성하며 ~/assets/data 경로로 설정
// return `~/assets/data/${item}.json`
// })
// const resources = await Promise.all(translationPaths.map((path) => import(`${path}`)))
//https://static-pubcomm.gate8.com/dev/test/multilingual/test_common_template.json?20251021185116
const config = useRuntimeConfig()
const rootPath = config.public.staticUrl
const runType = config.public.runType
// console.log('translationLocal ~ translationLocal:', translationLocal)
// const translationApi = translationItemsArr.map((item: string): string => {
// return `${staticUrl}/${baseType}/tmp/${item}.json`
// })
// // API 데이터 가져오기
// const fetchDataPromises = translationApi.map((apiUrl) => {
// return useFetch(apiUrl, {
// method: 'GET',
// headers: {
// 'Content-Type': 'application/json;charset=UTF-8'
// }
// })
// })
const translationApi = `${rootPath}/${runType}/test/multilingual/test_common_template.json`
try {
// const fetchResults = await Promise.all(fetchDataPromises)
const { data } = await useFetch(translationApi, {
method: 'GET',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
}
})
// // 각 결과에서 locale에 맞는 데이터를 추출
// const apiData = fetchResults.map((result) => {
// return result.data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
// })
// API 데이터에서 locale에 맞는 데이터를 추출
const apiData = data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
// // apiData를 이용해 자동으로 병합
// const mergedResult = apiData.reduce((acc, data) => {
// return { ...acc, ...data }
// }, {})
// common.json에서 해당 locale의 데이터를 가져와서 병합
const commonLocaleData = commonData[locale] || {}
// API 데이터와 common.json 데이터를 병합 (common.json이 우선순위)
// const finalResult = { ...mergedResult, ...commonLocaleData }
const finalResult = { ...commonLocaleData }
// 병합된 결과 출력
// console.log('finalResult:', finalResult)
const finalResult = { ...apiData }
return finalResult
} catch (error) {

51
i18n/locales/es.ts
View File

@@ -1,49 +1,24 @@
// import { TRANSLATION_ITEMS } from '../i18n.config'
// common.json 파일을 직접 import
// @ts-ignore
import commonData from '../../layers/assets/data/common.json'
export default defineI18nLocale(async (locale: string) => {
const runtimeConfig = useRuntimeConfig()
const baseType = runtimeConfig.public.baseType
const translationItems = runtimeConfig.public.translationItems
const translationItemsArr = translationItems.split(',')
const staticUrl = runtimeConfig.public.staticUrl
const translationApi = translationItemsArr.map((item: string): string => {
return `${staticUrl}/${baseType}/tmp/${item}.json`
})
//https://static-pubcomm.gate8.com/dev/test/multilingual/test_common_template.json?20251021185116
const config = useRuntimeConfig()
const rootPath = config.public.staticUrl
const runType = config.public.runType
// API 데이터 가져오기
const fetchDataPromises = translationApi.map(apiUrl => {
return useFetch(apiUrl, {
method: 'GET',
headers: {
'Content-Type': 'application/json;charset=UTF-8',
},
})
})
const translationApi = `${rootPath}/${runType}/test/multilingual/test_common_template.json`
try {
const fetchResults = await Promise.all(fetchDataPromises)
// 각 결과에서 locale에 맞는 데이터를 추출
const apiData = fetchResults.map(result => {
return result.data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
const { data } = await useFetch(translationApi, {
method: 'GET',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
}
})
// apiData를 이용해 자동으로 병합
const mergedResult = apiData.reduce((acc, data) => {
return { ...acc, ...data }
}, {})
// common.json에서 해당 locale의 데이터를 가져와서 병합
const commonLocaleData = commonData[locale] || {}
// API 데이터에서 locale에 맞는 데이터를 추출
const apiData = data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
// API 데이터와 common.json 데이터를 병합 (common.json이 우선순위)
const finalResult = { ...mergedResult, ...commonLocaleData }
// 병합된 결과 출력
// console.log('finalResult:', finalResult)
const finalResult = { ...apiData }
return finalResult
} catch (error) {

51
i18n/locales/fr.ts
View File

@@ -1,49 +1,24 @@
// import { TRANSLATION_ITEMS } from '../i18n.config'
// common.json 파일을 직접 import
// @ts-ignore
import commonData from '../../layers/assets/data/common.json'
export default defineI18nLocale(async (locale: string) => {
const runtimeConfig = useRuntimeConfig()
const baseType = runtimeConfig.public.baseType
const translationItems = runtimeConfig.public.translationItems
const translationItemsArr = translationItems.split(',')
const staticUrl = runtimeConfig.public.staticUrl
const translationApi = translationItemsArr.map((item: string): string => {
return `${staticUrl}/${baseType}/tmp/${item}.json`
})
//https://static-pubcomm.gate8.com/dev/test/multilingual/test_common_template.json?20251021185116
const config = useRuntimeConfig()
const rootPath = config.public.staticUrl
const runType = config.public.runType
// API 데이터 가져오기
const fetchDataPromises = translationApi.map(apiUrl => {
return useFetch(apiUrl, {
method: 'GET',
headers: {
'Content-Type': 'application/json;charset=UTF-8',
},
})
})
const translationApi = `${rootPath}/${runType}/test/multilingual/test_common_template.json`
try {
const fetchResults = await Promise.all(fetchDataPromises)
// 각 결과에서 locale에 맞는 데이터를 추출
const apiData = fetchResults.map(result => {
return result.data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
const { data } = await useFetch(translationApi, {
method: 'GET',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
}
})
// apiData를 이용해 자동으로 병합
const mergedResult = apiData.reduce((acc, data) => {
return { ...acc, ...data }
}, {})
// common.json에서 해당 locale의 데이터를 가져와서 병합
const commonLocaleData = commonData[locale] || {}
// API 데이터에서 locale에 맞는 데이터를 추출
const apiData = data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
// API 데이터와 common.json 데이터를 병합 (common.json이 우선순위)
const finalResult = { ...mergedResult, ...commonLocaleData }
// 병합된 결과 출력
// console.log('finalResult:', finalResult)
const finalResult = { ...apiData }
return finalResult
} catch (error) {

61
i18n/locales/ja.ts
View File

@@ -1,57 +1,24 @@
// import { TRANSLATION_ITEMS } from '../i18n.config'
// common.json 파일을 직접 import
// @ts-ignore
import commonData from '../../layers/assets/data/common.json'
export default defineI18nLocale(async (locale: string) => {
// const config = useRuntimeConfig()
// const baseType = config.public.baseType
// const translationItems = config.public.translationItems
// const translationItemsArr = translationItems.split(',')
// const staticUrl = config.public.staticUrl
// const translationPaths = translationItemsArr.map((item) => {
// 경로를 생성하며 ~/assets/data 경로로 설정
// return `~/assets/data/${item}.json`
// })
// const resources = await Promise.all(translationPaths.map((path) => import(`${path}`)))
//https://static-pubcomm.gate8.com/dev/test/multilingual/test_common_template.json?20251021185116
const config = useRuntimeConfig()
const rootPath = config.public.staticUrl
const runType = config.public.runType
// console.log('translationLocal ~ translationLocal:', translationLocal)
// const translationApi = translationItemsArr.map((item: string): string => {
// return `${staticUrl}/${baseType}/tmp/${item}.json`
// })
// // API 데이터 가져오기
// const fetchDataPromises = translationApi.map((apiUrl) => {
// return useFetch(apiUrl, {
// method: 'GET',
// headers: {
// 'Content-Type': 'application/json;charset=UTF-8'
// }
// })
// })
const translationApi = `${rootPath}/${runType}/test/multilingual/test_common_template.json`
try {
// const fetchResults = await Promise.all(fetchDataPromises)
const { data } = await useFetch(translationApi, {
method: 'GET',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
}
})
// // 각 결과에서 locale에 맞는 데이터를 추출
// const apiData = fetchResults.map((result) => {
// return result.data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
// })
// API 데이터에서 locale에 맞는 데이터를 추출
const apiData = data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
// // apiData를 이용해 자동으로 병합
// const mergedResult = apiData.reduce((acc, data) => {
// return { ...acc, ...data }
// }, {})
// common.json에서 해당 locale의 데이터를 가져와서 병합
const commonLocaleData = commonData[locale] || {}
// API 데이터와 common.json 데이터를 병합 (common.json이 우선순위)
// const finalResult = { ...mergedResult, ...commonLocaleData }
const finalResult = { ...commonLocaleData }
// 병합된 결과 출력
// console.log('finalResult:', finalResult)
const finalResult = { ...apiData }
return finalResult
} catch (error) {

61
i18n/locales/ko.ts
View File

@@ -1,57 +1,24 @@
// import { TRANSLATION_ITEMS } from '../i18n.config'
// common.json 파일을 직접 import
// @ts-ignore
import commonData from '../../layers/assets/data/common.json'
export default defineI18nLocale(async (locale: string) => {
// const config = useRuntimeConfig()
// const baseType = config.public.baseType
// const translationItems = config.public.translationItems
// const translationItemsArr = translationItems.split(',')
// const staticUrl = config.public.staticUrl
// const translationPaths = translationItemsArr.map((item) => {
// 경로를 생성하며 ~/assets/data 경로로 설정
// return `~/assets/data/${item}.json`
// })
// const resources = await Promise.all(translationPaths.map((path) => import(`${path}`)))
//https://static-pubcomm.gate8.com/dev/test/multilingual/test_common_template.json?20251021185116
const config = useRuntimeConfig()
const rootPath = config.public.staticUrl
const runType = config.public.runType
// console.log('translationLocal ~ translationLocal:', translationLocal)
// const translationApi = translationItemsArr.map((item: string): string => {
// return `${staticUrl}/${baseType}/tmp/${item}.json`
// })
// // API 데이터 가져오기
// const fetchDataPromises = translationApi.map((apiUrl) => {
// return useFetch(apiUrl, {
// method: 'GET',
// headers: {
// 'Content-Type': 'application/json;charset=UTF-8'
// }
// })
// })
const translationApi = `${rootPath}/${runType}/test/multilingual/test_common_template.json`
try {
// const fetchResults = await Promise.all(fetchDataPromises)
const { data } = await useFetch(translationApi, {
method: 'GET',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
}
})
// // 각 결과에서 locale에 맞는 데이터를 추출
// const apiData = fetchResults.map((result) => {
// return result.data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
// })
// API 데이터에서 locale에 맞는 데이터를 추출
const apiData = data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
// // apiData를 이용해 자동으로 병합
// const mergedResult = apiData.reduce((acc, data) => {
// return { ...acc, ...data }
// }, {})
// common.json에서 해당 locale의 데이터를 가져와서 병합
const commonLocaleData = commonData[locale] || {}
// API 데이터와 common.json 데이터를 병합 (common.json이 우선순위)
// const finalResult = { ...mergedResult, ...commonLocaleData }
const finalResult = { ...commonLocaleData }
// 병합된 결과 출력
// console.log('finalResult:', finalResult)
const finalResult = { ...apiData }
return finalResult
} catch (error) {

51
i18n/locales/pt.ts
View File

@@ -1,49 +1,24 @@
// import { TRANSLATION_ITEMS } from '../i18n.config'
// common.json 파일을 직접 import
// @ts-ignore
import commonData from '../../layers/assets/data/common.json'
export default defineI18nLocale(async (locale: string) => {
const runtimeConfig = useRuntimeConfig()
const baseType = runtimeConfig.public.baseType
const translationItems = runtimeConfig.public.translationItems
const translationItemsArr = translationItems.split(',')
const staticUrl = runtimeConfig.public.staticUrl
const translationApi = translationItemsArr.map((item: string): string => {
return `${staticUrl}/${baseType}/tmp/${item}.json`
})
//https://static-pubcomm.gate8.com/dev/test/multilingual/test_common_template.json?20251021185116
const config = useRuntimeConfig()
const rootPath = config.public.staticUrl
const runType = config.public.runType
// API 데이터 가져오기
const fetchDataPromises = translationApi.map(apiUrl => {
return useFetch(apiUrl, {
method: 'GET',
headers: {
'Content-Type': 'application/json;charset=UTF-8',
},
})
})
const translationApi = `${rootPath}/${runType}/test/multilingual/test_common_template.json`
try {
const fetchResults = await Promise.all(fetchDataPromises)
// 각 결과에서 locale에 맞는 데이터를 추출
const apiData = fetchResults.map(result => {
return result.data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
const { data } = await useFetch(translationApi, {
method: 'GET',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
}
})
// apiData를 이용해 자동으로 병합
const mergedResult = apiData.reduce((acc, data) => {
return { ...acc, ...data }
}, {})
// common.json에서 해당 locale의 데이터를 가져와서 병합
const commonLocaleData = commonData[locale] || {}
// API 데이터에서 locale에 맞는 데이터를 추출
const apiData = data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
// API 데이터와 common.json 데이터를 병합 (common.json이 우선순위)
const finalResult = { ...mergedResult, ...commonLocaleData }
// 병합된 결과 출력
// console.log('finalResult:', finalResult)
const finalResult = { ...apiData }
return finalResult
} catch (error) {

45
i18n/locales/th.ts
View File

@@ -1,49 +1,24 @@
// import { TRANSLATION_ITEMS } from '../i18n.config'
// common.json 파일을 직접 import
// @ts-ignore
import commonData from '../../layers/assets/data/common.json'
export default defineI18nLocale(async (locale: string) => {
//https://static-pubcomm.gate8.com/dev/test/multilingual/test_common_template.json?20251021185116
const config = useRuntimeConfig()
const baseType = config.public.baseType
const translationItems = config.public.translationItems
const translationItemsArr = translationItems.split(',')
const staticUrl = config.public.staticUrl
const translationApi = translationItemsArr.map((item: string): string => {
return `${staticUrl}/${baseType}/tmp/${item}.json`
})
const rootPath = config.public.staticUrl
const runType = config.public.runType
// API 데이터 가져오기
const fetchDataPromises = translationApi.map((apiUrl) => {
return useFetch(apiUrl, {
const translationApi = `${rootPath}/${runType}/test/multilingual/test_common_template.json`
try {
const { data } = await useFetch(translationApi, {
method: 'GET',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
}
})
})
try {
const fetchResults = await Promise.all(fetchDataPromises)
// API 데이터에서 locale에 맞는 데이터를 추출
const apiData = data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
// 각 결과에서 locale에 맞는 데이터를 추출
const apiData = fetchResults.map((result) => {
return result.data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
})
// apiData를 이용해 자동으로 병합
const mergedResult = apiData.reduce((acc, data) => {
return { ...acc, ...data }
}, {})
// common.json에서 해당 locale의 데이터를 가져와서 병합
const commonLocaleData = commonData[locale] || {}
// API 데이터와 common.json 데이터를 병합 (common.json이 우선순위)
const finalResult = { ...mergedResult, ...commonLocaleData }
// 병합된 결과 출력
// console.log('finalResult:', finalResult)
const finalResult = { ...apiData }
return finalResult
} catch (error) {

64
i18n/locales/zh-cn.ts
View File

@@ -1,57 +1,29 @@
// import { TRANSLATION_ITEMS } from '../i18n.config'
// common.json 파일을 직접 import
// @ts-ignore
import commonData from '../../layers/assets/data/common.json'
export default defineI18nLocale(async (locale: string) => {
// const config = useRuntimeConfig()
// const baseType = config.public.baseType
// const translationItems = config.public.translationItems
// const translationItemsArr = translationItems.split(',')
// const staticUrl = config.public.staticUrl
// const translationPaths = translationItemsArr.map((item) => {
// 경로를 생성하며 ~/assets/data 경로로 설정
// return `~/assets/data/${item}.json`
// })
// const resources = await Promise.all(translationPaths.map((path) => import(`${path}`)))
//https://static-pubcomm.gate8.com/dev/test/multilingual/test_common_template.json?20251021185116
const config = useRuntimeConfig()
const rootPath = config.public.staticUrl
const runType = config.public.runType
// console.log('translationLocal ~ translationLocal:', translationLocal)
// const translationApi = translationItemsArr.map((item: string): string => {
// return `${staticUrl}/${baseType}/tmp/${item}.json`
// })
// // API 데이터 가져오기
// const fetchDataPromises = translationApi.map((apiUrl) => {
// return useFetch(apiUrl, {
// method: 'GET',
// headers: {
// 'Content-Type': 'application/json;charset=UTF-8'
// }
// })
// })
const translationApi = `${rootPath}/${runType}/test/multilingual/test_common_template.json`
try {
// const fetchResults = await Promise.all(fetchDataPromises)
const { data } = await useFetch(translationApi, {
method: 'GET',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
}
})
// // 각 결과에서 locale에 맞는 데이터를 추출
// const apiData = fetchResults.map((result) => {
// return result.data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
// })
// // apiData를 이용해 자동으로 병합
// const mergedResult = apiData.reduce((acc, data) => {
// return { ...acc, ...data }
// }, {})
if(locale === 'zh-cn') {
locale = 'zh-CN'
}
// API 데이터에서 locale에 맞는 데이터를 추출
const apiData = data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
// common.json에서 해당 locale의 데이터를 가져와서 병합
const commonLocaleData = commonData[locale] || {}
// API 데이터와 common.json 데이터를 병합 (common.json이 우선순위)
// const finalResult = { ...mergedResult, ...commonLocaleData }
const finalResult = { ...commonLocaleData }
// 병합된 결과 출력
// console.log('finalResult:', finalResult)
const finalResult = { ...apiData }
return finalResult
} catch (error) {

64
i18n/locales/zh-tw.ts
View File

@@ -1,57 +1,29 @@
// import { TRANSLATION_ITEMS } from '../i18n.config'
// common.json 파일을 직접 import
// @ts-ignore
import commonData from '../../layers/assets/data/common.json'
export default defineI18nLocale(async (locale: string) => {
// const config = useRuntimeConfig()
// const baseType = config.public.baseType
// const translationItems = config.public.translationItems
// const translationItemsArr = translationItems.split(',')
// const staticUrl = config.public.staticUrl
// const translationPaths = translationItemsArr.map((item) => {
// 경로를 생성하며 ~/assets/data 경로로 설정
// return `~/assets/data/${item}.json`
// })
// const resources = await Promise.all(translationPaths.map((path) => import(`${path}`)))
//https://static-pubcomm.gate8.com/dev/test/multilingual/test_common_template.json?20251021185116
const config = useRuntimeConfig()
const rootPath = config.public.staticUrl
const runType = config.public.runType
// console.log('translationLocal ~ translationLocal:', translationLocal)
// const translationApi = translationItemsArr.map((item: string): string => {
// return `${staticUrl}/${baseType}/tmp/${item}.json`
// })
// // API 데이터 가져오기
// const fetchDataPromises = translationApi.map((apiUrl) => {
// return useFetch(apiUrl, {
// method: 'GET',
// headers: {
// 'Content-Type': 'application/json;charset=UTF-8'
// }
// })
// })
const translationApi = `${rootPath}/${runType}/test/multilingual/test_common_template.json`
try {
// const fetchResults = await Promise.all(fetchDataPromises)
const { data } = await useFetch(translationApi, {
method: 'GET',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
}
})
// // 각 결과에서 locale에 맞는 데이터를 추출
// const apiData = fetchResults.map((result) => {
// return result.data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
// })
// // apiData를 이용해 자동으로 병합
// const mergedResult = apiData.reduce((acc, data) => {
// return { ...acc, ...data }
// }, {})
if(locale === 'zh-tw') {
locale = 'zh-TW'
}
// API 데이터에서 locale에 맞는 데이터를 추출
const apiData = data.value?.[locale] || {} // locale에 맞는 데이터가 없으면 빈 객체 반환
// common.json에서 해당 locale의 데이터를 가져와서 병합
const commonLocaleData = commonData[locale] || {}
// API 데이터와 common.json 데이터를 병합 (common.json이 우선순위)
// const finalResult = { ...mergedResult, ...commonLocaleData }
const finalResult = { ...commonLocaleData }
// 병합된 결과 출력
// console.log('finalResult:', finalResult)
const finalResult = { ...apiData }
return finalResult
} catch (error) {

106
layers/components/layouts/Footer.vue
View File

@@ -16,7 +16,7 @@
}"
>
<NuxtLink
:to="footerMenuItem.link"
:to="footerMenuItem.url"
:target="footerMenuItem.target"
:class="[
footerMenuItem.active === 'y' && 'text-[#e04600]',
@@ -31,11 +31,11 @@
</div>
<div class="flex mt-2.5 md:flex-col md:mt-1.5">
<img
<!-- <img
:src="footerData.game_rating_image_url"
alt="게임등급"
class="w-10 h-14 md:w-10 md:h-12 md:order-1"
/>
/> -->
<dl
class="grid grid-cols-[110px_auto_110px_auto] w-full max-w-[490px] ml-5 border-t border-l border-gray-600 tracking-tight md:grid-cols-[66px_auto_84px_auto] md:max-w-[358px] md:m-0 md:mb-2.5"
@@ -120,28 +120,25 @@
<div class="logo-area flex mt-3 md:mt-2.5">
<a
:href="
locale === 'ja'
? 'https://www.smilegate.com/jp'
: 'https://www.smilegate.com/en'
"
href="https://www.smilegate.com"
target="_blank"
class="smilegate"
>
<img
:src="footerData.dev_ci_url"
src="https://static-pubcomm.gate8.com/local/template/l9/common/logo_smilegate.png"
alt="스마일게이트 로고"
class="w-auto h-auto"
/>
</a>
<a
href="https://www.nx3games.com"
v-if="setDevCi"
:href="footerData.use_dev_ci_url"
target="_blank"
class="nx3 ml-2.5 md:ml-4"
>
<img
:src="footerData.dev_ci_url2"
alt="NX3 로고"
:src="footerData.use_dev_ci_url"
alt="CI"
class="w-auto h-auto"
/>
</a>
@@ -160,85 +157,18 @@
</template>
<script setup lang="ts">
const { locale } = useI18n()
interface FooterMenuType {
id: string
title: string
link: string
target: string
active: string
highlight?: string
}
const footerLinks = ref<FooterMenuType[]>([
{
id: 'company',
title: '회사소개',
link: '#',
target: '_blank',
active: 'n',
},
{
id: 'terms',
title: '이용약관',
link: 'https://common.game.onstove.com/terms/index?gameType=SG&termsType=1&langCode=@m{Terms_Lang_Code}',
target: '_blank',
active: 'n',
},
{
id: 'privacy',
title: '개인정보처리방침',
link: 'https://clause.onstove.com/stove/terms?category=privacy',
target: '_blank',
active: 'y',
},
{
id: 'operation',
title: '운영정책',
link: 'https://common.game.onstove.com/terms/index?gameType=CZN&termsType=3&langCode=@m{Terms_Lang_Code}',
target: '_blank',
active: 'n',
},
{
id: 'fund',
title: '청소년보호정책',
link: 'https://common.game.onstove.com/terms/index?gameType=CZN&termsType=6&langCode=ja',
target: '_blank',
active: 'n',
},
{
id: 'customerService',
title: '게임 이용 등급',
link: 'https://cs.onstove.com/@m{Terms_Lang_Code}/service/STOVE_CHAOSZERO',
target: '_blank',
active: 'n',
},
] as FooterMenuType[])
const { tm } = useI18n()
const footerData = ref({
dev_ci_url:
'https://static-pubcomm.gate8.com/local/template/l9/common/logo_smilegate.png',
dev_ci_url2:
'https://static-pubcomm.gate8.com/local/template/l9/common/logo_nx3.png',
game_rating_image_url:
'https://static-pubcomm.gate8.com/local/template/l9/common/grades_age/Type15.svg',
use_dev_ci_url: true,
fund_display_yn: true,
use_game_rating: true,
fund_display_url: 'https://testgame.com/law/fund-ko',
game_rating_info: {
title: '테스트 게임',
reg_no: 'R-2024-7890',
prod_date: '2024-05-01',
rating_type: '15',
company_name: '테스트엔터테인먼트',
content_info: '1,2,3,',
rating_grade: '15세 이용가',
rating_class_no: '2024-123456',
},
footer_info:
"(주)스마일게이트홀딩스 메가포트지점 대표: 성준호<br>주소: 경기도 성남시 분당구 분당로 55, 7층 (서현동 분당 퍼스트타워)<br>통신판매업 신고번호: 제2023-성남분당A-0145호<br>사업자등록번호: 813-85-02492<br>E-mail: <a href='mailto:help@smilegate.com'>help@smilegate.com</a><br>TEL: 1670-0399",
const gameDataStore = useGameDataStore()
const { gameData } = storeToRefs(gameDataStore)
const footerLinks = computed(() => {
return tm('Footer_Menu') as unknown as any[]
})
const footerData = ref(gameData.value?.footer_json as any)
const setDevCi = ref(gameData.value?.footer_dev_ci_img_yn as boolean)
</script>
<style scoped>

7
layers/components/layouts/Main.vue
View File

@@ -11,6 +11,7 @@ interface Props {
}
const props = defineProps<Props>()
const { locale } = useI18n()
// 템플릿 레지스트리 사용
const { getTemplateComponent } = useTemplateRegistry()
@@ -44,12 +45,18 @@ const setupSeoMeta = (metaTag: PageDataMetaTag) => {
})
}
onMounted(() => {
const { sendLog } = useAnalytics()
sendLog(locale.value, useAnalyticsLogDataDirect('view', 1))
})
// 메타 태그 설정 감시
watchEffect(() => {
if (shouldShowMetaTag.value && props.pageData.meta_tag) {
setupSeoMeta(props.pageData.meta_tag)
}
})
</script>
<template>

84
layers/composables/useAnalytics.ts
View File

@@ -9,45 +9,6 @@ declare const svcLog: any
declare const twq: any
declare const ttq: any
/**
* 페이지 데이터와 템플릿 정보를 기반으로 분석용 로그 데이터를 생성하는 composable
* @param resourcesData 페이지 리소스 데이터
* @param pageVerTmplSeq 템플릿 시퀀스 번호
* @returns 분석용 로그 데이터 객체
*/
export const useAnalyticsLogData = (
resourcesData: PageDataResourceGroup,
pageVerTmplSeq: number
) => {
const store = usePageDataStore()
const pageData = store.pageData
if (!pageData) {
return ref({} as AnalyticsDetailType)
}
// const pageDataTrack = (typeof resourcesData.tracking === 'object' ? resourcesData.tracking : {}) as AnalyticsLogDataTracking
const pageDataTrack = resourcesData.tracking
const logData = ref({
actionType: pageDataTrack?.action_type,
// logSourceType:pageDataTrack.logSourceType,
// viewArea:pageDataTrack.viewArea,
// viewType:pageDataTrack.viewType,
clickArea: pageData.page_name_en,
clickSarea: pageData.templates[pageVerTmplSeq].page_ver_tmpl_name_en,
clickItem: `${pageData.templates[pageVerTmplSeq].page_ver_tmpl_name}_${pageDataTrack?.click_item}`,
event: pageData.page_name,
eventCategory: `${pageData.page_name}_${pageDataTrack?.click_item}`,
template_code: pageData.templates[pageVerTmplSeq].template_code,
page_ver_tmpl_name: pageData.templates[pageVerTmplSeq].page_ver_tmpl_name,
page_ver_tmpl_name_en:
pageData.templates[pageVerTmplSeq].page_ver_tmpl_name_en,
} as unknown as AnalyticsDetailType)
return logData
}
/**
* 페이지 데이터와 템플릿 정보를 기반으로 분석용 로그 데이터를 생성하는 composable (직접 객체 반환)
* @param resourcesData 페이지 리소스 데이터
@@ -55,8 +16,8 @@ export const useAnalyticsLogData = (
* @returns 분석용 로그 데이터 객체 (ref 없이)
*/
export const useAnalyticsLogDataDirect = (
resourcesData: PageDataResourceGroup,
pageVerTmplSeq: number
resourcesData: PageDataResourceGroup | string,
pageVerTmplSeq: number | null
) => {
const store = usePageDataStore()
const pageData = store.pageData
@@ -64,24 +25,41 @@ export const useAnalyticsLogDataDirect = (
if (!pageData) {
return {} as AnalyticsDetailType
}
// const pageDataTrack = (typeof resourcesData.tracking === 'object' ? resourcesData.tracking : {}) as AnalyticsLogDataTracking
// resourcesData가 문자열인 경우 (예: 'view')
if (typeof resourcesData === 'string') {
const logData = {
actionType: resourcesData,
event: pageData.page_name,
eventCategory: pageData.page_name,
} as unknown as AnalyticsDetailType
if (resourcesData === 'view') {
logData.viewArea = pageData.page_name_en
logData.viewType = 'pageView'
}
return logData
}
// resourcesData가 객체인 경우 (기존 로직)
const pageDataTrack = resourcesData.tracking
const logData = {
actionType: pageDataTrack?.action_type,
// logSourceType:pageDataTrack.logSourceType,
// viewArea:pageDataTrack.viewArea,
// viewType:pageDataTrack.viewType,
clickArea:pageData.page_name_en,
clickSarea: pageData.templates[pageVerTmplSeq].page_ver_tmpl_name_en,
clickItem: `${pageData.templates[pageVerTmplSeq].page_ver_tmpl_name}_${pageDataTrack?.click_item}`,
event: pageData.page_name,
eventCategory: `${pageData.page_name}_${pageDataTrack?.click_item}`,
template_code: pageData.templates[pageVerTmplSeq].template_code,
page_ver_tmpl_name: pageData.templates[pageVerTmplSeq].page_ver_tmpl_name,
page_ver_tmpl_name_en: pageData.templates[pageVerTmplSeq].page_ver_tmpl_name_en,
eventCategory: `${pageData.page_name}_${pageDataTrack?.click_sarea}_${pageDataTrack?.click_item}`,
} as unknown as AnalyticsDetailType
if(pageDataTrack.action_type === 'click') {
logData.clickArea = pageData.page_name_en
logData.clickSarea = pageDataTrack.click_sarea
logData.clickItem = pageDataTrack.click_item
} else if(pageDataTrack.action_type === 'view') {
logData.viewArea = pageData.page_name_en
logData.viewType = 'view_frame'
}
return logData
}
@@ -362,5 +340,5 @@ const sendMarketingScript = ({
}
export default () => {
return { sendGA, sendSA, sendLog, sendMarketingScript, useAnalyticsLogData, useAnalyticsLogDataDirect }
return { sendGA, sendSA, sendLog, sendMarketingScript, useAnalyticsLogDataDirect }
}