fix: explore chart color and range add changes fixed

intellica-tech · Apr 4, 2024 · e5d645c · e5d645c
1 parent ef794cc
commit e5d645c
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 4 deletions.
diff --git a/superset-frontend/src/pages/DvtChart/dvtChartData.ts b/superset-frontend/src/pages/DvtChart/dvtChartData.ts
@@ -17,6 +17,12 @@ interface ValuesProps {
   number?: boolean;
 }
 
+interface RangeConfigProps {
+  min: number;
+  max: number;
+  step: number;
+}
+
 interface FormsProps {
   status:
     | 'input'
@@ -42,6 +48,7 @@ interface FormsProps {
   options?: OptionsData[];
   number?: boolean;
   values?: ValuesProps[];
+  rangeConfig?: RangeConfigProps;
 }
 
 interface CollapsesProps {

diff --git a/superset-frontend/src/pages/DvtChart/dvtChartDataCustomize.ts b/superset-frontend/src/pages/DvtChart/dvtChartDataCustomize.ts
@@ -17,6 +17,12 @@ interface ValuesProps {
   number?: boolean;
 }
 
+interface RangeConfigProps {
+  min: number;
+  max: number;
+  step: number;
+}
+
 interface FormsProps {
   status:
     | 'input'
@@ -42,6 +48,7 @@ interface FormsProps {
   options?: OptionsData[];
   number?: boolean;
   values?: ValuesProps[];
+  rangeConfig?: RangeConfigProps;
 }
 
 interface CollapsesProps {
@@ -464,15 +471,21 @@ const DvtChartCustomize: DvtChartCustomizeProps[] = [
         collapse_popper_error: t('This section contains validation errors'),
         collapse_active: 'query',
         forms: [
-          formDimensions,
-          formMetric,
-          formFilters,
-          formRowLimit,
           {
             label: t('SORT BY METRIC'),
             name: 'sort_by_metric',
             status: 'checkbox',
           },
+          {
+            label: t('OUTER RADIUS'),
+            name: 'outerRadius',
+            status: 'range',
+            rangeConfig: {
+              min: 10,
+              max: 100,
+              step: 1,
+            },
+          },
         ],
       },
     ],

diff --git a/superset-frontend/src/pages/DvtChart/index.tsx b/superset-frontend/src/pages/DvtChart/index.tsx
@@ -27,6 +27,8 @@ import DvtButtonTabs, {
 import DvtSelect from 'src/components/DvtSelect';
 import DvtInputSelect from 'src/components/DvtInputSelect';
 import DvtInputDrop from 'src/components/DvtInputDrop';
+import DvtColorSelect from 'src/components/DvtColorSelect';
+import DvtRange from 'src/components/DvtRange';
 import DvtSpinner from 'src/components/DvtSpinner';
 import ChartContainer from 'src/components/Chart/ChartContainer';
 import moment from 'moment';
@@ -1635,6 +1637,29 @@ const DvtChart = () => {
                           ))}
                         </CreateChartCenterCollapseInGapFlexRow>
                       )}
+                      {fItem.status === 'color' && (
+                        <DvtColorSelect
+                          label={fItem.label}
+                          popoverLabel={fItem.popper}
+                          value={values[fItem.name]}
+                          setValue={v =>
+                            setValues({ ...values, [fItem.name]: v })
+                          }
+                        />
+                      )}
+                      {fItem.status === 'range' && (
+                        <DvtRange
+                          label={fItem.label}
+                          popoverLabel={fItem.popper}
+                          value={values[fItem.name]}
+                          setValue={v =>
+                            setValues({ ...values, [fItem.name]: v })
+                          }
+                          min={fItem.rangeConfig?.min || 0}
+                          max={fItem.rangeConfig?.max || 0}
+                          step={fItem.rangeConfig?.step || 0}
+                        />
+                      )}
                     </div>
                   ))}
               </CreateChartCenterCollapseInGap>