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

Commit318571a

Browse files
committed
[FEAT]:#1579 Add Icon as a button for the Button Column type
1 parent704a160 commit318571a

File tree

2 files changed

+42
-5
lines changed

2 files changed

+42
-5
lines changed

‎client/packages/lowcoder/src/comps/comps/tableComp/column/simpleColumnTypeComps.tsx‎

Lines changed: 39 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,8 @@ import { trans } from "i18n";
77
import{useStyle}from"comps/controls/styleControl";
88
import{ButtonStyle}from"comps/controls/styleControlConstants";
99
import{Button100}from"comps/comps/buttonComp/buttonCompConstants";
10+
import{IconControl}from"comps/controls/iconControl";
11+
import{hasIcon}from"comps/utils";
1012

1113
exportconstColumnValueTooltip=trans("table.columnValueTooltip");
1214

@@ -20,24 +22,44 @@ export const ButtonTypeOptions = [
2022
value:"default",
2123
},
2224
{
23-
label:trans("text"),
25+
label:trans("table.text"),
2426
value:"text",
2527
},
2628
]asconst;
2729

30+
exportconstButtonDisplayOptions=[
31+
{
32+
label:trans("table.text"),
33+
value:"text",
34+
},
35+
{
36+
label:trans("table.icon"),
37+
value:"icon",
38+
},
39+
{
40+
label:trans("table.textAndIcon"),
41+
value:"textAndIcon",
42+
},
43+
]asconst;
44+
2845
exportconstButtonComp=(function(){
2946
constchildrenMap={
3047
text:StringControl,
3148
buttonType:dropdownControl(ButtonTypeOptions,"primary"),
3249
onClick:ActionSelectorControlInContext,
3350
loading:BoolCodeControl,
3451
disabled:BoolCodeControl,
52+
displayMode:dropdownControl(ButtonDisplayOptions,"text"),
53+
icon:IconControl,
3554
};
3655
returnnewColumnTypeCompBuilder(
3756
childrenMap,
3857
(props)=>{
3958
constButtonStyled=()=>{
4059
conststyle=useStyle(ButtonStyle);
60+
constshowIcon=props.displayMode==="icon"||props.displayMode==="textAndIcon";
61+
constshowText=props.displayMode==="text"||props.displayMode==="textAndIcon";
62+
4163
return(
4264
<Button100
4365
type={props.buttonType}
@@ -46,9 +68,10 @@ export const ButtonComp = (function () {
4668
disabled={props.disabled}
4769
$buttonStyle={props.buttonType==="primary" ?style :undefined}
4870
style={{margin:0}}
71+
icon={showIcon&&hasIcon(props.icon) ?props.icon :undefined}
4972
>
5073
{/* prevent the button from disappearing */}
51-
{!props.text ?" " :props.text}
74+
{showText ?(!props.text ?" " :props.text) :null}
5275
</Button100>
5376
);
5477
};
@@ -58,10 +81,21 @@ export const ButtonComp = (function () {
5881
)
5982
.setPropertyViewFn((children)=>(
6083
<>
61-
{children.text.propertyView({
62-
label:trans("table.columnValue"),
63-
tooltip:ColumnValueTooltip,
84+
{children.displayMode.propertyView({
85+
label:trans("table.displayMode"),
86+
radioButton:true,
6487
})}
88+
{(children.displayMode.getView()==="text"||children.displayMode.getView()==="textAndIcon")&&
89+
children.text.propertyView({
90+
label:trans("table.columnValue"),
91+
tooltip:ColumnValueTooltip,
92+
})
93+
}
94+
{(children.displayMode.getView()==="icon"||children.displayMode.getView()==="textAndIcon")&&
95+
children.icon.propertyView({
96+
label:trans("table.icon"),
97+
})
98+
}
6599
{children.buttonType.propertyView({
66100
label:trans("table.type"),
67101
radioButton:true,

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

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2066,6 +2066,9 @@ export const en = {
20662066
"primaryButton":"Primary",
20672067
"defaultButton":"Default",
20682068
"type":"Type",
2069+
"displayMode":"Display Mode",
2070+
"textAndIcon":"Text and Icon",
2071+
"icon":"Icon",
20692072
"tableSize":"Table Size",
20702073
"hideHeader":"Hide Table Header",
20712074
"hideToolbar":"Hide Table Toolbar (Footer)",

0 commit comments

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