feat(dashboard): replace echartsOptions with getEchartsOptions

Author: GerilLeto

dashboard/src/components/panel/panel-editor/dropdown-menu-items/dropdown-menu-items.tsx

@@ -10,7 +10,6 @@ type Props = {
 
 export const PanelDropdownMenuItems = observer(({ view }: Props) => {
   const { getEchartsOptions, panel } = useRenderPanelContext();
-  const echartsOptions = getEchartsOptions();
   const items = useItems(view);
-  return items.map((item) => item.render({ echartsOptions, inEditMode: true, panelID: panel.id, viewID: view.id }));
+  return items.map((item) => item.render({ getEchartsOptions, inEditMode: true, panelID: panel.id, viewID: view.id }));
 });

dashboard/src/components/panel/panel-render/dropdown-menu-items/dropdown-menu-items.tsx

@@ -10,7 +10,6 @@ type Props = {
 
 export const PanelDropdownMenuItems = observer(({ view }: Props) => {
   const { getEchartsOptions, panel } = useRenderPanelContext();
-  const echartsOptions = getEchartsOptions();
   const items = useItems(view);
-  return items.map((item) => item.render({ echartsOptions, inEditMode: false, panelID: panel.id, viewID: view.id }));
+  return items.map((item) => item.render({ getEchartsOptions, inEditMode: false, panelID: panel.id, viewID: view.id }));
 });

dashboard/src/types/dashboard.ts

@@ -100,7 +100,7 @@ export type DashboardContentDBType = {
 export type PanelMenuItem = {
   order: number;
   render: (props: {
-    echartsOptions: EChartsOption | null;
+    getEchartsOptions: () => EChartsOption | null;
     inEditMode: boolean;
     panelID: string;
     viewID: string;

website/src/pages/dashboard-render-page/content.tsx

@@ -13,8 +13,8 @@ import './content.css';
 import { DashboardIsEmpty } from './placeholder';
 import { useLanguageContext } from '../../contexts';
 
-const DownloadChartData: PanelMenuItem['render'] = ({ echartsOptions }) => {
-  return <Menu.Item onClick={() => console.log(echartsOptions)}>下载图表数据</Menu.Item>;
+const DownloadChartData: PanelMenuItem['render'] = ({ getEchartsOptions }) => {
+  return <Menu.Item onClick={() => console.log(getEchartsOptions())}>下载图表数据</Menu.Item>;
 };
 
 const items = [