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{