@lingxiteam/ebe-utils 0.5.11 → 0.6.2

package/lib/pcpublic/src/components/pcfactory/src/Radio/index.tsx

@@ -1,8 +1,9 @@
-import { LingxiForwardRef } from '@lingxiteam/types';
 import { Radio as AntdRadio } from 'antd';
-import React, { useEffect, useState } from 'react';
+import React, { useEffect, useMemo, useState } from 'react';
 import { FormFields, getFieldsProps, useCommonImperativeHandle } from '../utils';
+import { LingxiForwardRef } from '@lingxiteam/types';
 import renderReadOnly from '../utils/renderReadOnly';
+import classNames from 'classnames';
 
 export interface RadioProps {
   value?: any;
@@ -69,6 +70,7 @@ const typeFn: any = {
   boolean: Boolean,
 };
 
+
 /**
  * 处理数据
  * @param dataSource 数据源
@@ -76,7 +78,7 @@ const typeFn: any = {
  * @param labelKey
  * @returns
  */
-export const handleDataSource = (dataSource: any[], valueKey?: string, labelKey?: string) => {
+export const handleDataSource = (dataSource: any[], valueKey?: string, labelKey?: string,) => {
   const valueKeys: any = [];
   const newDataSoure: any[] = [];
   if (Array.isArray(dataSource)) {
@@ -154,6 +156,7 @@ const Radio = LingxiForwardRef<any, RadioProps>((props, ref) => {
   const [lKey, setLKey] = useState(labelKey);
   const [vKey, setVKey] = useState(valueKey);
 
+
   const transformValueType = (v: any, curVal: any) => {
     const realValueType = typeof (curVal ?? '');
     if (typeFn[realValueType]) {
@@ -166,14 +169,15 @@ const Radio = LingxiForwardRef<any, RadioProps>((props, ref) => {
     return v;
   };
 
+
   // 处理列表数据
   useEffect(() => {
     const newData = Array.isArray(newDataSoure) ? handleDataSource(newDataSoure, vKey, lKey) : [];
     const valueArray = newData.map(it => it?.value);
-    const targetDefault: { value: string; label: string }[] = [];
+    const targetDefault: { value: string; label:string}[] = [];
     // 自定义数据中若存在和预置数据中相同的value ，则取自定义数据
     if (defaultOptions && defaultOptions.length) {
-      defaultOptions.forEach((item: { value: string; label: string }) => {
+      defaultOptions.forEach((item:{value:string, label:string}) => {
         if (!valueArray.includes(item?.value)) {
           targetDefault.push(item);
         }
@@ -186,6 +190,9 @@ const Radio = LingxiForwardRef<any, RadioProps>((props, ref) => {
 
   const Opt = radioType === 'Radio' ? AntdRadio : Button;
 
+  const isButtonType = useMemo(() => {
+    return ['Radio.Button', 'SplitButton', 'BackgroundButton', 'CircleButton', 'ColorButton', 'BadgeButton'].includes(radioType || '');
+  }, [radioType]);
   return (
     <FormFields
       {...getFieldsProps(props)}
@@ -212,19 +219,21 @@ const Radio = LingxiForwardRef<any, RadioProps>((props, ref) => {
         {...restProps}
         value={value}
         defaultValue={defaultValue}
-        onChange={e => {
+        onChange={(e) => {
           if (onChange) {
             onChange(e);
           }
         }}
+        className={classNames(restProps.className, `ued-radio-${radioType === 'Radio.Button' ? 'button' : radioType}`)}
       >
-        {(dataSource || []).map(c => (
+        {(dataSource || []).map((c) => (
           <Opt
             value={transformValueType(c.value, value)}
             key={c.value}
             disabled={rangeLimit && rangeLimit.length > 0 && !rangeLimit.includes(+c.value)}
             style={{
-              marginRight: radioType === 'Radio.Button' && optionMarginRight ? optionMarginRight : '',
+              marginRight:
+              isButtonType && optionMarginRight ? optionMarginRight : '',
             }}
           >
             {c.label}

package/lib/pcpublic/src/components/pcfactory/src/Rate/index.tsx

@@ -1,9 +1,9 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
-import { LingxiForwardRef } from '@lingxiteam/types';
-import { Rate as AntdRate } from 'antd';
+import React, { useMemo, useCallback } from 'react';
 import type { RateProps } from 'antd/lib/rate';
-import React, { useCallback, useMemo } from 'react';
+import { Rate as AntdRate } from 'antd';
 import { FormFields, getFieldsProps, useCommonImperativeHandle } from '../utils';
+import { LingxiForwardRef } from '@lingxiteam/types';
 import { useLocale } from '../utils/hooks/useLocale';
 
 export interface MyRateProps {
@@ -53,7 +53,13 @@ interface BaseRatePropsType {
 const rateCls = 'ued-rateContainer';
 
 const BaseRate = (props: BaseRatePropsType) => {
-  const { value: originValue, tooltips, onChange, tooltipType = 'custom', ...restProps } = props;
+  const {
+    value: originValue,
+    tooltips,
+    onChange,
+    tooltipType = 'custom',
+    ...restProps
+  } = props;
 
   const value = useMemo(() => {
     return Number(originValue);
@@ -64,18 +70,27 @@ const BaseRate = (props: BaseRatePropsType) => {
       onChange(newValue);
     }
   };
-  const rendeRrightTool = useCallback(() => {
-    switch (tooltipType) {
-      case 'number':
-        return value;
-      case 'none':
-        return null;
-      // 没有tooltipType代表存量数据，按照自定义展示，向上取整
-      case 'custom':
-      default:
-        return value && tooltips && tooltips.length > value - 1 ? tooltips[Math.ceil(+value) - 1] : '';
-    }
-  }, [value, tooltips, tooltipType]);
+  const rendeRrightTool = useCallback(
+    () => {
+      switch (tooltipType) {
+        case 'number':
+          return value;
+        case 'none':
+          return null;
+        // 没有tooltipType代表存量数据，按照自定义展示，向上取整
+        case 'custom':
+        default:
+          return value &&
+            tooltips &&
+            tooltips.length > value - 1 ? (
+              tooltips[Math.ceil(+value) - 1]
+            ) : (
+              ''
+            );
+      }
+    },
+    [value, tooltips, tooltipType],
+  );
   const myTooltips = useMemo(() => {
     switch (tooltipType) {
       case 'number':
@@ -89,7 +104,12 @@ const BaseRate = (props: BaseRatePropsType) => {
   }, [tooltips, tooltipType, restProps.count]);
   return (
     <div className={rateCls}>
-      <AntdRate {...restProps} tooltips={myTooltips} value={value} onChange={val => onStarChange(val)} />
+      <AntdRate
+        {...restProps}
+        tooltips={myTooltips}
+        value={value}
+        onChange={(val) => onStarChange(val)}
+      />
       <span className={`${rateCls}-rateText`}>{rendeRrightTool()}</span>
     </div>
   );
@@ -135,14 +155,13 @@ const Rate = LingxiForwardRef<any, MyRateProps>((props, ref) => {
 
   const { disabled, required, readOnly, formFieldsRef } = useCommonImperativeHandle(ref, props);
 
-  const finalRules = useMemo(
-    () => [
-      {
-        required,
-        message: getLocale?.('notEmpty', { name }),
-      },
-    ],
-    [required, name, lang]
+  const finalRules = useMemo(() => [
+    {
+      required,
+      message: getLocale?.('notEmpty', { name }),
+    },
+  ],
+  [required, name, lang],
   );
 
   return (
@@ -161,7 +180,11 @@ const Rate = LingxiForwardRef<any, MyRateProps>((props, ref) => {
         return val;
       }}
     >
-      <BaseRate tooltips={tooltips} onChange={onChange} {...restProps} />
+      <BaseRate
+        tooltips={tooltips}
+        onChange={onChange}
+        {...restProps}
+      />
     </FormFields>
   );
 });

package/lib/pcpublic/src/components/pcfactory/src/ReactECharts/ReactECharts.tsx

@@ -3,23 +3,28 @@
 /* eslint-disable no-restricted-syntax */
 /* eslint-disable @typescript-eslint/no-for-in-array */
 /* eslint-disable no-underscore-dangle */
+import React, { useEffect, useMemo, useRef, useLayoutEffect } from 'react';
 import { LingXiFC } from '@lingxiteam/types';
-import { BarChart, LineChart, PieChart, RadarChart } from 'echarts/charts';
+import * as echarts from 'echarts/core';
+import { bind, clear } from 'size-sensor';
+import {
+  LineChart,
+  BarChart,
+  PieChart,
+  RadarChart,
+} from 'echarts/charts';
 import {
-  // 数据集组件
-  DatasetComponent,
-  GridComponent,
-  LegendComponent,
   TitleComponent,
   TooltipComponent,
+  GridComponent,
+  // 数据集组件
+  DatasetComponent,
   // 内置数据转换器组件 (filter, sort)
   TransformComponent,
+  LegendComponent,
 } from 'echarts/components';
-import * as echarts from 'echarts/core';
 import { LabelLayout, UniversalTransition } from 'echarts/features';
 import { CanvasRenderer } from 'echarts/renderers';
-import React, { useEffect, useLayoutEffect, useMemo, useRef } from 'react';
-import { bind, clear } from 'size-sensor';
 import { useHiddenStyle, useListenProps } from '../utils';
 import { MyReactEChartsProps } from './PropsType';
 
@@ -45,12 +50,13 @@ echarts.use([
  * 配 api参考echarts官网： https://echarts.apache.org/examples/zh/index.html
  */
 
+
 function arrayToJSON(arr: any[], val: any, obj: any) {
   const result = { ...obj };
   let temp = result;
   for (const key in arr) {
     let len = 0;
-    if (arr.some(i => ['LineChart', 'BarChart', 'PieChart', 'RadarChart'].indexOf(i) > -1)) {
+    if (arr.some((i) => ['LineChart', 'BarChart', 'PieChart', 'RadarChart'].indexOf(i) > -1)) {
       if (Number.isNaN(Number(arr[1]))) {
         len = 1;
       } else {
@@ -78,12 +84,7 @@ export interface ColorStopMap {
 export interface SeriesMap {
   data?: any[];
   type?: string;
-  areaStyle?: {
-    showColor?: boolean;
-    color0?: string;
-    color1?: string;
-    color?: ColorStopMap;
-  };
+  areaStyle?: { showColor?: boolean; color0?: string; color1?: string; color?: ColorStopMap };
   label?: { formatter: any };
   lineStyle?: { color: string };
   itemStyle?: { color: string };
@@ -113,14 +114,14 @@ const ReactECharts: LingXiFC<MyReactEChartsProps> = (props, ref) => {
 
   const [dataSource, setDataSource] = useListenProps(props.dataSource);
 
-  const seriesAttr = Object.keys(props).filter(i => i.indexOf('series') > -1);
-  const pieSeriesAttr = Object.keys(props).filter(i => i.indexOf('pieSeries') > -1);
-  const titleAttr = Object.keys(props).filter(i => i.indexOf('chartTitle') > -1);
-  const legendAttr = Object.keys(props).filter(i => i.indexOf('chartsLegend') > -1);
-  const xAxisAttr = Object.keys(props).filter(i => i.indexOf('chartXAxis') > -1);
-  const yAxisAttr = Object.keys(props).filter(i => i.indexOf('chartYAxis') > -1);
-  const gridAttr = Object.keys(props).filter(i => i.indexOf('chartGrid') > -1);
-  const tooltipAttr = Object.keys(props).filter(i => i.indexOf('chartTooltip') > -1);
+  const seriesAttr = Object.keys(props).filter((i) => i.indexOf('series') > -1);
+  const pieSeriesAttr = Object.keys(props).filter((i) => i.indexOf('pieSeries') > -1);
+  const titleAttr = Object.keys(props).filter((i) => i.indexOf('chartTitle') > -1);
+  const legendAttr = Object.keys(props).filter((i) => i.indexOf('chartsLegend') > -1);
+  const xAxisAttr = Object.keys(props).filter((i) => i.indexOf('chartXAxis') > -1);
+  const yAxisAttr = Object.keys(props).filter((i) => i.indexOf('chartYAxis') > -1);
+  const gridAttr = Object.keys(props).filter((i) => i.indexOf('chartGrid') > -1);
+  const tooltipAttr = Object.keys(props).filter((i) => i.indexOf('chartTooltip') > -1);
   const finalStyle = useHiddenStyle(visible, style);
   const chartRef = useRef<HTMLDivElement>(null);
   const chartNode = useRef<echarts.EChartsType>();
@@ -147,11 +148,20 @@ const ReactECharts: LingXiFC<MyReactEChartsProps> = (props, ref) => {
     }
     if (['bar', 'line'].includes(type)) {
       if (isDataMap) {
-        xAxislength = dataMapColumns.map(i => i.keyVal)?.filter(j => j.indexOf('x') > -1)?.length;
-        yAxislength = dataMapColumns.map(i => i.keyVal)?.filter(j => j !== 'key' && j.indexOf('y') > -1)?.length;
+        xAxislength = dataMapColumns
+          .map((i) => i.keyVal)
+          ?.filter((j) => j.indexOf('x') > -1)?.length;
+        yAxislength = dataMapColumns
+          .map((i) => i.keyVal)
+          ?.filter((j) => j !== 'key' && j.indexOf('y') > -1)?.length;
       } else {
-        xAxislength = Array.isArray(chartData) ? Object.keys(chartData[0] || {})?.filter(i => i.indexOf('x') > -1)?.length : 1;
-        yAxislength = Array.isArray(chartData) ? Object.keys(chartData[0] || {})?.filter(i => i !== 'key' && i.indexOf('y') > -1)?.length : 1;
+        xAxislength = Array.isArray(chartData)
+          ? Object.keys(chartData[0] || {})?.filter((i) => i.indexOf('x') > -1)?.length
+          : 1;
+        yAxislength = Array.isArray(chartData)
+          ? Object.keys(chartData[0] || {})?.filter((i) => i !== 'key' && i.indexOf('y') > -1)
+            ?.length
+          : 1;
       }
       return {
         datasource: Array.isArray(chartData) ? chartData : [],
@@ -165,7 +175,7 @@ const ReactECharts: LingXiFC<MyReactEChartsProps> = (props, ref) => {
   const transferDataMap: { name?: any; value?: any; x?: any } = useMemo(() => {
     let obj = {};
     if (isDataMap) {
-      dataMapColumns.forEach(item => {
+      dataMapColumns.forEach((item) => {
         obj = {
           ...obj,
           [item.keyVal]: item.attrVal,
@@ -208,11 +218,8 @@ const ReactECharts: LingXiFC<MyReactEChartsProps> = (props, ref) => {
       // const xItem0=getNestObj(xAxisAttr.filter((attr) => attr.indexOf(`chartXAxis0`) > -1));
       // const len=xItem0.type === 'value'?yAxislen:xAxislen;
       for (let i = 0; i < yAxisNum; i += 1) {
-        const xAxisItem = xAxisAttr.filter(attr => attr.indexOf(`chartXAxis${i}`) > -1);
-        let obj: { type?: string; data?: any[] } = {
-          type: 'category',
-          ...getNestObj(xAxisItem),
-        };
+        const xAxisItem = xAxisAttr.filter((attr) => attr.indexOf(`chartXAxis${i}`) > -1);
+        let obj: { type?: string; data?: any[] } = { type: 'category', ...getNestObj(xAxisItem) };
         if (obj.type === 'value' && +i === +yAxislen) {
           break;
         } else {
@@ -224,7 +231,7 @@ const ReactECharts: LingXiFC<MyReactEChartsProps> = (props, ref) => {
               ...obj,
               data:
                 datasource?.map((j: Record<string, any>) =>
-                  i < 1 ? j[transferDataMap.x || 'x'] : j[(transferDataMap as any)[`x${i}`] || `x${i}`]
+                  i < 1 ? j[transferDataMap.x || 'x'] : j[(transferDataMap as any)[`x${i}`] || `x${i}`],
                 ) || [],
             };
           } else {
@@ -247,12 +254,8 @@ const ReactECharts: LingXiFC<MyReactEChartsProps> = (props, ref) => {
       // const yItem0=getNestObj(yAxisAttr.filter((attr) => attr.indexOf(`chartYAxis0`) > -1));
       // const len=yItem0.type === 'category'?xAxislen:yAxislen;
       for (let i = 0; i < yAxisNum; i += 1) {
-        const yAxisItem = yAxisAttr.filter(attr => attr.indexOf(`chartYAxis${i}`) > -1);
-        let obj: {
-          type?: string;
-          axisLabel?: { formatter?: string };
-          data?: any[];
-        } = {
+        const yAxisItem = yAxisAttr.filter((attr) => attr.indexOf(`chartYAxis${i}`) > -1);
+        let obj: { type?: string; axisLabel?: { formatter?: string }; data?: any[] } = {
           type: 'value',
           ...getNestObj(yAxisItem),
         };
@@ -276,7 +279,7 @@ const ReactECharts: LingXiFC<MyReactEChartsProps> = (props, ref) => {
               ...obj,
               data:
                 datasource?.map((j: Record<string, any>) =>
-                  i < 1 ? j[transferDataMap.x || 'x'] : j[(transferDataMap as any)[`x${i}`] || `x${i}`]
+                  i < 1 ? j[transferDataMap.x || 'x'] : j[(transferDataMap as any)[`x${i}`] || `x${i}`],
                 ) || [],
             };
           } else {
@@ -295,12 +298,7 @@ const ReactECharts: LingXiFC<MyReactEChartsProps> = (props, ref) => {
   }, [yAxisAttr, transferDataMap, isDataMap]);
 
   const chartTooltip = useMemo(() => {
-    const obj: {
-      position?: any;
-      formatter?: any;
-      padding?: any;
-      trigger?: string;
-    } = getNestObj(tooltipAttr);
+    const obj: { position?: any; formatter?: any; padding?: any; trigger?: string; } = getNestObj(tooltipAttr);
     if (obj.position) {
       obj.position = Array.isArray(obj.position) ? obj.position : obj.position?.split(',') || undefined;
     } else {
@@ -319,10 +317,10 @@ const ReactECharts: LingXiFC<MyReactEChartsProps> = (props, ref) => {
           let item = {};
           if (type === 'pie') {
             const xval = isDataMap ? transferDataMap.name : 'name';
-            item = newdata.find(i => i[xval] === params?.name);
+            item = newdata.find((i) => i[xval] === params?.name);
           } else {
             const xval = isDataMap ? transferDataMap.x : 'x';
-            item = newdata.find(i => i[xval] === params?.name);
+            item = newdata.find((i) => i[xval] === params?.name);
           }
           formatter = sandBoxSafeRun(`(${obj.formatter})`);
           if (typeof formatter === 'function') {
@@ -390,61 +388,56 @@ const ReactECharts: LingXiFC<MyReactEChartsProps> = (props, ref) => {
         ...
       }],
    */
-
+  
   // @ts-ignore
   const chartSeries = useMemo(() => {
     if (datasource) {
       if (['bar', 'line'].includes(type)) {
         const series = [];
         for (let i = 0; i < yAxislen; i += 1) {
-          const seriesItem = seriesAttr.filter(attr => attr.indexOf(`series${i}`) > -1);
+          const seriesItem = seriesAttr.filter((attr) => attr.indexOf(`series${i}`) > -1);
           let obj: SeriesMap = getNestObj(seriesItem);
           obj = {
             type,
             ...obj,
-            data:
-              datasource?.map((j: Record<string, any>) => {
-                if (Object.prototype.toString.call(chartColor) === '[object Object]') {
-                  if (chartColor.targetVal) {
-                    const itemStyle = sandBoxSafeRun(chartColor.targetVal, {
-                      charItem: j,
-                    });
-                    if (typeof itemStyle === 'string') {
-                      return {
-                        value: j[`y${i}`],
-                        itemStyle: {
-                          color: itemStyle,
-                        },
-                      };
-                    }
-                    if (Object.prototype.toString.call(itemStyle) === '[object Object]') {
-                      return {
-                        value: j[`y${i}`],
-                        itemStyle,
-                      };
-                    }
+            data: datasource?.map((j: Record<string, any>) => {
+              if (Object.prototype.toString.call(chartColor) === '[object Object]') {
+                if (chartColor.targetVal) {
+                  const itemStyle = sandBoxSafeRun(chartColor.targetVal, { charItem: j });
+                  if (typeof itemStyle === 'string') {
+                    return {
+                      value: j[`y${i}`],
+                      itemStyle: {
+                        color: itemStyle,
+                      },
+
+                    };
+                  } if (Object.prototype.toString.call(itemStyle) === '[object Object]') {
+                    return {
+                      value: j[`y${i}`],
+                      itemStyle,
+                    };
                   }
                 }
-                return j[`y${i}`];
-              }) || [],
+              }
+              return j[`y${i}`];
+            }) || [],
           };
           if (isDataMap) {
             obj.data =
               datasource?.map((j: Record<string, any>) => {
                 if (Object.prototype.toString.call(chartColor) === '[object Object]') {
                   if (chartColor.targetVal) {
-                    const itemStyle = sandBoxSafeRun(chartColor.targetVal, {
-                      charItem: j,
-                    });
+                    const itemStyle = sandBoxSafeRun(chartColor.targetVal, { charItem: j });
                     if (typeof itemStyle === 'string') {
                       return {
                         value: j[(transferDataMap as any)[`y${i}`] || `y${i}`],
                         itemStyle: {
                           color: itemStyle,
                         },
+  
                       };
-                    }
-                    if (Object.prototype.toString.call(itemStyle) === '[object Object]') {
+                    } if (Object.prototype.toString.call(itemStyle) === '[object Object]') {
                       return {
                         value: j[(transferDataMap as any)[`y${i}`] || `y${i}`],
                         itemStyle,
@@ -497,7 +490,7 @@ const ReactECharts: LingXiFC<MyReactEChartsProps> = (props, ref) => {
             let item: any = {};
             const xval = isDataMap ? transferDataMap.x : 'x';
             obj.label.formatter = function (params: { name: string; value: string }) {
-              item = newdata.find(i => i[xval] === params.name);
+              item = newdata.find((i) => i[xval] === params.name);
               return item[`percent${i}`] ? `${item[`percent${i}`]}%` : `${params.value}%`;
             };
           } else if (obj.label?.formatter === 'labvalue') {
@@ -517,18 +510,16 @@ const ReactECharts: LingXiFC<MyReactEChartsProps> = (props, ref) => {
         let obj: SeriesMap = { type: 'pie' };
         let newDataSource = [...datasource];
         if (isDataMap) {
-          newDataSource = newDataSource.map(item => ({
+          newDataSource = newDataSource.map((item) => ({
             name: item[transferDataMap.name || 'name'],
             value: item[transferDataMap.value || 'value'],
           }));
         }
-        obj = {
-          ...obj,
-          ...getNestObj(pieSeriesAttr),
-          data: newDataSource || [],
-        };
+        obj = { ...obj, ...getNestObj(pieSeriesAttr), data: newDataSource || [] };
         obj.radius = Array.isArray(obj.radius) ? obj.radius : obj.radius?.split(',') || [0, '75%'];
-        obj.center = Array.isArray(obj.center) ? obj.center : obj.center?.split(',') || ['50%', '50%'];
+        obj.center = Array.isArray(obj.center)
+          ? obj.center
+          : obj.center?.split(',') || ['50%', '50%'];
         if (obj.label?.formatter === 'value') {
           obj.label.formatter = function (param: { value: any }) {
             return param.value;
@@ -573,7 +564,17 @@ const ReactECharts: LingXiFC<MyReactEChartsProps> = (props, ref) => {
     } else {
       finalOption = {
         ...finalOption,
-        color: ['#5470c6', '#91cc75', '#fac858', '#ee6666', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc'],
+        color: [
+          '#5470c6',
+          '#91cc75',
+          '#fac858',
+          '#ee6666',
+          '#73c0de',
+          '#3ba272',
+          '#fc8452',
+          '#9a60b4',
+          '#ea7ccc',
+        ],
       };
     }
     return finalOption;
@@ -585,6 +586,7 @@ const ReactECharts: LingXiFC<MyReactEChartsProps> = (props, ref) => {
     }
   }, [refDataReload]);
 
+
   useEffect(() => {
     if (chartNode && chartNode.current) {
       const chartInst = chartNode.current;

package/lib/pcpublic/src/components/pcfactory/src/ReactECharts/index.tsx

@@ -1,5 +1,5 @@
+import React, { useState, useImperativeHandle } from 'react';
 import { LingxiForwardRef } from '@lingxiteam/types';
-import React, { useImperativeHandle, useState } from 'react';
 import ReactEChartsLoader from './loader';
 import { MyReactEChartsProps } from './PropsType';
 

package/lib/pcpublic/src/components/pcfactory/src/ReactECharts/loader.tsx

@@ -2,7 +2,7 @@ import Loadable from 'react-loadable';
 import { LoadingComponennt } from '../utils/LoaderHelper';
 
 const ReactChartsLoader = Loadable({
-  loader: async () => (await import(/* webpackChunkName: 'pcFactory-ReactECharts' */ './ReactECharts')) as unknown as React.ComponentType<any>,
+  loader: async () => (await import/* webpackChunkName: 'pcFactory-ReactECharts' */('./ReactECharts')) as unknown as React.ComponentType<any>,
   loading: LoadingComponennt,
 });
 

package/lib/pcpublic/src/components/pcfactory/src/RemoteComponent/components/FishRender.tsx

@@ -3,10 +3,11 @@ import { ReactLoadFish } from '@lingxiteam/load-framework';
 import { LingXiFC } from '@lingxiteam/types';
 import { Empty, Spin } from 'antd';
 
+
 export interface FishRenderProps {
   url: string;
   customProps: any;
-  engineType: 'editor' | 'engine';
+  engineType: 'editor' | 'engine'
 }
 
 const FishRender: LingXiFC<FishRenderProps> = props => {

package/lib/pcpublic/src/components/pcfactory/src/RemoteComponent/components/ReactRender.tsx

@@ -1,10 +1,10 @@
 import React from 'react';
+import { useDynamicData } from '../../utils';
+import { useForm } from '../../utils/formUtils/FormContext';
 import { LingXiFC } from '@lingxiteam/types';
 import { createRequires } from '@paciolan/remote-component/dist/createRequires';
 import { createUseRemoteComponent } from '@paciolan/remote-component/dist/hooks/useRemoteComponent';
 import { Empty, Spin } from 'antd';
-import { useDynamicData } from '../../utils';
-import { useForm } from '../../utils/formUtils/FormContext';
 import RemoteCompConfig from '../remote-component.config';
 
 export const getUseRemoteComponent = (config: any) => {
@@ -18,13 +18,13 @@ export interface MyRemoteComponentProps {
   useRemoteComponent?: any; // 自定义组件调用依赖的模块，可由调用方传入
   forwardRef?: any;
   // 如果在动态容器里面，传入表单的name
-  name?: string;
+  name?: string,
   // 如果在动态容器里面，传入表单fieldName
-  fieldName?: string;
+  fieldName?: string,
 }
 
 // const prefixCls = 'remoteComponent';
-const RemoteComponent: LingXiFC<MyRemoteComponentProps> = props => {
+const RemoteComponent: LingXiFC<MyRemoteComponentProps> = (props) => {
   const { url, customProps, getEngineApis, name, fieldName, ...restProps } = props;
 
   const engineApis = getEngineApis?.() || {};
@@ -44,19 +44,19 @@ const RemoteComponent: LingXiFC<MyRemoteComponentProps> = props => {
     if (err) {
       console.warn('自定义组件报错:', err);
     }
-    return <Empty description={engineApis?.getLocale?.('RemoteComponent.fail')} image={Empty.PRESENTED_IMAGE_SIMPLE} />;
+    return (
+      <Empty
+        description={engineApis?.getLocale?.('RemoteComponent.fail')}
+        image={Empty.PRESENTED_IMAGE_SIMPLE}
+      />
+    );
   }
   return (
     <Component
       {...restProps}
       {...customProps}
       getEngineApis={getEngineApis}
-      $lxApi={{
-        form: dynamicDataContext.form,
-        formCode: formContext.formCode,
-        name,
-        fieldName,
-      }}
+      $lxApi={{ form: dynamicDataContext.form, formCode: formContext.formCode, name, fieldName }}
       ref={props.forwardRef}
     />
   );