Skip to content

Commit 706ba7c

Browse files
FalkWolskyFalkWolsky
authored
Merge pull request lowcoder-org#1129 from lowcoder-org/table-summary-row
Option to Show/Hide save/cancel button in table toolbar + Expose functions with table to cancel changes
2 parents 327e4f8 + 7eba0e3 commit 706ba7c

File tree

8 files changed

+91
-30
lines changed

8 files changed

+91
-30
lines changed

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

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -642,6 +642,26 @@ TableTmpComp = withMethodExposing(TableTmpComp, [
642642
comp.children.selection.children.selectedRowKeys.dispatchChangeValueAction([]);
643643
},
644644
},
645+
{
646+
method: {
647+
name: "cancelChanges",
648+
description: "",
649+
params: [],
650+
},
651+
execute: (comp, values) => {
652+
comp.children.columns.dispatchClearChangeSet();
653+
},
654+
},
655+
{
656+
method: {
657+
name: "cancelInsertChanges",
658+
description: "",
659+
params: [],
660+
},
661+
execute: (comp, values) => {
662+
comp.children.columns.dispatchClearInsertSet();
663+
},
664+
},
645665
]);
646666

647667
// exposing data

‎client/packages/lowcoder/src/comps/comps/tableComp/tablePropertyView.tsx

Lines changed: 21 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -489,21 +489,40 @@ export function compTablePropertyView<T extends MultiBaseComp<TableChildrenType>
489489
<>
490490
<Section name={sectionNames.interaction}>
491491
{comp.children.onEvent.getPropertyView()}
492-
{comp.children.selection.getPropertyView()}
493492
{hiddenPropertyView(comp.children)}
494493
{loadingPropertyView(comp.children)}
494+
{comp.children.showDataLoadSpinner.propertyView({
495+
label: trans("table.showDataLoadSpinner"),
496+
})}
497+
{comp.children.selection.getPropertyView()}
498+
{comp.children.editModeClicks.propertyView({
499+
label: trans("table.editMode"),
500+
radioButton: true,
501+
})}
502+
{comp.children.searchText.propertyView({
503+
label: trans("table.searchText"),
504+
tooltip: trans("table.searchTextTooltip"),
505+
placeholder: "{{input1.value}}",
506+
})}
495507
</Section>
496508

497509
<Section name={"Summary"}>
498510
{comp.children.showSummary.propertyView({
499511
label: trans("table.showSummary")
500512
})}
501-
{comp.children.summaryRows.propertyView({
513+
{comp.children.showSummary.getView() &&
514+
comp.children.summaryRows.propertyView({
502515
label: trans("table.totalSummaryRows"),
503516
radioButton: true,
504517
})}
505518
</Section>
506519

520+
<Section name={"Insert Rows"}>
521+
{comp.children.inlineAddNewRow.propertyView({
522+
label: trans("table.inlineAddNewRow")
523+
})}
524+
</Section>
525+
507526
<Section name={trans("prop.toolbar")}>
508527
{comp.children.toolbar.getPropertyView()}
509528
</Section>
@@ -550,27 +569,12 @@ export function compTablePropertyView<T extends MultiBaseComp<TableChildrenType>
550569
<>
551570
<Section name={sectionNames.advanced}>
552571
{comp.children.expansion.getPropertyView()}
553-
{comp.children.inlineAddNewRow.propertyView({
554-
label: trans("table.inlineAddNewRow")
555-
})}
556-
{comp.children.showDataLoadSpinner.propertyView({
557-
label: trans("table.showDataLoadSpinner"),
558-
})}
559572
{comp.children.dynamicColumn.propertyView({ label: trans("table.dynamicColumn") })}
560573
{comp.children.dynamicColumn.getView() &&
561574
comp.children.dynamicColumnConfig.propertyView({
562575
label: trans("table.dynamicColumnConfig"),
563576
tooltip: trans("table.dynamicColumnConfigDesc"),
564577
})}
565-
{comp.children.editModeClicks.propertyView({
566-
label: trans("table.editMode"),
567-
radioButton: true,
568-
})}
569-
{comp.children.searchText.propertyView({
570-
label: trans("table.searchText"),
571-
tooltip: trans("table.searchTextTooltip"),
572-
placeholder: "{{input1.value}}",
573-
})}
574578
</Section>
575579
</>
576580
)}

‎client/packages/lowcoder/src/comps/comps/tableComp/tableToolbarComp.tsx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -562,6 +562,7 @@ export const TableToolbarComp = (function () {
562562
filter: stateComp<TableFilter>({ stackType: "and", filters: [] }),
563563
position: dropdownControl(positionOptions, "below"),
564564
columnSeparator: withDefault(StringControl, ','),
565+
showUpdateButtons: withDefault(BoolControl, true),
565566
};
566567

567568
return new ControlNodeCompBuilder(childrenMap, (props, dispatch) => {
@@ -587,6 +588,7 @@ export const TableToolbarComp = (function () {
587588
label: trans("table.fixedToolbar"),
588589
tooltip: trans("table.fixedToolbarTooltip")
589590
}),
591+
children.showUpdateButtons.propertyView({ label: trans("table.showUpdateButtons")}),
590592
children.showFilter.propertyView({ label: trans("table.showFilter") }),
591593
children.showRefresh.propertyView({ label: trans("table.showRefresh") }),
592594
children.showDownload.propertyView({ label: trans("table.showDownload") }),
@@ -816,7 +818,7 @@ export function TableToolbar(props: {
816818
}
817819
}}
818820
/>
819-
{hasChange && (
821+
{hasChange && toolbar.showUpdateButtons && (
820822
<SaveChangeButtons>
821823
<Button onClick={onCancelChanges}>{trans("cancel")}</Button>
822824
<Button type="primary" onClick={onSaveChanges}>

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

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1516,7 +1516,14 @@ export const de: typeof en = {
15161516
"falseValues": "Text Wenn Falsch",
15171517
"allColumn": "Alle",
15181518
"visibleColumn": "Sichtbar",
1519-
"emptyColumns": "Derzeit sind keine Spalten sichtbar"
1519+
"emptyColumns": "Derzeit sind keine Spalten sichtbar",
1520+
"showSummary": "Zusammenfassungszeile(n) anzeigen",
1521+
"totalSummaryRows": "Gesamtzahl der Zeilen",
1522+
"inlineAddNewRow": "Inline neue Zeile(n) hinzufügen",
1523+
"editMode": "Bearbeitungsmodus",
1524+
"singleClick": "Einzelklick",
1525+
"doubleClick": "Doppelklick",
1526+
"showUpdateButtons": "Schaltflächen zum Speichern/Abbrechen anzeigen"
15201527
},
15211528
"image": {
15221529
...en.image,
@@ -2350,7 +2357,9 @@ export const de: typeof en = {
23502357
"clone": "Klonen",
23512358
"editorMode_layout": "Layout",
23522359
"editorMode_logic": "Logik",
2353-
"editorMode_both": "Beide"
2360+
"editorMode_both": "Beide",
2361+
"editorMode_layout_tooltip": "Passen Sie im rechten Fenster das Erscheinungsbild und Layout der Komponente an. Passen Sie Aussehen, Stil und Animationen an.",
2362+
"editorMode_logic_tooltip": "Richten Sie im rechten Fenster ein, wie Ihre Komponente funktioniert und interagiert. Verwalten Sie den Inhalt und das interaktive Verhalten."
23542363
},
23552364
"userAuth": {
23562365
...en.userAuth,

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

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1854,7 +1854,7 @@ export const en = {
18541854
"columnSeparatorTooltip": "Column Separator (\"delimiter\") in downloaded CSV file. \n\nRecommendations:\n- Comma (,)\n- Semicolon (;)\n- Pipe (|)\n- Tab (\\t)",
18551855
"columnSetting": "Show Columns Visibility Button",
18561856
"searchText": "Search Text",
1857-
"searchTextTooltip": "Search and Filter the Data Presented in the Table",
1857+
"searchTextTooltip": "Search and Filter the Data, which is currently Presented in the Table. This is a frontend-only Search and Does Not Affect the Data Source Query.)",
18581858
"showQuickJumper": "Show Quick Jumper",
18591859
"hideOnSinglePage": "Hide on Single Page",
18601860
"showSizeChanger": "Show Size Changer Button",
@@ -1999,12 +1999,13 @@ export const en = {
19991999
"allColumn": "All",
20002000
"visibleColumn": "Visible",
20012001
"emptyColumns": "No Columns Are Currently Visible",
2002-
"showSummary": "Show Summary Row",
2002+
"showSummary": "Show Summary Row(s)",
20032003
"totalSummaryRows": "Total Rows",
2004-
"inlineAddNewRow": "Inline Add New Row",
2004+
"inlineAddNewRow": "Inline Add New Row(s)",
20052005
"editMode": "Edit Mode",
20062006
"singleClick": "Single Click",
20072007
"doubleClick": "Double Click",
2008+
"showUpdateButtons": "Show Save/Cancel Buttons",
20082009
},
20092010

20102011

@@ -2142,7 +2143,7 @@ export const en = {
21422143
"single": "Single",
21432144
"multiple": "Multiple",
21442145
"close": "Close",
2145-
"mode": "Select Mode"
2146+
"mode": "Row Select Mode"
21462147
},
21472148
"container": {
21482149
"title": "Displayed Container Title",
@@ -2905,7 +2906,9 @@ export const en = {
29052906
"clone": "Clone",
29062907
"editorMode_layout": "Layout",
29072908
"editorMode_logic": "Logic",
2908-
"editorMode_both": "Both"
2909+
"editorMode_both": "Both",
2910+
"editorMode_layout_tooltip": "Customise the component's appearance and layout, in the right window. Adjust how it looks, styles, and animates.",
2911+
"editorMode_logic_tooltip": "Set up how your component works and interacts, in the right window. Manage its content and interactive behaviours."
29092912
},
29102913
"userAuth": {
29112914
"registerByEmail": "Sign Up",

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

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2051,7 +2051,14 @@ export const pt: typeof en = {
20512051
"iconNull": "Ícone Quando Nulo",
20522052
"allColumn": "Todas",
20532053
"visibleColumn": "Visível",
2054-
"emptyColumns": "Nenhuma coluna está atualmente visível"
2054+
"emptyColumns": "Nenhuma coluna está atualmente visível",
2055+
"showSummary": "Mostrar linha(s) de resumo",
2056+
"totalSummaryRows": "Total de linhas",
2057+
"inlineAddNewRow": "Adicionar nova(s) linha(s) em linha",
2058+
"editMode": "Modo de edição",
2059+
"singleClick": "Clique Único",
2060+
"doubleClick": "Clique duplo",
2061+
"showUpdateButtons": "Mostrar botões Salvar/Cancelar",
20552062
},
20562063

20572064

@@ -2959,7 +2966,9 @@ export const pt: typeof en = {
29592966
"clone": "Clonar",
29602967
"editorMode_layout": "Layout",
29612968
"editorMode_logic": "Lógica",
2962-
"editorMode_both": "Ambos"
2969+
"editorMode_both": "Ambos",
2970+
"editorMode_layout_tooltip": "Personalize a aparência e o layout do componente, na janela direita. Ajuste sua aparência, estilo e animação.",
2971+
"editorMode_logic_tooltip": "Configure como seu componente funciona e interage, na janela direita. Gerencie seu conteúdo e comportamentos interativos."
29632972
},
29642973
"userAuth": {
29652974
...en.userAuth,

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

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1546,6 +1546,13 @@ export const zh: typeof en = {
15461546
allColumn: "全部",
15471547
visibleColumn: "可见",
15481548
emptyColumns: "当前没有可见列",
1549+
showSummary: "显示摘要行",
1550+
totalSummaryRows: "总行数",
1551+
inlineAddNewRow: "内联添加新行",
1552+
editMode: "编辑模式",
1553+
singleClick: "单击",
1554+
doubleClick: "双击",
1555+
showUpdateButtons: "显示保存/取消按钮",
15491556
},
15501557
image: {
15511558
...en.image,
@@ -2344,6 +2351,8 @@ export const zh: typeof en = {
23442351
editorMode_layout: "应用程序布局",
23452352
editorMode_logic: "应用程序逻辑",
23462353
editorMode_both: "两者",
2354+
editorMode_layout_tooltip: "在右侧窗口中自定义组件的外观和布局。调整它的外观、样式和动画。",
2355+
editorMode_logic_tooltip: "在右侧窗口中设置组件的工作和交互方式。管理其内容和交互行为。"
23472356
},
23482357
userAuth: {
23492358
...en.userAuth,

‎client/packages/lowcoder/src/pages/common/header.tsx

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -53,6 +53,7 @@ import { AppPermissionDialog } from "../../components/PermissionDialog/AppPermis
5353
import { getBrandingConfig } from "../../redux/selectors/configSelectors";
5454
import { messageInstance } from "lowcoder-design/src/components/GlobalInstances";
5555
import { EditorContext } from "../../comps/editorState";
56+
import Tooltip from "antd/es/tooltip";
5657

5758
const StyledLink = styled.a`
5859
display: flex;
@@ -320,11 +321,13 @@ export default function Header(props: HeaderProps) {
320321
const editorModeOptions = [
321322
{
322323
label: trans("header.editorMode_layout"),
324+
tooltip: trans("header.editorMode_layout_tooltip"),
323325
key: "editorModeSelector_layout",
324326
value: "layout",
325327
},
326328
{
327329
label: trans("header.editorMode_logic"),
330+
tooltip: trans("header.editorMode_logic_tooltip"),
328331
key: "editorModeSelector_logic",
329332
value: "logic",
330333
},
@@ -398,9 +401,11 @@ export default function Header(props: HeaderProps) {
398401
size="small"
399402
>
400403
{editorModeOptions.map((option) => (
401-
<Radio.Button key={option.key} value={option.value}>
402-
{option.label}
403-
</Radio.Button>
404+
<Tooltip title={option.tooltip}>
405+
<Radio.Button key={option.key} value={option.value}>
406+
{option.label}
407+
</Radio.Button>
408+
</Tooltip>
404409
))}
405410
</Radio.Group>
406411
<IconRadius>

0 commit comments

Comments
 (0)