<template>
  <div class="club-layout">
    <router-view></router-view>
  </div>
</template>

<script>
import { useGtag } from 'vue-gtag-next'

export default {
  name: 'ClubLayout',
  setup() {
    const gtag = useGtag()
    
    // 컴포넌트 마운트 시 페이지뷰 이벤트 발생
    gtag.pageview({
      page_title: '클럽 레이아웃',
      page_path: window.location.pathname,
      page_location: window.location.href
    })
    
    // 이벤트 추적 메서드 예시
    const trackButtonClick = (buttonName) => {
      gtag.event('button_click', {
        'event_category': '클럽',
        'event_label': buttonName,
        'value': 1
      })
    }
    
    return {
      trackButtonClick
    }
  }
}
</script>

<style scoped>
.club-layout {
  width: 100%;
  height: 100%;
}
</style>
