Commit 9c90106cf9257a03698ec669313fb70109fa02ff

Authored by ww
1 parent 680eaf2f

fix: data component history trend moadal on close not destory echarts instance

... ... @@ -62,7 +62,6 @@ export function useECharts(
62 62 }
63 63 nextTick(() => {
64 64 useTimeoutFn(() => {
65   - console.log(chartInstance);
66 65 if (!chartInstance) {
67 66 initCharts(getDarkMode.value as 'default');
68 67
... ... @@ -71,7 +70,6 @@ export function useECharts(
71 70 clear && chartInstance?.clear();
72 71
73 72 chartInstance?.setOption(unref(getOptions));
74   - chartInstance = null;
75 73 }, 30);
76 74 });
77 75 }
... ... @@ -105,10 +103,17 @@ export function useECharts(
105 103 return chartInstance;
106 104 }
107 105
  106 + function destory() {
  107 + if (!chartInstance) return;
  108 + chartInstance.dispose();
  109 + chartInstance = null;
  110 + }
  111 +
108 112 return {
109 113 setOptions,
110 114 resize,
111 115 echarts,
112 116 getInstance,
  117 + destory,
113 118 };
114 119 }
... ...
... ... @@ -28,7 +28,7 @@
28 28 const { deviceAttrs, getDeviceKeys, getSearchParams, setChartOptions, getDeviceAttribute } =
29 29 useHistoryData();
30 30
31   - const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
  31 + const { setOptions, destory } = useECharts(chartRef as Ref<HTMLDivElement>);
32 32
33 33 function hasDeviceAttr() {
34 34 if (!unref(deviceAttrs).length) {
... ... @@ -133,7 +133,7 @@
133 133 for (const item of dataSource) {
134 134 const { deviceName, gatewayDevice, slaveDeviceId, organizationId } = item;
135 135 let { deviceId } = item;
136   - if (gatewayDevice) {
  136 + if (gatewayDevice && slaveDeviceId) {
137 137 deviceId = slaveDeviceId;
138 138 }
139 139 if (record[deviceId]) continue;
... ... @@ -177,10 +177,22 @@
177 177
178 178 await handleModalOpen();
179 179 });
  180 +
  181 + const handleCancel = () => {
  182 + destory();
  183 + };
180 184 </script>
181 185
182 186 <template>
183   - <BasicModal @register="registerModal" :destroy-on-close="true" width="70%" title="历史趋势">
  187 + <BasicModal
  188 + @register="registerModal"
  189 + @cancel="handleCancel"
  190 + :destroy-on-close="true"
  191 + :show-ok-btn="false"
  192 + cancel-text="关闭"
  193 + width="70%"
  194 + title="历史趋势"
  195 + >
184 196 <section
185 197 class="flex flex-col p-4 h-full w-full min-w-7/10"
186 198 style="color: #f0f2f5; background-color: #f0f2f5"
... ...