@@ -37,35 +37,25 @@ export default {
Taskitem
},
props: {
-
},
data: () => { return {
- clickSpeedCounter: 0,
- clickSpeedTimer: 0,
- clickSpeedTimerStatus: false,
taskSelection_last: -1,
draggingFiles: false,
lastTaskListLength: 0 // 记录上一次计算 taskList 的长度，如变大了说明拖进来文件，就要滚动到底
}},
computed: {
taskList: function () {
- // console.log('taskList updated at ' + new Date().getTime())
- var ret = []
- for (const taskIndex of this.$store.state.taskOrder) {
- let task = this.$store.state.tasks.get(taskIndex)
- if (typeof task != 'undefined') {
- ret.push({ ...task, id: taskIndex })
- }
+ console.log('taskList updated at ' + new Date().getTime())
+ var ret = [];
+ for (const [id, task] of Object.entries(this.$store.state.tasks)) {
+ ret.push({ ...task, id })
}
- // 新任务加入，更新选择
+ // 新任务加入，滚动到底
if (ret.length > this.lastTaskListLength) {
- this.$nextTick(() => {
- })
- setTimeout(() => {
- this.$store.commit('taskSelection_update', new Set([(ret.slice(ret.length - 1)[0]).id]))
- var tasklistWrapper = document.getElementById('tasklist-wrapper')
- tasklistWrapper.scrollTop = tasklistWrapper.scrollHeight - tasklistWrapper.offsetHeight
- }, 100); // 咱也不清楚为啥要给个延时，不然读出来的数据不更新到 DOM 上
+ // v2.4 开始这里不需要加延时了
+ // this.$store.commit('taskSelection_update', new Set([(ret.slice(ret.length - 1)[0]).id]))
+ var tasklistWrapper = document.getElementById('tasklist-wrapper')
+ tasklistWrapper.scrollTop = tasklistWrapper.scrollHeight - tasklistWrapper.offsetHeight
}
this.lastTaskListLength = ret.length
return ret
@@ -93,29 +83,34 @@ export default {
}
},
methods: {
- debugLauncher: function () {
- this.clickSpeedCounter += 20;
- if (this.clickSpeedCounter > 100) {
- this.$store.commit('popup', {
- msg: '打开开发者工具',
- level: 0
- })
- currentWindow.openDevTools();
- this.clickSpeedCounter = 0;
- clearInterval(this.clickSpeedTimer);
- this.clickSpeedTimerStatus = false;
- } else if (this.clickSpeedTimerStatus == false) {
- this.clickSpeedTimerStatus = true;
- this.clickSpeedTimer = setInterval(() => {
- // console.log(this.clickSpeedCounter)
- if (this.clickSpeedCounter == 0) {
- clearInterval(this.clickSpeedTimer);
- this.clickSpeedTimerStatus = false;
- }
- this.clickSpeedCounter -= 1;
- }, 70)
+ debugLauncher: (function () {
+ var clickSpeedCounter = 0
+ var clickSpeedTimer = 0
+ var clickSpeedTimerStatus = false
+ return function () {
+ clickSpeedCounter += 20;
+ if (clickSpeedCounter > 100) {
+ this.$store.commit('popup', {
+ msg: '打开开发者工具',
+ level: 0
+ })
+ currentWindow.openDevTools();
+ clickSpeedCounter = 0;
+ clearInterval(clickSpeedTimer);
+ clickSpeedTimerStatus = false;
+ } else if (clickSpeedTimerStatus == false) {
+ clickSpeedTimerStatus = true;
+ clickSpeedTimer = setInterval(() => {
+ // console.log(clickSpeedCounter)
+ if (clickSpeedCounter == 0) {
+ clearInterval(clickSpeedTimer);
+ clickSpeedTimerStatus = false;
+ }
+ clickSpeedCounter -= 1;
+ }, 70)
+ }
}
- },
+ })(),
onItemClicked: function (event, id, index) {
var currentSelection = new Set(this.$store.state.taskSelection)
if (event.shiftKey) {
@@ -163,18 +158,35 @@ export default {
event.preventDefault()
this.draggingFiles = false
},
- onDrop: function (event) {
+ onDrop: function (event) { // 此函数触发四次 taskList update，分别为加入任务、ffmpeg data、ffmpeg metadata、taskSelection update
event.stopPropagation()
this.draggingFiles = false
var dropDelayCount = 0
+ var fileCount = event.dataTransfer.files.length
+ let newIDs = []
for (const file of event.dataTransfer.files) {
- setTimeout(() => {
+ setTimeout(() => { // v2.4 版本开始完全可以不要延时，但是太生硬，所以加个动画
console.log(file.path)
- this.$store.commit('addTask', file)
+ this.$store.commit('addTask', { name: file.name, path: file.path, callback: id => {
+ newIDs.push(id + '')
+ if (--fileCount == 0) {
+ this.$store.commit('taskSelection_update', new Set(newIDs))
+ }
+ }})
}, dropDelayCount);
- dropDelayCount += 100
+ // console.log(dropDelayCount)
+ dropDelayCount += 33.33
}
}
+ },
+ watch: {
+ /* 仅供数据刷新测试，经试验在使用 Vue.set 时不需 deep 也能监听
+ '$store.state.tasks': {
+ handler: function(newValue, oldValue) {
+ console.log('task: ', newValue, oldValue)
+ },
+ }
+ */
}
}
diff --git a/src/App/ContentWrapper/Clientarea/Maincontent/Parabox/AcodecView.vue b/src/App/ContentWrapper/Clientarea/Maincontent/Parabox/AcodecView.vue
index 135961f..ddf2605 100644
--- a/src/App/ContentWrapper/Clientarea/Maincontent/Parabox/AcodecView.vue
+++ b/src/App/ContentWrapper/Clientarea/Maincontent/Parabox/AcodecView.vue
@@ -4,6 +4,11 @@
+
@@ -27,6 +32,23 @@ export default {
props: {
},
computed: {
+ // 所有参数控制器列表，这段代码废弃了，因为发现并没有解决问题，主要是 v-for 的 div 在 DOM 中占有实际位置，因此 combobox、slider 等之外必定会包着一个多余的 div，依然需要把子组件的一些 CSS 属性拷贝到此处才行
+ /*
+ controlsList: function () {
+ let ret = []
+ ret.push({ mode: 'combo', parameter: 'acodec', title: '音频编码', text: this.$store.state.globalParams.audio.acodec, list: acodecs })
+ if (this.hasParameters > 1) {
+ ret.push({ mode: 'combo', parameter: 'aencoder', title: '编码器', text: this.$store.state.globalParams.audio.aencoder, list: this.aencodersList })
+ }
+ if (this.hasParameters != 0) {
+ ret.push({ mode: 'combo', parameter: 'ratecontrol', title: '码率控制', text: this.$store.state.globalParams.audio.ratecontrol, list: this.ratecontrolsList })
+ }
+ if (this.ratecontrolSlider != null) {
+ ret.push({ mode: 'slider', parameter: 'ratevalue', title: this.ratecontrolSlider.display, value: this.$store.state.globalParams.audio.ratevalue, tags: this.ratecontrolSlider.tags, step: this.ratecontrolSlider.step, valueToText: this.ratecontrolSlider.valueToText, valueProcess: this.ratecontrolSlider.valueProcess })
+ }
+ return ret
+ },
+ */
// 用途是给 template 读取，因为它不能直接读取 import 的变量
acodecsList: function () {
return acodecs