完善匹配类型部分

This commit is contained in:
fofolee 2022-04-05 22:26:55 +08:00
parent d28629775d
commit cf2dcd1c21
3 changed files with 189 additions and 49 deletions

View File

@ -79,7 +79,7 @@
v-ripple
:style="{
color: isCommandActivated ? 'unset' : 'grey',
background: $q.dark.isActive ? '#ffffff08' : '#00000008'
background: $q.dark.isActive ? '#ffffff08' : '#00000008',
}"
>
<q-card-section>
@ -108,9 +108,10 @@
<span v-for="cmd in commandInfo.features.cmds" :key="cmd">
<span v-if="typeof cmd === 'string'">
<q-badge rounded :color="cmdBadgeColor()"
><q-icon class="q-mr-xs" name="font_download" />{{
getShortStrByByte(cmd)
}}</q-badge
><q-icon
class="q-mr-xs"
:name="commandTypes.keyword.icon"
/>{{ getShortStrByByte(cmd) }}</q-badge
>
<q-tooltip>
<div class="text-subtitle2">
@ -120,9 +121,10 @@
</span>
<span v-else-if="cmd.type === 'window' && cmd.match">
<q-badge rounded :color="cmdBadgeColor(cmd.type)"
><q-icon class="q-mr-xs" name="widgets" />{{
getShortStrByByte(cmd.match.app[0])
}}
><q-icon
class="q-mr-xs"
:name="commandTypes.window.icon"
/>{{ getShortStrByByte(cmd.match.app[0]) }}
</q-badge>
<q-tooltip>
<div
@ -136,7 +138,7 @@
</span>
<span v-else-if="cmd.type === 'files'">
<q-badge rounded :color="cmdBadgeColor(cmd.type)"
><q-icon class="q-mr-xs" name="description" />
><q-icon class="q-mr-xs" :name="commandTypes.files.icon" />
{{
(cmd.match && getShortStrByByte(cmd.match)) || "所有文件"
}}</q-badge
@ -149,9 +151,10 @@
</span>
<span v-else-if="cmd.type === 'regex'">
<q-badge rounded :color="cmdBadgeColor(cmd.type)"
><q-icon class="q-mr-xs" name="playlist_add_check" />{{
getShortStrByByte(cmd.match)
}}
><q-icon
class="q-mr-xs"
:name="commandTypes.regex.icon"
/>{{ getShortStrByByte(cmd.match) }}
</q-badge>
<q-tooltip>
<div class="text-subtitle2">
@ -161,12 +164,15 @@
</span>
<span v-else-if="cmd.type === 'over'">
<q-badge rounded :color="cmdBadgeColor(cmd.type)"
><q-icon class="q-mr-xs" name="clear_all" />所有文本
><q-icon
class="q-mr-xs"
:name="commandTypes.over.icon"
/>
</q-badge>
</span>
<span v-else-if="cmd.type === 'img'">
<q-badge rounded :color="cmdBadgeColor(cmd.type)" label="">
<q-icon class="q-mr-xs" name="panorama" />图片
<q-icon class="q-mr-xs" :name="commandTypes.img.icon" />图片
</q-badge>
</span>
</span>
@ -201,12 +207,15 @@
</template>
<script>
import commandTypes from "../js/commandTypes.js";
export default {
data() {
return {
allProgrammings: this.$programmings,
isCommandActivated: this.activated,
maxCmdStingLen: 8,
commandTypes: commandTypes,
cmdBadgeSheet: {
keyword: "primary",
files: "light-blue",

View File

@ -1,7 +1,10 @@
<template>
<div class="relative">
<!-- 命令设置栏 -->
<div
<q-scroll-area
:thumb-style="{
width: '3px',
}"
class="absolute-left shadow-10"
:style="{
width: sideBarWidth,
@ -11,47 +14,91 @@
v-if="showSidebar"
>
<div class="row q-pa-md q-gutter-md">
<div class="row">
<q-btn
dense
flat
color="grey"
icon="arrow_back_ios_new"
@click="closeEditor"
/>
<div class="q-pa-md">
<q-img class="commandLogo" width="80px" :src="commandIcon" />
</div>
</div>
<q-btn
dense
flat
color="grey"
icon="arrow_back_ios_new"
@click="closeEditor"
/>
<q-img class="commandLogo" width="64px" :src="commandIcon" />
<div class="row">
<div>
<!-- 说明 -->
<q-input
standout="bg-primary text-white"
dense
square
v-model="quickcommandInfo.features.explain"
type="text"
label="说明"
/>
<q-input
>
<template v-slot:prepend>
<q-icon name="drive_file_rename_outline" />
</template>
</q-input>
<!-- 匹配类型 -->
<q-select
standout="bg-primary text-white"
dense
square
v-model="commandType"
options-dense
@update:model-value="cmdMatch = null"
:options="commandTypesOptions"
v-model="cmdType"
type="text"
label="匹配类型"
/>
<q-input
>
<template v-slot:prepend>
<q-icon :name="cmdType.icon" />
</template>
<template v-slot:option="scope">
<q-item v-bind="scope.itemProps" v-on="scope.itemEvents">
<q-item-section avatar>
<q-icon :name="scope.opt.icon" />
</q-item-section>
<q-item-section>
<q-item-label v-html="scope.opt.name" />
<q-item-label caption>{{ scope.opt.desc }}</q-item-label>
</q-item-section>
</q-item>
</template></q-select
>
<!-- 匹配规则 -->
<q-select
v-if="cmdType.valueType === 'array'"
standout="bg-primary text-white"
dense
square
v-model="quickcommandInfo.features.cmds[0]"
v-model="cmdMatch"
use-input
use-chips
multiple
hide-dropdown-icon
input-debounce="0"
new-value-mode="add-unique"
type="text"
label="关键字"
/>
placeholder="回车添加"
:label="cmdType.matchLabel"
>
<template v-slot:prepend>
<q-icon name="square_foot" />
</template>
</q-select>
<q-input
v-else
autogrow
standout="bg-primary text-white"
square
v-model="cmdMatch"
:readonly="cmdType.inputType === 'null'"
type="text"
:label="cmdType.matchLabel"
>
<template v-slot:prepend>
<q-icon name="square_foot" />
</template>
</q-input>
<!-- 标签 -->
<q-input
standout="bg-primary text-white"
dense
square
v-model="quickcommandInfo.tags"
type="text"
@ -59,21 +106,18 @@
/>
<q-input
standout="bg-primary text-white"
dense
square
type="text"
label="变量"
/>
<q-input
standout="bg-primary text-white"
dense
square
type="text"
label="输出"
/>
<q-input
standout="bg-primary text-white"
dense
square
v-model="quickcommandInfo.features.platform"
type="text"
@ -83,7 +127,7 @@
</div>
</div>
<div></div>
</div>
</q-scroll-area>
<!-- 编程语言栏 -->
<div
class="absolute-top"
@ -131,6 +175,7 @@
dense
standout="bg-primary text-white"
square
stack-label
hide-bottom-space
color="primary"
input-style="width: 120px;"
@ -222,20 +267,25 @@
<script>
import MonocaEditor from "components/MonocaEditor";
import commandTypes from "../js/commandTypes.js";
let commandTypesOptions = Object.values(commandTypes);
export default {
components: { MonocaEditor },
data() {
return {
reg: "i",
programLanguages: Object.keys(this.$programmings),
matchTypes: ["关键字", "正则", "窗口", "文件", "专业模式"],
currentMatchType: "关键字",
sideBarWidth: "200px",
sideBarWidth: "240px",
languageBarHeight: "40px",
commandTypes: commandTypes,
commandTypesOptions: commandTypesOptions,
cmdType: commandTypesOptions[0],
cmdMatch: "",
quickcommandInfo: {
features: {
explain: "",
cmds: [],
platform: [],
},
program: "quickcommand",
@ -276,10 +326,6 @@ export default {
currentProgramLogo() {
return "/logo/" + this.quickcommandInfo.program + ".png";
},
commandType() {
let cmd = this.quickcommandInfo.features.cmds[0];
return typeof cmd === "string" ? "关键字" : cmd?.type;
},
},
created() {},
methods: {
@ -291,6 +337,12 @@ export default {
? this.action.data
: this.$utools.getDB(this.$utools.DBPRE.CFG + "codeHistory");
Object.assign(this.quickcommandInfo, quickCommandInfo);
//
let currentQuickCommandCmds = this.getCommandType();
// Object
this.cmdType = this.commandTypes[currentQuickCommandCmds.type];
this.cmdMatch = currentQuickCommandCmds.match;
// monoca
this.setLanguage(this.quickcommandInfo.program);
this.$refs.editor.setEditorValue(quickCommandInfo.cmd);
//
@ -471,6 +523,24 @@ export default {
},
//
saveCurrentCommand() {},
//
getCommandType() {
let data = {};
let cmds = this.quickcommandInfo.features.cmds;
if (cmds.length === 1) {
let { type, match } = cmds[0];
data.type = type ? type : "keyword";
data.match =
data.type === "keyword" ? cmds[0] : match?.app ? match.app : match;
} else {
data.type = cmds.filter((x) => !x.length).length
? "professional"
: "keyword";
data.match =
data.type === "keyword" ? cmds : JSON.stringify(cmds, null, 4);
}
return data;
},
},
};
</script>

61
src/js/commandTypes.js Normal file
View File

@ -0,0 +1,61 @@
const commandTypes = {
keyword: {
name: "keyword",
label: "关键词",
icon: "font_download",
matchLabel: "关键词",
desc: "在主输入框输入对应关键字进入插件,最通用的一种模式,关键字可以设置多个",
valueType: "array"
},
regex: {
name: "regex",
label: "正则/划词",
matchLabel: "正则",
icon: "rule",
desc: "匹配主输入框或超级面板选中的文本,可以获取输入框文本或选中文本作为变量",
valueType: "regex"
},
over: {
name: "over",
label: "所有文本",
matchLabel: "无需设置",
icon: "emergency",
desc: "匹配主输入框的所有文本,但只有在该文本未设置对应的插件或功能时才生效",
valueType: "null"
},
window: {
name: "window",
label: "窗口/进程",
matchLabel: "进程名",
icon: "widgets",
desc: "匹配呼出uTools前或唤出超级面板时的活动窗口可以获取窗口的信息或文件夹路径作为变量",
valueType: "array"
},
img: {
name: "img",
label: "图片",
matchLabel: "无需配置",
icon: "panorama",
desc: "匹配主输入框或超级面板选中的图片,并返回图片的 base64",
valueType: "null"
},
files: {
name: "files",
label: "复制/选中文件",
matchLabel: "正则",
icon: "description",
desc: "匹配主输入框或超级面板选中的文件,可以获取复制及选中的文件信息作为变量",
valueType: "regex"
},
professional: {
name: "professional",
label: "专业模式",
matchLabel: "json配置",
icon: "construction",
desc: "通过json格式的配置实现同时匹配关键字、窗口、文件甚至图片或者指定文件数量、窗口类等",
valueType: "json"
}
}
export default commandTypes