编排UI分类补全showConfirmBox、showMessageBox、showTextArea

This commit is contained in:
fofolee 2025-01-08 15:25:56 +08:00
parent 6af4a15e2a
commit 430466c38c
4 changed files with 110 additions and 0 deletions

View File

@ -5,6 +5,7 @@
dense dense
filled filled
:label="label" :label="label"
:placeholder="placeholder"
class="number-input" class="number-input"
> >
<template v-slot:prepend> <template v-slot:prepend>
@ -55,6 +56,10 @@ export default defineComponent({
type: String, type: String,
default: "", default: "",
}, },
placeholder: {
type: String,
default: "",
},
icon: { icon: {
type: String, type: String,
default: "", default: "",

View File

@ -11,6 +11,7 @@
:model-value="values[index]" :model-value="values[index]"
@update:model-value="$emit('update', index, $event)" @update:model-value="$emit('update', index, $event)"
:label="config.label" :label="config.label"
:placeholder="config.placeholder"
:icon="config.icon" :icon="config.icon"
:options="config.options" :options="config.options"
/> />
@ -20,6 +21,7 @@
@update:model-value="$emit('update', index, $event)" @update:model-value="$emit('update', index, $event)"
:label="config.label" :label="config.label"
:icon="config.icon" :icon="config.icon"
:placeholder="config.placeholder"
/> />
<ArrayEditor <ArrayEditor
v-else-if="config.type === 'arrayEditor'" v-else-if="config.type === 'arrayEditor'"
@ -61,6 +63,7 @@
@update:model-value="$emit('update', index, $event)" @update:model-value="$emit('update', index, $event)"
:label="config.label" :label="config.label"
:icon="config.icon" :icon="config.icon"
:placeholder="config.placeholder"
> >
<template v-slot:prepend> <template v-slot:prepend>
<q-icon :name="config.icon || 'code'" /> <q-icon :name="config.icon || 'code'" />
@ -153,6 +156,8 @@ export default defineComponent({
min-width: 50px; min-width: 50px;
margin-bottom: 0; margin-bottom: 0;
display: flex; display: flex;
justify-content: center;
align-items: center;
} }
.grid-item > * { .grid-item > * {
@ -160,6 +165,13 @@ export default defineComponent({
min-width: 0; min-width: 0;
} }
/* 让开关、复选框和按钮组居中显示 */
.grid-item > .q-toggle,
.grid-item > .q-checkbox,
.grid-item > .q-btn-group {
flex: 0 1 auto;
}
@media (max-width: 600px) { @media (max-width: 600px) {
.grid-item { .grid-item {
width: 100% !important; width: 100% !important;

View File

@ -4,6 +4,7 @@
dense dense
filled filled
:label="label" :label="label"
:placeholder="placeholder"
class="variable-input" class="variable-input"
> >
<template v-slot:append> <template v-slot:append>
@ -182,6 +183,7 @@ export default defineComponent({
default: () => newVarInputVal("str"), default: () => newVarInputVal("str"),
}, },
label: String, label: String,
placeholder: String,
icon: String, icon: String,
noIcon: Boolean, noIcon: Boolean,
options: { options: {

View File

@ -61,5 +61,96 @@ export const uiCommands = {
component: "SelectListEditor", component: "SelectListEditor",
isAsync: true, isAsync: true,
}, },
{
value: "quickcommand.showTextArea",
label: "文本框",
desc: "显示一个文本框,可以输入多行文本",
isAsync: true,
outputVariable: "textareaValue",
saveOutput: true,
config: [
{
label: "文本框占位符",
type: "varInput",
defaultValue: newVarInputVal("str", "请输入"),
width: 6,
},
{
label: "文本框默认值",
type: "varInput",
defaultValue: newVarInputVal("str"),
width: 6,
},
],
},
{
value: "quickcommand.showMessageBox",
label: "消息提示",
desc: "显示一个自动消失的提示框",
isAsync: true,
config: [
{
label: "提示内容",
type: "varInput",
icon: "info",
defaultValue: newVarInputVal("str", "这是一条提示消息"),
width: 12,
},
{
label: "图标类型",
type: "select",
defaultValue: "success",
icon: "lightbulb",
width: 6,
options: [
{ label: "成功", value: "success" },
{ label: "错误", value: "error" },
{ label: "警告", value: "warning" },
{ label: "信息", value: "info" },
],
},
{
label: "显示时间(ms)",
type: "numInput",
width: 6,
placeholder: "0为手动关闭留空按文本长度调整",
},
],
},
{
value: "quickcommand.showConfirmBox",
label: "确认框",
desc: "显示一个确认框,返回是否点击了确认",
isAsync: true,
outputVariable: "confirmed",
saveOutput: true,
config: [
{
label: "提示内容",
type: "varInput",
defaultValue: newVarInputVal("str", "确认要执行此操作吗?"),
width: 12,
},
{
label: "标题",
type: "varInput",
defaultValue: newVarInputVal("str", "提示"),
width: 7,
},
{
label: "支持HTML",
type: "switch",
defaultValue: false,
width: 2,
},
{
label: "宽度",
type: "numInput",
defaultValue: 450,
width: 3,
placeholder: "对话框宽度",
},
],
},
], ],
}; };