diff --git a/components/my-video-list/list-item.vue b/components/my-video-list/list-item.vue index f1f1cbc..d1cc9bb 100644 --- a/components/my-video-list/list-item.vue +++ b/components/my-video-list/list-item.vue @@ -2,15 +2,14 @@ - + @@ -44,8 +43,8 @@ 分享 - - + + {{isCollect?'已追':'追剧'}} @@ -71,19 +70,19 @@ } } }, - rightStyle:{ - type:Object, - default:()=>{ + rightStyle: { + type: Object, + default: () => { return { - + } } }, - infoStyle:{ - type:Object, - default:()=>{ + infoStyle: { + type: Object, + default: () => { return { - + } } }, @@ -125,7 +124,7 @@ type: Number, default: 1 }, - showControls:{ + showControls: { type: Boolean, default: true } @@ -133,11 +132,10 @@ let autoplay = ref(props.item.videoUrl ? true : false) const emits = defineEmits(['controlstoggles', 'disappear', 'appear', 'waiting', 'videoPlay', 'ended', 'dianzanClick', - 'share', 'zhuijuClick', 'popupShow', 'itemMounted', 'toDetail' + 'share', 'zhuijuClick', 'popupShow', 'itemMounted', 'toDetail', 'showInfo' ]) function controlstoggles(e) { - console.log(e); emits('controlstoggles', e) } @@ -151,28 +149,39 @@ function waiting() { } + + + let isPlying = ref(false) + watch(() => isPlying.value, (newval) => { + console.log(newval); + emits('showInfo', newval) + }) - - let isPlying=false function videoPlay() { - isPlying=true + isPlying.value = true // #ifdef H5 emits('controlstoggles', { - detail:{show:true} + detail: { + show: true + } }) // #endif - + } - - function onpause(){ - isPlying=false + + function onpause() { + isPlying.value = false // #ifdef H5 emits('controlstoggles', { - detail:{show:false} + detail: { + show: false + } }) // #endif } + + function ended() { } @@ -192,16 +201,18 @@ function popupShow(key) { emits('popupShow', key) } - function videoClick(){ - if(video){ - if(isPlying){ + + function videoClick() { + console.log('videoClick'); + if (video) { + if (isPlying.value) { video.pause() - }else{ + } else { video.play() } } } - + let first = true function appear() { @@ -233,7 +244,6 @@ }) onMounted(() => { init() - console.log('itemMounted', props.index); emits('itemMounted', props.index) }) @@ -242,6 +252,8 @@ if (props.item.videoUrl && showVideo.value) { video = uni.createVideoContext('myVideo' + props.item.courseDetailsId) video.playbackRate(props.playSpeeds) + video.play() + console.log('init play'); } } catch (error) { console.error('------') @@ -255,13 +267,28 @@ } }) watch(() => showVideo.value, (newval) => { + console.log('showVideo change:'+newval); if (newval) { - init() + nextTick(()=>{ + init() + }) } else { video = null } }) + + const infoStyle = computed(() => { + return { + transform: `translateX(${(!isPlying.value||!props.item.videoUrl)?0:'-110%'})` + } + }) + + const rightStyle = computed(() => { + return { + transform: `translateX(${(!isPlying.value||!props.item.videoUrl)?'0':60}px)` + } + })