|
|
@@ -58,14 +58,19 @@
|
|
|
<el-table-column label="视频id" align="center" prop="id" />
|
|
|
<el-table-column label="视频标题" align="center" prop="title" />
|
|
|
<el-table-column label="视频描述" align="center" prop="videoDescribe" />
|
|
|
- <el-table-column label="视频预览" align="center" width="300px">
|
|
|
+ <!-- <el-table-column label="视频预览" align="center" width="300px">
|
|
|
<template slot-scope="scope">
|
|
|
<video :src="scope.row.fileUrl" class="videoPreview" :poster="scope.row.coverFileUrl" controls preload="meta"></video>
|
|
|
</template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="视频封面" align="center" width="300px">
|
|
|
+ </el-table-column> -->
|
|
|
+ <el-table-column label="视频封面" align="center" width="200px">
|
|
|
<template slot-scope="scope">
|
|
|
- <img :src="scope.row.coverFileUrl" class="imgPreview" />
|
|
|
+ <div>
|
|
|
+ <el-card :body-style="{ padding: '0 0 5px' }">
|
|
|
+ <img :src="scope.row.coverFileUrl" class="imgPreview" />
|
|
|
+ <el-button type="primary" size="mini" @click="videoPreview(scope.row.fileUrl)" :disabled="!scope.row.fileUrl">预览视频</el-button>
|
|
|
+ </el-card>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="视频时长" align="center">
|
|
|
@@ -173,6 +178,7 @@ import Treeselect from '@riophae/vue-treeselect'
|
|
|
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
|
|
|
import { vodSignature } from '@/api/upload'
|
|
|
import TcVod from 'vod-js-sdk-v6'
|
|
|
+import VideoPreview from '@/components/VideoPreview/index'
|
|
|
|
|
|
export default {
|
|
|
name: 'User',
|
|
|
@@ -246,6 +252,9 @@ export default {
|
|
|
})
|
|
|
},
|
|
|
methods: {
|
|
|
+ videoPreview(videoSrc) {
|
|
|
+ VideoPreview(videoSrc)
|
|
|
+ },
|
|
|
//上传视频
|
|
|
fileUpload(e) {
|
|
|
this.mediaFile = e.target.files[0]
|
|
|
@@ -455,6 +464,5 @@ export default {
|
|
|
.imgPreview {
|
|
|
object-fit: contain;
|
|
|
width: 200px;
|
|
|
- height: 180px;
|
|
|
}
|
|
|
</style>
|
