mirror of
https://github.com/fofolee/uTools-quickcommand.git
synced 2025-06-07 21:46:12 +08:00
修改快捷动作的send使用utools接口,按钮重新布局
This commit is contained in:
parent
06756777ea
commit
9ebae5cbf3
@ -94,8 +94,7 @@ const shortCodes = [
|
||||
electron.clipboard.writeText(text);
|
||||
}),
|
||||
(send = (text) => {
|
||||
copyTo(text);
|
||||
quickcommand.simulatePaste();
|
||||
utools.hideMainWindowTypeString(text);
|
||||
}),
|
||||
];
|
||||
|
||||
|
@ -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>
|
||||
|
Loading…
x
Reference in New Issue
Block a user