|
|
@@ -45,6 +45,19 @@
|
|
|
<div class="name">{{ item.name }}</div>
|
|
|
<text class="desc">{{ item.desc }}</text>
|
|
|
<swiper class="siwper" next-margin="47px" circular>
|
|
|
+ <swiper-item v-if="item.video" class="swiper-item">
|
|
|
+ <video
|
|
|
+ :id="`video-${i}`"
|
|
|
+ :src="item.video.src"
|
|
|
+ :poster="item.video.poster"
|
|
|
+ :loop="true"
|
|
|
+ object-fit="cover"
|
|
|
+ @play="onPlay"
|
|
|
+ ></video>
|
|
|
+ <!-- <div class="mask">
|
|
|
+ <img src="../static/imgs/icon_play.png" class="icon-play" />
|
|
|
+ </div> -->
|
|
|
+ </swiper-item>
|
|
|
<swiper-item v-for="(img, j) in item.img" :key="j" class="swiper-item">
|
|
|
<img :src="img" mode="aspectFill" @click="preview(img, item.img)" />
|
|
|
</swiper-item>
|
|
|
@@ -114,7 +127,7 @@ export default {
|
|
|
if (this.$mp.query.tab) {
|
|
|
this.tab = this.$mp.query.tab;
|
|
|
}
|
|
|
- this.$http.get('/article/getByName/可玩项目').then(res => {
|
|
|
+ this.$http.get('/article/getByName/游玩项目').then(res => {
|
|
|
this.intro = JSON.parse(res.content);
|
|
|
});
|
|
|
this.$http.get('/article/getByName/购买须知').then(res => {
|
|
|
@@ -144,6 +157,18 @@ export default {
|
|
|
current: img,
|
|
|
urls: list
|
|
|
});
|
|
|
+ },
|
|
|
+ onPlay(e) {
|
|
|
+ console.log(e);
|
|
|
+ this.intro.forEach((i, index) => {
|
|
|
+ if (i.video) {
|
|
|
+ console.log(i.video);
|
|
|
+ if (e.target.id !== `video-${index}`) {
|
|
|
+ let ctx = wx.createVideoContext(`video-${index}`, this);
|
|
|
+ ctx.stop();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
@@ -305,6 +330,11 @@ rich-text {
|
|
|
height: 199px;
|
|
|
border-radius: 8px;
|
|
|
}
|
|
|
+ video {
|
|
|
+ width: 100%;
|
|
|
+ height: 199px;
|
|
|
+ border-radius: 8px;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
