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

Commitf65005a

Browse files
added trigger mode option in dropdown comp
1 parent902fe26 commitf65005a

File tree

4 files changed

+23
-11
lines changed

4 files changed

+23
-11
lines changed

‎client/packages/lowcoder/src/comps/comps/buttonComp/buttonCompConstants.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,12 +11,12 @@ export function getButtonStyle(buttonStyle: ButtonStyleType) {
1111
consthoverColor=buttonStyle.background&&genHoverColor(buttonStyle.background);
1212
constactiveColor=buttonStyle.background&&genActiveColor(buttonStyle.background);
1313
returncss`
14-
&&& {
14+
& {
1515
border-radius:${buttonStyle.radius};
1616
border-width:${buttonStyle.borderWidth};
1717
margin:${buttonStyle.margin};
1818
padding:${buttonStyle.padding};
19-
rotate:${buttonStyle.rotation&&buttonStyle.rotation};
19+
rotate:${buttonStyle.rotation};
2020
&:not(:disabled) {
2121
--antd-wave-shadow-color:${buttonStyle.border};
2222
border-color:${buttonStyle.border};

‎client/packages/lowcoder/src/comps/comps/buttonComp/dropdownComp.tsx

Lines changed: 18 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -22,18 +22,18 @@ import {
2222
getButtonStyle,
2323
}from"./buttonCompConstants";
2424
import{styleControl}from"@lowcoder-ee/comps/controls/styleControl";
25+
import{dropdownControl}from"@lowcoder-ee/comps/controls/dropdownControl";
2526

2627
constStyledDropdownButton=styled(DropdownButton)`
2728
width: 100%;
2829
2930
.ant-btn-group {
3031
width: 100%;
31-
3232
}
3333
`;
3434

3535
constLeftButtonWrapper=styled.div<{$buttonStyle:DropdownStyleType}>`
36-
width: calc(100%);
36+
flex: 1;
3737
${(props)=>`margin:${props.$buttonStyle.margin};`}
3838
margin-right: 0;
3939
.ant-btn span {
@@ -42,12 +42,11 @@ const LeftButtonWrapper = styled.div<{ $buttonStyle: DropdownStyleType }>`
4242
}
4343
4444
.ant-btn {
45-
${(props)=>getButtonStyle(props.$buttonStyle)}
45+
${(props)=>getButtonStyle(props.$buttonStyleasany)}
4646
margin: 0 !important;
4747
height: 100%;
4848
&.ant-btn-default {
4949
margin: 0 !important;
50-
5150
${(props)=>`border-radius:${props.$buttonStyle.radius} 0 0${props.$buttonStyle.radius};`}
5251
${(props)=>`text-transform:${props.$buttonStyle.textTransform};`}
5352
${(props)=>`font-weight:${props.$buttonStyle.textWeight};`}
@@ -65,11 +64,11 @@ const LeftButtonWrapper = styled.div<{ $buttonStyle: DropdownStyleType }>`
6564
`;
6665

6766
constRightButtonWrapper=styled.div<{$buttonStyle:DropdownStyleType}>`
68-
//width: 32px;
67+
width: 32px;
6968
${(props)=>`margin:${props.$buttonStyle.margin};`}
7069
margin-left: -1px;
7170
.ant-btn {
72-
${(props)=>getButtonStyle(props.$buttonStyle)}
71+
${(props)=>getButtonStyle(props.$buttonStyleasany)}
7372
margin: 0 !important;
7473
height: 100%;
7574
&.ant-btn-default {
@@ -80,10 +79,16 @@ const RightButtonWrapper = styled.div<{ $buttonStyle: DropdownStyleType }>`
8079
}
8180
`;
8281

82+
consttriggerOptions=[
83+
{label:"Hover",value:"hover"},
84+
{label:"Click",value:"click"},
85+
]asconst;
86+
8387
constDropdownTmpComp=(function(){
8488
constchildrenMap={
8589
text:withDefault(StringControl,trans("menu")),
8690
onlyMenu:BoolControl,
91+
triggerMode:dropdownControl(triggerOptions,"hover"),
8792
options:DropdownOptionControl,
8893
disabled:BoolCodeControl,
8994
onEvent:ButtonEventHandlerControl,
@@ -121,15 +126,17 @@ const DropdownTmpComp = (function () {
121126
<Dropdown
122127
disabled={props.disabled}
123128
dropdownRender={()=>menu}
129+
trigger={[props.triggerMode]}
124130
>
125-
<Button100$buttonStyle={props.style}disabled={props.disabled}>
131+
<Button100$buttonStyle={props.styleasany}disabled={props.disabled}>
126132
{props.text||" "/* Avoid button disappearing */}
127133
</Button100>
128134
</Dropdown>
129135
) :(
130136
<StyledDropdownButton
131137
disabled={props.disabled}
132138
dropdownRender={()=>menu}
139+
trigger={[props.triggerMode]}
133140
onClick={()=>props.onEvent("click")}
134141
buttonsRender={([left,right])=>[
135142
<LeftButtonWrapper$buttonStyle={props.style}>
@@ -170,6 +177,10 @@ const DropdownTmpComp = (function () {
170177
<>
171178
<Sectionname={sectionNames.layout}>
172179
{children.text.propertyView({label:trans("label")})}
180+
{children.triggerMode.propertyView({
181+
label:trans("dropdown.triggerMode"),
182+
radioButton:true,
183+
})}
173184
{children.onlyMenu.propertyView({label:trans("dropdown.onlyMenu")})}
174185
</Section>
175186
<Sectionname={sectionNames.style}>{children.style.getPropertyView()}</Section>

‎client/packages/lowcoder/src/comps/controls/styleControlConstants.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -965,7 +965,7 @@ export const ButtonStyle = [
965965
]asconst;
966966

967967
exportconstDropdownStyle=[
968-
getBackground('primary'),
968+
getBackground(),
969969
...STYLING_FIELDS_SEQUENCE.filter(style=>style.name!=='rotation'),
970970
]asconst;
971971

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

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1927,7 +1927,8 @@ export const en = {
19271927
},
19281928
"dropdown":{
19291929
"onlyMenu":"Display with Label Only",
1930-
"textDesc":"Text Currently Displayed on Button"
1930+
"textDesc":"Text Currently Displayed on Button",
1931+
"triggerMode":"Trigger Mode"
19311932
},
19321933
"textShow":{
19331934
"text":"### 👋 Hello, {name}",

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp