Commit d332ef57 authored by Jeff's avatar Jeff

更新规则

parent 780a265f
...@@ -10,7 +10,7 @@ module.exports = { ...@@ -10,7 +10,7 @@ module.exports = {
// 3: ESLint + Standard config // 3: ESLint + Standard config
// extends: [ 'plugin:vue/essential', '@vue/airbnb',], // extends: [ 'plugin:vue/essential', '@vue/airbnb',],
// ESLint + Prettier // ESLint + Prettier
extends: ['plugin:vue/essential', 'eslint:recommended'], extends: ['plugin:vue/recommended', 'eslint:recommended'],
plugins: [], plugins: [],
parserOptions: { parserOptions: {
parser: 'babel-eslint' parser: 'babel-eslint'
......
<template> <template>
<div class="video-control"> <div class="video-control">
<div <div
class="video-play-btn" class="video-play-btn"
@click="play()"> @click="play()"
>
播放 播放
</div> </div>
<div class="video-time-content"> <div class="video-time-content">
...@@ -18,15 +19,6 @@ class="video-play-btn" ...@@ -18,15 +19,6 @@ class="video-play-btn"
</template> </template>
<script> <script>
export default { export default {
data() {
return {}
},
props: ['duration', 'nowTime'],
methods: {
play() {
this.$emit('play')
}
},
filters: { filters: {
formatTime(duration) { formatTime(duration) {
if (duration <= 0) return '00:00' if (duration <= 0) return '00:00'
...@@ -39,6 +31,15 @@ export default { ...@@ -39,6 +31,15 @@ export default {
sec = sec || '00' sec = sec || '00'
return min + ':' + sec return min + ':' + sec
} }
},
props: ['duration', 'nowTime'], // eslint-disable-line
data() {
return {}
},
methods: {
play() {
this.$emit('play')
}
} }
} }
</script> </script>
......
...@@ -33,6 +33,10 @@ export default { ...@@ -33,6 +33,10 @@ export default {
}) })
}) })
}, },
beforeDestroy() {
this.$refs.videoDom.removeEventListener('canplay')
this.$refs.videoDom.removeEventListener('ended')
},
methods: { methods: {
canPlayFunc() { canPlayFunc() {
this.canPlay = true this.canPlay = true
...@@ -52,10 +56,6 @@ export default { ...@@ -52,10 +56,6 @@ export default {
if (!this.canPlay) return if (!this.canPlay) return
this.$refs.videoDom.currentTime = time this.$refs.videoDom.currentTime = time
} }
},
beforeDestroy() {
this.$refs.videoDom.removeEventListener('canplay')
this.$refs.videoDom.removeEventListener('ended')
} }
} }
</script> </script>
......
...@@ -2,10 +2,13 @@ ...@@ -2,10 +2,13 @@
<div class="videoConverter"> <div class="videoConverter">
<ul> <ul>
<li <li
v-for="(item, index) in taskList" v-for="(item, index) in taskList"
:key="index"> :key="index"
>
<div class="info"> <div class="info">
<div class="cove">视频封面</div> <div class="cove">
视频封面
</div>
<div> <div>
<div>{{ item.name }}.mp4</div> <div>{{ item.name }}.mp4</div>
<div>时长:{{ item.duration }}</div> <div>时长:{{ item.duration }}</div>
...@@ -13,27 +16,37 @@ v-for="(item, index) in taskList" ...@@ -13,27 +16,37 @@ v-for="(item, index) in taskList"
</div> </div>
<div class="operationPanel"> <div class="operationPanel">
<div <div
class="wait" v-show="item.state == 0"
v-show="item.state == 0"> class="wait"
>
<div>输出格式</div> <div>输出格式</div>
<div class="selectionFormat">mp4</div> <div class="selectionFormat">
mp4
</div>
<div <div
class="delete" class="delete"
@click="clearTask(item)">删除</div> @click="clearTask(item)"
>
删除
</div>
</div> </div>
<div <div
class="active" v-show="item.state == 1"
v-show="item.state == 1"> class="active"
>
<div class="progress"> <div class="progress">
<div>转换中{{ item.progress }}%</div> <div>转换中{{ item.progress }}%</div>
<div class="slide"> <div class="slide">
<div></div> <div />
</div> </div>
</div> </div>
<div <div
class="stop" class="stop"
@click="stopTask(item)">取消</div> @click="stopTask(item)"
>
取消
</div>
</div> </div>
</div> </div>
</li> </li>
...@@ -41,17 +54,28 @@ class="stop" ...@@ -41,17 +54,28 @@ class="stop"
<div class="editBar"> <div class="editBar">
<div <div
class="addVideo" class="addVideo"
@click="addVideo">添加视频</div> @click="addVideo"
>
添加视频
</div>
<div <div
class="clearList" class="clearList"
@click="clearAllTasks">清空列表</div> @click="clearAllTasks"
<div class="clearWatermark">去除水印</div> >
清空列表
</div>
<div class="clearWatermark">
去除水印
</div>
</div> </div>
<div <div
class="startAll" class="startAll"
@click="startAllTasks">开始转换</div> @click="startAllTasks"
>
开始转换
</div>
</div> </div>
</template> </template>
...@@ -67,6 +91,18 @@ export default { ...@@ -67,6 +91,18 @@ export default {
}, },
computed: {}, computed: {},
watch: {}, watch: {},
created() {
for (let i = 1; i < 10; i++) {
this.taskList.push({
cover: '',
name: '视频片段' + i,
duration: '10:00',
state: 0,
progress: 60,
outputFormat: 'mp4'
})
}
},
methods: { methods: {
addVideo() { addVideo() {
this.taskList.push({ this.taskList.push({
...@@ -95,18 +131,6 @@ export default { ...@@ -95,18 +131,6 @@ export default {
task.state = 1 task.state = 1
}) })
} }
},
created() {
for (let i = 1; i < 10; i++) {
this.taskList.push({
cover: '',
name: '视频片段' + i,
duration: '10:00',
state: 0,
progress: 60,
outputFormat: 'mp4'
})
}
} }
} }
</script> </script>
......
...@@ -31,12 +31,12 @@ import VideoChange from '@/components/videoCutter/videoChange.vue' ...@@ -31,12 +31,12 @@ import VideoChange from '@/components/videoCutter/videoChange.vue'
import VideoControl from '@/components/videoCutter/videoControl.vue' import VideoControl from '@/components/videoCutter/videoControl.vue'
export default { export default {
name: 'VideoCutter',
components: { components: {
VideoPlayer, VideoPlayer,
VideoChange, VideoChange,
VideoControl VideoControl
}, },
name: 'VideoCutter',
data() { data() {
return { return {
name: '', name: '',
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment