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

Commit7371565

Browse files
author
FalkWolsky
committed
Color settings
1 parentf1ced9f commit7371565

File tree

6 files changed

+36
-58
lines changed

6 files changed

+36
-58
lines changed

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

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -122,9 +122,7 @@ const getStyle = (
122122
`;
123123
};
124124

125-
constTitleResizeHandle=styled.span<{
126-
$visibleResizables:boolean;
127-
}>`
125+
constTitleResizeHandle=styled.span`
128126
position: absolute;
129127
top: 0;
130128
right: -5px;
@@ -157,6 +155,8 @@ const TableWrapper = styled.div<{
157155
$toolbarPosition:"above"|"below"|"close";
158156
$fixedHeader:boolean;
159157
$fixedToolbar:boolean;
158+
$visibleResizables:boolean;
159+
$showHRowGridBorder?:boolean;
160160
}>`
161161
overflow: unset !important;
162162
@@ -240,13 +240,15 @@ const TableWrapper = styled.div<{
240240
241241
&::before {
242242
background-color:${(props)=>props.$headerStyle.border};
243+
width:${(props)=>(props.$visibleResizables ?"1px" :"0px")} !important;
243244
}
244245
}
245246
}
246247
247248
> thead > tr > th,
248249
> tbody > tr > td {
249-
border-color:${(props)=>props.$style.border};
250+
border-color:${(props)=>props.$headerStyle.border};
251+
${(props)=>!props.$showHRowGridBorder&&`border-bottom: 0px;`}
250252
}
251253
252254
td {
@@ -436,7 +438,6 @@ const ResizeableTitle = (props: any) => {
436438
handle={(axis:ResizeHandleAxis,ref:ReactRef<HTMLDivElement>)=>(
437439
<TitleResizeHandle
438440
ref={ref}
439-
$visibleResizables={props.visibleResizables}
440441
onClick={(e)=>{
441442
e.preventDefault();
442443
e.stopPropagation();
@@ -682,6 +683,7 @@ export function TableCompView(props: {
682683
constrowAutoHeight=compChildren.rowAutoHeight.getView();
683684
consttableAutoHeight=comp.getTableAutoHeight();
684685
constvisibleResizables=compChildren.visibleResizables.getView();
686+
constshowHRowGridBorder=compChildren.showHRowGridBorder.getView();
685687
constcolumnsStyle=compChildren.columnsStyle.getView();
686688
constchangeSet=useMemo(()=>compChildren.columns.getChangeSet(),[compChildren.columns]);
687689
consthasChange=useMemo(()=>!_.isEmpty(changeSet),[changeSet]);
@@ -762,7 +764,7 @@ export function TableCompView(props: {
762764
consttoolbarView=(
763765
<TableToolbar
764766
toolbar={toolbar}
765-
$style={style}
767+
$style={toolbarStyle}
766768
pagination={{
767769
...pagination,
768770
total:pageDataInfo.total,
@@ -800,6 +802,8 @@ export function TableCompView(props: {
800802
$toolbarPosition={toolbar.position}
801803
$fixedHeader={compChildren.fixedHeader.getView()}
802804
$fixedToolbar={toolbar.fixedToolbar&&toolbar.position==='above'}
805+
$visibleResizables={visibleResizables}
806+
$showHRowGridBorder={showHRowGridBorder}
803807
>
804808
<ResizeableTable<RecordType>
805809
expandable={{
@@ -815,7 +819,7 @@ export function TableCompView(props: {
815819
rowColorFn={compChildren.rowColor.getView()asany}
816820
rowHeightFn={compChildren.rowHeight.getView()asany}
817821
{...compChildren.selection.getView()(onEvent)}
818-
bordered={compChildren.showHeaderGridBorder.getView()}
822+
bordered={compChildren.showRowGridBorder.getView()}
819823
onChange={(pagination,filters,sorter,extra)=>{
820824
onTableChange(pagination,filters,sorter,extra,comp.dispatch,onEvent);
821825
}}

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

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -511,17 +511,17 @@ export function compTablePropertyView<T extends MultiBaseComp<TableChildrenType>
511511
{comp.children.style.getPropertyView()}
512512
</Section>
513513
<Sectionname={"Header Style"}>
514-
{comp.children.showHeaderGridBorder.propertyView({
515-
label:trans("table.showHeaderGridBorder"),
516-
})}
517514
{comp.children.headerStyle.getPropertyView()}
518515
</Section>
519516
<Sectionname={"Toolbar Style"}>
520517
{comp.children.toolbarStyle.getPropertyView()}
521518
</Section>
522519
<Sectionname={"Row Style"}>
523520
{comp.children.showRowGridBorder.propertyView({
524-
label:trans("table.showRowGridBorder"),
521+
label:trans("table.showVerticalRowGridBorder"),
522+
})}
523+
{comp.children.showHRowGridBorder.propertyView({
524+
label:trans("table.showHorizontalRowGridBorder"),
525525
})}
526526
{comp.children.rowStyle.getPropertyView()}
527527
{comp.children.rowAutoHeight.getPropertyView()}

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

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { TableOnEventView } from "comps/comps/tableComp/tableTypes";
77
import{BoolControl}from"comps/controls/boolControl";
88
import{StringControl}from"comps/controls/codeControl";
99
import{dropdownControl}from"comps/controls/dropdownControl";
10-
import{defaultTheme,TableStyleType}from"comps/controls/styleControlConstants";
10+
import{defaultTheme,TableToolbarStyleType}from"comps/controls/styleControlConstants";
1111
import{stateComp}from"comps/generators";
1212
import{genRandomKey}from"comps/utils/idGenerator";
1313
import{ThemeContext}from"comps/utils/themeContext";
@@ -46,19 +46,20 @@ const SaveChangeButtons = styled.div`
4646
`;
4747

4848
constgetStyle=(
49-
style:TableStyleType,
49+
style:TableToolbarStyleType,
5050
filtered:boolean,
5151
theme:ThemeDetail,
5252
position:ToolbarRowType["position"],
5353
fixedToolbar:boolean,
5454
)=>{
5555
returncss`
56-
background-color:${style.toolbarBackground};
56+
background-color:${style.background};
5757
// Implement horizontal scrollbar and vertical page number selection is not blocked
5858
padding: 13px 12px;
5959
position: sticky;
6060
postion: -webkit-sticky;
6161
left: 0px !important;
62+
margin:${style.margin} !important;
6263
6364
${fixedToolbar&&`z-index: 99;`};
6465
${fixedToolbar&&position==='below'&&`bottom: 0;`};
@@ -125,7 +126,7 @@ const getStyle = (
125126
}
126127
127128
.ant-pagination-item-active {
128-
border-color:${theme?.primary};
129+
border-color:${style.border||theme?.primary};
129130
130131
a {
131132
color:${theme?.textDark};
@@ -145,13 +146,13 @@ const getStyle = (
145146
.ant-select-selector,
146147
.ant-pagination-options-quick-jumper input:hover,
147148
.ant-pagination-options-quick-jumper input:focus {
148-
border-color:${theme?.primary};
149+
border-color:${style.border||theme?.primary};
149150
}
150151
`;
151152
};
152153

153154
constToolbarWrapper=styled.div<{
154-
$style:TableStyleType;
155+
$style:TableToolbarStyleType;
155156
$filtered:boolean;
156157
$theme:ThemeDetail;
157158
$position:ToolbarRowType["position"];
@@ -711,7 +712,7 @@ type ToolbarRowType = ConstructorToView<typeof TableToolbarComp>;
711712

712713
exportfunctionTableToolbar(props:{
713714
toolbar:ToolbarRowType;
714-
$style:TableStyleType;
715+
$style:TableToolbarStyleType;
715716
pagination:PaginationProps;
716717
columns:Array<ColumnCompType>;
717718
onRefresh:()=>void;

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

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -173,6 +173,7 @@ const tableChildrenMap = {
173173
// hideBordered: BoolControl,
174174
showHeaderGridBorder:BoolControl,
175175
showRowGridBorder:BoolControl,
176+
showHRowGridBorder:BoolControl,
176177
hideHeader:BoolControl,
177178
fixedHeader:BoolControl,
178179
autoHeight:withDefault(AutoHeightControl,"auto"),

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

Lines changed: 10 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -157,7 +157,10 @@ export function handleToSelectedRow(color: string, primary: string = defaultThem
157157
// return table header background color
158158
exportfunctionhandleToHeadBg(color:string){
159159
if(toHex(color)===SURFACE_COLOR){
160-
return"#FAFAFA";
160+
returndarkenColor(color,0.06);
161+
}
162+
if(toHex(color)==="#000000"){
163+
returnSECOND_SURFACE_COLOR;
161164
}
162165
if(isDarkColor(color)){
163166
returndarkenColor(color,0.06);
@@ -690,60 +693,29 @@ export const TableStyle = [
690693
label:trans("style.borderWidth"),
691694
borderWidth:"borderWidth",
692695
},
693-
{
694-
name:"headerBackground",
695-
label:trans("style.tableHeaderBackground"),
696-
depName:"background",
697-
transformer:handleToHeadBg,
698-
},
699-
{
700-
name:"headerText",
701-
label:trans("style.tableHeaderText"),
702-
depName:"headerBackground",
703-
depType:DEP_TYPE.CONTRAST_TEXT,
704-
transformer:contrastText,
705-
},
706-
{
707-
name:"toolbarBackground",
708-
label:trans("style.toolbarBackground"),
709-
depName:"background",
710-
depType:DEP_TYPE.SELF,
711-
transformer:toSelf,
712-
},
713-
{
714-
name:"toolbarText",
715-
label:trans("style.toolbarText"),
716-
depName:"toolbarBackground",
717-
depType:DEP_TYPE.CONTRAST_TEXT,
718-
transformer:contrastText,
719-
},
720696
]asconst;
721697

722698
exportconstTableToolbarStyle=[
723-
{
724-
name:"toolbarBackground",
725-
label:trans("style.toolbarBackground"),
726-
depName:"background",
727-
depType:DEP_TYPE.SELF,
728-
transformer:toSelf,
729-
},
699+
MARGIN,
700+
getBackground(),
701+
getStaticBorder(),
730702
{
731703
name:"toolbarText",
732704
label:trans("style.toolbarText"),
733705
depName:"toolbarBackground",
734706
depType:DEP_TYPE.CONTRAST_TEXT,
735-
transformer:contrastText,
707+
transformer:toSelf,
736708
},
737709
]asconst;
738710

739711
exportconstTableHeaderStyle=[
712+
MARGIN,
740713
{
741714
name:"headerBackground",
742715
label:trans("style.tableHeaderBackground"),
743-
depName:"background",
716+
depName:"headerBackground",
744717
transformer:handleToHeadBg,
745718
},
746-
MARGIN,
747719
getStaticBorder(),
748720
{
749721
name:"borderWidth",

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

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1273,8 +1273,8 @@ export const en = {
12731273
"fixedToolbar":"Fixed Toolbar",
12741274
"fixedToolbarTooltip":"Toolbar Will Be Fixed for Vertically Scrollable Table Based on Position",
12751275
"hideBordered":"Show Resize Handles",
1276-
"showHeaderGridBorder":"ShowHeader Grid Border",
1277-
"showRowGridBorder":"Show Row Grid Border",
1276+
"showVerticalRowGridBorder":"Showvertical Row Grid Border",
1277+
"showHorizontalRowGridBorder":"Show horizontal Row Grid Border",
12781278
"deleteColumn":"Delete Column",
12791279
"confirmDeleteColumn":"Confirm Delete Column: ",
12801280
"small":"S",

0 commit comments

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