Skip to content

M
mould-vuecli3
Commit 9f9a61d1 authored by Jeff's avatar Jeff
Browse files
Options

更新规则

parent fa6117b3
Hide whitespace changes
Inline Side-by-side
Showing with 373 additions and 373 deletions
.eslintrc.js
View file @ 9f9a61d1
......@@ -38,7 +38,7 @@ module.exports = {
],
'comma-dangle': ['error', 'never'],
quotes: ['error', 'single'],
semi: ['error', 'never'],
semi: ['error', 'always'],
'vue/html-indent': [
'error',
2,
......
src/App.vue
View file @ 9f9a61d1
......@@ -12,7 +12,7 @@
</template>
<script>
import CommonHeader from '@/components/header/index.vue'
import CommonHeader from '@/components/header/index.vue';
export default {
components: {
CommonHeader,
......@@ -22,13 +22,13 @@ export default {
Uploader: () => import('@/components/misc/uploader.vue')
},
data() {
return {}
return {};
},
async created() {
let result = await this.$http.get('/webapi/home/banner?type=1&category=18')
console.log('result:', result)
let result = await this.$http.get('/webapi/home/banner?type=1&category=18');
console.log('result:', result);
}
}
};
</script>
<style lang="scss">
......
src/components/header/index.vue
View file @ 9f9a61d1
......@@ -20,16 +20,16 @@ export default {
tipPanel: () => import('@/components/header/tipPanel.vue')
},
data() {
return {}
return {};
},
created() {},
mounted() {},
methods: {
showModal() {
this.$modal.show('selectModal')
this.$modal.show('selectModal');
}
}
}
};
</script>
<style scoped lang="scss">
......
src/components/header/tipPanel.vue
View file @ 9f9a61d1
......@@ -7,11 +7,11 @@
<script>
export default {
data() {
return {}
return {};
},
created() {},
mounted() {}
}
};
</script>
<style scoped lang="scss">
......
src/components/misc/tutorialContent.vue
View file @ 9f9a61d1
......@@ -5,10 +5,10 @@
<script>
export default {
data() {
return {}
return {};
},
methods: {}
}
};
</script>
<style lang="scss" scoped></style>
src/components/misc/uploader.vue
View file @ 9f9a61d1
......@@ -12,39 +12,39 @@
</template>
<script>
import { mapActions } from 'Vuex'
import { mapActions } from 'Vuex';
export default {
data() {
return {
videoInput: {}
}
};
},
mounted() {
this.videoInput = this.$refs.videoInput
this.videoInput = this.$refs.videoInput;
},
methods: {
...mapActions({
upload: 'uploader/upload'
}),
onVideoInputChange() {
let file = this.videoInput.files[0]
console.log('turbo: onVideoInputChange -> file', file)
let file = this.videoInput.files[0];
console.log('turbo: onVideoInputChange -> file', file);
},
onInputClick() {
const vm = this
const vm = this;
window.addEventListener('focus', function h() {
vm.clearInputValue(vm.videoInput)
console.log('turbo: h -> this.videoInput', vm.videoInput)
window.removeEventListener('focus', h)
})
vm.clearInputValue(vm.videoInput);
console.log('turbo: h -> this.videoInput', vm.videoInput);
window.removeEventListener('focus', h);
});
},
clearInputValue(el) {
if (el) {
el.value = ''
el.value = '';
}
}
}
}
};
</script>
<style lang="scss" scoped></style>
src/components/modal/completeContent.vue
View file @ 9f9a61d1
......@@ -7,10 +7,10 @@
<script>
export default {
data() {
return {}
return {};
},
methods: {}
}
};
</script>
<style lang="scss" scoped></style>
src/components/modal/completeModal.vue
View file @ 9f9a61d1
......@@ -8,16 +8,16 @@
</template>
<script>
import CompleteContent from './completeContent'
import CompleteContent from './completeContent';
export default {
components: {
CompleteContent
},
data() {
return {}
return {};
},
methods: {}
}
};
</script>
<style lang="scss" scoped></style>
src/components/modal/modalLayer.vue
View file @ 9f9a61d1
......@@ -6,18 +6,18 @@
</template>
<script>
import CompleteModal from '@/components/modal/completeModal'
import SelectModal from '@/components/modal/selectModal'
import CompleteModal from '@/components/modal/completeModal';
import SelectModal from '@/components/modal/selectModal';
export default {
components: {
CompleteModal,
SelectModal
},
data() {
return {}
return {};
},
methods: {}
}
};
</script>
<style lang="scss" scoped>
......
src/components/modal/selectContent.vue
View file @ 9f9a61d1
......@@ -25,23 +25,23 @@ export default {
data() {
return {
items: [{ text: '本地上传', type: 'upload' }, { text: '视频库' }, { text: '我的作品' }]
}
};
},
methods: {
close() {
this.$modal.hide('selectModal')
this.$modal.hide('selectModal');
},
triggerUpload() {
const el = document.getElementById('video-input')
el && el.click()
const el = document.getElementById('video-input');
el && el.click();
},
itemClick({ item = {} } = {}) {
if (item.type === 'upload') {
this.triggerUpload()
this.triggerUpload();
}
}
}
}
};
</script>
<style lang="scss" scoped></style>
src/components/modal/selectModal.vue
View file @ 9f9a61d1
......@@ -8,16 +8,16 @@
</template>
<script>
import SelectContent from './selectContent'
import SelectContent from './selectContent';
export default {
components: {
SelectContent
},
data() {
return {}
return {};
},
methods: {}
}
};
</script>
<style lang="scss" scoped></style>
src/components/rightPanel/index.vue
View file @ 9f9a61d1
......@@ -7,11 +7,11 @@
<script>
export default {
data() {
return {}
return {};
},
created() {},
mounted() {}
}
};
</script>
<style scoped lang="scss">
......
src/components/rightPanel/screenshotPanel.vue
View file @ 9f9a61d1
......@@ -7,11 +7,11 @@
<script>
export default {
data() {
return {}
return {};
},
created() {},
mounted() {}
}
};
</script>
<style></style>
src/components/sideNav/index.vue
View file @ 9f9a61d1
......@@ -21,11 +21,11 @@
<script>
export default {
data() {
return {}
return {};
},
created() {},
mounted() {}
}
};
</script>
<style scoped lang="scss">
......
src/components/videoConverter/taskComplete.vue
View file @ 9f9a61d1
......@@ -8,20 +8,20 @@ export default {
components: {},
props: {},
data() {
return {}
return {};
},
computed: {},
watch: {},
methods: {}
}
};
</script>
<style scoped lang="scss">
.taskComplete {
width: 100%;
height: 100%;
background-color: #fff;
border: 0px solid black;
margin: 0px;
width: 100%;
height: 100%;
background-color: #fff;
border: 0px solid black;
margin: 0px;
}
</style>
src/components/videoConverter/taskEdit.vue
View file @ 9f9a61d1
......@@ -80,7 +80,7 @@
</template>
<script>
import { start, stop, clear, checkStatus } from './webApi'
import { start, stop, clear, checkStatus } from './webApi';
export default {
name: 'TaskEdit',
components: {},
......@@ -88,7 +88,7 @@ export default {
data() {
return {
taskList: []
}
};
},
computed: {},
watch: {},
......@@ -101,35 +101,35 @@ export default {
state: 0,
progress: 60,
outputFormat: 'mp4'
})
});
}
},
methods: {
async startTask(item) {
let result = await start()
let result = await start();
if (result) {
item.state = 1
item.state = 1;
} else {
item.state = 2
item.state = 2;
}
},
async stopTask(item) {
let result = await stop()
let result = await stop();
if (result) {
item.state = 0
item.state = 0;
}
},
async clearTask(item) {
let result = await clear()
let result = await clear();
if (result) {
let index = this.taskList.indexOf(item)
let index = this.taskList.indexOf(item);
if (index > -1) {
this.taskList.splice(index, 1)
this.taskList.splice(index, 1);
}
}
},
async checkTaskStatus() {
await checkStatus()
await checkStatus();
},
addVideo() {
this.taskList.push({
......@@ -139,149 +139,149 @@ export default {
state: 0,
progress: 60,
outputFormat: 'mp4'
})
});
},
clearAllTasks() {
this.taskList = []
this.taskList = [];
},
startAllTasks() {
this.taskList.forEach((task) => {
task.state = 1
})
task.state = 1;
});
}
}
}
};
</script>
<style scoped lang="scss">
.taskEdit {
width: 100%;
height: 100%;
background-color: #fff;
border: 0px solid black;
margin: 0px;
padding: 0 20px;
display: flex;
flex-direction: column;
align-items: center;
cursor: default;
overflow: hidden;
> ul {
width: 100%;
height: 100%;
background-color: #fff;
border: 0px solid black;
margin: 0px;
padding: 0 20px;
display: flex;
flex-direction: column;
align-items: center;
cursor: default;
overflow: hidden;
> ul {
width: 100%;
height: 100%;
border: 1px solid black;
flex-grow: 1;
overflow-y: auto;
> li {
padding: 5px 0;
height: 60px;
border: 1px solid black;
flex-grow: 1;
overflow-y: auto;
> li {
padding: 5px 0;
height: 60px;
display: flex;
justify-content: space-between;
align-items: center;
}
> li:nth-of-type(odd) {
background-color: gainsboro;
}
.info {
display: flex;
align-items: center;
.cove {
width: 100px;
height: 40px;
background-color: #ccc;
line-height: 40px;
margin-right: 10px;
}
}
display: flex;
justify-content: space-between;
align-items: center;
.operationPanel {
width: 300px;
height: 100%;
.wait {
height: 100%;
display: flex;
align-items: center;
.selectionFormat {
height: 30px;
width: 100px;
line-height: 30px;
border: 1px solid black;
margin-left: 20px;
}
> li:nth-of-type(odd) {
background-color: gainsboro;
.delete {
width: 60px;
height: 30px;
line-height: 30px;
background-color: black;
color: #fff;
margin-left: 20px;
}
.info {
display: flex;
align-items: center;
.cove {
width: 100px;
height: 40px;
background-color: #ccc;
line-height: 40px;
margin-right: 10px;
}
}
.active {
height: 100%;
width: 300px;
display: flex;
align-items: center;
.progress {
}
.operationPanel {
width: 300px;
.slide {
width: 200px;
height: 5px;
background: gray;
> div {
width: 120px;
height: 100%;
.wait {
height: 100%;
display: flex;
align-items: center;
.selectionFormat {
height: 30px;
width: 100px;
line-height: 30px;
border: 1px solid black;
margin-left: 20px;
}
.delete {
width: 60px;
height: 30px;
line-height: 30px;
background-color: black;
color: #fff;
margin-left: 20px;
}
}
.active {
height: 100%;
width: 300px;
display: flex;
align-items: center;
.progress {
}
.slide {
width: 200px;
height: 5px;
background: gray;
> div {
width: 120px;
height: 100%;
background-color: black;
}
}
.stop {
width: 60px;
height: 30px;
line-height: 30px;
background-color: black;
color: #fff;
margin-left: 20px;
}
}
background-color: black;
}
}
.stop {
width: 60px;
height: 30px;
line-height: 30px;
background-color: black;
color: #fff;
margin-left: 20px;
}
}
}
}
.editBar {
position: relative;
height: 30px;
width: 100%;
margin: 20px 0;
.editBar {
position: relative;
height: 30px;
width: 100%;
margin: 20px 0;
.addVideo {
position: absolute;
left: 0;
height: 30px;
line-height: 30px;
border: 1px solid black;
}
.clearList {
position: absolute;
left: 100px;
height: 30px;
line-height: 30px;
border: 1px solid black;
}
.clearWatermark {
position: absolute;
right: 0;
height: 30px;
line-height: 30px;
border: 1px solid black;
}
.addVideo {
position: absolute;
left: 0;
height: 30px;
line-height: 30px;
border: 1px solid black;
}
.startAll {
height: 30px;
width: 100px;
background-color: black;
color: #fff;
line-height: 30px;
.clearList {
position: absolute;
left: 100px;
height: 30px;
line-height: 30px;
border: 1px solid black;
}
.clearWatermark {
position: absolute;
right: 0;
height: 30px;
line-height: 30px;
border: 1px solid black;
}
}
.startAll {
height: 30px;
width: 100px;
background-color: black;
color: #fff;
line-height: 30px;
}
}
</style>
src/components/videoConverter/webApi.js
View file @ 9f9a61d1
async function start() {
let result = await new Promise((resolve) => {
setTimeout(() => {
resolve(true)
}, 1000)
})
return result
resolve(true);
}, 1000);
});
return result;
}
async function stop() {
let result = await new Promise((resolve) => {
setTimeout(() => {
resolve(true)
}, 500)
})
return result
resolve(true);
}, 500);
});
return result;
}
async function clear() {
let result = await new Promise((resolve) => {
setTimeout(() => {
resolve(true)
}, 500)
})
return result
resolve(true);
}, 500);
});
return result;
}
async function checkStatus(fakeValue) {
let result = await new Promise((resolve) => {
setTimeout(() => {
resolve(fakeValue++)
}, 500)
})
return result
resolve(fakeValue++);
}, 500);
});
return result;
}
export { start, stop, clear, checkStatus }
export { start, stop, clear, checkStatus };
src/components/videoCutter/videoChange.vue
View file @ 9f9a61d1
......@@ -10,10 +10,10 @@
export default {
methods: {
changeVideo() {
this.$emit('changeVideo')
this.$emit('changeVideo');
}
}
}
};
</script>
<style lang="scss" scoped>
.video-change {
......
src/components/videoCutter/videoControl.vue
View file @ 9f9a61d1
......@@ -21,27 +21,27 @@
export default {
filters: {
formatTime(duration) {
if (duration <= 0) return '00:00'
if (!duration) return '--:--'
let min = ~~(duration / 60)
min = (min + '').length === 1 ? '0' + min : min
let sec = Math.floor(duration % 60)
sec = (sec + '').length === 1 ? '0' + sec : sec
min = min || '00'
sec = sec || '00'
return min + ':' + sec
if (duration <= 0) return '00:00';
if (!duration) return '--:--';
let min = ~~(duration / 60);
min = (min + '').length === 1 ? '0' + min : min;
let sec = Math.floor(duration % 60);
sec = (sec + '').length === 1 ? '0' + sec : sec;
min = min || '00';
sec = sec || '00';
return min + ':' + sec;
}
},
props: ['duration', 'nowTime'], // eslint-disable-line
data() {
return {}
return {};
},
methods: {
play() {
this.$emit('play')
this.$emit('play');
}
}
}
};
</script>
<style lang="scss" scoped>
.video-control {
......
src/components/videoCutter/videoPlayer.vue
View file @ 9f9a61d1
......@@ -13,54 +13,54 @@ export default {
state: 'pluse',
times: 0,
canPlay: false
}
};
},
mounted() {
this.$bus.on('videoPlayer.play', (data) => {
if (data.time !== undefined) {
this.currentTime(data.time)
this.currentTime(data.time);
}
if (data.play) {
this.play()
this.play();
} else {
this.pause()
this.pause();
}
})
});
this.$nextTick(() => {
this.$refs.videoDom.addEventListener('canplay', this.canPlayFunc)
this.$refs.videoDom.addEventListener('canplay', this.canPlayFunc);
this.$refs.videoDom.addEventListener('ended', () => {
this.$emit('ended')
})
this.$emit('ended');
});
this.$refs.videoDom.addEventListener('timeupdate', () => {
this.$emit('timeupdate', this.$refs.videoDom.currentTime)
})
})
this.$emit('timeupdate', this.$refs.videoDom.currentTime);
});
});
},
beforeDestroy() {
this.$refs.videoDom.removeEventListener('canplay')
this.$refs.videoDom.removeEventListener('ended')
this.$refs.videoDom.removeEventListener('timeupdate')
this.$refs.videoDom.removeEventListener('canplay');
this.$refs.videoDom.removeEventListener('ended');
this.$refs.videoDom.removeEventListener('timeupdate');
},
methods: {
canPlayFunc() {
this.canPlay = true
let from = this.$parent.$options.name || 'videoPlayer'
this.$bus.emit(`${from}.canPlay`, this.$refs.videoDom.duration)
this.canPlay = true;
let from = this.$parent.$options.name || 'videoPlayer';
this.$bus.emit(`${from}.canPlay`, this.$refs.videoDom.duration);
},
play() {
if (!this.canPlay) return
this.$refs.videoDom.play()
if (!this.canPlay) return;
this.$refs.videoDom.play();
},
pause() {
if (!this.canPlay) return
this.$refs.videoDom.pause()
if (!this.canPlay) return;
this.$refs.videoDom.pause();
},
currentTime(time) {
if (!this.canPlay) return
this.$refs.videoDom.currentTime = time
if (!this.canPlay) return;
this.$refs.videoDom.currentTime = time;
}
}
}
};
</script>
<style lang="scss" scoped>
.video-player {
......
src/components/videoCutter/videoTimeline.vue
View file @ 9f9a61d1
......@@ -26,32 +26,32 @@ export default {
let _this = vnode.context,
mousemove = null,
mouseup = null,
dataAction = ''
dataAction = '';
mousemove = (e) => {
_this.dragMove && _this.dragMove(e.pageX, dataAction, e)
}
_this.dragMove && _this.dragMove(e.pageX, dataAction, e);
};
mouseup = (e) => {
document.removeEventListener('mousemove', mousemove)
document.removeEventListener('mouseup', mouseup)
document.removeEventListener('mousemove', mousemove);
document.removeEventListener('mouseup', mouseup);
_this.dragUp && _this.dragUp(e.pageX, dataAction, e)
}
_this.dragUp && _this.dragUp(e.pageX, dataAction, e);
};
el.onmousedown = (e) => {
dataAction = e.target.dataset.action
dataAction = e.target.dataset.action;
if (e.which === 3 || e.which === 2) {
e.stopPropagation()
return
e.stopPropagation();
return;
}
document.addEventListener('mousemove', mousemove)
document.addEventListener('mouseup', mouseup)
document.addEventListener('mousemove', mousemove);
document.addEventListener('mouseup', mouseup);
_this.dragDown && _this.dragDown(e.pageX, dataAction, e)
}
_this.dragDown && _this.dragDown(e.pageX, dataAction, e);
};
}
},
props: {
......@@ -59,45 +59,45 @@ export default {
type: Object,
required: true,
default: function() {
return { step: 0.1, min: 0, max: 10, val: 0, cut: [0, 10] }
return { step: 0.1, min: 0, max: 10, val: 0, cut: [0, 10] };
}
}
},
data() {
return {
width: 100
}
};
},
methods: {
dragDown(dis, action) {
if (!action) return
this.width = this.$refs.sliderWidth.clientWidth
this.action = action
this.dragHand = true
if (!action) return;
this.width = this.$refs.sliderWidth.clientWidth;
this.action = action;
this.dragHand = true;
this.mpos = {
x: dis,
v: this.info.val
}
this.$emit('changeData', { val: this.mpos.v, action: action, type: 'start' })
};
this.$emit('changeData', { val: this.mpos.v, action: action, type: 'start' });
},
dragMove(pos) {
if (!this.action) return
let val = 0
console.log(pos, '<_-------------')
if (!this.action) return;
let val = 0;
console.log(pos, '<_-------------');
// let pre = Math.round(((pos.x - this.mpos.x) / 120 * this.item.len + this.mpos.v) / this.item.step) / (1 / this.item.step);
// this.item.val = pre > this.item.max ? this.item.max : pre < this.item.min ? this.item.min : pre;
this.$emit('changeData', { val: val, action: this.action, type: 'change' })
this.$emit('changeData', { val: val, action: this.action, type: 'change' });
},
dragUp() {
if (!this.action) return
let val = 0
this.mpos = null
this.dragHand = false
this.action = ''
this.$emit('changeData', { val: val, action: this.action, type: 'end' })
if (!this.action) return;
let val = 0;
this.mpos = null;
this.dragHand = false;
this.action = '';
this.$emit('changeData', { val: val, action: this.action, type: 'end' });
}
}
}
};
</script>
<style lang="scss" scoped>
.video-timeline {
......
src/main.js
View file @ 9f9a61d1
import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import './registerServiceWorker'
import './assets/style/index.scss'
import axios from 'axios'
import VueBus from 'vue-bus'
import VModal from 'vue-js-modal'
import Vue from 'vue';
import App from './App.vue';
import router from './router';
import store from './store';
import './registerServiceWorker';
import './assets/style/index.scss';
import axios from 'axios';
import VueBus from 'vue-bus';
import VModal from 'vue-js-modal';
Vue.use(VueBus)
Vue.use(VModal)
Vue.use(VueBus);
Vue.use(VModal);
import baseURL from '../config/baseUrl.js'
console.log('baseURL:', baseURL)
import baseURL from '../config/baseUrl.js';
console.log('baseURL:', baseURL);
Vue.config.productionTip = false
Vue.prototype.$http = axios
Vue.config.productionTip = false;
Vue.prototype.$http = axios;
new Vue({
router,
store,
render: (h) => h(App)
}).$mount('#app')
}).$mount('#app');
src/registerServiceWorker.js
View file @ 9f9a61d1
/* eslint-disable no-console */
import { register } from 'register-service-worker'
import { register } from 'register-service-worker';
if (process.env.NODE_ENV === 'production') {
register(`${process.env.BASE_URL}service-worker.js`, {
ready() {
console.log('App is being served from cache by a service worker.\n' + 'For more details, visit https://goo.gl/AFskqB')
console.log('App is being served from cache by a service worker.\n' + 'For more details, visit https://goo.gl/AFskqB');
},
registered() {
console.log('Service worker has been registered.')
console.log('Service worker has been registered.');
},
cached() {
console.log('Content has been cached for offline use.')
console.log('Content has been cached for offline use.');
},
updatefound() {
console.log('New content is downloading.')
console.log('New content is downloading.');
},
updated() {
console.log('New content is available; please refresh.')
console.log('New content is available; please refresh.');
},
offline() {
console.log('No internet connection found. App is running in offline mode.')
console.log('No internet connection found. App is running in offline mode.');
},
error(error) {
console.error('Error during service worker registration:', error)
console.error('Error during service worker registration:', error);
}
})
});
}
src/router/index.js
View file @ 9f9a61d1
import Vue from 'vue'
import VueRouter from 'vue-router'
import Bao3 from '../views/bao3.vue'
import Screenshot from '../views/screenshot.vue'
import screenshotPanel from '../components/rightPanel/screenshotPanel.vue'
import Vue from 'vue';
import VueRouter from 'vue-router';
import Bao3 from '../views/bao3.vue';
import Screenshot from '../views/screenshot.vue';
import screenshotPanel from '../components/rightPanel/screenshotPanel.vue';
Vue.use(VueRouter)
Vue.use(VueRouter);
const routes = [
{
......@@ -37,12 +37,12 @@ const routes = [
panel: screenshotPanel
}
}
]
];
const router = new VueRouter({
mode: 'history',
base: process.env.BASE_URL,
routes
})
});
export default router
export default router;
src/store/global.js
View file @ 9f9a61d1
......@@ -3,19 +3,19 @@
const state = {
_test: 1
}
};
const getters = {
test: (state) => state._test
}
};
const mutations = {}
const mutations = {};
const actions = {}
const actions = {};
export default {
state,
getters,
mutations,
actions
}
};
src/store/index.js
View file @ 9f9a61d1
import Vue from 'vue'
import Vuex from 'vuex'
import Vue from 'vue';
import Vuex from 'vuex';
import global from './global'
import moduleA from './modules/moduleA'
import uploader from './modules/uploader'
import global from './global';
import moduleA from './modules/moduleA';
import uploader from './modules/uploader';
Vue.use(Vuex)
Vue.use(Vuex);
export default new Vuex.Store({
...global,
......@@ -13,4 +13,4 @@ export default new Vuex.Store({
moduleA,
uploader
}
})
});
src/store/modules/moduleA.js
View file @ 9f9a61d1
......@@ -3,15 +3,15 @@
const state = {
_moduleState: 'moduleState'
}
};
const getters = {
moduleState: (state) => state._moduleState
}
};
const mutations = {}
const mutations = {};
const actions = {}
const actions = {};
export default {
namespaced: true,
......@@ -19,4 +19,4 @@ export default {
getters,
mutations,
actions
}
};
src/store/modules/uploader.js
View file @ 9f9a61d1
......@@ -3,20 +3,20 @@
const state = {
video: {}
}
};
const getters = {
video: (state) => state.video
}
};
const mutations = {}
const mutations = {};
const actions = {
async upload(store, payload) {
console.log('turbo: upload -> store, payload', store, payload)
console.log('turbo: upload -> store, payload', store, payload);
},
async storeMaterial() {}
}
};
export default {
namespaced: true,
......@@ -24,4 +24,4 @@ export default {
getters,
mutations,
actions
}
};
src/views/bao2.vue
View file @ 9f9a61d1
......@@ -7,11 +7,11 @@
<script>
export default {
data() {
return {}
return {};
},
created() {},
mounted() {}
}
};
</script>
<style scoped lang="scss">
......
src/views/bao3.vue
View file @ 9f9a61d1
......@@ -8,11 +8,11 @@
<script>
export default {
data() {
return {}
return {};
},
created() {},
mounted() {}
}
};
</script>
<style scoped lang="scss">
......
src/views/screenshot.vue
View file @ 9f9a61d1
......@@ -40,26 +40,26 @@ export default {
videoEle: null,
current: 0,
duration: 10
}
};
},
created() {},
mounted() {
let input = document.getElementById('screenshot-input')
let fileBtn = document.getElementById('select-btn')
let input = document.getElementById('screenshot-input');
let fileBtn = document.getElementById('select-btn');
fileBtn.addEventListener('click', function() {
input.click()
})
let video = document.getElementById('screenshot-video')
input.click();
});
let video = document.getElementById('screenshot-video');
video.onerror = function(e) {
console.log('onerror', e)
}
console.log('onerror', e);
};
video.addEventListener('loadedmetadata', function(e) {
console.log('loadedmetadata', e)
console.log('loadedmetadata', e);
//webkitVideoDecodedByteCount
if (e.target.webkitVideoDecodedByteCount < 1) {
console.error('格式不支持')
console.error('格式不支持');
}
})
});
//loadedmetadata
},
......@@ -67,11 +67,11 @@ export default {
changeFile(e) {
//console.log('changeFile', e)
if (e.target.files[0]) {
this.srcUrl = URL.createObjectURL(e.target.files[0])
this.srcUrl = URL.createObjectURL(e.target.files[0]);
}
}
}
}
};
</script>
<style lang="scss" scoped>
......
src/views/videoConverter.vue
View file @ 9f9a61d1
......@@ -5,19 +5,19 @@
</template>
<script>
import taskEdit from '@/components/videoConverter/taskEdit'
import taskEdit from '@/components/videoConverter/taskEdit';
export default {
name: 'VideoConverter',
components: { taskEdit },
props: {},
data() {
return {}
return {};
},
computed: {},
watch: {},
created() {},
methods: {}
}
};
</script>
<style scoped lang="scss">
......
src/views/videoCutter.vue
View file @ 9f9a61d1
......@@ -48,50 +48,50 @@ export default {
canPlay: false,
noWater: true,
timelineObj: { step: 0.1, min: 0, max: 10, val: 0 }
}
};
},
created() {},
mounted() {
this.$bus.on('VideoCutter.canPlay', this.canPlayFunc)
this.$bus.on('VideoCutter.canPlay', this.canPlayFunc);
},
methods: {
changeVideo() {
console.log('todo change video, <-----lilei')
console.log('todo change video, <-----lilei');
},
canPlayFunc(data) {
this.duration = data
this.timelineObj.max = this.duration
this.canPlay = true
this.duration = data;
this.timelineObj.max = this.duration;
this.canPlay = true;
},
videoPlay() {
if (!this.canPlay) return
let ob = {}
if (!this.canPlay) return;
let ob = {};
if (this.playing) {
ob.play = false
ob.play = false;
} else {
ob.play = true
ob.play = true;
if (this.nowTime >= this.duration) {
ob.time = 0
this.timelineObj.val = 0
ob.time = 0;
this.timelineObj.val = 0;
}
}
this.playing = !this.playing
this.$bus.emit('videoPlayer.play', ob)
this.playing = !this.playing;
this.$bus.emit('videoPlayer.play', ob);
},
changeTime(data) {
console.log(data)
console.log(data);
},
playEnd() {
this.playing = false
this.nowTime = this.duration
this.timelineObj.val = this.nowTime
this.playing = false;
this.nowTime = this.duration;
this.timelineObj.val = this.nowTime;
},
timeupdate(time) {
this.nowTime = time
this.timelineObj.val = this.nowTime
this.nowTime = time;
this.timelineObj.val = this.nowTime;
}
}
}
};
</script>
<style scoped lang="scss">
......
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