Content-Length: 44300 | pFad | http://github.com/lowcoder-org/lowcoder/pull/1470.patch

thub.com From 338a8faf70f11d373787acb710588976e27ae262 Mon Sep 17 00:00:00 2001 From: Imiss-U1025 Date: Wed, 22 Jan 2025 10:23:06 -0500 Subject: [PATCH 1/8] Added query variables on Query Dialogue, added parameters on Run a Data Query of Event Handlers. --- .../actionSelector/executeQueryAction.tsx | 43 ++++++++++++------- .../controls/actionSelector/goToURLAction.tsx | 2 +- .../lowcoder/src/comps/queries/queryComp.tsx | 2 + .../queries/queryComp/queryPropertyView.tsx | 34 +++++++++++++++ .../queries/queryComp/variablesCompl.tsx | 16 +++++++ .../packages/lowcoder/src/i18n/locales/en.ts | 1 + .../packages/lowcoder/src/util/appUtils.tsx | 1 + 7 files changed, 83 insertions(+), 16 deletions(-) create mode 100644 client/packages/lowcoder/src/comps/queries/queryComp/variablesCompl.tsx diff --git a/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx b/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx index 720fc93fe..e425f1e3e 100644 --- a/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx +++ b/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx @@ -7,10 +7,13 @@ import { BranchDiv, Dropdown } from "lowcoder-design"; import { BottomResTypeEnum } from "types/bottomRes"; import { getPromiseAfterDispatch } from "util/promiseUtils"; import { trans } from "i18n"; +import {keyValueListControl, keyValueListToSearchStr, withDefault} from "lowcoder-sdk"; +import {KeyValue} from "@lowcoder-ee/types/common"; const ExecuteQueryTmpAction = (function () { const childrenMap = { queryName: SimpleNameComp, + query: withDefault(keyValueListControl(false, [], "string"), [{ key: "", value: "" }]) }; return new MultiCompBuilder(childrenMap, () => { return () => Promise.resolve(undefined as unknown); @@ -22,6 +25,8 @@ const ExecuteQueryTmpAction = (function () { export class ExecuteQueryAction extends ExecuteQueryTmpAction { override getView() { const queryName = this.children.queryName.getView(); + const queryParams = keyValueListToSearchStr(Array.isArray(this?.children?.query) ? (this.children.query as unknown as any[]).map((i: any) => i.getView() as KeyValue) : []); + console.log(queryParams, queryName); if (!queryName) { return () => Promise.resolve(); } @@ -80,21 +85,29 @@ export class ExecuteQueryAction extends ExecuteQueryTmpAction { return options; }; return ( - - - {(editorState) => ( - <> - this.dispatchChangeValueAction({ queryName: value })} - /> - - )} - - + <> + + + {(editorState) => ( + <> + this.dispatchChangeValueAction({ queryName: value })} + /> + + )} + + + + {this.children.query.propertyView({ + label: trans("eventHandler.queryParams"), + layout: "vertical", + })} + + ); } } diff --git a/client/packages/lowcoder/src/comps/controls/actionSelector/goToURLAction.tsx b/client/packages/lowcoder/src/comps/controls/actionSelector/goToURLAction.tsx index 462cd6213..2223079ef 100644 --- a/client/packages/lowcoder/src/comps/controls/actionSelector/goToURLAction.tsx +++ b/client/packages/lowcoder/src/comps/controls/actionSelector/goToURLAction.tsx @@ -20,7 +20,7 @@ const childrenMap = { }; export const GoToURLAction = new MultiCompBuilder(childrenMap, (props) => { - return () => { + return () => { const queryParams = keyValueListToSearchStr( props.query.map((i) => i.getView() as KeyValue) ); diff --git a/client/packages/lowcoder/src/comps/queries/queryComp.tsx b/client/packages/lowcoder/src/comps/queries/queryComp.tsx index e90bf8d19..13682595b 100644 --- a/client/packages/lowcoder/src/comps/queries/queryComp.tsx +++ b/client/packages/lowcoder/src/comps/queries/queryComp.tsx @@ -75,6 +75,7 @@ import { QueryNotificationControl } from "./queryComp/queryNotificationControl"; import { QueryPropertyView } from "./queryComp/queryPropertyView"; import { getTriggerType, onlyManualTrigger } from "./queryCompUtils"; import { messageInstance } from "lowcoder-design/src/components/GlobalInstances"; +import {VariablesComp} from "@lowcoder-ee/comps/queries/queryComp/variablesCompl"; const latestExecution: Record = {}; @@ -153,6 +154,7 @@ const childrenMap = { defaultValue: 10 * 1000, }), confirmationModal: QueryConfirmationModal, + variables: VariablesComp, periodic: BoolPureControl, periodicTime: millisecondsControl({ defaultValue: Number.NaN, diff --git a/client/packages/lowcoder/src/comps/queries/queryComp/queryPropertyView.tsx b/client/packages/lowcoder/src/comps/queries/queryComp/queryPropertyView.tsx index 07f4ef1e0..fa0f078e1 100644 --- a/client/packages/lowcoder/src/comps/queries/queryComp/queryPropertyView.tsx +++ b/client/packages/lowcoder/src/comps/queries/queryComp/queryPropertyView.tsx @@ -171,6 +171,17 @@ export function QueryPropertyView(props: { comp: InstanceType ), }, + { + key: "variables", + title: trans("query.variablesTab"), + children: ( + + + {children.variables.getPropertyView()} + + + ), + }, ] as const } tabTitle={children.name.getView()} @@ -501,6 +512,29 @@ export const QueryGeneralPropertyView = (props: { ); }; +export const QueryVariablesPropertyView = (props: { + comp: InstanceType; + placement?: PageType; +}) => { + const { comp, placement = "editor" } = props; + + const children = comp.children; + let datasourceId = children.datasourceId.getView(); + + console.log(children.datasourceId); + return ( + + + {isCompWithPropertyView(children.comp) + ? children.comp.propertyView({ + datasourceId: datasourceId, + }) + : children.comp.getPropertyView()} + + + ); +}; + function findQueryInNestedStructure( structure: any, queryName: string, diff --git a/client/packages/lowcoder/src/comps/queries/queryComp/variablesCompl.tsx b/client/packages/lowcoder/src/comps/queries/queryComp/variablesCompl.tsx new file mode 100644 index 000000000..87c5bd432 --- /dev/null +++ b/client/packages/lowcoder/src/comps/queries/queryComp/variablesCompl.tsx @@ -0,0 +1,16 @@ +import {MultiCompBuilder, withDefault} from "../../generators"; +import {keyValueListControl} from "lowcoder-sdk"; + +export const VariablesComp = new MultiCompBuilder( + { + variables: withDefault(keyValueListControl(), [{ key: "", value: "" }]), + }, + (props) => + props.variables + ) + .setPropertyViewFn((children) => ( + <> + {children.variables.propertyView({})} + + )) + .build(); diff --git a/client/packages/lowcoder/src/i18n/locales/en.ts b/client/packages/lowcoder/src/i18n/locales/en.ts index 9c8cdddfa..c4c14c228 100644 --- a/client/packages/lowcoder/src/i18n/locales/en.ts +++ b/client/packages/lowcoder/src/i18n/locales/en.ts @@ -705,6 +705,7 @@ export const en = { "newDatasource": "New Data Source", "generalTab": "General", "notificationTab": "Notification", + "variablesTab": "Variables", "advancedTab": "Advanced", "showFailNotification": "Show Notification on Failure", "failCondition": "Failure Conditions", diff --git a/client/packages/lowcoder/src/util/appUtils.tsx b/client/packages/lowcoder/src/util/appUtils.tsx index 5aed643ae..be38dfc22 100644 --- a/client/packages/lowcoder/src/util/appUtils.tsx +++ b/client/packages/lowcoder/src/util/appUtils.tsx @@ -32,6 +32,7 @@ export function openApp(props: { hashParams?: string; newTab?: boolean; }) { + console.log(props.queryParams) const m = matchPath(window.location.pathname, APP_EDITOR_URL); if (!m || !props.applicationId) { return; From 2c730804050b080211373c1b93af6707c22ef93c Mon Sep 17 00:00:00 2001 From: Imiss-U1025 Date: Fri, 24 Jan 2025 10:02:46 -0500 Subject: [PATCH 2/8] Added Variables to every queries of Data Queries in your App of left panel. Added ability to apply query variables when running a query in the bottom panel. --- .../actionSelector/executeQueryAction.tsx | 10 +++++-- .../lowcoder/src/comps/queries/queryComp.tsx | 27 ++++++++++++++++++- .../{variablesCompl.tsx => variablesComp.tsx} | 0 3 files changed, 34 insertions(+), 3 deletions(-) rename client/packages/lowcoder/src/comps/queries/queryComp/{variablesCompl.tsx => variablesComp.tsx} (100%) diff --git a/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx b/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx index e425f1e3e..807adc986 100644 --- a/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx +++ b/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx @@ -25,8 +25,14 @@ const ExecuteQueryTmpAction = (function () { export class ExecuteQueryAction extends ExecuteQueryTmpAction { override getView() { const queryName = this.children.queryName.getView(); - const queryParams = keyValueListToSearchStr(Array.isArray(this?.children?.query) ? (this.children.query as unknown as any[]).map((i: any) => i.getView() as KeyValue) : []); - console.log(queryParams, queryName); + // const queryParams = keyValueListToSearchStr(Array.isArray(this?.children?.query) ? (this.children.query as unknown as any[]).map((i: any) => i.getView() as KeyValue) : []); + const result = Object.values(this.children.query.children as Record) + .filter(item => item.children.key.unevaledValue !== "" && item.children.value.unevaledValue !== "") + .map(item => ({[item.children.key.unevaledValue]: item.children.value.unevaledValue})); if (!queryName) { return () => Promise.resolve(); } diff --git a/client/packages/lowcoder/src/comps/queries/queryComp.tsx b/client/packages/lowcoder/src/comps/queries/queryComp.tsx index 13682595b..2d49400d3 100644 --- a/client/packages/lowcoder/src/comps/queries/queryComp.tsx +++ b/client/packages/lowcoder/src/comps/queries/queryComp.tsx @@ -75,7 +75,7 @@ import { QueryNotificationControl } from "./queryComp/queryNotificationControl"; import { QueryPropertyView } from "./queryComp/queryPropertyView"; import { getTriggerType, onlyManualTrigger } from "./queryCompUtils"; import { messageInstance } from "lowcoder-design/src/components/GlobalInstances"; -import {VariablesComp} from "@lowcoder-ee/comps/queries/queryComp/variablesCompl"; +import {VariablesComp} from "@lowcoder-ee/comps/queries/queryComp/variablesComp"; const latestExecution: Record = {}; @@ -137,6 +137,7 @@ const childrenMap = { isFetching: stateComp(false), lastQueryStartTime: stateComp(-1), // The last execution time of the query, in order to avoid multiple executions overwriting each other, not persistent latestEndTime: stateComp(0), // The time when the query was last executed + variable: stateComp(0), // The time when the query was last executed runTime: stateComp(0), // query run time datasourceId: StringControl, @@ -406,16 +407,21 @@ QueryCompTmp = class extends QueryCompTmp { return this; } + + + /** * Process the execution result */ private processResult(result: QueryResult, action: ExecuteQueryAction, startTime: number) { const lastQueryStartTime = this.children.lastQueryStartTime.getView(); + if (lastQueryStartTime > startTime) { // There are more new requests, ignore this result // FIXME: cancel this request in advance in the future return; } + const changeAction = multiChangeAction({ code: this.children.code.changeValueAction(result.code ?? QUERY_EXECUTION_OK), success: this.children.success.changeValueAction(result.success ?? true), @@ -424,6 +430,24 @@ QueryCompTmp = class extends QueryCompTmp { extra: this.children.extra.changeValueAction(result.extra ?? {}), isFetching: this.children.isFetching.changeValueAction(false), latestEndTime: this.children.latestEndTime.changeValueAction(Date.now()), + variable: this.children.variable.changeValueAction( + + Object.values(this.children?.variables?.children?.variables?.children || {}) + .filter( + (item: any) => + item?.children?.key?.children?.text?.unevaledValue !== "" && + item?.children?.value?.children?.text?.unevaledValue !== "" + ) + .reduce((acc: any, item: any) => { + const key = item?.children?.key?.children?.text?.unevaledValue; + const value = item?.children?.value?.children?.text?.unevaledValue; + if (key !== undefined && value !== undefined) { + acc[key] = value; + } + return acc; + }, {}) + ), + runTime: this.children.runTime.changeValueAction(result.runTime ?? 0), }); getPromiseAfterDispatch(this.dispatch, changeAction, { @@ -655,6 +679,7 @@ export const QueryComp = withExposingConfigs(QueryCompTmp, [ new NameConfig("isFetching", trans("query.isFetchingExportDesc")), new NameConfig("runTime", trans("query.runTimeExportDesc")), new NameConfig("latestEndTime", trans("query.latestEndTimeExportDesc")), + new NameConfig("variable", trans("query.variables")), new NameConfig("triggerType", trans("query.triggerTypeExportDesc")), ]); diff --git a/client/packages/lowcoder/src/comps/queries/queryComp/variablesCompl.tsx b/client/packages/lowcoder/src/comps/queries/queryComp/variablesComp.tsx similarity index 100% rename from client/packages/lowcoder/src/comps/queries/queryComp/variablesCompl.tsx rename to client/packages/lowcoder/src/comps/queries/queryComp/variablesComp.tsx From 6f9ae4141e7f9c6b7b4a954e9fe448f48e6ced43 Mon Sep 17 00:00:00 2001 From: Imiss-U1025 Date: Sat, 25 Jan 2025 09:41:48 -0500 Subject: [PATCH 3/8] Added console to query. --- .../src/comps/controls/actionSelector/executeQueryAction.tsx | 4 +++- .../src/comps/queries/queryComp/queryPropertyView.tsx | 2 ++ 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx b/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx index 807adc986..ba01dc22f 100644 --- a/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx +++ b/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx @@ -32,7 +32,9 @@ export class ExecuteQueryAction extends ExecuteQueryTmpAction { value: { unevaledValue: string } }}>) .filter(item => item.children.key.unevaledValue !== "" && item.children.value.unevaledValue !== "") - .map(item => ({[item.children.key.unevaledValue]: item.children.value.unevaledValue})); + .map(item => ({[item.children.key.unevaledValue]: item.children.value.unevaledValue})) + .reduce((acc, curr) => Object.assign(acc, curr), {}); + console.log(result); if (!queryName) { return () => Promise.resolve(); } diff --git a/client/packages/lowcoder/src/comps/queries/queryComp/queryPropertyView.tsx b/client/packages/lowcoder/src/comps/queries/queryComp/queryPropertyView.tsx index fa0f078e1..d0cbab197 100644 --- a/client/packages/lowcoder/src/comps/queries/queryComp/queryPropertyView.tsx +++ b/client/packages/lowcoder/src/comps/queries/queryComp/queryPropertyView.tsx @@ -274,6 +274,8 @@ export const QueryGeneralPropertyView = (props: { return options; }, [editorState]); + console.log(children.variable) + return ( From 8564f794b5e85f8eda6e638e16cccabee36e1808 Mon Sep 17 00:00:00 2001 From: Imiss-U1025 Date: Mon, 27 Jan 2025 11:01:57 -0500 Subject: [PATCH 4/8] overwrite variables before executeQuery --- .../actionSelector/executeQueryAction.tsx | 5 +--- .../lowcoder/src/comps/queries/queryComp.tsx | 28 ++++++------------- .../queries/queryComp/queryPropertyView.tsx | 2 -- 3 files changed, 10 insertions(+), 25 deletions(-) diff --git a/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx b/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx index ba01dc22f..718560217 100644 --- a/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx +++ b/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx @@ -34,7 +34,6 @@ export class ExecuteQueryAction extends ExecuteQueryTmpAction { .filter(item => item.children.key.unevaledValue !== "" && item.children.value.unevaledValue !== "") .map(item => ({[item.children.key.unevaledValue]: item.children.value.unevaledValue})) .reduce((acc, curr) => Object.assign(acc, curr), {}); - console.log(result); if (!queryName) { return () => Promise.resolve(); } @@ -43,9 +42,7 @@ export class ExecuteQueryAction extends ExecuteQueryTmpAction { this.dispatch, routeByNameAction( queryName, - executeQueryAction({ - // can add context in the future - }) + executeQueryAction({args: result}) ), { notHandledError: trans("eventHandler.notHandledError") } ); diff --git a/client/packages/lowcoder/src/comps/queries/queryComp.tsx b/client/packages/lowcoder/src/comps/queries/queryComp.tsx index 2d49400d3..74f41b8fc 100644 --- a/client/packages/lowcoder/src/comps/queries/queryComp.tsx +++ b/client/packages/lowcoder/src/comps/queries/queryComp.tsx @@ -135,9 +135,9 @@ const childrenMap = { data: stateComp(null), extra: stateComp({}), isFetching: stateComp(false), + variable: stateComp({}), lastQueryStartTime: stateComp(-1), // The last execution time of the query, in order to avoid multiple executions overwriting each other, not persistent latestEndTime: stateComp(0), // The time when the query was last executed - variable: stateComp(0), // The time when the query was last executed runTime: stateComp(0), // query run time datasourceId: StringControl, @@ -364,6 +364,14 @@ QueryCompTmp = class extends QueryCompTmp { } if (action.type === CompActionTypes.EXECUTE_QUERY) { if (getReduceContext().disableUpdateState) return this; + let variableVal = {}; + if(action.args) variableVal = action.args; + else variableVal = this.children.variables.children.variables.toJsonValue().reduce((acc, curr) => Object.assign(acc, {[curr.key as string]:curr.value}), {}); + //Update query.variable + const changeValAction = this.children.variable.changeValueAction(variableVal); + const changeValAction2 = this.changeChildAction("variable", variableVal) + this.dispatch(changeValAction2); + console.log("changed value: ", this.children.variable.toJsonValue()); return this.executeQuery(action); } if (action.type === CompActionTypes.CHANGE_VALUE) { @@ -430,24 +438,6 @@ QueryCompTmp = class extends QueryCompTmp { extra: this.children.extra.changeValueAction(result.extra ?? {}), isFetching: this.children.isFetching.changeValueAction(false), latestEndTime: this.children.latestEndTime.changeValueAction(Date.now()), - variable: this.children.variable.changeValueAction( - - Object.values(this.children?.variables?.children?.variables?.children || {}) - .filter( - (item: any) => - item?.children?.key?.children?.text?.unevaledValue !== "" && - item?.children?.value?.children?.text?.unevaledValue !== "" - ) - .reduce((acc: any, item: any) => { - const key = item?.children?.key?.children?.text?.unevaledValue; - const value = item?.children?.value?.children?.text?.unevaledValue; - if (key !== undefined && value !== undefined) { - acc[key] = value; - } - return acc; - }, {}) - ), - runTime: this.children.runTime.changeValueAction(result.runTime ?? 0), }); getPromiseAfterDispatch(this.dispatch, changeAction, { diff --git a/client/packages/lowcoder/src/comps/queries/queryComp/queryPropertyView.tsx b/client/packages/lowcoder/src/comps/queries/queryComp/queryPropertyView.tsx index d0cbab197..fa0f078e1 100644 --- a/client/packages/lowcoder/src/comps/queries/queryComp/queryPropertyView.tsx +++ b/client/packages/lowcoder/src/comps/queries/queryComp/queryPropertyView.tsx @@ -274,8 +274,6 @@ export const QueryGeneralPropertyView = (props: { return options; }, [editorState]); - console.log(children.variable) - return ( From 845f9c110f78bb06039028af9e79f683c6072166 Mon Sep 17 00:00:00 2001 From: Imiss-U1025 Date: Mon, 27 Jan 2025 12:08:19 -0500 Subject: [PATCH 5/8] key to label on event handler popup --- .../src/components/keyValueList.tsx | 3 +++ .../actionSelector/executeQueryAction.tsx | 25 ++++++++++++++--- .../src/comps/controls/keyValueControl.tsx | 27 ++++++++++++------- 3 files changed, 41 insertions(+), 14 deletions(-) diff --git a/client/packages/lowcoder-design/src/components/keyValueList.tsx b/client/packages/lowcoder-design/src/components/keyValueList.tsx index 7bd9f317a..fb075420f 100644 --- a/client/packages/lowcoder-design/src/components/keyValueList.tsx +++ b/client/packages/lowcoder-design/src/components/keyValueList.tsx @@ -76,6 +76,7 @@ export const KeyValueList = (props: { list: ReactNode[]; onAdd: () => void; onDelete: (item: ReactNode, index: number) => void; + isStatic?: boolean; }) => ( <> {props.list.map((item, index) => ( @@ -87,9 +88,11 @@ export const KeyValueList = (props: { /> ))} + {!props.isStatic && {trans("addItem")} + } ); diff --git a/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx b/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx index 718560217..7b6063de6 100644 --- a/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx +++ b/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx @@ -89,6 +89,24 @@ export class ExecuteQueryAction extends ExecuteQueryTmpAction { }); return options; }; + const getVariableOptions = (editorState?: EditorState) => { + const options = + editorState + ?.getQueriesComp() + .getView() + .filter( + // Filter out the current query under query + (option) => { + return option.children.name.getView() === this.children.queryName.getView(); + } + ) || []; + return this.children.query.propertyView({ + label: trans("eventHandler.queryParams"), + layout: "vertical", + isStatic: true, + keyFixed: true, + }); + } return ( <> @@ -107,10 +125,9 @@ export class ExecuteQueryAction extends ExecuteQueryTmpAction { - {this.children.query.propertyView({ - label: trans("eventHandler.queryParams"), - layout: "vertical", - })} + + {(editorState) => getVariableOptions(editorState)} + ); diff --git a/client/packages/lowcoder/src/comps/controls/keyValueControl.tsx b/client/packages/lowcoder/src/comps/controls/keyValueControl.tsx index 89cc6d276..1f4d722a2 100644 --- a/client/packages/lowcoder/src/comps/controls/keyValueControl.tsx +++ b/client/packages/lowcoder/src/comps/controls/keyValueControl.tsx @@ -47,6 +47,8 @@ export type KeyValueControlParams = ControlParams & { typeTooltip?: ReactNode; keyFlexBasics?: number; valueFlexBasics?: number; + isStatic?: boolean; + keyFixed?: boolean; }; /** @@ -82,16 +84,20 @@ function keyValueControl( return ( - {this.children.key.propertyView({ placeholder: "key", indentWithTab: false })} - {hasType && params.showType && ( - - {this.children.type.propertyView({ - placeholder: "key", - indentWithTab: false, - tooltip: params.typeTooltip, - })} - - )} + {params.keyFixed? + <>{this.children.key.getView()} + :<> + {this.children.key.propertyView({ placeholder: "key", indentWithTab: false })} + {hasType && params.showType && ( + + {this.children.type.propertyView({ + placeholder: "key", + indentWithTab: false, + tooltip: params.typeTooltip, + })} + + )} + } {this.children.value.propertyView({ @@ -136,6 +142,7 @@ export function keyValueListControl( list={this.getView().map((child) => child.propertyView(params))} onAdd={() => this.dispatch(this.pushAction({}))} onDelete={(item, index) => this.dispatch(this.deleteAction(index))} + isStatic={params.isStatic} /> ); From 5e1cf9e5746a2576ccbc0482273390020a45169f Mon Sep 17 00:00:00 2001 From: Imiss-U1025 Date: Tue, 28 Jan 2025 06:39:47 -0500 Subject: [PATCH 6/8] use overwritten variable in query request --- .../lowcoder/src/comps/queries/queryComp.tsx | 32 ++++++++++++------- .../src/comps/queries/queryCompUtils.tsx | 7 +++- 2 files changed, 27 insertions(+), 12 deletions(-) diff --git a/client/packages/lowcoder/src/comps/queries/queryComp.tsx b/client/packages/lowcoder/src/comps/queries/queryComp.tsx index 74f41b8fc..fbfabeaaa 100644 --- a/client/packages/lowcoder/src/comps/queries/queryComp.tsx +++ b/client/packages/lowcoder/src/comps/queries/queryComp.tsx @@ -67,7 +67,7 @@ import { JSONObject, JSONValue } from "../../util/jsonTypes"; import { BoolPureControl } from "../controls/boolControl"; import { millisecondsControl } from "../controls/millisecondControl"; import { paramsMillisecondsControl } from "../controls/paramsControl"; -import { NameConfig, withExposingConfigs } from "../generators/withExposing"; +import { DepsConfig, NameConfig, withExposingConfigs } from "../generators/withExposing"; import { HttpQuery } from "./httpQuery/httpQuery"; import { StreamQuery } from "./httpQuery/streamQuery"; import { QueryConfirmationModal } from "./queryComp/queryConfirmationModal"; @@ -135,7 +135,6 @@ const childrenMap = { data: stateComp(null), extra: stateComp({}), isFetching: stateComp(false), - variable: stateComp({}), lastQueryStartTime: stateComp(-1), // The last execution time of the query, in order to avoid multiple executions overwriting each other, not persistent latestEndTime: stateComp(0), // The time when the query was last executed runTime: stateComp(0), // query run time @@ -364,14 +363,8 @@ QueryCompTmp = class extends QueryCompTmp { } if (action.type === CompActionTypes.EXECUTE_QUERY) { if (getReduceContext().disableUpdateState) return this; - let variableVal = {}; - if(action.args) variableVal = action.args; - else variableVal = this.children.variables.children.variables.toJsonValue().reduce((acc, curr) => Object.assign(acc, {[curr.key as string]:curr.value}), {}); - //Update query.variable - const changeValAction = this.children.variable.changeValueAction(variableVal); - const changeValAction2 = this.changeChildAction("variable", variableVal) - this.dispatch(changeValAction2); - console.log("changed value: ", this.children.variable.toJsonValue()); + if(!action.args) action.args = this.children.variables.children.variables.toJsonValue().reduce((acc, curr) => Object.assign(acc, {[curr.key as string]:curr.value}), {}); + return this.executeQuery(action); } if (action.type === CompActionTypes.CHANGE_VALUE) { @@ -486,6 +479,7 @@ QueryCompTmp = class extends QueryCompTmp { applicationId: applicationId, applicationPath: parentApplicationPath, args: action.args, + variables: action.args, timeout: this.children.timeout, callback: (result) => this.processResult(result, action, startTime) }); @@ -669,7 +663,23 @@ export const QueryComp = withExposingConfigs(QueryCompTmp, [ new NameConfig("isFetching", trans("query.isFetchingExportDesc")), new NameConfig("runTime", trans("query.runTimeExportDesc")), new NameConfig("latestEndTime", trans("query.latestEndTimeExportDesc")), - new NameConfig("variable", trans("query.variables")), + new DepsConfig( + "variable", + (children: any) => { + return {data: children.variables.children.variables.node()}; + }, + (input) => { + if (!input.data) { + return undefined; + } + const newNode = Object.values(input.data) + .filter((kvNode: any) => kvNode.key.text.value) + .map((kvNode: any) => ({[kvNode.key.text.value]: kvNode.value.text.value})) + .reduce((prev, obj) => ({...prev, ...obj}), {}); + return newNode; + }, + trans("query.variables") + ), new NameConfig("triggerType", trans("query.triggerTypeExportDesc")), ]); diff --git a/client/packages/lowcoder/src/comps/queries/queryCompUtils.tsx b/client/packages/lowcoder/src/comps/queries/queryCompUtils.tsx index 1971e8ec5..1203e1cfd 100644 --- a/client/packages/lowcoder/src/comps/queries/queryCompUtils.tsx +++ b/client/packages/lowcoder/src/comps/queries/queryCompUtils.tsx @@ -25,18 +25,23 @@ export function toQueryView(params: FunctionProperty[]) { applicationId: string; applicationPath: string[]; args?: Record; + variables?: any; timeout: InstanceType; }): Promise => { const { applicationId, isViewMode } = getGlobalSettings(); + const mappedVariables = Object.keys(props.variables).map(key => ({key: `query1.variable.${key}`, value: props.variables[key]})); let request: QueryExecuteRequest = { path: props.applicationPath, params: [ - ...params.map(({ key, value }) => ({ key, value: value(props.args) })), + ...params.filter(param => { + return !mappedVariables.map(v => v.key).includes(param.key); + }).map(({ key, value }) => ({ key, value: value(props.args) })), ...Object.entries(props.timeout.getView()).map(([key, value]) => ({ key, value: value(props.args), })), + ...mappedVariables, ], viewMode: !!isViewMode, }; From 63faec27f37953ef9934abca5b078dded1f9ac1c Mon Sep 17 00:00:00 2001 From: RAHEEL Date: Wed, 29 Jan 2025 17:44:12 +0500 Subject: [PATCH 7/8] show query variables in event handlers popup --- .../actionSelector/executeQueryAction.tsx | 170 ++++++++++-------- .../comps/controls/eventHandlerControl.tsx | 6 + 2 files changed, 100 insertions(+), 76 deletions(-) diff --git a/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx b/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx index 7b6063de6..5c2148816 100644 --- a/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx +++ b/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx @@ -9,11 +9,98 @@ import { getPromiseAfterDispatch } from "util/promiseUtils"; import { trans } from "i18n"; import {keyValueListControl, keyValueListToSearchStr, withDefault} from "lowcoder-sdk"; import {KeyValue} from "@lowcoder-ee/types/common"; +import { useCallback, useContext, useEffect, useMemo } from "react"; +const ExecuteQueryPropertyView = ({ + comp, + placement, +}: { + comp: any, + placement?: "query" | "table" +}) => { + const getQueryOptions = useCallback((editorState?: EditorState) => { + const options: { label: string; value: string; variable?: Record }[] = + editorState + ?.queryCompInfoList() + .map((info) => { + return { + label: info.name, + value: info.name, + variable: info.data.variable, + } + }) + .filter( + // Filter out the current query under query + (option) => { + if ( + placement === "query" && + editorState.selectedBottomResType === BottomResTypeEnum.Query + ) { + return option.value !== editorState.selectedBottomResName; + } + return true; + } + ) || []; + + // input queries + editorState + ?.getModuleLayoutComp() + ?.getInputs() + .forEach((i) => { + const { name, type } = i.getView(); + if (type === InputTypeEnum.Query) { + options.push({ label: name, value: name }); + } + }); + return options; + }, [placement]); + + const getVariableOptions = useCallback((editorState?: EditorState) => { + return comp.children.queryVariables.propertyView({ + label: trans("eventHandler.queryParams"), + layout: "vertical", + isStatic: true, + keyFixed: true, + }); + }, [comp.children.queryVariables.getView()]) + + return ( + <> + + + {(editorState) => ( + <> + { + const options = getQueryOptions(editorState); + const selectedQuery = options.find(option => option.value === value); + const variables = selectedQuery ? Object.keys(selectedQuery.variable || {}) : []; + comp.dispatchChangeValueAction({ + queryName: value, + queryVariables: variables.map((variable) => ({key: variable, value: ''})), + }); + }} + /> + + )} + + + + + {(editorState) => getVariableOptions(editorState)} + + + + ); +} const ExecuteQueryTmpAction = (function () { const childrenMap = { queryName: SimpleNameComp, - query: withDefault(keyValueListControl(false, [], "string"), [{ key: "", value: "" }]) + queryVariables: withDefault(keyValueListControl(false, [], "string"), []) }; return new MultiCompBuilder(childrenMap, () => { return () => Promise.resolve(undefined as unknown); @@ -26,7 +113,7 @@ export class ExecuteQueryAction extends ExecuteQueryTmpAction { override getView() { const queryName = this.children.queryName.getView(); // const queryParams = keyValueListToSearchStr(Array.isArray(this?.children?.query) ? (this.children.query as unknown as any[]).map((i: any) => i.getView() as KeyValue) : []); - const result = Object.values(this.children.query.children as Record { - const options: { label: string; value: string }[] = - editorState - ?.queryCompInfoList() - .map((info) => ({ - label: info.name, - value: info.name, - })) - .filter( - // Filter out the current query under query - (option) => { - if ( - placement === "query" && - editorState.selectedBottomResType === BottomResTypeEnum.Query - ) { - return option.value !== editorState.selectedBottomResName; - } - return true; - } - ) || []; - - // input queries - editorState - ?.getModuleLayoutComp() - ?.getInputs() - .forEach((i) => { - const { name, type } = i.getView(); - if (type === InputTypeEnum.Query) { - options.push({ label: name, value: name }); - } - }); - return options; - }; - const getVariableOptions = (editorState?: EditorState) => { - const options = - editorState - ?.getQueriesComp() - .getView() - .filter( - // Filter out the current query under query - (option) => { - return option.children.name.getView() === this.children.queryName.getView(); - } - ) || []; - return this.children.query.propertyView({ - label: trans("eventHandler.queryParams"), - layout: "vertical", - isStatic: true, - keyFixed: true, - }); - } return ( - <> - - - {(editorState) => ( - <> - this.dispatchChangeValueAction({ queryName: value })} - /> - - )} - - - - - {(editorState) => getVariableOptions(editorState)} - - - - ); + + ) } } diff --git a/client/packages/lowcoder/src/comps/controls/eventHandlerControl.tsx b/client/packages/lowcoder/src/comps/controls/eventHandlerControl.tsx index 3a22afe71..70bf77962 100644 --- a/client/packages/lowcoder/src/comps/controls/eventHandlerControl.tsx +++ b/client/packages/lowcoder/src/comps/controls/eventHandlerControl.tsx @@ -167,12 +167,18 @@ const EventHandlerControlPropertyView = (props: { if (eventConfigs.length === 0) { return; } + + const queryVariables = editorState + ?.selectedOrFirstQueryComp() + ?.children.variables.children.variables.toJsonValue(); + const queryExecHandler = { compType: "executeQuery", comp: { queryName: editorState ?.selectedOrFirstQueryComp() ?.children.name.getView(), + queryVariables: queryVariables?.map((variable) => ({...variable, value: ''})), }, }; const messageHandler = { From e43aba83a19cb955f03ba2d022ef2b9e5d294bb9 Mon Sep 17 00:00:00 2001 From: Imiss-U1025 Date: Wed, 29 Jan 2025 09:31:54 -0500 Subject: [PATCH 8/8] Fix label and remove del button --- .../lowcoder-design/src/components/keyValueList.tsx | 10 ++++++---- .../controls/actionSelector/executeQueryAction.tsx | 2 +- client/packages/lowcoder/src/i18n/locales/en.ts | 1 + 3 files changed, 8 insertions(+), 5 deletions(-) diff --git a/client/packages/lowcoder-design/src/components/keyValueList.tsx b/client/packages/lowcoder-design/src/components/keyValueList.tsx index fb075420f..6cedce3c4 100644 --- a/client/packages/lowcoder-design/src/components/keyValueList.tsx +++ b/client/packages/lowcoder-design/src/components/keyValueList.tsx @@ -82,10 +82,12 @@ export const KeyValueList = (props: { {props.list.map((item, index) => ( {item} - props.list.length > 1 && props.onDelete(item, index)} - $forbidden={props.list.length === 1} - /> + {!props.isStatic && + props.list.length > 1 && props.onDelete(item, index)} + $forbidden={props.list.length === 1} + /> + } ))} {!props.isStatic && diff --git a/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx b/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx index 5c2148816..cc4018bd5 100644 --- a/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx +++ b/client/packages/lowcoder/src/comps/controls/actionSelector/executeQueryAction.tsx @@ -57,7 +57,7 @@ const ExecuteQueryPropertyView = ({ const getVariableOptions = useCallback((editorState?: EditorState) => { return comp.children.queryVariables.propertyView({ - label: trans("eventHandler.queryParams"), + label: trans("eventHandler.queryVariables"), layout: "vertical", isStatic: true, keyFixed: true, diff --git a/client/packages/lowcoder/src/i18n/locales/en.ts b/client/packages/lowcoder/src/i18n/locales/en.ts index c4c14c228..7623177c6 100644 --- a/client/packages/lowcoder/src/i18n/locales/en.ts +++ b/client/packages/lowcoder/src/i18n/locales/en.ts @@ -277,6 +277,7 @@ export const en = { "moduleEvent": "Module Event", "goToApp": "Go to an other App", "queryParams": "Query Parameters", + "queryVariables": "Query Variables", "hashParams": "Hash Parameters", "showNotification": "Show a Notification", "text": "Text",

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