Commit 9c90106cf9257a03698ec669313fb70109fa02ff
1 parent
680eaf2f
fix: data component history trend moadal on close not destory echarts instance
Showing
2 changed files
with
22 additions
and
5 deletions
| ... | ... | @@ -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" | ... | ... |