From f1dd98624eb98feba9f63ed14d805fd0fd3f511f Mon Sep 17 00:00:00 2001 From: fofolee Date: Sun, 26 Jan 2025 14:41:22 +0800 Subject: [PATCH] =?UTF-8?q?OutPutEditor=E6=94=AF=E6=8C=81=E4=B8=8B?= =?UTF-8?q?=E6=8B=89=E9=80=89=E6=8B=A9=E5=8F=98=E9=87=8F=E5=92=8C=E5=87=BD?= =?UTF-8?q?=E6=95=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../composer/card/CommandButtons.vue | 11 ++++- src/components/composer/card/OutputEditor.vue | 2 + .../composer/card/output/OutputField.vue | 47 +++++++++++++++++++ .../composer/common/VariableInput.vue | 16 ++++++- .../composer/common/varinput/VariableList.vue | 34 +++++++++----- src/components/composer/flow/FlowManager.vue | 7 ++- src/js/composer/generateCode.js | 22 +++++---- 7 files changed, 112 insertions(+), 27 deletions(-) diff --git a/src/components/composer/card/CommandButtons.vue b/src/components/composer/card/CommandButtons.vue index cd163cc..eadb4a1 100644 --- a/src/components/composer/card/CommandButtons.vue +++ b/src/components/composer/card/CommandButtons.vue @@ -10,8 +10,10 @@ @@ -195,6 +197,11 @@ export default { color: var(--q-primary); } +.output-btn-active { + color: var(--q-primary); + opacity: 1; +} + /* 暗色模式适配 */ .body--dark .output-btn { border-color: rgba(255, 255, 255, 0.1); diff --git a/src/components/composer/card/OutputEditor.vue b/src/components/composer/card/OutputEditor.vue index 4906733..9ea3ecb 100644 --- a/src/components/composer/card/OutputEditor.vue +++ b/src/components/composer/card/OutputEditor.vue @@ -11,6 +11,7 @@ v-model="simpleOutputVar" :label="currentOutputs?.label || '输出变量名'" autofocus + :show-variable-list="true" class="q-px-sm" /> @@ -75,6 +76,7 @@ label="回调函数" placeholder="新函数名则自动创建" class="col-8" + :show-function-list="true" /> diff --git a/src/components/composer/card/output/OutputField.vue b/src/components/composer/card/output/OutputField.vue index 0c5cd20..3ec7bcc 100644 --- a/src/components/composer/card/output/OutputField.vue +++ b/src/components/composer/card/output/OutputField.vue @@ -12,6 +12,14 @@ + import { defineComponent } from "vue"; +import VariableList from "components/composer/common/varinput/VariableList.vue"; export default defineComponent({ + components: { + VariableList, + }, name: "OutputField", props: { modelValue: { @@ -51,8 +63,21 @@ export default defineComponent({ type: null, default: null, }, + showVariableList: { + type: Boolean, + default: false, + }, + showFunctionList: { + type: Boolean, + default: false, + }, }, emits: ["update:modelValue"], + methods: { + updateValBySelect(_type, val) { + this.$emit("update:modelValue", val); + }, + }, }); @@ -73,6 +98,14 @@ export default defineComponent({ font-size: 12px; } +.output-field:not(.q-select) :deep(.q-field__control) { + padding-right: 0; +} + +.output-field.q-select :deep(.q-field__append) { + font-size: 16px; +} + /* 去除filled输入框边框 */ .output-field :deep(.q-field__control:before) { border: none; @@ -83,4 +116,18 @@ export default defineComponent({ height: 0; border-bottom: none; } + +.variable-list-btn { + padding: 0 12px; +} + +/* 去掉下拉按钮的焦点效果 */ +.variable-list-btn :deep(.q-focus-helper) { + display: none !important; +} + +/* 移除波纹效果 */ +.variable-list-btn :deep(.q-ripple) { + display: none; +} diff --git a/src/components/composer/common/VariableInput.vue b/src/components/composer/common/VariableInput.vue index 9dad0d6..1c2e89b 100644 --- a/src/components/composer/common/VariableInput.vue +++ b/src/components/composer/common/VariableInput.vue @@ -47,7 +47,12 @@ class="prepend-btn" /> - +