|
|
@@ -1,8 +1,5 @@
|
|
|
<template>
|
|
|
<el-row>
|
|
|
- <el-row>
|
|
|
- <el-button size="mini" type="danger" @click="loadAll">加载视频</el-button>
|
|
|
- </el-row>
|
|
|
<el-row>
|
|
|
<el-col v-for="(item, index) in dataList" :key="index" :md="6" :sm="12" :xs="12">
|
|
|
<el-row style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
|
|
|
@@ -18,7 +15,7 @@
|
|
|
:show-prev-button="false"
|
|
|
:show-next-button="false"
|
|
|
:show-playback-rate="false"
|
|
|
- :audio-list="audioList.map(elm => elm.url)"
|
|
|
+ :audio-list="item.audioList.map(elm => elm.url)"
|
|
|
:before-play="handleBeforePlay"
|
|
|
theme-color="#87CEFA"
|
|
|
@playing="onPlaying"
|
|
|
@@ -34,18 +31,13 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import DPlayer from 'dplayer'
|
|
|
-import {
|
|
|
- getImageList
|
|
|
-} from '@/api/disk'
|
|
|
+import { getImageList } from '@/api/disk'
|
|
|
import SocketInstance from '@/utils/ws/socket-instance'
|
|
|
|
|
|
export default {
|
|
|
name: 'FileVideo',
|
|
|
data() {
|
|
|
return {
|
|
|
- DPlayer,
|
|
|
- dplayer: null,
|
|
|
// 屏幕宽度, 为了控制分页条的大小
|
|
|
screenWidth: document.body.clientWidth,
|
|
|
currentPage: 1,
|
|
|
@@ -68,11 +60,14 @@ export default {
|
|
|
this.dataList = []
|
|
|
getImageList(this.searchForm).then(resp => {
|
|
|
if (resp.code === 0) {
|
|
|
- this.dataList = resp.data.list
|
|
|
this.totalSize = resp.data.totalSize
|
|
|
- for (const item of this.dataList) {
|
|
|
- console.log(item)
|
|
|
+ for (const item of resp.data.list) {
|
|
|
+ item.audioList = [
|
|
|
+ { name: item.filename, url: item.url }
|
|
|
+ ]
|
|
|
+ this.dataList.push(item)
|
|
|
}
|
|
|
+ console.log(this.dataList)
|
|
|
} else {
|
|
|
this.$notify({
|
|
|
title: '提示',
|
|
|
@@ -90,48 +85,25 @@ export default {
|
|
|
})
|
|
|
})
|
|
|
},
|
|
|
- initMp4Player(fileId, videoUrl) {
|
|
|
- return new DPlayer({
|
|
|
- container: document.getElementById(fileId),
|
|
|
- lang: 'zh-cn',
|
|
|
- screenshot: false,
|
|
|
- autoplay: false,
|
|
|
- volume: 0.1,
|
|
|
- mutex: false,
|
|
|
- video: {
|
|
|
- url: videoUrl
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
- loadAll() {
|
|
|
- for (const item of this.dataList) {
|
|
|
- /* const elem = document.getElementById(item.fileId)
|
|
|
- console.log(elem)*/
|
|
|
- this.initMp4Player(item.fileId, item.url)
|
|
|
- }
|
|
|
- },
|
|
|
// 播放前做的事
|
|
|
handleBeforePlay(next) {
|
|
|
- // 这里可以做一些事情...
|
|
|
- // this.audioList[this.$refs.audioPlayer.currentPlayIndex].name
|
|
|
- this.$refs.audioPlayer.$refs.audio.currentTime = this.audioInfo.currentTime
|
|
|
- // 开始播放
|
|
|
+ // this.$refs.audioPlayer.$refs.audio.currentTime = this.audioInfo.currentTime
|
|
|
next()
|
|
|
},
|
|
|
handlePlaySpecify() {
|
|
|
this.$refs.audioPlayer.currentPlayIndex = 1
|
|
|
this.$nextTick(() => {
|
|
|
this.$refs.audioPlayer.play()
|
|
|
- this.title = this.audioList[
|
|
|
+ /* this.title = this.audioList[
|
|
|
this.$refs.audioPlayer.currentPlayIndex
|
|
|
- ].name
|
|
|
+ ].name*/
|
|
|
})
|
|
|
},
|
|
|
onPlaying() {
|
|
|
- const jsonData = {}
|
|
|
+ /* const jsonData = {}
|
|
|
jsonData.videoId = this.audioInfo.audioId
|
|
|
jsonData.currentTime = this.$refs.audioPlayer.$refs.audio.currentTime
|
|
|
- SocketInstance.send(jsonData)
|
|
|
+ SocketInstance.send(jsonData)*/
|
|
|
},
|
|
|
onProgressMove(event) {
|
|
|
},
|
