feat: 新增动态接口过滤器功能

src/hooks/useChartDataFetch.hook.ts

@@ -4,11 +4,12 @@ import { http } from '@/api/http'
 import { CreateComponentType, ChartFrameEnum } from '@/packages/index.d'
 import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
 import { RequestDataTypeEnum } from '@/enums/httpEnum'
-import { isPreview } from '@/utils'
+import { isPreview, newFunctionHandle } from '@/utils'
 
 // 获取类型
 type ChartEditStoreType = typeof useChartEditStore
 
+
 /**
  * setdata 数据监听与更改
  * @param targetComponent
@@ -23,26 +24,23 @@ export const useChartDataFetch = (
   const vChartRef = ref<typeof VChart | null>(null)
   let fetchInterval: any = 0
 
-  const requestInterval = () => {
+  const requestIntervalFn = () => {
     const chartEditStore = useChartEditStore()
-    const { requestOriginUrl, requestInterval } = toRefs(
-      chartEditStore.getRequestGlobalConfig
-    )
+    const { requestOriginUrl, requestInterval } = toRefs(chartEditStore.getRequestGlobalConfig)
     // 组件类型
     const { chartFrame } = targetComponent.chartConfig
     // 请求配置
-    const { requestDataType, requestHttpType, requestUrl } = toRefs(
-      targetComponent.data
-    )
+    const { requestDataType, requestHttpType, requestUrl } = toRefs(targetComponent.data)
     // 非请求类型
     if (requestDataType.value !== RequestDataTypeEnum.AJAX) return
     // 处理地址
     if (requestUrl?.value && requestInterval.value > 0) {
       // requestOriginUrl 允许为空
-      const completePath =
-        requestOriginUrl && requestOriginUrl.value + requestUrl.value
+      const completePath = requestOriginUrl && requestOriginUrl.value + requestUrl.value
       if (!completePath) return
 
+      clearInterval(fetchInterval)
+
       const fetchFn = async () => {
         const res: any = await http(requestHttpType.value)(completePath || '', {})
         if (res.data) {
@@ -54,7 +52,8 @@ export const useChartDataFetch = (
               // eCharts 组件配合 vChart 库更新方式
               if (chartFrame === ChartFrameEnum.ECHARTS) {
                 if (vChartRef.value) {
-                  vChartRef.value.setOption({ dataset: res.data })
+                  const filter = targetComponent.filter
+                  vChartRef.value.setOption({ dataset: newFunctionHandle(res.data, filter) })
                 }
               }
             }
@@ -63,16 +62,15 @@ export const useChartDataFetch = (
           }
         }
       }
-      
+
       // 立即调用
       fetchFn()
       // 开启定时
-      setInterval(fetchFn, requestInterval.value * 1000)
+      fetchInterval = setInterval(fetchFn, requestInterval.value * 1000)
     }
   }
 
-  isPreview() && requestInterval()
-     
+  isPreview() && requestIntervalFn()
 
   return { vChartRef }
 }