32 lines
858 B
Vue
32 lines
858 B
Vue
<template>
|
|
<swiper class="banner-swiper" :indicator-dots="true" :autoplay="false" circular>
|
|
<swiper-item v-if="video">
|
|
<video class="banner-swiper__video" :src="fullUrl(video)" controls />
|
|
</swiper-item>
|
|
<swiper-item v-for="(img, idx) in images" :key="idx">
|
|
<image class="banner-swiper__image" :src="fullUrl(img)" mode="aspectFill" />
|
|
</swiper-item>
|
|
</swiper>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { BASE_URL } from '../utils/request'
|
|
|
|
defineProps<{
|
|
images: string[]
|
|
video?: string
|
|
}>()
|
|
|
|
function fullUrl(path: string): string {
|
|
if (!path) return ''
|
|
if (path.startsWith('http')) return path
|
|
return BASE_URL + path
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.banner-swiper { width: 100%; height: 600rpx; }
|
|
.banner-swiper__image { width: 100%; height: 600rpx; }
|
|
.banner-swiper__video { width: 100%; height: 600rpx; }
|
|
</style>
|