|
|
@@ -18,8 +18,8 @@
|
|
|
/>
|
|
|
<div v-if="data.video_list.length > 0 && data.video_list[0].media_duration" class="interaction-box">
|
|
|
<video
|
|
|
- ref="videoPlayer"
|
|
|
id="interaction-video"
|
|
|
+ ref="videoPlayer"
|
|
|
:src="data.video_list[0].file_url"
|
|
|
width="100%"
|
|
|
height="400"
|
|
|
@@ -28,7 +28,7 @@
|
|
|
></video>
|
|
|
<!-- <video ref="videoPlayer" class="video-js vjs-default-skin vjs-big-play-centered"></video> -->
|
|
|
|
|
|
- <el-button type="primary" size="small" @click="handlePause" style="margin-top: 5px">暂停视频编辑题目</el-button>
|
|
|
+ <el-button type="primary" size="small" style="margin-top: 5px" @click="handlePause">暂停视频编辑题目</el-button>
|
|
|
<!-- <el-button @click="handleMultilingual">多语言</el-button> -->
|
|
|
<ul v-if="data.file_info_list.length > 0" class="file-list">
|
|
|
<li v-for="(file, i) in data.file_info_list" :key="i">
|
|
|
@@ -48,14 +48,12 @@
|
|
|
v-if="exerciseFlag"
|
|
|
:visible.sync="exerciseFlag"
|
|
|
width="1400px"
|
|
|
- append-to-body
|
|
|
- :show-close="true"
|
|
|
title="练习题"
|
|
|
:close-on-click-modal="false"
|
|
|
- class="module-content"
|
|
|
- @close="handleCancle"
|
|
|
+ custom-class="module-content"
|
|
|
+ @close="handleCancale"
|
|
|
>
|
|
|
- <exercise-add :exercise-content="exerciseContent" @handleCancle="handleCancle" @submitAdd="submitAdd" />
|
|
|
+ <exercise-add :exercise-content="exerciseContent" @handleCancale="handleCancale" @submitAdd="submitAdd" />
|
|
|
</el-dialog>
|
|
|
<MultilingualFill
|
|
|
:visible.sync="multilingualVisible"
|
|
|
@@ -114,26 +112,25 @@ export default {
|
|
|
};
|
|
|
},
|
|
|
watch: {
|
|
|
- 'data.video_list': {
|
|
|
- handler(val, oldVal) {
|
|
|
- if (val !== oldVal) {
|
|
|
- }
|
|
|
- },
|
|
|
- immediate: true,
|
|
|
- },
|
|
|
'data.property.file_list': 'handleMindMap',
|
|
|
},
|
|
|
+ mounted() {},
|
|
|
+ beforeDestroy() {
|
|
|
+ if (this.player) {
|
|
|
+ this.player.dispose();
|
|
|
+ }
|
|
|
+ },
|
|
|
methods: {
|
|
|
// 初始化player
|
|
|
- handleCreatPlayer(time) {
|
|
|
+ handleCreatePlayer() {
|
|
|
let _this = this;
|
|
|
let options = {
|
|
|
- autoplay: false, //自动播放
|
|
|
+ autoplay: false, // 自动播放
|
|
|
height: 500,
|
|
|
width: 918,
|
|
|
- controls: true, //用户可以与之交互的控件
|
|
|
- loop: true, //视频一结束就重新开始
|
|
|
- muted: false, //默认情况下将使所有音频静音
|
|
|
+ controls: true, // 用户可以与之交互的控件
|
|
|
+ loop: true, // 视频一结束就重新开始
|
|
|
+ muted: false, // 默认情况下将使所有音频静音
|
|
|
playsinline: true,
|
|
|
webkitPlaysinline: true,
|
|
|
// aspectRatio:"16:9",//显示比率
|
|
|
@@ -154,8 +151,8 @@ export default {
|
|
|
// 设置标点
|
|
|
_this.handleMarkers();
|
|
|
// 获取当前播放时间
|
|
|
- this.player.on('timeupdate', function (event) {
|
|
|
- _this.currentTime = this.currentTime().toFixed(3);
|
|
|
+ this.player.on('timeupdate', () => {
|
|
|
+ this.currentTime = this.player.currentTime().toFixed(3);
|
|
|
// console.log(this.currentTime());
|
|
|
});
|
|
|
},
|
|
|
@@ -178,28 +175,7 @@ export default {
|
|
|
'background-color': 'red',
|
|
|
'border-radius': '50%',
|
|
|
},
|
|
|
- markers: markers,
|
|
|
- // markers: [
|
|
|
- // {
|
|
|
- // time: 0.694313,
|
|
|
- // class: 'custom-marker-class',
|
|
|
- // text: '标记1',
|
|
|
- // },
|
|
|
- // {
|
|
|
- // time: 5.694313,
|
|
|
- // class: 'custom-marker-class',
|
|
|
- // text: '标记2',
|
|
|
- // },
|
|
|
- // {
|
|
|
- // time: 10.694313,
|
|
|
- // class: 'custom-marker-class',
|
|
|
- // text: '标记3',
|
|
|
- // },
|
|
|
- // {
|
|
|
- // time: 15.694313,
|
|
|
- // class: 'custom-marker-class',
|
|
|
- // },
|
|
|
- // ],
|
|
|
+ markers,
|
|
|
});
|
|
|
},
|
|
|
updateFileList({ file_list, file_id_list, file_info_list }) {
|
|
|
@@ -210,21 +186,12 @@ export default {
|
|
|
if (file_list.length === 0) {
|
|
|
this.data.file_info_list = [];
|
|
|
} else {
|
|
|
- let _this = this;
|
|
|
this.$nextTick(() => {
|
|
|
- _this.handleCreatPlayer();
|
|
|
+ this.handleCreatePlayer();
|
|
|
});
|
|
|
this.duration = file_list[0].media_duration;
|
|
|
}
|
|
|
},
|
|
|
-
|
|
|
- handleData() {
|
|
|
- // this.data.video_list.forEach((item) => {
|
|
|
- // GetFileURLMap({ file_id_list: [item.file_id] }).then(({ url_map }) => {
|
|
|
- // this.$set(item, 'file_url', url_map[item.file_id]);
|
|
|
- // });
|
|
|
- // });
|
|
|
- },
|
|
|
handleMindMap() {
|
|
|
// 思维导图数据
|
|
|
let node_list = [];
|
|
|
@@ -249,7 +216,7 @@ export default {
|
|
|
this.player.play();
|
|
|
}
|
|
|
},
|
|
|
- handleCancle() {
|
|
|
+ handleCancale() {
|
|
|
// this.sourceAddFlag = false;
|
|
|
this.exerciseFlag = false;
|
|
|
this.player.play();
|
|
|
@@ -325,16 +292,10 @@ export default {
|
|
|
}
|
|
|
})
|
|
|
.catch(() => {
|
|
|
- this.$emit('handleCancle');
|
|
|
+ this.$emit('handleCancale');
|
|
|
});
|
|
|
},
|
|
|
},
|
|
|
- mounted() {},
|
|
|
- beforeDestroy() {
|
|
|
- if (this.player) {
|
|
|
- this.player.dispose();
|
|
|
- }
|
|
|
- },
|
|
|
};
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
dsy