35 lines
831 B
Vue
35 lines
831 B
Vue
<script setup lang="ts">
|
|
import type { PageDataResourceGroup } from '#layers/types/api/pageData'
|
|
|
|
interface Props {
|
|
variant?: 'videoPlay' | 'videoPlayImg'
|
|
resourcesData: PageDataResourceGroup
|
|
}
|
|
|
|
const props = defineProps<Props>()
|
|
|
|
const modalStore = useModalStore()
|
|
|
|
const backgroundColor = computed(() => {
|
|
return getColorCodeFromData(props.resourcesData.display, 'none')
|
|
})
|
|
|
|
// 비디오 플레이 버튼 클릭 핸들러
|
|
const handleVideoPlayClick = () => {
|
|
const youtubeUrl = props.resourcesData?.display?.text ?? ''
|
|
if (youtubeUrl) {
|
|
modalStore.handleOpenYoutube({ youtubeUrl })
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<AtomsButtonPlay
|
|
v-motion-stagger
|
|
:variant="props.variant"
|
|
:background-color="backgroundColor"
|
|
:tracking="props.resourcesData.tracking"
|
|
@click="handleVideoPlayClick"
|
|
/>
|
|
</template>
|