study/uTools-quickcommand
1
0
Fork 0
mirror of https://github.com/fofolee/uTools-quickcommand.git synced 2025-06-08 14:34:13 +08:00
Code Issues Packages Projects Releases Wiki Activity

优化参数值为空和传递空参数的逻辑

Browse Source
This commit is contained in:
fofolee 2025-01-07 17:50:13 +08:00
parent 5c2d9a5d89
commit a13580d53f
7 changed files with 275 additions and 199 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

82
src/components/composer/MultiParams.vue
View File

@ -4,7 +4,7 @@
v-if="hasFunctionSelector"
:model-value="funcName"
@update:model-value="funcName = $event"
:options="localCommand.functionSelector?.options"
:options="localCommand.functionSelector"
/>
<ParamInput :configs="localConfig" :values="argvs" @update="updateArgv" />
</div>
@ -40,17 +40,22 @@ export default defineComponent({
},
// 特定函数独有参数配置
functionConfig() {
return (
this.modelValue.functionSelector?.options.find(
(item) => item.value === this.funcName
)?.config || []
);
return this.getSelectFunction()?.config || [];
},
localConfig() {
return [...this.commonConfig, ...this.functionConfig].map((item) => {
const value =
item.type === "varInput"
? item.defaultValue || {
value: "",
isString: true,
__varInputVal__: true,
}
: // 其他类型情况复杂，不做判断，没有默认值返回undefined
item.defaultValue;
return {
...item,
value: item.defaultValue,
value,
};
});
},
@ -62,7 +67,20 @@ export default defineComponent({
return this.modelValue.value;
},
set(value) {
this.updateModelValue(value, this.defaultArgvs);
// 构建新的参数数组
const newArgvs = [];
// 保留通用配置的参数值
this.commonConfig.forEach((_, index) => {
newArgvs[index] = this.argvs[index];
});
// 使用新选择的函数独有配置的默认值
this.getSelectFunction(value)?.config?.forEach((config, index) => {
newArgvs[this.commonConfig.length + index] = config.defaultValue;
});
this.updateModelValue(value, newArgvs);
},
},
argvs() {
@ -75,6 +93,11 @@ export default defineComponent({
},
},
methods: {
getSelectFunction(funcName = this.funcName) {
return this.modelValue.functionSelector?.find(
(item) => item.value === funcName
);
},
updateArgv(index, value) {
const newArgvs = [...this.argvs];
newArgvs[index] = value;
@ -82,10 +105,41 @@ export default defineComponent({
this.updateModelValue(this.funcName, newArgvs);
},
generateCode(funcName, argvs) {
const newArgvs = argvs
.map((argv) => stringifyArgv(argv))
.filter((item) => item != null && item !== "");
return `${funcName}(${newArgvs.join(",")})`;
console.log("argvs", argvs);
/**
* 字符串模式stringfiy后，null会变成'"null"', ''变成'""'
* 变量模式stringify后，null变成'null', ''保持''
*/
const stringifiedArgvs = argvs.map((argv) => stringifyArgv(argv));
/* 空值处理：
* 1. 去掉 undefined，'', null
* 2. varInput在字符串模式下，留空为'""'，所以不会被处理
* 3. 变量模式下，留空是'', 会被过滤
* 4. 如果想传递空字符串，将varInput切为字符串模式并留空
* 5. 如果不想传递对应参数，将varInput切为变量模式并留空
* 6. 如果想传递空参数，将varInput切为变量模式并设置为null或undefined
* [undefined, undefined] -> funcName()
* [undefined, 1] -> ''
* [1, undefined] -> funcName(1)
* [null, 1] -> funcName(null, 1)
* [1, 字符串模式下varInput留空] -> funcName(1, "")
* [1, 变量模式下varInput留空] -> funcName(1)
* [1, 变量模式下varInput设置为null] -> funcName(1, null)
*/
// 空参数后面跟着非空参数，不生成代码
const isEmpty = (v) => v === undefined || v === "" || v === null;
for (let i = 0; i < stringifiedArgvs.length - 1; i++) {
if (isEmpty(stringifiedArgvs[i]) && !isEmpty(stringifiedArgvs[i + 1])) {
return "";
}
}
// 过滤空参数，由于前面已经对处于非空参数中间的空参数做了处理，这里直接过滤空参数不会对参数顺序造成影响
const finalArgvs = stringifiedArgvs.filter((v) => !isEmpty(v));
return `${funcName}(${finalArgvs.join(",")})`;
},
parseCodeToArgvs(code) {
let argvs = window.lodashM.cloneDeep(this.defaultArgvs);
@ -110,9 +164,7 @@ export default defineComponent({
},
getSummary(argvs) {
// 虽然header里对溢出做了处理，但是这里截断主要是为了节省存储空间
const funcNameLabel = this.localCommand.functionSelector?.options.find(
(option) => option.value === this.funcName
)?.label;
const funcNameLabel = this.getSelectFunction()?.label;
const subFeature = funcNameLabel ? `${funcNameLabel} ` : "";
const allArgvs = argvs
.filter((item) => item != null && item != "")

6
src/components/composer/common/NumberInput.vue
View File

@ -67,13 +67,17 @@ export default defineComponent({
return this.modelValue;
},
set(value) {
if (value === null || value === undefined || value === "") {
this.$emit("update:modelValue", null);
} else {
this.$emit("update:modelValue", value);
}
},
},
},
methods: {
updateNumber(delta) {
this.$emit("update:modelValue", this.localValue + delta);
this.$emit("update:modelValue", (this.localValue || 0) + delta);
},
},
});

16
src/components/composer/common/ParamInput.vue
View File

@ -43,6 +43,8 @@
<q-select
v-else-if="config.type === 'select'"
filled
emit-value
map-options
:model-value="values[index]"
@update:model-value="$emit('update', index, $event)"
:options="config.options"
@ -113,9 +115,16 @@ export default defineComponent({
emits: ["update"],
methods: {
getColumnStyle(width = 12) {
if (width === "auto") {
return {
flex: "1 1 0%",
minWidth: "0",
};
}
const columnWidth = (width / 12) * 100;
return {
width: `calc(${columnWidth}% - var(--grid-gap))`,
flex: "0 0 auto",
};
},
},
@ -134,11 +143,18 @@ export default defineComponent({
.grid-item {
min-width: 50px;
margin-bottom: 0;
display: flex;
}
.grid-item > * {
flex: 1;
min-width: 0;
}
@media (max-width: 600px) {
.grid-item {
width: 100% !important;
flex: 1 1 100% !important;
}
}
</style>

12
src/js/composer/commands/dataCommands.js
View File

@ -17,8 +17,7 @@ export const dataCommands = {
type: "varInput",
},
],
functionSelector: {
options: [
functionSelector: [
{
label: "Base64编码",
value: "quickcomposer.data.base64Encode",
@ -61,7 +60,6 @@ export const dataCommands = {
},
],
},
},
{
value: "quickcomposer.data.symmetricCrypto",
label: "对称加解密",
@ -90,8 +88,7 @@ export const dataCommands = {
type: "varInput",
},
],
functionSelector: {
options: [
functionSelector: [
{
label: "MD5",
value: "quickcomposer.data.md5Hash",
@ -119,7 +116,6 @@ export const dataCommands = {
},
],
},
},
{
value: "Math.sin",
label: "数学计算",
@ -134,8 +130,7 @@ export const dataCommands = {
type: "numInput",
},
],
functionSelector: {
options: [
functionSelector: [
{
label: "正弦(sin)",
value: "Math.sin",
@ -208,7 +203,6 @@ export const dataCommands = {
},
],
},
},
{
value: "quickcomposer.data.random",
label: "随机数",

5
src/js/composer/commands/simulateCommands.js
View File

@ -27,8 +27,7 @@ export const simulateCommands = {
width: 6,
},
],
functionSelector: {
options: [
functionSelector: [
{
label: "单击",
value: "utools.simulateMouseClick",
@ -45,8 +44,6 @@ export const simulateCommands = {
icon: "mouse",
},
],
allowEmptyArgv: true,
},
},
{
value: "utools.simulateMouseMove",

29
src/js/composer/formatString.js
View File

@ -103,15 +103,19 @@ const stringifyObject = (jsonObj) => {
* @returns {string} 格式化后的字符串
*/
export const stringifyArgv = (argv) => {
// 处理普通字符串
// 普通字符串加上引号
if (typeof argv === "string") {
return `"${argv}"`;
}
// 处理对象
// null类型是Object，需要单独处理，返回原值
if (argv === null) {
return null;
}
// 对象通过stringifyObject处理
if (typeof argv === "object") {
return stringifyObject(argv);
}
// 处理其他类型
// 其他类型返回原值
return argv;
};
@ -270,12 +274,25 @@ export const parseFunction = (functionStr, options = {}) => {
return shouldUseVariableFormat
? { value: node.value, isString: true, __varInputVal__: true }
: node.value;
// 数字、布尔
case "NumericLiteral":
return node.value;
case "BooleanLiteral":
return node.value;
return shouldUseVariableFormat
? {
value: JSON.stringify(node.value),
isString: false,
__varInputVal__: true,
}
: node.value;
// null
case "NullLiteral":
return null;
return shouldUseVariableFormat
? {
value: "null",
isString: false,
__varInputVal__: true,
}
: null;
case "Identifier":
// 标识符（变量）总是不带引号的
return shouldUseVariableFormat

4
项目说明.json
View File

@ -28,15 +28,11 @@
}
},
"functionSelector": {
"描述": "可选，函数选择器，用于选择函数，如果存在则使用MultiParams组件，用于一类参数类似，但函数名不同的命令",
"options": {
"描述": "必选，选项，一个数组，每个元素是一个对象，包含以下属性：",
"配置项属性": {
"label": "必选，显示的名称",
"value": "必选，生成代码时使用的函数名",
"icon": "可选，图标",
"config": "可选，特定函数独有参数配置，和MultiParams组件的config一样"
}
},
"value": "必选，默认值"
}