diff --git a/src/components/composer/CommandComposer.vue b/src/components/composer/CommandComposer.vue
index 0de8d9f..e419722 100644
--- a/src/components/composer/CommandComposer.vue
+++ b/src/components/composer/CommandComposer.vue
@@ -123,7 +123,7 @@ export default defineComponent({
const flow = window.lodashM.cloneDeep(this.commandFlow);
const uselessProps = [
"config",
- "argvs",
+ "code",
"label",
"component",
"subCommands",
diff --git a/src/components/composer/ComposerCard.vue b/src/components/composer/ComposerCard.vue
index c0d044f..f924047 100644
--- a/src/components/composer/ComposerCard.vue
+++ b/src/components/composer/ComposerCard.vue
@@ -6,6 +6,25 @@
}"
v-bind="$attrs"
>
+
+
@@ -74,6 +96,7 @@ import MultiParams from "components/composer/MultiParams.vue";
import CommandHead from "components/composer/card/CommandHead.vue";
import * as CardComponents from "js/composer/cardComponents";
import { processVariable } from "js/composer/variableManager";
+import { newVarInputVal } from "js/composer/varInputValManager";
import ControlCommand from "components/composer/control/ControlCommand.vue";
export default defineComponent({
@@ -95,7 +118,15 @@ export default defineComponent({
required: true,
},
},
- emits: ["remove", "run", "addBranch", "toggle-collapse", "update:modelValue"],
+ emits: [
+ "remove",
+ "run",
+ "addBranch",
+ "toggle-collapse",
+ "update:modelValue",
+ "add-command",
+ "toggle-disable",
+ ],
computed: {
localCommand: {
get() {
@@ -105,18 +136,15 @@ export default defineComponent({
this.$emit("update:modelValue", value);
},
},
- showRunBtn() {
- return !this.command.isControlFlow;
- },
- showOutputBtn() {
- return !this.command.isControlFlow;
- },
- isLastCommandInChain() {
- if (!this.command.commandChain) return false;
+ isFirstCommandInChain() {
+ if (!this.localCommand.commandChain) return false;
return (
- this.command.commandType === this.command.commandChain?.slice(-1)[0]
+ this.localCommand.commandType === this.localCommand.commandChain?.[0]
);
},
+ canToggleDisable() {
+ return !this.localCommand.isControlFlow || this.isFirstCommandInChain;
+ },
},
setup(props) {
const getCurrentVariables = inject("getCurrentVariables");
@@ -171,6 +199,68 @@ export default defineComponent({
this.localCommand.isCollapsed = !this.localCommand.isCollapsed;
}
},
+ handleCopy() {
+ if (this.localCommand.isControlFlow && this.localCommand.chainId) {
+ // 如果是控制流程命令,通知父组件复制整个链
+ this.$emit("add-command", {
+ command: this.localCommand,
+ type: "chain",
+ });
+ } else {
+ // 非控制流程命令的复制逻辑保持不变
+ const copiedCommand = window.lodashM.cloneDeep(this.localCommand);
+ delete copiedCommand.id;
+ delete copiedCommand.chainId;
+ delete copiedCommand.commandType;
+ this.$emit("add-command", {
+ command: copiedCommand,
+ type: "single",
+ });
+ }
+ },
+ handleToggleDisable() {
+ if (!this.canToggleDisable) return;
+ if (this.localCommand.isControlFlow && this.localCommand.chainId) {
+ console.log(
+ "handleToggleDisable card",
+ this.localCommand.isControlFlow,
+ this.localCommand.chainId
+ );
+ // 如果是控制流程命令,通知父组件切换整个链的禁用状态
+ this.$emit("toggle-disable", {
+ chainId: this.localCommand.chainId,
+ disabled: !this.localCommand.disabled,
+ });
+ } else {
+ // 非控制流程命令的禁用逻辑保持不变
+ this.localCommand.disabled = !this.localCommand.disabled;
+ }
+ },
+ handleAddPrint() {
+ // 创建一个打印命令
+ if (!this.localCommand.outputVariable) {
+ this.localCommand.outputVariable = `temp_${parseInt(
+ new Date().getTime() / 1000
+ )}`;
+ this.localCommand.saveOutput = true;
+ }
+ const printCommand = {
+ value: "console.log",
+ label: "显示消息",
+ config: [
+ {
+ label: "要打印的消息文本",
+ component: "VariableInput",
+ icon: "info",
+ },
+ ],
+ argvs: [newVarInputVal("var", this.localCommand.outputVariable)],
+ };
+ this.$emit("add-command", {
+ command: printCommand,
+ type: "single",
+ });
+ },
},
});
@@ -268,4 +358,71 @@ export default defineComponent({
.command-item :deep(.condition-type-btn) {
margin-left: -8px;
}
+
+/* 禁用状态样式 */
+.composer-card.disabled {
+ position: relative;
+}
+
+/* 禁用遮罩层 */
+.disabled-overlay {
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ background: rgba(255, 255, 255, 0.05);
+ backdrop-filter: blur(1px);
+ border: 1px dashed rgba(0, 0, 0, 0.2);
+ z-index: 10;
+ border-radius: inherit;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ cursor: pointer !important;
+ transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.body--dark .disabled-overlay {
+ background: rgba(0, 0, 0, 0.05);
+ border-color: rgba(255, 255, 255, 0.15);
+}
+
+/* 斜纹背景 */
+.disabled-overlay::before {
+ content: "";
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ background: repeating-linear-gradient(
+ -45deg,
+ rgba(0, 0, 0, 0.02),
+ rgba(0, 0, 0, 0.02) 10px,
+ rgba(0, 0, 0, 0.04) 10px,
+ rgba(0, 0, 0, 0.04) 20px
+ );
+ border-radius: inherit;
+ pointer-events: none;
+}
+
+.enable-btn-wrapper {
+ opacity: 0;
+ transform: scale(0.9);
+ transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+ user-select: none;
+ cursor: pointer !important;
+}
+
+.disabled-overlay.showToggleBtn:hover .enable-btn-wrapper {
+ opacity: 1;
+ transform: scale(1);
+}
+
+.disabled-overlay.showToggleBtn:hover {
+ backdrop-filter: blur(0.5px);
+ border-color: transparent;
+ transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+}
diff --git a/src/components/composer/ComposerFlow.vue b/src/components/composer/ComposerFlow.vue
index fa34140..da346d8 100644
--- a/src/components/composer/ComposerFlow.vue
+++ b/src/components/composer/ComposerFlow.vue
@@ -55,6 +55,8 @@
@run="handleRunCommand"
@add-branch="addBranch"
@toggle-collapse="(event) => handleControlFlowCollapse(event)"
+ @add-command="(event) => handleAddCommand(event, index)"
+ @toggle-disable="handleToggleDisable"
/>
@@ -435,6 +437,62 @@ export default defineComponent({
this.$emit("action", action, payload);
}
},
+ getChainCommands(chainId) {
+ const startIndex = this.commands.findIndex(
+ (cmd) => cmd.chainId === chainId
+ );
+ const endIndex = this.commands.findLastIndex(
+ (cmd) => cmd.chainId === chainId
+ );
+ return {
+ chainCommands: this.commands.slice(startIndex, endIndex + 1),
+ startIndex,
+ endIndex,
+ };
+ },
+ copyChainCommands(chainCommands) {
+ // 生成新的chainId
+ const newChainId = this.$root.getUniqueId();
+ // 复制并修改每个命令
+ const newChainCommands = [];
+ chainCommands.forEach((cmd) => {
+ const copiedCommand = window.lodashM.cloneDeep(cmd);
+ copiedCommand.id = this.$root.getUniqueId();
+ if (copiedCommand.chainId) copiedCommand.chainId = newChainId;
+ newChainCommands.push(copiedCommand);
+ });
+ return newChainCommands;
+ },
+ handleAddCommand({ command, type }, index) {
+ if (type === "chain") {
+ // 如果是复制链式命令
+ const { chainCommands, endIndex } = this.getChainCommands(
+ command.chainId
+ );
+ const newChainCommands = this.copyChainCommands(chainCommands);
+ const newCommands = [...this.commands];
+ newCommands.splice(endIndex + 1, 0, ...newChainCommands);
+ this.$emit("update:modelValue", newCommands);
+ } else {
+ // 单个命令的复制逻辑
+ const newCommand = {
+ ...command,
+ id: this.$root.getUniqueId(),
+ };
+ const newCommands = [...this.commands];
+ newCommands.splice(index + 1, 0, newCommand);
+ this.$emit("update:modelValue", newCommands);
+ }
+ },
+ handleToggleDisable({ chainId, disabled }) {
+ console.log("handleToggleDisable", chainId, disabled);
+ const { chainCommands } = this.getChainCommands(chainId);
+ // 更新所有相关命令的禁用状态
+ const newCommands = chainCommands.map((cmd) => {
+ return { ...cmd, disabled };
+ });
+ this.$emit("update:modelValue", newCommands);
+ },
collapseAll() {
const newCommands = this.commands.map((cmd) => ({
...cmd,
diff --git a/src/components/composer/MultiParams.vue b/src/components/composer/MultiParams.vue
index e1aafb1..79f7714 100644
--- a/src/components/composer/MultiParams.vue
+++ b/src/components/composer/MultiParams.vue
@@ -199,8 +199,9 @@ export default defineComponent({
},
},
mounted() {
- if (!this.modelValue.argvs && !this.modelValue.code) {
- this.updateModelValue(this.funcName, this.defaultArgvs);
+ const argvs = this.modelValue.argvs || this.defaultArgvs;
+ if (!this.modelValue.code) {
+ this.updateModelValue(this.funcName, argvs);
}
},
});
diff --git a/src/components/composer/card/CommandButtons.vue b/src/components/composer/card/CommandButtons.vue
index 0ab583d..7c894f7 100644
--- a/src/components/composer/card/CommandButtons.vue
+++ b/src/components/composer/card/CommandButtons.vue
@@ -54,6 +54,50 @@
单独运行此命令并打印输出
+
+
+
+
+
+
+
+
+ 复制命令
+
+
+
+
+
+
+ {{
+ command.disabled ? "启用命令" : "禁用命令"
+ }}
+
+
+
+
+
+
+ 打印输出
+
+
+
+
+
{
+ // 跳过禁用的命令
+ if (cmd.disabled) return;
if (!cmd.code) return;
let line = indent;