Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Feat/layout mode complete#553

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to ourterms of service andprivacy statement. We’ll occasionally send you account related emails.

Already on GitHub?Sign in to your account

Merged
FalkWolsky merged 4 commits intodevfromfeat/Layout-Mode
Dec 3, 2023
Merged
Show file tree
Hide file tree
Changes fromall commits
Commits
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -11,6 +11,8 @@ import { trans } from "i18n";
import { ModuleEventListItemComp } from "./moduleEventListItemComp";
import { ConfigViewSection } from "./styled";
import { messageInstance } from "lowcoder-design";
import { DocLink } from "lowcoder-design";
import { markdownCompCss, TacoMarkDown } from "lowcoder-design";

const ModuleEventListComp = list(ModuleEventListItemComp);

Expand DownExpand Up@@ -73,6 +75,9 @@ export class ModuleEventComp extends simpleMultiComp({
onDelete={(i) => this.handleDelete(i)}
items={children}
/>
<><br/><TacoMarkDown>{trans("module.documentationText")}</TacoMarkDown><br/><DocLink style={{ marginTop: 8 }} href={trans("docUrls.module")} title={trans("module.documentationText")}>
{trans("module.docLink")}
</DocLink></>
</ConfigViewSection>
);
}
Expand Down
56 changes: 40 additions & 16 deletionsclient/packages/lowcoder/src/comps/comps/treeComp/treeComp.tsx
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -16,16 +16,23 @@ import {
advancedSection,
expandSection,
formSection,
intersectSection,
//intersectSection,
treeCommonChildren,
treeDataPropertyView,
TreeNameConfigs,
useTree,
valuePropertyView,
} from "./treeUtils";
import {
SelectInputInvalidConfig,
SelectInputValidationChildren,
SelectInputValidationSection,
} from "../selectInputComp/selectInputConstants";
import { selectInputValidate } from "../selectInputComp/selectInputConstants";
import { SelectEventHandlerControl } from "comps/controls/eventHandlerControl";
import { trans } from "i18n";
import { useContext } from "react";
import { EditorContext } from "comps/editorState";

type TreeStyleType = StyleConfigType<typeof TreeStyle>;

Expand DownExpand Up@@ -140,23 +147,40 @@ let TreeBasicComp = (function () {
<>
<Section name={sectionNames.basic}>
{treeDataPropertyView(children)}
{children.selectType.propertyView({ label: trans("tree.selectType") })}
{children.selectType.getView() !== "none" && valuePropertyView(children)}
{children.selectType.getView() === "check" &&
children.checkStrictly.propertyView({
label: trans("tree.checkStrictly"),
tooltip: trans("tree.checkStrictlyTooltip"),
})}
</Section>
{formSection(children)}
{children.label.getPropertyView()}
{expandSection(
children,
children.autoExpandParent.propertyView({ label: trans("tree.autoExpandParent") })

{["logic", "both"].includes(useContext(EditorContext).editorModeStatus) && (
<><SelectInputValidationSection {...children} />
{formSection(children)}
<Section name={sectionNames.interaction}>
{children.onEvent.getPropertyView()}
{children.hidden.propertyView({ label: trans("prop.hide") })}
{children.disabled.propertyView({ label: trans("prop.disabled") })}
{children.selectType.propertyView({ label: trans("tree.selectType") })}
{children.selectType.getView() !== "none" && valuePropertyView(children)}
{children.selectType.getView() === "check" &&
children.checkStrictly.propertyView({
label: trans("tree.checkStrictly"),
tooltip: trans("tree.checkStrictlyTooltip"),
})}
</Section>
</>
)}

{["layout", "both"].includes(useContext(EditorContext).editorModeStatus) && (
<Section name={sectionNames.layout}>
{children.expanded.propertyView({ label: trans("tree.expanded") })}
{children.defaultExpandAll.propertyView({ label: trans("tree.defaultExpandAll") })}
{children.showLine.propertyView({ label: trans("tree.showLine") })}
{children.showLine.getView() && children.showLeafIcon.propertyView({ label: trans("tree.showLeafIcon") })}
</Section>
)}

{["layout", "both"].includes(useContext(EditorContext).editorModeStatus) && ( children.label.getPropertyView() )}

{["layout", "both"].includes(useContext(EditorContext).editorModeStatus) && (
<Section name={sectionNames.style}>{children.style.getPropertyView()}</Section>
)}
{intersectSection(children, children.onEvent.getPropertyView())}
{advancedSection(children)}
<Section name={sectionNames.style}>{children.style.getPropertyView()}</Section>
</>
))
.build();
Expand Down
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -13,19 +13,19 @@ import {
advancedSection,
expandSection,
formSection,
intersectSection,
treeCommonChildren,
treeDataPropertyView,
TreeNameConfigs,
useTree,
valuePropertyView,
} from "./treeUtils";
import { baseSelectRefMethods, getStyle } from "../selectInputComp/selectCompConstants";
import { useSelectInputValidate } from "../selectInputComp/selectInputConstants";
import { useSelectInputValidate, SelectInputValidationSection } from "../selectInputComp/selectInputConstants";
import { StringControl } from "comps/controls/codeControl";
import { SelectEventHandlerControl } from "comps/controls/eventHandlerControl";
import { selectInputValidate } from "../selectInputComp/selectInputConstants";
import { BoolControl } from "comps/controls/boolControl";
import { stateComp } from "comps/generators/simpleGenerators";
import { stateComp, withDefault } from "comps/generators/simpleGenerators";
import { trans } from "i18n";
import {
allowClearPropertyView,
Expand All@@ -34,6 +34,8 @@ import {
} from "comps/utils/propertyUtils";
import { BaseSelectRef } from "rc-select";
import { RefControl } from "comps/controls/refControl";
import { useContext } from "react";
import { EditorContext } from "comps/editorState";

const StyledTreeSelect = styled(TreeSelect)<{ $style: TreeSelectStyleType }>`
width: 100%;
Expand All@@ -57,7 +59,7 @@ const childrenMap = {
selectType: dropdownControl(selectTypeOptions, "single"),
checkedStrategy: dropdownControl(checkedStrategyOptions, "parent"),
label: LabelControl,
placeholder: StringControl,
placeholder:withDefault(StringControl, trans("tree.placeholder")),
// TODO: more event
onEvent: SelectEventHandlerControl,
allowClear: BoolControl,
Expand DownExpand Up@@ -144,21 +146,43 @@ let TreeBasicComp = (function () {
<>
<Section name={sectionNames.basic}>
{treeDataPropertyView(children)}
{children.selectType.propertyView({ label: trans("tree.selectType") })}
{valuePropertyView(children)}
{children.selectType.getView() === "check" &&
children.checkedStrategy.propertyView({ label: trans("tree.checkedStrategy") })}
{placeholderPropertyView(children)}
</Section>
{formSection(children)}
{children.label.getPropertyView()}
{expandSection(children)}
{intersectSection(children, children.onEvent.getPropertyView())}
{advancedSection(children, [
allowClearPropertyView(children),
showSearchPropertyView(children),
])}
<Section name={sectionNames.style}>{children.style.getPropertyView()}</Section>

{["logic", "both"].includes(useContext(EditorContext).editorModeStatus) && (
<><SelectInputValidationSection {...children} />
{formSection(children)}
<Section name={sectionNames.interaction}>
{children.onEvent.getPropertyView()}
{children.hidden.propertyView({ label: trans("prop.hide") })}
{children.disabled.propertyView({ label: trans("prop.disabled") })}
{children.selectType.propertyView({ label: trans("tree.selectType") })}
{valuePropertyView(children)}
{children.selectType.getView() === "check" &&
children.checkedStrategy.propertyView({ label: trans("tree.checkedStrategy") })}
{allowClearPropertyView(children)}
{showSearchPropertyView(children)}
</Section>
</>
)}

{["layout", "both"].includes(useContext(EditorContext).editorModeStatus) && (
<Section name={sectionNames.layout}>
{children.expanded.propertyView({ label: trans("tree.expanded") })}
{children.defaultExpandAll.propertyView({ label: trans("tree.defaultExpandAll") })}
{children.showLine.propertyView({ label: trans("tree.showLine") })}
{children.showLine.getView() && children.showLeafIcon.propertyView({ label: trans("tree.showLeafIcon") })}
</Section>
)}

{["layout", "both"].includes(useContext(EditorContext).editorModeStatus) && ( children.label.getPropertyView() )}

{["layout", "both"].includes(useContext(EditorContext).editorModeStatus) && (
<Section name={sectionNames.style}>{children.style.getPropertyView()}</Section>
)}



</>
))
.setExposeMethodConfigs(baseSelectRefMethods)
Expand Down
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -107,23 +107,23 @@ export const expandSection = (children: TreeCommonComp, other?: ControlNode) =>
</Section>
);

export const intersectSection = (children: TreeCommonComp, onEvent?: ControlNode) => (
{/*export const intersectSection = (children: TreeCommonComp, onEvent?: ControlNode) => (
<Section name={sectionNames.interaction}>
{onEvent}
{disabledPropertyView(children)}
{disabledPropertyView(children)}
</Section>
);
);*/}

export const advancedSection = (children: TreeCommonComp, other?: ControlNode) => (
<>
<Section name={sectionNames.advanced}>
{/*<Section name={sectionNames.advanced}>
{children.showLine.propertyView({ label: trans("tree.showLine") })}
{children.showLine.getView() &&
children.showLeafIcon.propertyView({ label: trans("tree.showLeafIcon") })}
{other}
</Section>
<SelectInputValidationSection {...children} />
<Section name={sectionNames.layout}>{hiddenPropertyView(children)}</Section>
<Section name={sectionNames.layout}>{hiddenPropertyView(children)}</Section> */}
</>
);

Expand Down
4 changes: 2 additions & 2 deletionsclient/packages/lowcoder/src/comps/index.tsx
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -1000,7 +1000,7 @@ const uiCompMap: Registry = {
name: trans("uiComp.treeCompName"),
enName: "Tree",
description: trans("uiComp.treeCompDesc"),
categories: ["layout", "itemHandling"],
categories: ["layout", "itemHandling", "documents"],
icon: TreeIcon,
keywords: trans("uiComp.treeCompKeywords"),
comp: TreeComp,
Expand All@@ -1013,7 +1013,7 @@ const uiCompMap: Registry = {
name: trans("uiComp.treeSelectCompName"),
enName: "Tree Select",
description: trans("uiComp.treeSelectCompDesc"),
categories: ["layout", "itemHandling"],
categories: ["layout", "itemHandling", "documents"],
icon: TreeSelectIcon,
keywords: trans("uiComp.treeSelectCompKeywords"),
comp: TreeSelectComp,
Expand Down
94 changes: 49 additions & 45 deletionsclient/packages/lowcoder/src/i18n/locales/en.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -974,6 +974,7 @@ export const en = {
"code": "Code of your Custom Component",
},
"tree": {
"placeholder": "Please Select",
"selectType": "Select Type",
"noSelect": "No Select",
"singleSelect": "Single Select",
Expand DownExpand Up@@ -1893,6 +1894,8 @@ export const en = {
},
"module": {
"emptyText": "No Data",
"docLink": "Read More About Modules...",
"documentationText" : "Lowcoder Modules are complete Applications, that can get included and repeated in other Lowcoder Applications and it functions just like a single component. As modules can get embedded, they need to be able to interact with your outside apps or websites. This four settings help to support communication with a Module.",
"circularReference": "Circular Reference, Current Module/Application Cannot Be Used!",
"emptyTestInput": "The Current Module Has No Input to Test",
"emptyTestMethod": "The Current Module Has No Method to Test",
Expand DownExpand Up@@ -2294,49 +2297,6 @@ export const en = {
"alignment": "Alignment",
"showBorder": "Show Border"
},
docUrls: {
docHome: "https://docs.lowcoder.cloud/",
components: "https://app.lowcoder.cloud/components/{compType}",
module: "https://docs.lowcoder.cloud/lowcoder-documentation/build-applications/create-a-new-app/modules",
optionList: "",
terms: "https://lowcoder.cloud/terms",
privacy: "https://lowcoder.cloud/privacy",
aboutUs: "https://lowcoder.cloud/about",
changeLog: "https://github.com/lowcoder-org/lowcoder/releases",
introVideo: "",
devNpmPlugin: "https://docs.lowcoder.cloud/lowcoder-extension/develop-data-source-plugins",
devNpmPluginText: "How to develop npm plugin",
useHost: "https://docs.lowcoder.cloud/setup-and-run/self-hosting/access-local-database-or-api",
eventHandlerSlowdown: "https://docs.lowcoder.cloud/build-applications/app-interaction/event-handlers",
thirdLib: "https://docs.lowcoder.cloud/lowcoder-extension/use-third-party-libraries-in-apps",
thirdLibUrlText: "Use third-party libraries",
},
datasourceTutorial: {
mysql: "",
mongodb: "",
postgres: "",
redis: "",
es: "",
smtp: "",
clickHouse: "",
},
queryTutorial: {
js: "",
transformer: "https://docs.lowcoder.cloud/business-logic-in-apps/write-javascript/transformers",
tempState: "https://docs.lowcoder.cloud/business-logic-in-apps/write-javascript/temporary-state",
dataResponder: "https://docs.lowcoder.cloud/lowcoder-documentation/business-logic-in-apps/write-javascript/data-responder",
},
customComponent: {
entryUrl: "https://sdk.lowcoder.cloud/custom_component.html",
},
template: {
cloneUrl: "/apps/template-import/",
},
lowcoderUrl: {
createIssue: "https://github.com/lowcoder-org/lowcoder/issues",
discord: "https://discord.com/invite/qMG9uTmAx2",
},


// twenty-first part

Expand DownExpand Up@@ -2560,7 +2520,7 @@ export const en = {
"playground": {
"url": "https://app.lowcoder.cloud/playground/{compType}/1",
"data": "Current Data State",
"preview": "Preview",
"preview": "Preview (please mind, that your Editor-Layout/Logic Mode is active here too. You can set it to 'Both' in the App Editor to see all properties here too)",
"property": "Properties",
"console": "Visual Script Console",
"executeMethods": "Execute Methods",
Expand DownExpand Up@@ -2740,7 +2700,51 @@ export const en = {
"widthTooltip": "Pixel or Percentage, e.g. 520, 60%",
"navStyle": "Menu Style",
"navItemStyle": "Menu Item Style"
}
},

docUrls: {
docHome: "https://docs.lowcoder.cloud/",
components: "https://app.lowcoder.cloud/components/{compType}",
module: "https://docs.lowcoder.cloud/lowcoder-documentation/build-applications/create-a-new-app/modules",
optionList: "",
terms: "https://lowcoder.cloud/terms",
privacy: "https://lowcoder.cloud/privacy",
aboutUs: "https://lowcoder.cloud/about",
changeLog: "https://github.com/lowcoder-org/lowcoder/releases",
introVideo: "",
devNpmPlugin: "https://docs.lowcoder.cloud/lowcoder-extension/develop-data-source-plugins",
devNpmPluginText: "How to develop npm plugin",
useHost: "https://docs.lowcoder.cloud/setup-and-run/self-hosting/access-local-database-or-api",
eventHandlerSlowdown: "https://docs.lowcoder.cloud/build-applications/app-interaction/event-handlers",
thirdLib: "https://docs.lowcoder.cloud/lowcoder-extension/use-third-party-libraries-in-apps",
thirdLibUrlText: "Use third-party libraries",
},
datasourceTutorial: {
mysql: "",
mongodb: "",
postgres: "",
redis: "",
es: "",
smtp: "",
clickHouse: "",
},
queryTutorial: {
js: "",
transformer: "https://docs.lowcoder.cloud/business-logic-in-apps/write-javascript/transformers",
tempState: "https://docs.lowcoder.cloud/business-logic-in-apps/write-javascript/temporary-state",
dataResponder: "https://docs.lowcoder.cloud/lowcoder-documentation/business-logic-in-apps/write-javascript/data-responder",
},
customComponent: {
entryUrl: "https://sdk.lowcoder.cloud/custom_component.html",
},
template: {
cloneUrl: "/apps/template-import/",
},
lowcoderUrl: {
createIssue: "https://github.com/lowcoder-org/lowcoder/issues",
discord: "https://discord.com/invite/qMG9uTmAx2",
},

};

// const jsonString = JSON.stringify(en, null, 2);
Expand Down
2 changes: 1 addition & 1 deletionclient/packages/lowcoder/src/i18n/locales/index.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
// file examples: en, enGB, zh, zhHK
// fallback example: current locale is zh-HK, fallback order is zhHK => zh => en
export * from "./en";
export * from "./de";
//export * from "./de"; Not ready yet
export * from "./it";
export * from "@lowcoder-ee/i18n/locales/zh";

Expand Down
[8]ページ先頭
©2009-2025 Movatter.jp