Skip to content

Commit 46796e5

Browse files
author
FalkWolsky
committed
Fixed Tutorial bug
1 parent b970f6a commit 46796e5

File tree

4 files changed

+17
-21
lines changed

4 files changed

+17
-21
lines changed

‎client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,7 @@ export const en = {
6262
selectDesc: "Triggered when the user selects part of the data in the chart",
6363
unselectDesc: "Triggered when the user unselects part of the data in the chart",
6464
selectedPointsDesc: "Selected points",
65-
dataDesc: "The raw data used in the current chart",
65+
dataDesc: "The JSON data for the chart",
6666
titleDesc: "Current chart title",
6767
scatterShape: "Scatter shape",
6868
circle: "Circle",

‎client/packages/lowcoder/src/i18n/locales/en.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1279,7 +1279,7 @@ export const en = {
12791279
"displayDataDesc": "Data Displayed in the Current Table",
12801280
"selectedIndexDesc": "Selected Index in Display Data",
12811281
"filterDesc": "Table Filtering Parameters",
1282-
"dataDesc": "The Raw Data Used in the Current Table",
1282+
"dataDesc": "The JSON Data for the Table",
12831283
"saveChanges": "Save Changes",
12841284
"cancelChanges": "Cancel Changes",
12851285
"rowSelectChange": "Row Select Change",
@@ -2147,11 +2147,11 @@ export const en = {
21472147
},
21482148
"editorTutorials": {
21492149
"component": "Component",
2150-
"componentContent": "The Right Component Area Has Tables, Buttons, Input Boxes, Selectors, and Other Components That Can Be Dragged onto the Canvas for Use.",
2150+
"componentContent": "The Right Component Panel offers you many ready made Application Blocks (Components). These Can Be Dragged onto the Canvas for Use. You Can Also Create Your Own Components with a little coding knowledge.",
21512151
"canvas": "Canvas",
2152-
"canvasContent": "What You See on the Canvas is What You Get, and You Can Adjust Component Layout and Size by Dragging and Dropping, and Delete/Copy/Paste Components with Keyboard Shortcuts.",
2152+
"canvasContent": "Build your apps on the Canvas with a 'What You See Is What You Get' approach. Simply drag and drop components to design your layout, and use keyboard shortcuts for quick editing like delete, copy, and paste. Once a component is selected, you can fine-tune every detail—from styling and layout to data binding and logical behavior. Plus, enjoy the added benefit of responsive design, ensuring your apps look great on any device.",
21532153
"queryData": "Query Data",
2154-
"queryDataContent": "Create a New Query Here and Connect to Your MySQL, MongoDB, Redis, Airtable, and Other Data Sources. After Configuring the Query, Click 'Run' to Obtain the Data.",
2154+
"queryDataContent": "You can create Data Queries Here and Connect to Your MySQL, MongoDB, Redis, Airtable, and many Other Data Sources. After Configuring the Query, Click 'Run' to Obtain the Data and continue the Tutorial.",
21552155
"compProperties": "Component Properties"
21562156
},
21572157
"homeTutorials": {

‎client/packages/lowcoder/src/i18n/locales/enObj.tsx

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -115,16 +115,14 @@ export const enObj: I18nObjects = {
115115
mockDataUrl: "https://6523073ef43b179384152c4f.mockapi.io/api/lowcoder/users",
116116
data: (code) => (
117117
<>
118-
The component and query data are listed here, which can be referenced through
119-
{code("{{ }}")}. For example: {code("{{table1.selectedRow}}")}.
118+
The current State of the Component with all Settings and Data listed here. You can reference to this data with the handlebar expression.
119+
For example: {code("{{table1.selectedRow}}")}.
120120
</>
121121
),
122122
compProperties: (code) => (
123123
<>
124-
When the component is selected, its properties are displayed on the right
125-
{code("{{query1.data}}")}. Reference the data just queried, you can use in the input box
126-
{code("{{ }}")}
127-
write JavaScript.
124+
When the component is selected, its properties are displayed on the right. Now you can set a Data Binding. Please delete all static Data and enter the following handlebar expression:
125+
{code("{{query1.data}}")}. With this, you bind the data of the query to the table. The table will automatically display the data returned by the query. If the query updates the data, the table will also update the data automatically.
128126
</>
129127
),
130128
},

‎client/packages/lowcoder/src/pages/tutorials/editorTutorials.tsx

Lines changed: 8 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ const tourSteps: Step[] = [
4242
placement: "left",
4343
styles: {
4444
options: {
45-
width: 408,
45+
width: 500,
4646
},
4747
},
4848
target: `.${tableDragClassName}`,
@@ -55,7 +55,7 @@ const tourSteps: Step[] = [
5555
spotlightClicks: true,
5656
styles: {
5757
options: {
58-
width: 480,
58+
width: 600,
5959
},
6060
},
6161
target: `.${editorContentClassName}`,
@@ -68,7 +68,7 @@ const tourSteps: Step[] = [
6868
spotlightClicks: true,
6969
styles: {
7070
options: {
71-
width: 480,
71+
width: 500,
7272
},
7373
},
7474
target: `.${editorBottomClassName}`,
@@ -84,7 +84,7 @@ const tourSteps: Step[] = [
8484
spotlightPadding: 8,
8585
styles: {
8686
options: {
87-
width: 408,
87+
width: 500,
8888
},
8989
},
9090
target: `.${tableDataDivClassName}`,
@@ -103,7 +103,7 @@ const tourSteps: Step[] = [
103103
spotlightClicks: true,
104104
styles: {
105105
options: {
106-
width: 408,
106+
width: 500,
107107
},
108108
},
109109
target: `.${leftCompListClassName}`,
@@ -134,8 +134,8 @@ function addTable(editorState: EditorState) {
134134
{
135135
[key]: {
136136
i: key,
137-
x: 0,
138-
y: 0,
137+
x: 6,
138+
y: 25,
139139
...defaultLayout(compType),
140140
},
141141
},
@@ -237,6 +237,7 @@ export default function EditorTutorials() {
237237
const { status, index, action, type } = data;
238238
const finishedStatuses: string[] = [STATUS.FINISHED, STATUS.SKIPPED];
239239
const nextIndex = index + (action === ACTIONS.PREV ? -1 : 1);
240+
240241
if (finishedStatuses.includes(status)) {
241242
dispatch(markUserStatus("newUserGuidance", true));
242243
history.replace({
@@ -265,9 +266,6 @@ export default function EditorTutorials() {
265266
} else if (index === 2 && action === ACTIONS.NEXT) {
266267
// change data
267268
openTableData();
268-
const tableComp = editorState.getUICompByName("table1");
269-
tableComp &&
270-
tableComp.children.comp.children.data.dispatchChangeValueAction("{{query1.data}}");
271269
setStepIndex(nextIndex);
272270
} else if (index === 1 && action === ACTIONS.PREV) {
273271
// cancel select

0 commit comments

Comments
 (0)