gter.net/gterFang
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

预览切换视频暂停播放前一个视频

Browse Source
This commit is contained in:
A1300399510 2024-09-26 14:12:38 +08:00
parent 2c5b4255aa
commit 7b0de16bcf
19 changed files with 51 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
dist/css/seachPage.656f2a0e.css → dist/css/312.caec181f.css vendored
View File

File diff suppressed because one or more lines are too long

1
dist/css/49.ecfed06f.css vendored
View File

File diff suppressed because one or more lines are too long

1
dist/css/detail.30c20242.css vendored
View File

File diff suppressed because one or more lines are too long

1
dist/css/detail.cebb5e8f.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

1
dist/css/housing.b56519ac.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

1
dist/css/housing.fec91ddb.css vendored
View File

File diff suppressed because one or more lines are too long

1
dist/css/seachPage.fb0ee410.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

2
dist/index.html vendored
View File

@ -1,4 +1,4 @@
<!doctype html><html lang=""><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><meta name="viewport" content="width=device-width,initial-scale=1"/><link rel="icon" href="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/favicon.ico"/><title>港校租房</title><script defer="defer" src="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/js/chunk-vendors.6d96b969.js"></script><script defer="defer" src="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/js/app.61755ab4.js"></script><link href="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/css/chunk-vendors.7885d77e.css" rel="stylesheet"><link href="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/css/app.2bc4614a.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but zufang doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><script src="https://app.gter.net/bottom?tpl=header&menukey=fang"></script><div id="app"></div><div style="display: none;"><script src="//v1.cnzz.com/z_stat.php?id=1281224882&amp;web_id=1281224882"></script><script>var _hmt = _hmt || []
<!doctype html><html lang=""><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><meta name="viewport" content="width=device-width,initial-scale=1"/><link rel="icon" href="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/favicon.ico"/><title>港校租房</title><script defer="defer" src="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/js/chunk-vendors.6d96b969.js"></script><script defer="defer" src="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/js/app.5c613bbb.js"></script><link href="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/css/chunk-vendors.7885d77e.css" rel="stylesheet"><link href="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/css/app.2bc4614a.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but zufang doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><script src="https://app.gter.net/bottom?tpl=header&menukey=fang"></script><div id="app"></div><div style="display: none;"><script src="//v1.cnzz.com/z_stat.php?id=1281224882&amp;web_id=1281224882"></script><script>var _hmt = _hmt || []
;(function () {
var hm = document.createElement("script")
hm.src = "//hm.baidu.com/hm.js?4bd66cbe45a640b607fe46c48f658746"

2
dist/js/164.8c2cbe62.js → dist/js/312.c06ddbcf.js vendored
View File

File diff suppressed because one or more lines are too long

12
dist/js/49.3db27491.js → dist/js/770.cc3b93ef.js vendored
View File

File diff suppressed because one or more lines are too long

1
dist/js/app.5c613bbb.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

1
dist/js/app.61755ab4.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/js/detail.538cfe88.js → dist/js/detail.2ce915c6.js vendored
View File

File diff suppressed because one or more lines are too long

1
dist/js/housing.2bb5024d.js vendored
View File

File diff suppressed because one or more lines are too long

1
dist/js/housing.331e89af.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

6
src/components/detail/imageWatch.vue
View File

@ -1,5 +1,6 @@
<template>
<div class="watch-box" v-show="show">
<!-- <div class="watch-box" v-show="show"> -->
<div class="watch-box">
<div class="pos-r dis-f al-item jus-x mg-t-60">
<div class="carousel-w">
<el-carousel arrow="never" height="600px" :autoplay="false" :initial-index="props.index" indicator-position="none" ref="carousel" @change="carouselChange">
@ -7,7 +8,8 @@
<div class="dis-f jus-x al-item" v-if="item">
<div class="img-box dis-f jus-x" v-if="item['type'] != 'attachment'" style="align-items: center;">
<video-box :src="item.url || item['videourl']" :val="i" :poster="item.thumbnail" :imageTab="imageTab"></video-box>
<!-- <video ref="video" v-if="i >= imageTab - 1 && i <= imageTab + 1" :autoplay="false" controls :src="item.url || item['videourl']" :preload="imageTab == i ? 'metadata' : 'none'" style="width: 800px;"></video> --> </div>
<!-- <video ref="video" v-if="i >= imageTab - 1 && i <= imageTab + 1" :autoplay="false" controls :src="item.url || item['videourl']" :preload="imageTab == i ? 'metadata' : 'none'" style="width: 800px;"></video> -->
</div>
<div class="img-box dis-f jus-x" v-else>
<img v-if="i >= imageTab - 1 && i <= imageTab + 1" :src="(item && item.url) || item['imageurl'] || item['image']" class="img" alt="" />
</div>

33
src/components/public/video-box.vue
View File

@ -1,5 +1,6 @@
<template>
<video v-if="!ism3u8" class="11111" :autoplay="false" controls :src="src" style="width: 800px;"></video>
<!-- <video v-if="!ism3u8" class="11111" :autoplay="false" controls :src="src" style="width: 800px;"></video> -->
<video v-if="!ism3u8" ref="videoRef" class="video" :autoplay="false" controls :src="src" :preload="val == imageTab ? 'auto' : 'none'" style="width: 800px;" :poster="poster"></video>
<video v-else :id="'video' + val" style="width: 800px;" class="video video-js vjs-default-skin vjs-big-play-centered" preload="auto" controls :poster="poster">
<source type="application/x-mpegURL" />
<source type="video/mp4" />
@ -9,9 +10,18 @@
</template>
<script setup>
import videojs from "video.js"
import "video.js/dist/video-js.css"
// import "video.js/dist/video-js.css"
import { reactive, onMounted, ref, defineProps, watchEffect, watch, onUnmounted, nextTick } from "vue"
const onCanPlay = event => {
console.log("视频可以播放了")
// 这里可以添加额外的逻辑，例如显示播放按钮等
}
const onError = event => {
console.error("视频加载错误", event)
// 处理视频加载错误
}
const props = defineProps({
src: {
type: String,
@ -25,15 +35,30 @@ const props = defineProps({
type: Number,
default: "",
},
poster: String,
})
const videoRef = ref(null)
watch(
() => props.imageTab,
newVal => {
if (newVal != props.val) {
// console.log("videoRef", videoRef.value)
if (player.value != null) {
player.value.pause() // dispose()会直接删除Dom元素
}
if (videoRef.value) {
if (!videoRef.value.paused) {
// console.log("视频正在播放，现在停止.")
videoRef.value.pause()
} else {
// console.log("视频已经暂停.")
}
} else {
// console.error("Video element not found.")
}
}
}
)
@ -77,6 +102,4 @@ onUnmounted(() => {
}
})
</script>
<style lang="less" scoped>
</style>
<style lang="less" scoped></style>

3
src/views/apartmentDetail.vue
View File

@ -18,7 +18,8 @@
</div>
<div class="header-content flexflex">
<div class="header-left">
<image-watch style="z-index: 10000;" arrow="never" :index="imageIndex" :show="imageShow" :close="cloaseImageShow" :list="imageList"></image-watch>
<!-- <image-watch style="z-index: 10000;" arrow="never" :index="imageIndex" :show="imageShow" :close="cloaseImageShow" :list="imageList"></image-watch> -->
<image-watch arrow="never" :index="imageIndex" v-if="imageShow" :close="cloaseImageShow" :list="imageList"></image-watch>
<div class="slideshow">
<el-carousel :autoplay="false" arrow="never" indicator-position="none" ref="remarkCaruselUp" @change="carouselChange">
<el-carousel-item class="flexcenter" v-for="(item, index) in allCarouselsData" :key="index">

3
src/views/detail.vue
View File

@ -772,7 +772,8 @@
</div>
</div>
</div>
<watchImage :show="imageShow" :index="imageIndex" :close="cloaseImageShow" :list="imgList"></watchImage>
<!-- <watchImage :show="imageShow" :index="imageIndex" :close="cloaseImageShow" :list="imgList"></watchImage> -->
<watchImage v-if="imageShow" :index="imageIndex" :close="cloaseImageShow" :list="imgList"></watchImage>
<back-to-top></back-to-top>
<!-- 举报 -->
<report :id="uniqid"></report>