修改快捷动作的send使用utools接口,按钮重新布局

This commit is contained in:
fofolee 2024-12-21 21:34:06 +08:00
parent 06756777ea
commit 9ebae5cbf3
2 changed files with 150 additions and 69 deletions

View File

@ -94,8 +94,7 @@ const shortCodes = [
electron.clipboard.writeText(text);
}),
(send = (text) => {
copyTo(text);
quickcommand.simulatePaste();
utools.hideMainWindowTypeString(text);
}),
];

View File

@ -35,32 +35,34 @@
</div>
<q-separator vertical />
<div class="col-auto justify-end flex">
<q-btn-group unelevated>
<q-btn-group unelevated class="button-group">
<template v-if="modelValue.program === 'quickcommand'">
<q-btn
v-for="(item, index) in ['keyboard', 'rocket_launch', 'help_center']"
:key="index"
dense
flat
color="primary"
class="settings-btn"
:icon="item"
@click="handleQuickCommandAction(index)"
>
<q-tooltip>
{{ ["录制按键", "快捷动作", "查看文档"][index] }}
</q-tooltip>
</q-btn>
</template>
<q-btn-dropdown
v-show="modelValue.program !== 'html'"
style="padding: 0 10px"
v-else-if="modelValue.program !== 'html'"
class="settings-btn"
dense
flat
ref="settings"
color="primary"
:icon="modelValue.program === 'quickcommand' ? 'insights' : 'settings'"
icon="settings"
>
<q-list>
<!-- quickcommand系列按键 -->
<q-item
clickable
v-for="(item, index) in ['keyboard', 'ads_click', 'help']"
:key="index"
@click="handleQuickCommandAction(index)"
v-show="modelValue.program === 'quickcommand'"
>
<q-item-section avatar>
<q-icon :name="item" />
</q-item-section>
<q-item-section>{{
["录制按键", "快捷动作", "查看文档"][index]
}}</q-item-section>
</q-item>
<!-- 自定义解释器 -->
<q-item
v-for="(item, index) in Object.keys(modelValue.customOptions)"
@ -74,11 +76,13 @@
outlined
class="full-width"
@blur="matchLanguage"
:label="[
'解释器路径,如:/opt/python',
'运行参数,如:-u',
'脚本后缀不含点py',
][index]"
:label="
[
'解释器路径,如:/opt/python',
'运行参数,如:-u',
'脚本后缀不含点py',
][index]
"
:model-value="modelValue.customOptions[item]"
@update:model-value="(val) => updateCustomOption(item, val)"
>
@ -130,7 +134,7 @@
</q-btn-dropdown>
<q-separator vertical inset />
<q-btn
style="padding: 0 10px"
class="action-btn run-btn"
dense
flat
color="primary"
@ -139,8 +143,8 @@
@click="$emit('run')"
></q-btn>
<q-btn
class="action-btn save-btn"
flat
style="padding: 0 10px"
dense
v-if="!isRunCodePage"
:disable="!canCommandSave"
@ -167,7 +171,7 @@ import QuickAction from "components/popup/QuickAction";
import KeyRecorder from "components/popup/KeyRecorder";
export default {
name: 'CommandLanguageBar',
name: "CommandLanguageBar",
components: {
QuickAction,
KeyRecorder,
@ -175,94 +179,172 @@ export default {
props: {
modelValue: {
type: Object,
required: true
required: true,
},
height: {
type: Number,
default: 40
default: 40,
},
canCommandSave: {
type: Boolean,
default: true
default: true,
},
isRunCodePage: {
type: Boolean,
default: false
}
default: false,
},
},
data() {
return {
showActions: false,
showRecorder: false,
}
};
},
emits: ['update:modelValue', 'program-changed', 'run', 'save', 'show-recorder', 'show-actions', 'show-help', 'add-action'],
emits: [
"update:modelValue",
"program-changed",
"run",
"save",
"show-recorder",
"show-actions",
"show-help",
"add-action",
],
computed: {
programLanguages() {
return Object.keys(this.$root.programs)
}
return Object.keys(this.$root.programs);
},
},
methods: {
updateProgram(value) {
this.$emit('update:modelValue', {
this.$emit("update:modelValue", {
...this.modelValue,
program: value
})
this.programChanged(value)
program: value,
});
this.programChanged(value);
},
updateCustomOption(key, value) {
this.$emit('update:modelValue', {
this.$emit("update:modelValue", {
...this.modelValue,
customOptions: {
...this.modelValue.customOptions,
[key]: value
}
})
[key]: value,
},
});
},
updateScptarg(value) {
this.$emit('update:modelValue', {
this.$emit("update:modelValue", {
...this.modelValue,
scptarg: value
})
scptarg: value,
});
},
updateCharset(key, value) {
this.$emit('update:modelValue', {
this.$emit("update:modelValue", {
...this.modelValue,
charset: {
...this.modelValue.charset,
[key]: value
}
})
[key]: value,
},
});
},
programChanged(value) {
this.$emit('program-changed', value)
if (value === 'custom') {
this.$refs.settings.show()
this.$emit("program-changed", value);
if (value === "custom") {
this.$refs.settings.show();
}
},
matchLanguage() {
if (!this.modelValue.customOptions.ext) return
if (!this.modelValue.customOptions.ext) return;
let language = Object.values(this.$root.programs).filter(
program => program.ext === this.modelValue.customOptions.ext
)
(program) => program.ext === this.modelValue.customOptions.ext
);
if (language.length) {
this.$emit('program-changed', language[0].name)
this.$emit("program-changed", language[0].name);
}
},
handleQuickCommandAction(index) {
const actions = [
() => this.showRecorder = true,
() => this.showActions = true,
() => this.showHelp()
]
actions[index]()
() => (this.showRecorder = true),
() => (this.showActions = true),
() => this.showHelp(),
];
actions[index]();
},
addAction(text) {
this.$emit('add-action', text)
this.$emit("add-action", text);
},
showHelp() {
window.showUb.docs()
}
window.showUb.docs();
},
},
};
</script>
<style scoped>
.button-group {
.action-btn {
padding: 0 10px;
}
}
</script>
/* 运行按钮动画 */
.run-btn:hover :deep(.q-icon) {
display: inline-block;
animation: slideRight 1.5s infinite;
}
/* 保存按钮动画 */
.save-btn:not([disabled]):hover :deep(.q-icon) {
display: inline-block;
animation: saveAnimation 1.2s infinite;
}
/* 设置按钮动画 */
.settings-btn :deep(.q-icon:first-child) {
display: inline-block;
transform: scale(1);
transition: transform 0.5s ease;
}
.settings-btn:hover :deep(.q-icon:first-child) {
transform: scale(1.05);
}
@keyframes slideRight {
0% {
transform: translateX(-2px);
opacity: 0.7;
}
50% {
transform: translateX(2px);
opacity: 1;
}
100% {
transform: translateX(-2px);
opacity: 0.7;
}
}
@keyframes saveAnimation {
0% {
transform: translateY(-1px);
opacity: 1;
}
50% {
transform: translateY(1px);
opacity: 0.6;
}
75% {
transform: translateY(0.5px);
opacity: 0.8;
}
100% {
transform: translateY(-1px);
opacity: 1;
}
}
.settings-btn:hover :deep(.q-icon) {
display: inline-block;
}
</style>