Content-Length: 6422 | pFad | http://github.com/lowcoder-org/lowcoder/pull/1506.diff

thub.com diff --git a/client/packages/lowcoder/src/comps/comps/simpleVariableHeaderComp.tsx b/client/packages/lowcoder/src/comps/comps/simpleVariableHeaderComp.tsx new file mode 100644 index 000000000..a709da485 --- /dev/null +++ b/client/packages/lowcoder/src/comps/comps/simpleVariableHeaderComp.tsx @@ -0,0 +1,65 @@ +import { ControlParams } from "comps/controls/controlParams"; +import { CompAction, SimpleComp } from "lowcoder-core"; +import { ControlPropertyViewWrapper, PopupCard, Input } from "lowcoder-design"; +import { useEffect, useState } from "react"; +import { trans } from "i18n"; +import { checkName } from "../utils/rename"; +const SimpleVariableHeaderPropertyView = ({params, comp, isCheck}: any) => { + const [error, setError] = useState(); + const [value, setValue] = useState(comp.value); + useEffect(() => { + setValue(comp.value); + isCheck && setError(undefined); + }, [comp]); + return ( + + { + const error = isCheck && checkName(e.target.value); + isCheck && setError(error || undefined); + setValue(e.target.value); + }} + onBlur={(e) => { + if(!isCheck || !error) comp.dispatchChangeValueAction(value); + else { + setValue(comp.value); + setError(undefined); + } + }} + /> + {isCheck && } + + ); +} +export const SimpleVariableHeaderComp = (isCheck: boolean = false) => { + return class SimpleVariableHeaderComp extends SimpleComp { + override reduce(action: CompAction): this { + // if (isBroadcastAction(action, CompActionTypes.RENAME)) { + // if (this.getView() === action.action.oldName) { + // return super.reduce(this.changeValueAction(action.action.name)); + // } + // } + return super.reduce(action); + } + + readonly IGNORABLE_DEFAULT_VALUE = ""; + protected getDefaultValue(): string { + return ""; + } + + getPropertyView() { + return this.propertyView({}); + } + + propertyView(params: ControlParams) { + return + } + } +} diff --git a/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx b/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx index e337ac869..7946d93ab 100644 --- a/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx +++ b/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx @@ -99,7 +99,7 @@ const ExecuteQueryPropertyView = ({ const ExecuteQueryTmpAction = (function () { const childrenMap = { queryName: SimpleNameComp, - queryVariables: withDefault(keyValueListControl(false, [], "string"), []) + queryVariables: withDefault(keyValueListControl(false, [], "variable"), []) }; return new MultiCompBuilder(childrenMap, () => { return () => Promise.resolve(undefined as unknown); diff --git a/client/packages/lowcoder/src/comps/controls/keyValueControl.tsx b/client/packages/lowcoder/src/comps/controls/keyValueControl.tsx index 86e02a1a4..319d8ac0a 100644 --- a/client/packages/lowcoder/src/comps/controls/keyValueControl.tsx +++ b/client/packages/lowcoder/src/comps/controls/keyValueControl.tsx @@ -6,6 +6,7 @@ import { StringControl } from "./codeControl"; import { ControlParams } from "./controlParams"; import { dropdownControl } from "./dropdownControl"; import { ParamsStringControl } from "./paramsControl"; +import { SimpleVariableHeaderComp } from "../comps/simpleVariableHeaderComp"; const KeyValueWrapper = styled.div` display: flex; @@ -58,13 +59,20 @@ export type KeyValueControlParams = ControlParams & { export function keyValueControl( hasType: boolean = false, types: T, - controlType: "params" | "string" = "params" + controlType: "params" | "string" | "variable" = "params" ) { - const childrenMap = { + let childrenMap = { key: controlType === "params" ? ParamsStringControl : StringControl, value: controlType === "params" ? ParamsStringControl : StringControl, type: dropdownControl(types, types[0]?.value), }; + if(controlType === "variable") { + childrenMap = { + key: SimpleVariableHeaderComp(true) as any, + value: SimpleVariableHeaderComp() as any, + type: dropdownControl(types, types[0]?.value), + }; + } return class extends new MultiCompBuilder(childrenMap, (props) => { return hasType ? { diff --git a/client/packages/lowcoder/src/comps/controls/keyValueListControl.tsx b/client/packages/lowcoder/src/comps/controls/keyValueListControl.tsx index 6beb5eddc..fab6b0d0e 100644 --- a/client/packages/lowcoder/src/comps/controls/keyValueListControl.tsx +++ b/client/packages/lowcoder/src/comps/controls/keyValueListControl.tsx @@ -14,7 +14,7 @@ import { keyValueControl, KeyValueControlParams } from "./keyValueControl" export function keyValueListControl( hasType: boolean = false, types: T | OptionsType = [], - controlType: "params" | "string" = "params" + controlType: "params" | "string" | "variable" = "params" ) { return class extends list(keyValueControl(hasType, types, controlType)) { getQueryParams() { diff --git a/client/packages/lowcoder/src/comps/queries/queryComp/variablesComp.tsx b/client/packages/lowcoder/src/comps/queries/queryComp/variablesComp.tsx index 94ce13f03..ec271e28f 100644 --- a/client/packages/lowcoder/src/comps/queries/queryComp/variablesComp.tsx +++ b/client/packages/lowcoder/src/comps/queries/queryComp/variablesComp.tsx @@ -3,7 +3,7 @@ import { keyValueListControl } from "../../controls/keyValueListControl"; export const VariablesComp = new MultiCompBuilder( { - variables: withDefault(keyValueListControl(false, [], "string"), [{ key: "", value: "" }]), + variables: withDefault(keyValueListControl(false, [], "variable"), [{ key: "", value: "" }]), }, (props) => props //props.variables )

pFad - (p)hone/(F)rame/(a)nonymizer/(d)eclutterfier! Saves Data!