<script setup lang="ts">
import { computed, ref } from 'vue'
import Swiper from './swiper.vue'
import AllEvents from './all-events.vue'
import listEn from './list-en.js'
import listZhCn from './list-zh-cn.js'
import listZhTw from './list-zh-tw.js'
import { LangType } from '../../lang'
import { useI18n } from 'vue-i18n'
const { locale } = useI18n()
const allList = computed(() => {
	if (locale.value === LangType.zhCn) {
		return listZhCn
	}
	if (locale.value === LangType.zhTw) {
		return listZhTw
	}
	return listEn
})
defineExpose({})
</script>
<template>
	<div class="events">
		<div class="placeholder"></div>
		<Swiper />
		<AllEvents />
	</div>
</template>
<style lang="less" scoped>
	.events{
		.placeholder{
			height: var(--main-header-height, 100px);
			width: 100%;
			position: sticky;
			top: 0;
			background-color: #000;
		}
	}
</style>
