You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
115 lines
2.9 KiB
115 lines
2.9 KiB
<script setup>
|
|
import { onLoad } from "@dcloudio/uni-app";
|
|
import { ref } from "vue";
|
|
import navv from "@/components/nav/nav.vue";
|
|
import topTitle from "@/components/topTitle/topTitle.vue";
|
|
|
|
const type = ref("");
|
|
const result = ref([]);
|
|
const videoIndex = ref(0); // 视频滑块index
|
|
|
|
onLoad((options) => {
|
|
try {
|
|
const data = JSON.parse(options.data);
|
|
result.value = data.content;
|
|
type.value = data.fileType;
|
|
const videoContext = uni.createVideoContext(`myvideo${videoIndex.value}`);
|
|
videoContext.play();
|
|
console.log(type.value, result.value);
|
|
}
|
|
catch (err) {
|
|
console.error(err);
|
|
}
|
|
});
|
|
|
|
function swiperchange(e) {
|
|
videoIndex.value = e.detail.current;
|
|
for (let index = 0; index < this.data.result.length; index++) {
|
|
if (e.detail.current == index) {
|
|
const videoContext = uni.createVideoContext(`myvideo${index}`);
|
|
videoContext.play();
|
|
}
|
|
else {
|
|
const videoContexta = uni.createVideoContext(`myvideo${index}`);
|
|
videoContexta.pause();
|
|
}
|
|
}
|
|
}
|
|
|
|
function preview(index) {
|
|
// const index = e.currentTarget.dataset.index;
|
|
uni.previewImage({
|
|
current: result.value[index], // 当前显示图片的http链接
|
|
urls: result.value, // 需要预览的图片http链接列表
|
|
});
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<navv>
|
|
<template #default="{ screen, status, menu }">
|
|
<topTitle title="菜大王" />
|
|
|
|
<view
|
|
:style="{
|
|
height: `${screen - status - (menu || 0)}px`,
|
|
overflowY: 'auto',
|
|
}"
|
|
>
|
|
<swiper
|
|
v-if="type == 2"
|
|
:style="{
|
|
height: '100%',
|
|
// height: 'calc(100% - 40rpx)',
|
|
background: '#000000',
|
|
paddingBottom: '40rpx',
|
|
}"
|
|
:indicator-dots="true"
|
|
indicator-color="rgba(255, 255, 255, .8)"
|
|
autoplay
|
|
interval="3000"
|
|
duration="200"
|
|
>
|
|
<block
|
|
v-for="(item, index) in result"
|
|
:key="index"
|
|
>
|
|
<swiper-item
|
|
@tap="() => preview(index)"
|
|
>
|
|
<image style="width: 100%; height:100%" mode="aspectFit" :src="item" />
|
|
</swiper-item>
|
|
</block>
|
|
</swiper>
|
|
|
|
<swiper
|
|
v-if="type == 1"
|
|
:style="{
|
|
height: 'calc(100% - 40rpx)',
|
|
background: '#000000',
|
|
paddingBottom: '40rpx',
|
|
}"
|
|
vertical
|
|
circular
|
|
@change="(e) => swiperchange(e)"
|
|
>
|
|
<block
|
|
v-for="(item, index) in result"
|
|
:key="index"
|
|
>
|
|
<swiper-item>
|
|
<video :id="`myvideo${index}`" :src="item" loop />
|
|
</swiper-item>
|
|
</block>
|
|
</swiper>
|
|
</view>
|
|
</template>
|
|
</navv>
|
|
|
|
<!-- <video id="video_box" autoplay
|
|
wx:if="{{type==1}}" src="{{result}}"></video> -->
|
|
</template>
|
|
|
|
<style scoped lang="scss">
|
|
@import "./enterKingInfo.scss";
|
|
</style>
|