优化:移动端视频预览

This commit is contained in:
jmal 2021-03-24 13:53:36 +08:00
parent 05afe2c31a
commit 8953acc7bd

View File

@ -232,6 +232,7 @@
</van-overlay> </van-overlay>
<!--为了不受右键区域的影响, 把弹窗之类的提取出来--> <!--为了不受右键区域的影响, 把弹窗之类的提取出来-->
<image-viewer :fileList="fileList" :file="imagePreviewRow" :status.sync="imagePreviewVisible"></image-viewer> <image-viewer :fileList="fileList" :file="imagePreviewRow" :status.sync="imagePreviewVisible"></image-viewer>
<video-preview :file="videoPreviewRow" :status.sync="videoPreviewVisible"></video-preview>
</div> </div>
</template> </template>
<script> <script>
@ -244,10 +245,12 @@
import {getPath, getPathList, removePath, setPath} from '@/utils/path' import {getPath, getPathList, removePath, setPath} from '@/utils/path'
import fileConfig from "@/utils/file-config"; import fileConfig from "@/utils/file-config";
import ImageViewer from "@/components/preview/ImageViewer"; import ImageViewer from "@/components/preview/ImageViewer";
import VideoPreview from "@/components/preview/VideoPreview";
let pinyin = require("pinyin"); let pinyin = require("pinyin");
export default { export default {
components: { components: {
VideoPreview,
ImageViewer, IconFile, ImageViewer, IconFile,
}, },
computed: { computed: {
@ -330,6 +333,8 @@
vmode: 'list', vmode: 'list',
imagePreviewRow: {}, imagePreviewRow: {},
imagePreviewVisible: false, imagePreviewVisible: false,
videoPreviewRow: {},
videoPreviewVisible: false,
}; };
}, },
mounted(){ mounted(){
@ -968,6 +973,12 @@
this.imagePreviewRow = row this.imagePreviewRow = row
return return
} }
if (row.contentType.indexOf('video') > -1) {
// 视频文件
this.videoPreviewVisible = true
this.videoPreviewRow = row
return
}
// 通用打开文件的方法 // 通用打开文件的方法
fileConfig.preview(this.$store.state.user.name, row, this.$store.getters.token) fileConfig.preview(this.$store.state.user.name, row, this.$store.getters.token)
} }
@ -1185,6 +1196,12 @@
} }
} }
/deep/ .block {
.audio-player-close {
width: 1em;
height: 1em;
}
}
/deep/ .svg-icon { /deep/ .svg-icon {
width: 2.5em; width: 2.5em;
height: 2.5em; height: 2.5em;