From c1220ef752d0da65261d11b7c16cbbc773e29ab6 Mon Sep 17 00:00:00 2001
From: buvta <12312540+buvta@users.noreply.github.com>
Date: Mon, 7 Dec 2020 07:01:22 +0800
Subject: [PATCH] =?UTF-8?q?=E6=89=8B=E5=8A=A8=E8=AE=BE=E7=BD=AE=E8=B7=B3?=
=?UTF-8?q?=E8=BF=87=E7=89=87=E5=A4=B4=E7=89=87=E5=B0=BE=E6=97=B6=E9=97=B4?=
=?UTF-8?q?=E9=95=BF=E5=BA=A6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/components/Play.vue | 76 ++++++++++++++++++++++++++++++++++++++---
1 file changed, 72 insertions(+), 4 deletions(-)
diff --git a/src/components/Play.vue b/src/components/Play.vue
index 9850d75..2814ac9 100644
--- a/src/components/Play.vue
+++ b/src/components/Play.vue
@@ -98,6 +98,21 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
上次播放到【{{right.history[0].site}}】{{right.history[0].name}} 第{{right.history[0].index+1}}集
@@ -330,7 +345,9 @@ export default {
defaultProps: {
label: 'label',
children: 'children'
- }
+ },
+ startPosition: { min: '00', sec: '00' },
+ endPosition: { min: '00', sec: '00' }
}
},
filters: {
@@ -427,10 +444,34 @@ export default {
},
searchTxt () {
this.$refs.channelTree.filter(this.searchTxt)
+ },
+ startPosition: {
+ handler (time) {
+ this.leadingZero(time)
+ },
+ deep: true
+ },
+ endPosition: {
+ handler (time) {
+ this.leadingZero(time)
+ },
+ deep: true
}
},
methods: {
...mapMutations(['SET_VIEW', 'SET_DETAIL', 'SET_VIDEO', 'SET_SHARE', 'SET_APPSTATE']),
+ leadingZero (time) {
+ Object.keys(time).forEach(key => {
+ if (time[key] > 59 || time[key] < 0) {
+ time[key] = '00'
+ } else if (time[key].length > 2) {
+ time[key] = '' + parseInt(time[key])
+ // time[key] = time[key].replace(/^0+/, '')
+ } else if (time[key] < 10 && time[key].length === 1) {
+ time[key] = '0' + time[key]
+ }
+ })
+ },
handleNodeClick (node) {
if (node.channel) {
this.playChannel(node.channel)
@@ -471,9 +512,11 @@ export default {
if (!VIDEO_DETAIL_CACHE[key]) VIDEO_DETAIL_CACHE[key] = {}
if (db.startPosition) {
VIDEO_DETAIL_CACHE[key].startPosition = db.startPosition
+ this.startPosition = { min: '' + parseInt(db.startPosition / 60), sec: '' + parseInt(db.startPosition % 60) }
}
if (db.endPosition) {
VIDEO_DETAIL_CACHE[key].endPosition = db.endPosition
+ this.endPosition = { min: '' + parseInt(db.endPosition / 60), sec: '' + parseInt(db.endPosition % 60) }
}
}
this.playVideo(index, time)
@@ -614,6 +657,7 @@ export default {
const key = this.video.key + '@' + this.video.info.id
const db = await history.find({ site: this.video.key, ids: this.video.info.id })
if (db && this.xg && VIDEO_DETAIL_CACHE[key].list.length > 1) {
+ this[position] = { min: '' + parseInt(timespan / 60), sec: '' + parseInt(timespan % 60) }
const positionTime = position === 'endPosition' ? this.xg.duration - timespan : timespan
if (db[position]) this.xg.removeProgressDot(position === 'endPosition' ? this.xg.duration - db[position] : db[position])
this.xg.addProgressDot(positionTime, text)
@@ -624,6 +668,22 @@ export default {
VIDEO_DETAIL_CACHE[key][position] = timespan
}
},
+ async setProgressDotByInput () {
+ this.xg.removeAllProgressDot()
+ const startTime = parseInt(this.startPosition.min) * 60 + parseInt(this.startPosition.sec)
+ const endTime = parseInt(this.endPosition.min) * 60 + parseInt(this.endPosition.sec)
+ if (startTime > this.xg.duration || endTime > this.xg.duration) {
+ this.$message.error('设置的跳跃时间长度已超过视频播放时长，请调整设置！')
+ return
+ }
+ await this.setProgressDotEvent('startPosition', startTime)
+ await this.setProgressDotEvent('endPosition', endTime)
+ },
+ async clearPosition () {
+ await this.setProgressDotEvent('startPosition', 0)
+ await this.setProgressDotEvent('endPosition', 0)
+ this.xg.removeAllProgressDot()
+ },
timerEvent () {
this.timer = setInterval(async () => {
const endTime = this.xg.duration
@@ -1093,9 +1153,7 @@ export default {
return false
}
if (e === 'clearPosition') {
- await this.setProgressDotEvent('startPosition', 0)
- await this.setProgressDotEvent('endPosition', 0)
- this.xg.removeAllProgressDot()
+ this.clearPosition()
return false
}
if (e === 'opacityUp') {
@@ -1601,6 +1659,16 @@ export default {
margin-right: 10px;
cursor: pointer;
}
+ .timespan{
+ margin-left: auto;
+ justify-content: space-between;
+ align-items: center;
+ input{
+ &::-webkit-inner-spin-button, &::-webkit-outer-spin-button {
+ opacity: 1;
+ }
+ }
+ }
}
}
.list{