feat: 控件与组件交互

src/hooks/events.hook.ts

@@ -0,0 +1,23 @@
+import { computed, toRefs } from 'vue'
+import { CreateComponentType } from '@/packages/index.d'
+import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
+
+// 获取类型
+type ChartEditStoreType = typeof useChartEditStore
+
+// Params 参数修改触发api更新图表请求
+export const eventsCreate = (chartConfig: CreateComponentType, useChartEditStore: ChartEditStoreType, param: { [name: string]: string }, onEvevnt: string) => {
+  const chartEditStore = useChartEditStore()
+  const { eventsFn } = chartConfig.events
+  const fnOnEvevnt = eventsFn.filter((item) => {
+    return item.on === onEvevnt
+  }) || []
+  if (fnOnEvevnt.length === 0) return
+  fnOnEvevnt.forEach((item) => {
+    const index = chartEditStore.fetchTargetIndex(item.components)
+    const { Params } = toRefs(chartEditStore.componentList[index].request.requestParams)
+    Object.keys(item.fn).forEach((key) => {
+      Params.value[key] = param[item.fn[key]]
+    })
+  })
+}

src/hooks/index.ts

@@ -4,4 +4,5 @@ export * from '@/hooks/useCode.hook'
 export * from '@/hooks/useChartDataFetch.hook'
 export * from '@/hooks/useChartDataPondFetch.hook'
 export * from '@/hooks/useLifeHandler.hook'
-export * from '@/hooks/useLang.hook'
+export * from '@/hooks/useLang.hook'
+export * from '@/hooks/events.hook'

src/hooks/useChartDataFetch.hook.ts

@@ -1,4 +1,4 @@
-import { ref, toRefs, toRaw } from 'vue'
+import { ref, toRefs, toRaw, watch } from 'vue'
 import type VChart from 'vue-echarts'
 import { customizeHttp } from '@/api/http'
 import { useChartDataPondFetch } from '@/hooks/'
@@ -89,6 +89,13 @@ export const useChartDataFetch = (
 
         // 立即调用
         fetchFn()
+
+
+        watch(() => targetComponent.request, () => {
+          fetchFn()
+        }, {
+          deep: true
+        })
         // 定时时间
         const time = targetInterval && targetInterval.value ? targetInterval.value : globalRequestInterval.value
         // 单位