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

Commita90b975

Browse files
authored
Merge branch 'feat/Layout-Mode' into feat-layout-mode-table
2 parentsb081a7d +bd3cf48 commita90b975

File tree

8 files changed

+183
-102
lines changed

8 files changed

+183
-102
lines changed

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

Lines changed: 18 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -53,6 +53,9 @@ import { getSelectedRowKeys } from "./selectionControl";
5353
import{compTablePropertyView}from"./tablePropertyView";
5454
import{RowColorComp,TableChildrenView,TableInitComp}from"./tableTypes";
5555

56+
import{useContext}from"react";
57+
import{EditorContext}from"comps/editorState";
58+
5659
exportclassTableImplCompextendsTableInitCompimplementsIContainer{
5760
privateprevUnevaledValue?:string;
5861
readonlyfilterData:RecordType[]=[];
@@ -298,7 +301,7 @@ export class TableImplComp extends TableInitComp implements IContainer {
298301
filterNode(){
299302
constnodes={
300303
data:this.sortDataNode(),
301-
searchValue:this.children.toolbar.children.searchText.node(),
304+
searchValue:this.children.searchText.node(),
302305
filter:this.children.toolbar.children.filter.node(),
303306
showFilter:this.children.toolbar.children.showFilter.node(),
304307
};
@@ -443,7 +446,20 @@ let TableTmpComp = withViewFn(TableImplComp, (comp) => {
443446
);
444447
});
445448

446-
TableTmpComp=withPropertyViewFn(TableTmpComp,compTablePropertyView);
449+
450+
constwithEditorModeStatus=(Component:any)=>(props:any)=>{
451+
consteditorModeStatus=useContext(EditorContext).editorModeStatus;
452+
return<Component{...props}editorModeStatus={editorModeStatus}/>;
453+
};
454+
455+
// Use this HOC when defining TableTmpComp
456+
TableTmpComp=withPropertyViewFn(TableTmpComp,(comp)=>withEditorModeStatus(compTablePropertyView)(comp));
457+
458+
// TableTmpComp = withPropertyViewFn(TableTmpComp, compTablePropertyView);
459+
460+
461+
462+
447463

448464
/**
449465
* Hijack children's execution events and ensure that selectedRow is modified first (you can also add a triggeredRow field).

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -471,7 +471,7 @@ function ResizeableTable<RecordType extends object>(props: CustomTableProps<Reco
471471
constresizeWidth=(resizeData.index===index ?resizeData.width :col.width)??0;
472472
letcolWidth:number|string="auto";
473473
letminWidth:number|string=COL_MIN_WIDTH;
474-
if(resizeWidth>0){
474+
if(typeofresizeWidth==="number"&&resizeWidth>0){
475475
minWidth="unset";
476476
colWidth=resizeWidth;
477477
}else{

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

Lines changed: 98 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -397,83 +397,120 @@ function ColumnPropertyView<T extends MultiBaseComp<TableChildrenType>>(props: {
397397

398398
functioncolumnPropertyView<TextendsMultiBaseComp<TableChildrenType>>(comp:T){
399399
constcolumnLabel=trans("table.columnNum");
400-
constdynamicColumn=comp.children.dynamicColumn.getView();
400+
//const dynamicColumn = comp.children.dynamicColumn.getView();
401401
return[
402402
controlItem(
403403
{filterText:columnLabel},
404404
<ColumnPropertyViewcomp={comp}columnLabel={columnLabel}/>
405405
),
406-
comp.children.dynamicColumn.propertyView({label:trans("table.dynamicColumn")}),
406+
/*comp.children.dynamicColumn.propertyView({ label: trans("table.dynamicColumn") }),
407407
dynamicColumn &&
408408
comp.children.dynamicColumnConfig.propertyView({
409409
label: trans("table.dynamicColumnConfig"),
410410
tooltip: trans("table.dynamicColumnConfigDesc"),
411-
}),
411+
}), */
412412
];
413413
}
414414

415-
exportfunctioncompTablePropertyView<TextendsMultiBaseComp<TableChildrenType>>(comp:T){
415+
exportfunctioncompTablePropertyView<TextendsMultiBaseComp<TableChildrenType>&{editorModeStatus:string}>(comp:T){
416+
consteditorModeStatus=comp.editorModeStatus;
416417
constdataLabel=trans("data");
417418
return(
418419
<>
419-
<Sectionname={trans("data")}>
420-
{controlItem(
421-
{filterText:dataLabel},
422-
<divclassName={tableDataDivClassName}>
423-
{comp.children.data.propertyView({
424-
label:dataLabel,
420+
{["logic","both"].includes(editorModeStatus)&&(
421+
<Sectionname={trans("table.dataDesc")}>
422+
{controlItem(
423+
{filterText:dataLabel},
424+
<divclassName={tableDataDivClassName}>
425+
{comp.children.data.propertyView({
426+
label:dataLabel,
427+
})}
428+
</div>
429+
)}
430+
</Section>
431+
)}
432+
433+
{["layout","both"].includes(editorModeStatus)&&(
434+
<Sectionname={trans("prop.columns")}>
435+
{columnPropertyView(comp)}
436+
</Section>
437+
)}
438+
439+
{["logic","both"].includes(editorModeStatus)&&(
440+
<>
441+
<Sectionname={sectionNames.interaction}>
442+
{comp.children.onEvent.getPropertyView()}
443+
{comp.children.selection.getPropertyView()}
444+
{hiddenPropertyView(comp.children)}
445+
{loadingPropertyView(comp.children)}
446+
</Section>
447+
448+
<Sectionname={trans("prop.toolbar")}>
449+
{comp.children.toolbar.getPropertyView()}
450+
</Section>
451+
</>
452+
)}
453+
454+
{["layout","both"].includes(editorModeStatus)&&(
455+
<>
456+
<Sectionname={sectionNames.layout}>
457+
{comp.children.size.propertyView({
458+
label:trans("table.tableSize"),
459+
radioButton:true,
425460
})}
426-
</div>
427-
)}
428-
</Section>
429-
<Sectionname={trans("prop.columns")}>{columnPropertyView(comp)}</Section>
430-
<Sectionname={sectionNames.layout}>
431-
{comp.children.expansion.getPropertyView()}
432-
{comp.children.autoHeight.getPropertyView()}
433-
{hiddenPropertyView(comp.children)}
434-
</Section>
435-
<Sectionname={trans("prop.rowSelection")}>
436-
{comp.children.selection.getPropertyView()}
437-
</Section>
438-
<Sectionname={trans("prop.toolbar")}>{comp.children.toolbar.getPropertyView()}</Section>
439-
<Sectionname={trans("prop.pagination")}>
440-
{comp.children.pagination.getPropertyView()}
441-
</Section>
442-
<Sectionname={sectionNames.interaction}>
443-
{comp.children.onEvent.getPropertyView()}
444-
{loadingPropertyView(comp.children)}
445-
{comp.children.showDataLoadSpinner.propertyView({
446-
label:trans("table.showDataLoadSpinner"),
447-
})}
448-
{comp.children.viewModeResizable.propertyView({
449-
label:trans("table.viewModeResizable"),
450-
tooltip:trans("table.viewModeResizableTooltip"),
451-
})}
452-
</Section>
453-
<Sectionname={"Table Style"}>
454-
{comp.children.style.getPropertyView()}
455-
{comp.children.size.propertyView({
456-
label:trans("table.tableSize"),
457-
radioButton:true,
458-
})}
459-
{comp.children.hideBordered.propertyView({
460-
label:trans("table.hideBordered"),
461-
})}
462-
{comp.children.hideHeader.propertyView({
463-
label:trans("table.hideHeader"),
464-
})}
465-
{comp.children.fixedHeader.propertyView({
466-
label:trans("table.fixedHeader"),
467-
tooltip:trans("table.fixedHeaderTooltip")
468-
})}
469-
</Section>
470-
<Sectionname={"Row Style"}>
471-
{comp.children.rowStyle.getPropertyView()}
472-
{comp.children.rowColor.getPropertyView()}
473-
</Section>
474-
<Sectionname={"Column Style"}>
475-
{comp.children.columnsStyle.getPropertyView()}
476-
</Section>
461+
{comp.children.hideHeader.propertyView({
462+
label:trans("table.hideHeader"),
463+
})}
464+
{comp.children.hideBordered.propertyView({
465+
label:trans("table.hideBordered"),
466+
})}
467+
{comp.children.viewModeResizable.propertyView({
468+
label:trans("table.viewModeResizable"),
469+
tooltip:trans("table.viewModeResizableTooltip"),
470+
})}
471+
</Section>
472+
<Sectionname={trans("prop.pagination")}>
473+
{comp.children.pagination.getPropertyView()}
474+
</Section>
475+
</>
476+
)}
477+
478+
{["logic","both"].includes(editorModeStatus)&&(
479+
<>
480+
<Sectionname={sectionNames.advanced}>
481+
{comp.children.expansion.getPropertyView()}
482+
{comp.children.showDataLoadSpinner.propertyView({
483+
label:trans("table.showDataLoadSpinner"),
484+
})}
485+
{comp.children.dynamicColumn.propertyView({label:trans("table.dynamicColumn")})}
486+
{comp.children.dynamicColumn.getView()&&
487+
comp.children.dynamicColumnConfig.propertyView({
488+
label:trans("table.dynamicColumnConfig"),
489+
tooltip:trans("table.dynamicColumnConfigDesc"),
490+
})}
491+
{comp.children.searchText.propertyView({
492+
label:trans("table.searchText"),
493+
tooltip:trans("table.searchTextTooltip"),
494+
placeholder:"{{input1.value}}",
495+
})}
496+
</Section>
497+
</>
498+
)}
499+
500+
{["layout","both"].includes(editorModeStatus)&&(
501+
<><Sectionname={"Table Style"}>
502+
{comp.children.style.getPropertyView()}
503+
504+
</Section>
505+
<Sectionname={"Row Style"}>
506+
{comp.children.rowStyle.getPropertyView()}
507+
{comp.children.rowColor.getPropertyView()}
508+
</Section>
509+
<Sectionname={"Column Style"}>
510+
{comp.children.columnsStyle.getPropertyView()}
511+
</Section>
512+
</>
513+
)}
477514
</>
478515
);
479516
}

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

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -539,7 +539,7 @@ export const TableToolbarComp = (function () {
539539
showDownload:BoolControl,
540540
showFilter:BoolControl,
541541
columnSetting:BoolControl,
542-
searchText:StringControl,
542+
//searchText: StringControl,
543543
filter:stateComp<TableFilter>({stackType:"and",filters:[]}),
544544
position:dropdownControl(positionOptions,"below"),
545545
};
@@ -567,11 +567,11 @@ export const TableToolbarComp = (function () {
567567
children.showRefresh.propertyView({label:trans("table.showRefresh")}),
568568
children.showDownload.propertyView({label:trans("table.showDownload")}),
569569
children.columnSetting.propertyView({label:trans("table.columnSetting")}),
570-
children.searchText.propertyView({
570+
/*children.searchText.propertyView({
571571
label: trans("table.searchText"),
572572
tooltip: trans("table.searchTextTooltip"),
573573
placeholder: "{{input1.value}}",
574-
}),
574+
}), */
575575
])
576576
.build();
577577
})();

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

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import {
77
ColorOrBoolCodeControl,
88
JSONObjectArrayControl,
99
RadiusControl,
10+
StringControl,
1011
}from"comps/controls/codeControl";
1112
import{dropdownControl}from"comps/controls/dropdownControl";
1213
import{eventHandlerControl}from"comps/controls/eventHandlerControl";
@@ -148,6 +149,7 @@ const tableChildrenMap = {
148149
toolbar:TableToolbarComp,
149150
style:styleControl(TableStyle),
150151
rowStyle:styleControl(TableRowStyle),
152+
searchText:StringControl,
151153
columnsStyle:withDefault(styleControl(TableColumnStyle),{radius:'0px'}),
152154
viewModeResizable:BoolControl,
153155
// sample data for regenerating columns

‎client/packages/lowcoder/src/comps/comps/tabs/tabbedContainerComp.tsx‎

Lines changed: 19 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -237,14 +237,26 @@ export const TabbedContainerBaseComp = (function () {
237237
newOptionLabel:"Tab",
238238
})}
239239
{children.selectedTabKey.propertyView({label:trans("prop.defaultValue")})}
240-
{children.autoHeight.getPropertyView()}
241240
</Section>
242-
<Sectionname={sectionNames.interaction}>
243-
{children.onEvent.getPropertyView()}
244-
{disabledPropertyView(children)}
245-
</Section>
246-
<Sectionname={sectionNames.layout}>{hiddenPropertyView(children)}</Section>
247-
<Sectionname={sectionNames.style}>{children.style.getPropertyView()}</Section>
241+
242+
{["logic","both"].includes(useContext(EditorContext).editorModeStatus)&&(
243+
<Sectionname={sectionNames.interaction}>
244+
{children.onEvent.getPropertyView()}
245+
{disabledPropertyView(children)}
246+
{hiddenPropertyView(children)}
247+
</Section>
248+
)}
249+
250+
{["layout","both"].includes(useContext(EditorContext).editorModeStatus)&&(
251+
<>
252+
<Sectionname={sectionNames.layout}>
253+
{children.autoHeight.getPropertyView()}
254+
</Section>
255+
<Sectionname={sectionNames.style}>
256+
{children.style.getPropertyView()}
257+
</Section>
258+
</>
259+
)}
248260
</>
249261
);
250262
})

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

Lines changed: 30 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,9 @@ import { Timeline } from "antd";
6262

6363
import{ANTDICON}from"./antIcon";// todo: select icons to not import all icons
6464

65+
import{useContext}from"react";
66+
import{EditorContext}from"comps/editorState";
67+
6568
constEventOptions=[
6669
clickEvent,
6770
]asconst;
@@ -167,24 +170,34 @@ let TimeLineBasicComp = (function () {
167170
tooltip:TimelineDataTooltip,
168171
placeholder:"[]",
169172
})}
170-
{children.mode.propertyView({
171-
label:trans("timeLine.mode"),
172-
tooltip:trans("timeLine.modeTooltip"),
173-
})}
174-
{children.reverse.propertyView({
175-
label:trans("timeLine.reverse"),
176-
})}
177-
{children.pending.propertyView({
178-
label:trans("timeLine.pending"),
179-
})}
180-
</Section>
181-
<Sectionname={sectionNames.layout}>
182-
{children.onEvent.getPropertyView()}
183-
{hiddenPropertyView(children)}
184-
</Section>
185-
<Sectionname={sectionNames.style}>
186-
{children.style.getPropertyView()}
187173
</Section>
174+
175+
{["logic","both"].includes(useContext(EditorContext).editorModeStatus)&&(
176+
<Sectionname={sectionNames.interaction}>
177+
{children.onEvent.getPropertyView()}
178+
{hiddenPropertyView(children)}
179+
</Section>
180+
)}
181+
182+
{["layout","both"].includes(useContext(EditorContext).editorModeStatus)&&(
183+
<><Sectionname={sectionNames.layout}>
184+
{children.mode.propertyView({
185+
label:trans("timeLine.mode"),
186+
tooltip:trans("timeLine.modeTooltip"),
187+
})}
188+
{children.pending.propertyView({
189+
label:trans("timeLine.pending"),
190+
tooltip:trans("timeLine.pendingDescription"),
191+
})}
192+
{children.reverse.propertyView({
193+
label:trans("timeLine.reverse"),
194+
})}
195+
</Section>
196+
<Sectionname={sectionNames.style}>
197+
{children.style.getPropertyView()}
198+
</Section>
199+
</>
200+
)}
188201
</>
189202
))
190203
.build();

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

Lines changed: 12 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -2641,20 +2641,21 @@ export const en = {
26412641
},
26422642
/////////////////////
26432643
timeLine:{
2644-
titleColor:"title Color",
2645-
subTitleColor:"subTitle Color",
2646-
lableColor:"lable Color",
2647-
value:"value",
2648-
mode:"mode",
2649-
left:"Left",
2650-
right:"Right",
2651-
alternate:"alternate",
2644+
titleColor:"Title color",
2645+
subTitleColor:"Subtitle color",
2646+
lableColor:"Label color",
2647+
value:"Timeline data",
2648+
mode:"Display order",
2649+
left:"Content right",
2650+
right:"Content left",
2651+
alternate:"Alternate content order",
26522652
modeTooltip:
26532653
"Set the content to appear left/right or alternately on both sides of the timeline",
2654-
reverse:"reverse",
2655-
pending:"pending",
2654+
reverse:"Newest events first",
2655+
pending:"Pending node text",
2656+
pendingDescription:"When set, then an last node with the text and a waiting indicator will be displayed.",
26562657
defaultPending:"continuous improvement",
2657-
clickTitleEvent:"clickTitleEvent",
2658+
clickTitleEvent:"Click Title Event",
26582659
clickTitleEventDesc:"click Title Event",
26592660
Introduction:"Introduction keys",
26602661
helpTitle:"title of timeline(Required)",

0 commit comments

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