import { createApp } from 'vue'
import { createPinia } from 'pinia'
import App from './App.vue'
import router from './router'
import './assets/base.css'

// Google Tag Manager 설정
import VueGtag from 'vue-gtag-next'

// dayjs configuration
import dayjs from 'dayjs'
import timezone from 'dayjs/plugin/timezone'
import utc from 'dayjs/plugin/utc'

dayjs.extend(utc)
dayjs.extend(timezone)
dayjs.tz.setDefault('Asia/Seoul')

// dayjs를 전역 객체로 등록
window.dayjs = dayjs

// PrimeVue
import PrimeVue from 'primevue/config'
import Aura from '@primeuix/themes/aura';
import 'primeicons/primeicons.css'
import 'primeflex/primeflex.css'

// PrimeVue Components
import Button from 'primevue/button'
import SplitButton from 'primevue/splitbutton'
import InputText from 'primevue/inputtext'
import DataTable from 'primevue/datatable'
import Column from 'primevue/column'
import Dialog from 'primevue/dialog'
import Select from 'primevue/select'
import MultiSelect from 'primevue/multiselect'
import Toast from 'primevue/toast'
import ToastService from 'primevue/toastservice'
import Card from 'primevue/card'
import Menu from 'primevue/menu'
import Menubar from 'primevue/menubar'
import PanelMenu from 'primevue/panelmenu'
import Chart from 'primevue/chart'
import Avatar from 'primevue/avatar'
import Checkbox from 'primevue/checkbox'
import Password from 'primevue/password'
import Textarea from 'primevue/textarea'
import Badge from 'primevue/badge'
import InputNumber from 'primevue/inputnumber'
import Divider from 'primevue/divider'
import ProgressSpinner from 'primevue/progressspinner'
import DatePicker from 'primevue/datepicker'
import Tag from 'primevue/tag'
import FloatLabel from 'primevue/floatlabel';
import Tooltip from 'primevue/tooltip';
import Tabs from 'primevue/tabs';
import FileUpload from 'primevue/fileupload';
import Steps from 'primevue/steps';
import Calendar from 'primevue/calendar';
import TabPanels from 'primevue/tabpanels';
import TabPanel from 'primevue/tabpanel';
import TabList from 'primevue/tablist';
import Tab from 'primevue/tab';
import {ko} from 'primelocale/js/ko.js';
import { createHead } from '@vueuse/head'
import AppHeader from './components/AppHeader.vue';
const app = createApp(App)
const head = createHead()
app.use(head)
// Register PrimeVue
app.use(PrimeVue, {
  theme: {
    preset: Aura,
    options: {
      darkModeSelector: false
    },
    locale: ko
  }
})
app.directive('tooltip', Tooltip)
app.use(ToastService)
app.use(createPinia())
app.use(router)

// Google Analytics(GA) vue-gtag-next 플러그인 등록
app.use(VueGtag, {
  property: {
    id: 'GTM-PPDRKT7Q'
  },
  appName: '볼링매니저',
  pageTrackerScreenviewEnabled: true
}, router)
// GTM-PPDRKT7Q: 구글 태그매니저(GA4) ID

// Register custom components
app.component('AppHeader', AppHeader);

// Register PrimeVue Components
app.component('Button', Button)
app.component('SplitButton', SplitButton)
app.component('InputText', InputText)
app.component('DataTable', DataTable)
app.component('Column', Column)
app.component('Dialog', Dialog)
app.component('Select', Select)
app.component('MultiSelect', MultiSelect)
app.component('Toast', Toast)
app.component('Card', Card)
app.component('Tabs', Tabs)
app.component('TabPanels', TabPanels)
app.component('TabPanel', TabPanel)
app.component('TabList', TabList)
app.component('Tab', Tab)
app.component('Menu', Menu)
app.component('Menubar', Menubar)
app.component('PanelMenu', PanelMenu)
app.component('Chart', Chart)
app.component('Avatar', Avatar)
app.component('Checkbox', Checkbox)
app.component('Password', Password)
app.component('Textarea', Textarea)
app.component('Badge', Badge)
app.component('InputNumber', InputNumber)
app.component('Divider', Divider)
app.component('ProgressSpinner', ProgressSpinner)
app.component('DatePicker', DatePicker)
app.component('Tag', Tag)
app.component('FloatLabel', FloatLabel);
app.component('FileUpload', FileUpload);
app.component('Steps', Steps);
app.component('Calendar', Calendar);

app.mount('#app')