fix: refresh model list manually

2025-05-28 17:25:23 +08:00
parent f53fe042a9
commit aa6b5ec24f
5 changed files with 166 additions and 7 deletions
@@ -0,0 +1,129 @@
+import Chart from '@/components/echarts/chart';
+import useChartConfig from '@/components/echarts/config';
+import EmptyData from '@/components/empty-data';
+import _ from 'lodash';
+import React, { memo, useMemo } from 'react';
+import { ChartProps } from './types';
+
+const MixLineBarChart: React.FC<
+  ChartProps & {
+    chartData: {
+      line: any[];
+      bar: any[];
+    };
+  }
+> = (props) => {
+  const {
+    seriesData,
+    xAxisData,
+    yAxisName,
+    height,
+    width,
+    labelFormatter,
+    tooltipValueFormatter = null,
+    legendData = [],
+    smooth,
+    title,
+    chartData
+  } = props;
+  const {
+    grid,
+    legend,
+    lineItemConfig,
+    title: titleConfig,
+    tooltip,
+    xAxis,
+    yAxis
+  } = useChartConfig();
+
+  const { line: lineSeriesData, bar: barSeriesData } = chartData;
+
+  const options = {
+    title: {
+      text: ''
+    },
+    grid,
+    tooltip: {
+      ...tooltip,
+      formatter(params: any) {
+        return tooltipValueFormatter
+          ? tooltip.formatter(params, tooltipValueFormatter)
+          : tooltip.formatter(params);
+      }
+    },
+    xAxis: {
+      ...xAxis,
+      axisLabel: {
+        ...xAxis.axisLabel,
+        formatter: labelFormatter
+      }
+    },
+    yAxis,
+    legend: {
+      ...legend,
+      data: legendData.map((item: any) => {
+        return {
+          name: item,
+          icon: 'circle'
+        };
+      })
+    },
+
+    series: []
+  };
+
+  const dataOptions = useMemo((): any => {
+    const data = _.map(seriesData, (item: any) => {
+      return {
+        ...item,
+        ...lineItemConfig,
+        smooth: smooth,
+        itemStyle: {
+          ...lineItemConfig.itemStyle,
+          color: item.color
+        },
+        lineStyle: {
+          ...lineItemConfig.lineStyle,
+          color: item.color
+        }
+      };
+    });
+    return {
+      ...options,
+      animation: false,
+      title: {
+        ...titleConfig,
+        text: title
+      },
+      yAxis: {
+        ...options.yAxis,
+        name: yAxisName,
+        nameTextStyle: {
+          fontSize: 12,
+          align: 'right'
+        }
+      },
+      xAxis: {
+        ...options.xAxis,
+        data: xAxisData
+      },
+      series: data
+    };
+  }, [seriesData, xAxisData, yAxisName, title, smooth, legendData, options]);
+
+  return (
+    <>
+      {!seriesData.length ? (
+        <EmptyData height={height} title={title}></EmptyData>
+      ) : (
+        <Chart
+          height={height}
+          options={dataOptions}
+          width={width || '100%'}
+        ></Chart>
+      )}
+    </>
+  );
+};
+
+export default memo(MixLineBarChart);