aerwen_u_site/components/Poster/index.vue
2024-06-10 23:22:45 +08:00

47 lines
1.1 KiB
Vue

<template>
<div class="Poster-main op0" data-animation="animate__animated animate__fadeIn animate__slow">
<div class="Poster-container" :style="posterStyle">
<img class="Poster-img" :src="posterInfo.imgSrc" alt="">
<div class="Poster-content-box">
<div class="Poster-title">{{ posterInfo.title }}</div>
<div class="Poster-text">{{ posterInfo.text }}</div>
</div>
</div>
</div>
</template>
<script setup>
const { t, locale } = useI18n()
const props = defineProps({
type: Number,
title: String,
text: String,
})
const initState = {
imgSrc: '',
title: '',
text: ''
}
let posterInfo = ref({ ...initState })
let posterStyle = {
height: '8vw',
}
// 获取海报
useFetch('/api/poster/getPoster', { params: { poster_location: props.type, locale: locale.value } }).then(res => {
const data = JSON.parse(res.data.value).data
posterInfo.value = data
setTimeout(() => {
htmlAddAnimations()
});
})
</script>
<style scoped src="~/assets/css/poster/index.scss"></style>
<style scoped src="~/assets/css/poster/media.scss"></style>