Skip to content

Commit f99a96a

Browse files
committed
Added an editing ability on Grade Gauge chart.
1 parent 72284a3 commit f99a96a

File tree

6 files changed

+142
-69
lines changed

6 files changed

+142
-69
lines changed

client/packages/lowcoder-comps/src/comps/gaugeChartComp/gaugeChartConstants.tsx

Lines changed: 17 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -268,7 +268,8 @@ export const chartUiModeChildren = {
268268

269269
let chartJsonModeChildren: any = {
270270
echartsOption: jsonControl(toObject, i18nObjs.defaultGaugeChartOption),
271-
stageGaugeOption: jsonControl(toObject, i18nObjs.stageGaugeChartOption),
271+
stageGaugeOption: jsonControl(toObject, i18nObjs.defaultStageGaugeChartOption),
272+
gradeGaugeOption: jsonControl(toObject, i18nObjs.defaultGradeGaugeChartOption),
272273
chartType: dropdownControl(ChartTypeOptions, trans("chart.default")),
273274
echartsTitle: withDefault(StringControl, trans("gaugeChart.defaultTitle")),
274275
echartsLegendConfig: EchartsLegendConfig,
@@ -296,18 +297,33 @@ let chartJsonModeChildren: any = {
296297
splitNumber:withDefault(NumberControl,trans('gaugeChart.defaultSplitNumber')),
297298
pointerLength:withDefault(NumberControl,trans('gaugeChart.defaultPointerLength')),
298299
pointerWidth:withDefault(NumberControl,trans('gaugeChart.defaultPointerWidth')),
300+
pointer_Y:withDefault(NumberControl,trans('gaugeChart.defaultPointer_Y')),
301+
gradeGaugePointerLength:withDefault(NumberControl,trans('gaugeChart.defaultGradeGaugePointerLength')),
302+
gradeGaugePointerWidth:withDefault(NumberControl,trans('gaugeChart.defaultGradeGaugePointerWidth')),
303+
gradeGaugePointer_Y:withDefault(NumberControl,trans('gaugeChart.defaultGradeGaugePointer_Y')),
304+
pointerIcon:withDefault(StringControl),
299305
progressBarWidth:withDefault(NumberControl,trans('gaugeChart.defaultProgressBarWidth')),
300306
progressBarWidthStage:withDefault(NumberControl,trans('gaugeChart.defaultProgressBarWidthStage')),
301307
stageGaugeProgressBarColor1: withDefault(ColorControl, trans('gaugeChart.stageGauge.defaultProgressBarColor1')),
302308
stageGaugeProgressBarColor2: withDefault(ColorControl, trans('gaugeChart.stageGauge.defaultProgressBarColor2')),
303309
stageGaugeProgressBarColor3: withDefault(ColorControl, trans('gaugeChart.stageGauge.defaultProgressBarColor3')),
310+
stageGaugeProgressBarColor4: withDefault(ColorControl, trans('gaugeChart.stageGauge.defaultProgressBarColor4')),
304311
stageGaugeProgressBarInterval1: withDefault(NumberControl, trans('gaugeChart.stageGauge.defaultProgressBarInterval1')),
305312
stageGaugeProgressBarInterval2: withDefault(NumberControl, trans('gaugeChart.stageGauge.defaultProgressBarInterval2')),
306313
stageGaugeProgressBarInterval3: withDefault(NumberControl, trans('gaugeChart.stageGauge.defaultProgressBarInterval3')),
314+
gradeGaugeProgressBarInterval1: withDefault(NumberControl, trans('gaugeChart.stageGauge.defaultGradeProgressBarInterval1')),
315+
gradeGaugeProgressBarInterval2: withDefault(NumberControl, trans('gaugeChart.stageGauge.defaultGradeProgressBarInterval2')),
316+
gradeGaugeProgressBarInterval3: withDefault(NumberControl, trans('gaugeChart.stageGauge.defaultGradeProgressBarInterval3')),
317+
gradeGaugeProgressBarInterval4: withDefault(NumberControl, trans('gaugeChart.stageGauge.defaultGradeProgressBarInterval4')),
318+
gradeGaugeProgressBarString1: withDefault(StringControl, trans('gaugeChart.stageGauge.defaultGradeGaugeProgressBarString1')),
319+
gradeGaugeProgressBarString2: withDefault(StringControl, trans('gaugeChart.stageGauge.defaultGradeGaugeProgressBarString2')),
320+
gradeGaugeProgressBarString3: withDefault(StringControl, trans('gaugeChart.stageGauge.defaultGradeGaugeProgressBarString3')),
321+
gradeGaugeProgressBarString4: withDefault(StringControl, trans('gaugeChart.stageGauge.defaultGradeGaugeProgressBarString4')),
307322
axisTickWidth: withDefault(NumberControl, trans('gaugeChart.stageGauge.defaultAxisTickWidth')),
308323
axisTickLength: withDefault(NumberControl, trans('gaugeChart.stageGauge.defaultAxisTickLength')),
309324
axisTickColor: withDefault(ColorControl, trans('gaugeChart.stageGauge.defaultAxisTickColor')),
310325
axisTickColorStage: withDefault(ColorControl, trans('gaugeChart.stageGauge.defaultAxisTickColorStage')),
326+
axisTickColorGrade: withDefault(ColorControl),
311327
}
312328
if (EchartDefaultChartStyle && EchartDefaultTextStyle) {
313329
chartJsonModeChildren = {

client/packages/lowcoder-comps/src/comps/gaugeChartComp/gaugeChartPropertyView.tsx

Lines changed: 30 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -45,10 +45,12 @@ export function gaugeChartPropertyView(
4545
{children.position_y.propertyView({ label: trans("gaugeChart.position_y"), tooltip: trans("echarts.positionChart_x_Tooltip") })}
4646
{children.startAngle.propertyView({ label: trans("gaugeChart.startAngle"), tooltip: trans("echarts.startAngleTooltip") })}
4747
{children.endAngle.propertyView({ label: trans("gaugeChart.endAngle"), tooltip: trans("echarts.endAngleTooltip") })}
48-
{children.splitNumber.propertyView({ label: trans("gaugeChart.splitNumber"), tooltip: trans("echarts.splitNumberTooltip") })}
4948
{children.pointerLength.propertyView({ label: trans("gaugeChart.pointerLength"), tooltip: trans("echarts.pointerLengthTooltip") })}
5049
{children.pointerWidth.propertyView({ label: trans("gaugeChart.pointerWidth"), tooltip: trans("echarts.pointerWidthTooltip") })}
50+
{children.pointer_Y.propertyView({ label: trans("gaugeChart.pointer_Y"), tooltip: trans("gaugeChart.pointer_Y_Tooltip") })}
51+
{children.pointerIcon.propertyView({ label: trans("gaugeChart.pointerIcon"), tooltip: trans("gaugeChart.pointerIconTooltip") })}
5152
{children.progressBar.getView() && children.progressBarWidth.propertyView({ label: trans("gaugeChart.progressBarWidth"), tooltip: trans("echarts.pointerWidthTooltip") })}
53+
{children.splitNumber.propertyView({ label: trans("gaugeChart.splitNumber"), tooltip: trans("echarts.splitNumberTooltip") })}
5254
{children.axisTickLength.propertyView({ label: trans("gaugeChart.stageGauge.axisTickLength"), tooltip: trans("gaugeChart.stageGauge.axisTickLengthTooltip") })}
5355
{children.axisTickWidth.propertyView({ label: trans("gaugeChart.stageGauge.axisTickWidth"), tooltip: trans("gaugeChart.stageGauge.axisTickWidthTooltip") })}
5456
{children.axisTickColor.propertyView({ label: trans("gaugeChart.stageGauge.axisTickColor"), tooltip: trans("gaugeChart.stageGauge.axisTickColorTooltip") })}
@@ -155,7 +157,7 @@ export function gaugeChartPropertyView(
155157
const gradeGaugePropertyView = (
156158
<>
157159
<Section name={trans("chart.config")}>
158-
{children.echartsOption.propertyView({
160+
{children.gradeGaugeOption.propertyView({
159161
label: trans("chart.echartsOptionLabel"),
160162
styleName: "higher",
161163
tooltip: (
@@ -177,6 +179,20 @@ export function gaugeChartPropertyView(
177179
{children.top.propertyView({ label: trans("gaugeChart.top") })}
178180
{children.bottom.propertyView({ label: trans("gaugeChart.bottom") })}
179181
{children.width.propertyView({ label: trans("gaugeChart.width") })} */}
182+
183+
{children.gradeGaugeProgressBarInterval1.propertyView({label: trans("gaugeChart.stageGauge.progressBarInterval"), tooltip: trans("gaugeChart.stageGauge.defaultToolTip") })}
184+
{/*{children.gradeGaugeProgressBarString1.propertyView({label: trans("gaugeChart.stageGauge.gradeProgressBarString"), tooltip: trans("gaugeChart.stageGauge.defaultToolTip") })}*/}
185+
{children.stageGaugeProgressBarColor1.propertyView({label: trans("gaugeChart.stageGauge.progressBarColor"), tooltip: trans("gaugeChart.stageGauge.defaultToolTip") })}
186+
{children.gradeGaugeProgressBarInterval2.propertyView({label: trans("gaugeChart.stageGauge.progressBarInterval"), tooltip: trans("gaugeChart.stageGauge.defaultToolTip") })}
187+
{/*{children.gradeGaugeProgressBarString2.propertyView({label: trans("gaugeChart.stageGauge.gradeProgressBarString"), tooltip: trans("gaugeChart.stageGauge.defaultToolTip") })}*/}
188+
{children.stageGaugeProgressBarColor2.propertyView({label: trans("gaugeChart.stageGauge.progressBarColor"), tooltip: trans("gaugeChart.stageGauge.defaultToolTip") })}
189+
{children.gradeGaugeProgressBarInterval3.propertyView({label: trans("gaugeChart.stageGauge.progressBarInterval"), tooltip: trans("gaugeChart.stageGauge.defaultToolTip") })}
190+
{/*{children.gradeGaugeProgressBarString3.propertyView({label: trans("gaugeChart.stageGauge.gradeProgressBarString"), tooltip: trans("gaugeChart.stageGauge.defaultToolTip") })}*/}
191+
{children.stageGaugeProgressBarColor3.propertyView({label: trans("gaugeChart.stageGauge.progressBarColor"), tooltip: trans("gaugeChart.stageGauge.defaultToolTip") })}
192+
{children.gradeGaugeProgressBarInterval4.propertyView({label: trans("gaugeChart.stageGauge.progressBarInterval"), tooltip: trans("gaugeChart.stageGauge.defaultToolTip") })}
193+
{/*{children.gradeGaugeProgressBarString4.propertyView({label: trans("gaugeChart.stageGauge.gradeProgressBarString"), tooltip: trans("gaugeChart.stageGauge.defaultToolTip") })}*/}
194+
{children.stageGaugeProgressBarColor4.propertyView({label: trans("gaugeChart.stageGauge.progressBarColor"), tooltip: trans("gaugeChart.stageGauge.defaultToolTip") })}
195+
180196
{children.radius.propertyView({ label: trans("gaugeChart.radius"), tooltip: trans("echarts.radiusTooltip") })}
181197
{children.min.propertyView({ label: trans("gaugeChart.min"), tooltip: trans("echarts.minTooltip") })}
182198
{children.max.propertyView({ label: trans("gaugeChart.max"), tooltip: trans("echarts.maxTooltip") })}
@@ -185,13 +201,18 @@ export function gaugeChartPropertyView(
185201
{children.startAngle.propertyView({ label: trans("gaugeChart.startAngle"), tooltip: trans("echarts.startAngleTooltip") })}
186202
{children.endAngle.propertyView({ label: trans("gaugeChart.endAngle"), tooltip: trans("echarts.endAngleTooltip") })}
187203
{children.splitNumber.propertyView({ label: trans("gaugeChart.splitNumber"), tooltip: trans("echarts.splitNumberTooltip") })}
188-
{children.pointerLength.propertyView({ label: trans("gaugeChart.pointerLength"), tooltip: trans("echarts.pointerLengthTooltip") })}
189-
{children.pointerWidth.propertyView({ label: trans("gaugeChart.pointerWidth"), tooltip: trans("echarts.pointerWidthTooltip") })}
204+
{children.gradeGaugePointerLength.propertyView({ label: trans("gaugeChart.pointerLength"), tooltip: trans("echarts.pointerLengthTooltip") })}
205+
{children.gradeGaugePointerWidth.propertyView({ label: trans("gaugeChart.pointerWidth"), tooltip: trans("echarts.pointerWidthTooltip") })}
206+
{children.gradeGaugePointer_Y.propertyView({ label: trans("gaugeChart.pointer_Y"), tooltip: trans("gaugeChart.pointer_Y_Tooltip") })}
207+
{children.pointerIcon.propertyView({ label: trans("gaugeChart.pointerIcon"), tooltip: trans("gaugeChart.pointerIconTooltip") })}
190208
{children.progressBar.getView() && children.progressBarWidth.propertyView({ label: trans("gaugeChart.progressBarWidth"), tooltip: trans("echarts.pointerWidthTooltip") })}
209+
{children.axisTickLength.propertyView({ label: trans("gaugeChart.stageGauge.axisTickLength"), tooltip: trans("gaugeChart.stageGauge.axisTickLengthTooltip") })}
210+
{children.axisTickWidth.propertyView({ label: trans("gaugeChart.stageGauge.axisTickWidth"), tooltip: trans("gaugeChart.stageGauge.axisTickWidthTooltip") })}
211+
{children.axisTickColorGrade.propertyView({ label: trans("gaugeChart.stageGauge.axisTickColor"), tooltip: trans("gaugeChart.stageGauge.axisTickColorTooltip") })}
191212
{/* {children.gap.propertyView({ label: trans("gaugeChart.gap") })} */}
192213
{children.tooltip.propertyView({ label: trans("gaugeChart.tooltip"), tooltip: trans("echarts.tooltipVisibilityTooltip") })}
193-
{children.progressBar.propertyView({ label: trans("gaugeChart.progressBar"), tooltip: trans("echarts.progressBarVisibilityTooltip") })}
194-
{children.roundCap.propertyView({ label: trans("gaugeChart.roundCap"), tooltip: trans("echarts.roundCapVisibilityTooltip") })}
214+
{/*{children.progressBar.propertyView({ label: trans("gaugeChart.progressBar"), tooltip: trans("echarts.progressBarVisibilityTooltip") })}*/}
215+
{/*{children.roundCap.propertyView({ label: trans("gaugeChart.roundCap"), tooltip: trans("echarts.roundCapVisibilityTooltip") })}*/}
195216
</Section>
196217
<Section name={sectionNames.interaction}>
197218
{children.onEvent.propertyView()}
@@ -208,9 +229,9 @@ export function gaugeChartPropertyView(
208229
<Section name={sectionNames.detailStyle}>
209230
{children.legendStyle?.getPropertyView()}
210231
</Section>
211-
<Section name={sectionNames.axisLabelStyle}>
212-
{children.axisLabelStyle?.getPropertyView()}
213-
</Section>
232+
{/*<Section name={sectionNames.axisLabelStyle}>*/}
233+
{/* {children.axisLabelStyle?.getPropertyView()}*/}
234+
{/*</Section>*/}
214235
<Section name={sectionNames.layout}>{hiddenPropertyView(children)}</Section>
215236
</>
216237
);

0 commit comments

Comments
 (0)