Skip to content

Commit 006ab19

Browse files
Imiss-U1025Imiss-U1025
committed
Implemented settings of theme as default.
1 parent 8487136 commit 006ab19

File tree

2 files changed

+54
-50
lines changed

2 files changed

+54
-50
lines changed

‎client/packages/lowcoder-comps/src/comps/funnelChartComp/funnelChartComp.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -145,9 +145,9 @@ FunnelChartTmpComp = withViewFn(FunnelChartTmpComp, (comp) => {
145145
return getEchartsConfig(
146146
childrenToProps(echartsConfigChildren) as ToViewReturn<typeof echartsConfigChildren>,
147147
chartSize,
148-
theme?.theme?.components?.candleStickChart || {},
148+
themeConfig,
149149
);
150-
}, [chartSize, ...Object.values(echartsConfigChildren)]);
150+
}, [chartSize, ...Object.values(echartsConfigChildren), theme]);
151151

152152
useEffect(() => {
153153
comp.children.mapInstance.dispatch(changeValueAction(null, false))
@@ -175,7 +175,7 @@ FunnelChartTmpComp = withViewFn(FunnelChartTmpComp, (comp) => {
175175
lazyUpdate
176176
opts={{ locale: getEchartsLocale() }}
177177
option={option}
178-
theme={mode !== 'map' ? themeConfig : undefined}
178+
theme={themeConfig}
179179
mode={mode}
180180
/>
181181
</ReactResizeDetector>

‎client/packages/lowcoder-comps/src/comps/funnelChartComp/funnelChartUtils.ts

Lines changed: 51 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -134,36 +134,40 @@ export function getEchartsConfig(
134134
chartSize?: ChartSize,
135135
theme?: any,
136136
): EChartsOptionWithMap {
137+
138+
console.log("props", props);
139+
console.log("theme", theme);
140+
137141
if (props.mode === "json") {
138142
let opt={
139143
"title": {
140144
"text": props.echartsTitle,
141145
'top': props.echartsLegendConfig.top === 'bottom' ?'top':'bottom',
142146
"left":props.echartsTitleConfig.top,
143147
"textStyle": {
144-
"fontFamily": props?.titleStyle?.fontFamily,
145-
"fontSize": props?.titleStyle?.textSize,
146-
"fontWeight": props?.titleStyle?.textWeight,
147-
"color": props?.titleStyle?.text,
148-
"fontStyle": props?.titleStyle?.fontStyle,
149-
"textShadowColor": props?.titleStyle?.boxShadowColor,
150-
"textShadowBlur": props?.titleStyle?.boxShadow?.split(' ')[0],
151-
"textShadowOffsetX": props?.titleStyle?.boxShadow?.split(' ')[1],
152-
"textShadowOffsetY": props?.titleStyle?.boxShadow?.split(' ')[2]
148+
"fontFamily": props?.titleStyle?.fontFamily || theme?.titleStyle?.fontFamily,
149+
"fontSize": props?.titleStyle?.textSize || theme?.titleStyle?.fontSize,
150+
"fontWeight": props?.titleStyle?.textWeight || theme?.titleStyle?.fontWeight,
151+
"color": props?.titleStyle?.text || theme?.titleStyle?.fontColor,
152+
"fontStyle": props?.titleStyle?.fontStyle || theme?.titleStyle?.fontStyle,
153+
"textShadowColor": props?.titleStyle?.boxShadowColor || theme?.titleStyle?.shadowColor,
154+
"textShadowBlur": props?.titleStyle?.boxShadow?.split('px')[0] || theme?.titleStyle?.boxShadow.split('px')[0],
155+
"textShadowOffsetX": props?.titleStyle?.boxShadow?.split('px')[1] || theme?.titleStyle?.boxShadow.split('px')[1],
156+
"textShadowOffsetY": props?.titleStyle?.boxShadow?.split('px')[2] || theme?.titleStyle?.boxShadow.split('px')[2]
153157
}
154158
},
155-
"backgroundColor": props?.chartStyle?.gradientBackground && props?.chartStyle?.background
156-
? {
157-
"x": props?.chartStyle?.direction?.split(' ')[0],
158-
"y": props?.chartStyle?.direction?.split(' ')[1],
159-
"x2": props?.chartStyle?.direction?.split(' ')[2],
160-
"y2": props?.chartStyle?.direction?.split(' ')[3],
161-
"colorStops": [
162-
{ "offset": 0, "color": props?.chartStyle?.opacity ? props?.chartStyle?.background + opacityToHex(props?.chartStyle?.opacity) : props?.chartStyle?.background},
163-
{ "offset": 1, "color": props?.chartStyle?.opacity ? props?.chartStyle?.gradientBackground + opacityToHex(props?.chartStyle?.opacity) : props?.chartStyle?.gradientBackground}
164-
]
165-
}
166-
: props?.chartStyle?.opacity ? (props?.chartStyle?.background) + opacityToHex(props?.chartStyle?.opacity) : props?.chartStyle?.background,
159+
"backgroundColor": props?.chartStyle?.background || theme?.chartStyle?.backgroundColor,
160+
// ? {
161+
// "x": props?.chartStyle?.direction?.split(' ')[0],
162+
// "y": props?.chartStyle?.direction?.split(' ')[1],
163+
// "x2": props?.chartStyle?.direction?.split(' ')[2],
164+
// "y2": props?.chartStyle?.direction?.split(' ')[3],
165+
// "colorStops": [
166+
// { "offset": 0, "color": props?.chartStyle?.opacity ? props?.chartStyle?.background + opacityToHex(props?.chartStyle?.opacity) : props?.chartStyle?.background},
167+
// { "offset": 1, "color": props?.chartStyle?.opacity ? props?.chartStyle?.gradientBackground + opacityToHex(props?.chartStyle?.opacity) : props?.chartStyle?.gradientBackground}
168+
// ]
169+
// }
170+
// : props?.chartStyle?.opacity ? (props?.chartStyle?.background) + opacityToHex(props?.chartStyle?.opacity) : props?.chartStyle?.background,
167171
"color": props.echartsOption.data?.map(data => data.color),
168172
"tooltip": props.tooltip&&{
169173
"trigger": "item",
@@ -173,15 +177,15 @@ export function getEchartsConfig(
173177
"data": props.echartsOption.data?.map(data=>data.name),
174178
"top": props.echartsLegendConfig.top,
175179
"textStyle": {
176-
"fontFamily": props?.legendStyle?.fontFamily,
177-
"fontSize": props?.legendStyle?.textSize,
178-
"fontWeight": props?.legendStyle?.textWeight,
179-
"color": props?.legendStyle?.text,
180-
"fontStyle": props?.legendStyle?.fontStyle,
181-
"textShadowColor": props?.legendStyle?.boxShadowColor,
182-
"textShadowBlur": props?.legendStyle?.boxShadow?.split(' ')[0],
183-
"textShadowOffsetX": props?.legendStyle?.boxShadow?.split(' ')[1],
184-
"textShadowOffsetY": props?.legendStyle?.boxShadow?.split(' ')[2]
180+
"fontFamily": props?.legendStyle?.fontFamily || theme?.legendStyle?.fontFamily,
181+
"fontSize": props?.legendStyle?.textSize || theme?.legendStyle?.fontSize,
182+
"fontWeight": props?.legendStyle?.textWeight || theme?.legendStyle?.fontWeight,
183+
"color": props?.legendStyle?.text || theme?.legendStyle?.fontColor,
184+
"fontStyle": props?.legendStyle?.fontStyle || theme?.legendStyle?.fontStyle,
185+
"textShadowColor": props?.legendStyle?.boxShadowColor || theme?.legendStyle?.shadowColor,
186+
"textShadowBlur": props?.legendStyle?.boxShadow?.split('px')[0] || theme?.legendStyle?.boxShadow.split('px')[0],
187+
"textShadowOffsetX": props?.legendStyle?.boxShadow?.split('px')[1] || theme?.legendStyle?.boxShadow.split('px')[1],
188+
"textShadowOffsetY": props?.legendStyle?.boxShadow?.split('px')[2] || theme?.legendStyle?.boxShadow.split('px')[2]
185189
}
186190
},
187191
"series": [
@@ -199,27 +203,27 @@ export function getEchartsConfig(
199203
"sort": props.echartsSortingConfig.sort,
200204
"itemStyle": {
201205
"opacity": props.opacity,
202-
"borderColor": props?.chartStyle?.border,
203-
"borderWidth": props?.chartStyle?.borderWidth,
204-
"borderType": props?.chartStyle?.borderStyle,
205-
"borderRadius": props?.chartStyle?.radius,
206-
"shadowColor": props?.chartStyle?.boxShadowColor,
207-
"shadowBlur": props?.chartStyle?.boxShadow?.split(' ')[0],
208-
"shadowOffsetX": props?.chartStyle?.boxShadow?.split(' ')[0],
209-
"shadowOffsetY": props?.chartStyle?.boxShadow?.split(' ')[0]
206+
"borderColor": props?.chartStyle?.border || theme?.chartStyle?.borderColor,
207+
"borderWidth": props?.chartStyle?.borderWidth || theme?.chartStyle?.borderWidth,
208+
"borderType": props?.chartStyle?.borderStyle || theme?.chartStyle?.borderType,
209+
"borderRadius": props?.chartStyle?.radius || theme?.chartStyle?.borderRadius,
210+
"shadowColor": props?.chartStyle?.boxShadowColor || theme?.chartStyle?.shadowColor,
211+
"shadowBlur": props?.chartStyle?.boxShadow?.split('px')[0] || theme?.chartStyle?.boxShadow.split('px')[0],
212+
"shadowOffsetX": props?.chartStyle?.boxShadow?.split('px')[0] || theme?.chartStyle?.boxShadow.split('px')[1],
213+
"shadowOffsetY": props?.chartStyle?.boxShadow?.split('px')[0] || theme?.chartStyle?.boxShadow.split('px')[2]
210214
},
211215
"label": {
212216
"show": props.label,
213217
"position": props.echartsLabelConfig.top,
214-
"fontFamily": props?.labelStyle?.fontFamily,
215-
"fontSize": props?.labelStyle?.textSize,
216-
"fontWeight": props?.labelStyle?.textWeight,
217-
"color": props?.labelStyle?.text,
218-
"fontStyle": props?.labelStyle?.fontStyle,
219-
"textShadowColor": props?.labelStyle?.boxShadowColor,
220-
"textShadowBlur": props?.labelStyle?.boxShadow?.split(' ')[0],
221-
"textShadowOffsetX": props?.labelStyle?.boxShadow?.split(' ')[1],
222-
"textShadowOffsetY": props?.labelStyle?.boxShadow?.split(' ')[2]
218+
"fontFamily": props?.labelStyle?.fontFamily || theme?.labelStyle?.fontFamily,
219+
"fontSize": props?.labelStyle?.textSize || theme?.labelStyle?.fontSize,
220+
"fontWeight": props?.labelStyle?.textWeight || theme?.labelStyle?.fontWeight,
221+
"color": props?.labelStyle?.text || theme?.labelStyle?.fontColor,
222+
"fontStyle": props?.labelStyle?.fontStyle || theme?.labelStyle?.fontStyle,
223+
"textShadowColor": props?.labelStyle?.boxShadowColor || theme?.labelStyle?.shadowColor,
224+
"textShadowBlur": props?.labelStyle?.boxShadow?.split('px')[0] || theme?.labelStyle?.boxShadow.split('px')[0],
225+
"textShadowOffsetX": props?.labelStyle?.boxShadow?.split('px')[1] || theme?.labelStyle?.boxShadow.split('px')[1],
226+
"textShadowOffsetY": props?.labelStyle?.boxShadow?.split('px')[2] || theme?.labelStyle?.boxShadow.split('px')[2]
223227
},
224228
"data": props.echartsOption.data
225229
}

0 commit comments

Comments
 (0)