Merge branch 'all'

layers/templates/GrVisual03/index.vue

@@ -1,9 +1,10 @@
 <script setup lang="ts">
 import { SplideSlide } from '@splidejs/vue-splide'
 import {
-  hasComponentGroup,
-  getComponentGroup,
+  getComponentContainer,
   getComponentGroupAry,
+  getComponentGroup,
+  hasComponentGroup,
 } from '#layers/utils/dataUtil'
 import type { PageDataTemplateComponents } from '#layers/types/api/pageData'
 
@@ -12,11 +13,23 @@ interface Props {
   pageVerTmplSeq: string
 }
 
+const { locale } = useI18n()
+
 const props = defineProps<Props>()
 
+const { sendLog, useAnalyticsLogDataDirect } = useAnalytics()
+
 const slideData = computed(() => {
   return getComponentContainer(props.components, 'group_sets')
 })
+
+const onArrowClick = direction => {
+  const logTraking =
+    direction == 'prev'
+      ? getComponentGroupAry(props.components, 'arrow')?.groups[0]
+      : getComponentGroupAry(props.components, 'arrow')?.groups[1]
+  sendLog(locale.value, useAnalyticsLogDataDirect(logTraking, 1))
+}
 </script>
 
 <template>
@@ -26,6 +39,7 @@ const slideData = computed(() => {
       :arrows="true"
       :pagination="true"
       class="h-full"
+      @arrow-click="onArrowClick"
     >
       <SplideSlide v-for="(item, index) in slideData" :key="index">
         <WidgetsBackground
@@ -51,6 +65,7 @@ const slideData = computed(() => {
           <WidgetsButtonList
             v-if="hasComponentGroup(item, 'buttonList')"
             :resources-data="getComponentGroupAry(item, 'buttonList')"
+            :page-ver-tmpl-seq="Number(props.pageVerTmplSeq)"
             class="mt-[28px] md:mt-[52px]"
           />
         </div>