feat: 数据加工钩子支持获取接口返回的数据 (#2274)

* feat: 数据加工钩子支持获取接口返回的数据

* 参数传错了

* chore: chart 的dom 不要切换, 方便编辑器标记dom

scss/components/_chart.scss

@@ -9,4 +9,12 @@
     left: 50%;
     transform: translate(-50%, -50%);
   }
+
+  &-content {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+  }
 }

src/renderers/Chart.tsx

@@ -148,7 +148,7 @@ export interface ChartProps
   extends RendererProps,
     Omit<ChartSchema, 'type' | 'className'> {
   chartRef?: (echart: any) => void;
-  onDataFilter?: (config: any, echarts: any) => any;
+  onDataFilter?: (config: any, echarts: any, data?: any) => any;
   onChartWillMount?: (echarts: any) => void | Promise<void>;
   onChartMount?: (chart: any, echarts: any) => void;
   onChartUnMount?: (chart: any, echarts: any) => void;
@@ -388,7 +388,12 @@ export class Chart extends React.Component<ChartProps> {
     const dataFilter = this.props.dataFilter;
 
     if (!onDataFilter && typeof dataFilter === 'string') {
-      onDataFilter = new Function('config', 'echarts', dataFilter) as any;
+      onDataFilter = new Function(
+        'config',
+        'echarts',
+        'data',
+        dataFilter
+      ) as any;
     }
 
     config = config || this.pending;
@@ -399,7 +404,8 @@ export class Chart extends React.Component<ChartProps> {
     }
     try {
       onDataFilter &&
-        (config = onDataFilter(config, (window as any).echarts) || config);
+        (config =
+          onDataFilter(config, (window as any).echarts, data) || config);
     } catch (e) {
       console.warn(e);
     }
@@ -445,10 +451,10 @@ export class Chart extends React.Component<ChartProps> {
     height && (style.height = height);
 
     return (
-      <LazyComponent
-        unMountOnHidden={unMountOnHidden}
-        placeholder={
-          <div className={cx(`${ns}Chart`, className)} style={style}>
+      <div className={cx(`${ns}Chart`, className)} style={style}>
+        <LazyComponent
+          unMountOnHidden={unMountOnHidden}
+          placeholder={
             <div className={`${ns}Chart-placeholder`}>
               <Spinner
                 show
@@ -456,16 +462,12 @@ export class Chart extends React.Component<ChartProps> {
                 spinnerClassName={cx('Chart-spinner')}
               />
             </div>
-          </div>
-        }
-        component={() => (
-          <div
-            className={cx(`${ns}Chart`, className)}
-            style={style}
-            ref={this.refFn}
-          />
-        )}
-      />
+          }
+          component={() => (
+            <div className={`${ns}Chart-content`} ref={this.refFn}></div>
+          )}
+        />
+      </div>
     );
   }
 }