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

Commit 1d86562

Browse files
committed
refactor navComp
1 parent 18fadd6 commit 1d86562

File tree

3 files changed

+79
-72
lines changed

3 files changed

+79
-72
lines changed
Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
import { BoolCodeControl, StringControl } from "comps/controls/codeControl";
2+
import { clickEvent, eventHandlerControl } from "comps/controls/eventHandlerControl";
3+
import { MultiCompBuilder } from "comps/generators/multi";
4+
import { dropdownControl } from "comps/controls/dropdownControl";
5+
import { mapOptionsControl } from "comps/controls/optionsControl";
6+
import { trans } from "i18n";
7+
import { navListComp } from "../navItemComp";
8+
import { controlItem } from "lowcoder-design";
9+
import { menuPropertyView } from "./MenuItemList";
10+
11+
export function createNavItemsControl() {
12+
const OptionTypes = [
13+
{ label: trans("prop.manual"), value: "manual" },
14+
{ label: trans("prop.map"), value: "map" },
15+
] as const;
16+
17+
const NavMapOption = new MultiCompBuilder(
18+
{
19+
label: StringControl,
20+
hidden: BoolCodeControl,
21+
disabled: BoolCodeControl,
22+
active: BoolCodeControl,
23+
onEvent: eventHandlerControl([clickEvent]),
24+
},
25+
(props) => props
26+
)
27+
.setPropertyViewFn((children) => (
28+
<>
29+
{children.label.propertyView({ label: trans("label"), placeholder: "{{item}}" })}
30+
{children.active.propertyView({ label: trans("navItemComp.active") })}
31+
{children.hidden.propertyView({ label: trans("hidden") })}
32+
{children.disabled.propertyView({ label: trans("disabled") })}
33+
{children.onEvent.getPropertyView()}
34+
</>
35+
))
36+
.build();
37+
38+
const TmpNavItemsControl = new MultiCompBuilder(
39+
{
40+
optionType: dropdownControl(OptionTypes, "manual"),
41+
manual: navListComp(),
42+
mapData: mapOptionsControl(NavMapOption),
43+
},
44+
(props) => {
45+
return props.optionType === "manual" ? props.manual : props.mapData;
46+
}
47+
)
48+
.setPropertyViewFn(() => {
49+
throw new Error("Method not implemented.");
50+
})
51+
.build();
52+
53+
return class NavItemsControl extends TmpNavItemsControl {
54+
exposingNode() {
55+
return this.children.optionType.getView() === "manual"
56+
? (this.children.manual as any).exposingNode()
57+
: (this.children.mapData as any).exposingNode();
58+
}
59+
60+
propertyView() {
61+
const isManual = this.children.optionType.getView() === "manual";
62+
const content = isManual
63+
? menuPropertyView(this.children.manual as any)
64+
: this.children.mapData.getPropertyView();
65+
66+
return controlItem(
67+
{ searchChild: true },
68+
<>
69+
{this.children.optionType.propertyView({ radioButton: true, type: "oneline" })}
70+
{content}
71+
</>
72+
);
73+
}
74+
};
75+
}
76+
77+

‎client/packages/lowcoder/src/comps/comps/navComp/navComp.tsx‎

Lines changed: 1 addition & 71 deletions
Original file line numberDiff line numberDiff line change
@@ -23,9 +23,8 @@ import { trans } from "i18n";
2323

2424
import { useContext } from "react";
2525
import { EditorContext } from "comps/editorState";
26-
import { dropdownControl } from "comps/controls/dropdownControl";
2726
import { controlItem } from "lowcoder-design";
28-
import { mapOptionsControl } from "comps/controls/optionsControl";
27+
import { createNavItemsControl } from "./components/NavItemsControl";
2928

3029
type IProps = {
3130
$justify: boolean;
@@ -329,72 +328,3 @@ export const NavComp = withExposingConfigs(NavCompBase, [
329328
NameConfigHidden,
330329
new NameConfig("items", trans("navigation.itemsDesc")),
331330
]);
332-
333-
// ----------------------------------------
334-
// Nav Items Control (Manual / Map modes)
335-
// ----------------------------------------
336-
function createNavItemsControl() {
337-
const OptionTypes = [
338-
{ label: trans("prop.manual"), value: "manual" },
339-
{ label: trans("prop.map"), value: "map" },
340-
] as const;
341-
342-
const NavMapOption = new MultiCompBuilder(
343-
{
344-
label: StringControl,
345-
hidden: BoolCodeControl,
346-
disabled: BoolCodeControl,
347-
active: BoolCodeControl,
348-
onEvent: eventHandlerControl([clickEvent]),
349-
},
350-
(props) => props
351-
)
352-
.setPropertyViewFn((children) => (
353-
<>
354-
{children.label.propertyView({ label: trans("label"), placeholder: "{{item}}" })}
355-
{children.active.propertyView({ label: trans("navItemComp.active") })}
356-
{children.hidden.propertyView({ label: trans("hidden") })}
357-
{children.disabled.propertyView({ label: trans("disabled") })}
358-
{children.onEvent.getPropertyView()}
359-
</>
360-
))
361-
.build();
362-
363-
const TmpNavItemsControl = new MultiCompBuilder(
364-
{
365-
optionType: dropdownControl(OptionTypes, "manual"),
366-
manual: navListComp(),
367-
mapData: mapOptionsControl(NavMapOption),
368-
},
369-
(props) => {
370-
return props.optionType === "manual" ? props.manual : props.mapData;
371-
}
372-
)
373-
.setPropertyViewFn(() => {
374-
throw new Error("Method not implemented.");
375-
})
376-
.build();
377-
378-
return class NavItemsControl extends TmpNavItemsControl {
379-
exposingNode() {
380-
return this.children.optionType.getView() === "manual"
381-
? (this.children.manual as any).exposingNode()
382-
: (this.children.mapData as any).exposingNode();
383-
}
384-
385-
propertyView() {
386-
const isManual = this.children.optionType.getView() === "manual";
387-
const content = isManual
388-
? menuPropertyView(this.children.manual as any)
389-
: this.children.mapData.getPropertyView();
390-
391-
return controlItem(
392-
{ searchChild: true },
393-
<>
394-
{this.children.optionType.propertyView({ radioButton: true, type: "oneline" })}
395-
{content}
396-
</>
397-
);
398-
}
399-
};
400-
}

‎client/packages/lowcoder/src/comps/comps/navComp/navItemComp.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,9 +45,9 @@ export class NavItemComp extends MultiBaseComp<ChildrenType> {
4545
return (
4646
<>
4747
{this.children.label.propertyView({ label: trans("label") })}
48-
{disabledPropertyView(this.children)}
4948
{hiddenPropertyView(this.children)}
5049
{this.children.active.propertyView({ label: trans("navItemComp.active") })}
50+
{disabledPropertyView(this.children)}
5151
{this.children.onEvent.propertyView({ inline: true })}
5252
</>
5353
);

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /