Commit 4296b00683a01897cfbfc84a2d87558fc4e8a4bf
Merge branch 'ft' into 'main_dev'
fix(src/hooks/): 修复自定义下拉选择器和图表或其他组件一起分组,api接口联动失效问题 See merge request yunteng/thingskit-view!102
Showing
4 changed files
with
43 additions
and
14 deletions
| @@ -2,7 +2,7 @@ | @@ -2,7 +2,7 @@ | ||
| 2 | * 重写select下拉框联动 | 2 | * 重写select下拉框联动 |
| 3 | */ | 3 | */ |
| 4 | import {toRefs} from 'vue' | 4 | import {toRefs} from 'vue' |
| 5 | -import {CreateComponentType} from '@/packages/index.d' | 5 | +import {CreateComponentGroupType, CreateComponentType} from '@/packages/index.d' |
| 6 | import {useChartEditStore} from '@/store/modules/chartEditStore/chartEditStore' | 6 | import {useChartEditStore} from '@/store/modules/chartEditStore/chartEditStore' |
| 7 | 7 | ||
| 8 | // 获取类型 | 8 | // 获取类型 |
| @@ -20,19 +20,27 @@ export const useChartInteract = ( | @@ -20,19 +20,27 @@ export const useChartInteract = ( | ||
| 20 | const fnOnEvent = interactEvents.filter(item => { | 20 | const fnOnEvent = interactEvents.filter(item => { |
| 21 | return item.interactOn === interactEventOn | 21 | return item.interactOn === interactEventOn |
| 22 | }) | 22 | }) |
| 23 | - | ||
| 24 | if (fnOnEvent.length === 0) return | 23 | if (fnOnEvent.length === 0) return |
| 25 | - fnOnEvent.forEach(async (item) => { | 24 | + fnOnEvent.forEach((item) => { |
| 26 | const index = chartEditStore.fetchTargetIndex(item.interactComponentId) | 25 | const index = chartEditStore.fetchTargetIndex(item.interactComponentId) |
| 27 | if (index === -1) return | 26 | if (index === -1) return |
| 28 | - const {Params, Header} = toRefs(chartEditStore.componentList[index].request.requestParams) | ||
| 29 | - Object.keys(item.interactFn).forEach(key => { | 27 | + //支持分组 |
| 28 | + const target = chartEditStore.getComponentList?.reduce((prev: Array<CreateComponentType | CreateComponentGroupType>, acc) => { | ||
| 29 | + acc?.isGroup ? (prev = [...(acc?.groupList as CreateComponentGroupType[])]) : prev?.push(acc) | ||
| 30 | + return prev | ||
| 31 | + }, []) | ||
| 32 | + target?.forEach((targetItem)=>{ | ||
| 33 | + if(targetItem.id!==chartConfig.id){ | ||
| 34 | + const {Params, Header} = toRefs(targetItem.request.requestParams) | ||
| 35 | + Object.keys(item.interactFn).forEach(key => { | ||
| 30 | if (Params.value[key]) { | 36 | if (Params.value[key]) { |
| 31 | Params.value[key] = param[item.interactFn[key]] | 37 | Params.value[key] = param[item.interactFn[key]] |
| 32 | } | 38 | } |
| 33 | if (Header.value[key]) { | 39 | if (Header.value[key]) { |
| 34 | Header.value[key] = param[item.interactFn[key]] | 40 | Header.value[key] = param[item.interactFn[key]] |
| 35 | } | 41 | } |
| 42 | + }) | ||
| 43 | + } | ||
| 36 | }) | 44 | }) |
| 37 | }) | 45 | }) |
| 38 | } | 46 | } |
| @@ -34,6 +34,7 @@ import { useFullScreen } from '../../utls/fullScreen' | @@ -34,6 +34,7 @@ import { useFullScreen } from '../../utls/fullScreen' | ||
| 34 | import cloneDeep from 'lodash/cloneDeep' | 34 | import cloneDeep from 'lodash/cloneDeep' |
| 35 | import { useAssembleDataHooks } from '@/hooks/external/useAssembleData.hook' | 35 | import { useAssembleDataHooks } from '@/hooks/external/useAssembleData.hook' |
| 36 | import { SocketReceiveMessageType } from '@/store/external/modules/socketStore.d' | 36 | import { SocketReceiveMessageType } from '@/store/external/modules/socketStore.d' |
| 37 | +import {CreateComponentGroupType, CreateComponentType} from '@/packages/index.d' | ||
| 37 | 38 | ||
| 38 | const props = defineProps({ | 39 | const props = defineProps({ |
| 39 | themeSetting: { | 40 | themeSetting: { |
| @@ -225,9 +226,15 @@ const updateVChart =async (newData:SocketReceiveMessageType) => { | @@ -225,9 +226,15 @@ const updateVChart =async (newData:SocketReceiveMessageType) => { | ||
| 225 | } | 226 | } |
| 226 | 227 | ||
| 227 | const { vChartRef } = useChartDataFetch(props.chartConfig, useChartEditStore, newData => { | 228 | const { vChartRef } = useChartDataFetch(props.chartConfig, useChartEditStore, newData => { |
| 228 | - const index = chartEditStore.fetchTargetIndex(props.chartConfig.id) | ||
| 229 | - if (index === -1) return | ||
| 230 | - chartEditStore.componentList[index].option.dataset = newData | 229 | + const target = chartEditStore.getComponentList?.reduce((prev: Array<CreateComponentType | CreateComponentGroupType>, acc) => { |
| 230 | + acc?.isGroup ? (prev = [...(acc?.groupList as CreateComponentGroupType[])]) : prev?.push(acc) | ||
| 231 | + return prev | ||
| 232 | + }, []) | ||
| 233 | + target?.forEach((targetItem)=>{ | ||
| 234 | + if(targetItem.id === props.chartConfig.id){ | ||
| 235 | + targetItem.option.dataset = newData | ||
| 236 | + } | ||
| 237 | + }) | ||
| 231 | updateVChart(newData) | 238 | updateVChart(newData) |
| 232 | }) | 239 | }) |
| 233 | 240 |
| @@ -34,6 +34,7 @@ import dataJson from './data.json' | @@ -34,6 +34,7 @@ import dataJson from './data.json' | ||
| 34 | import { useFullScreen } from '../../utls/fullScreen' | 34 | import { useFullScreen } from '../../utls/fullScreen' |
| 35 | import { useAssembleDataHooks } from '@/hooks/external/useAssembleData.hook' | 35 | import { useAssembleDataHooks } from '@/hooks/external/useAssembleData.hook' |
| 36 | import { SocketReceiveMessageType } from '@/store/external/modules/socketStore.d' | 36 | import { SocketReceiveMessageType } from '@/store/external/modules/socketStore.d' |
| 37 | +import {CreateComponentGroupType, CreateComponentType} from '@/packages/index.d' | ||
| 37 | 38 | ||
| 38 | const props = defineProps({ | 39 | const props = defineProps({ |
| 39 | themeSetting: { | 40 | themeSetting: { |
| @@ -224,9 +225,15 @@ const updateVChart =async (newData:SocketReceiveMessageType) => { | @@ -224,9 +225,15 @@ const updateVChart =async (newData:SocketReceiveMessageType) => { | ||
| 224 | } | 225 | } |
| 225 | 226 | ||
| 226 | const {vChartRef} = useChartDataFetch(props.chartConfig, useChartEditStore, (newData) => { | 227 | const {vChartRef} = useChartDataFetch(props.chartConfig, useChartEditStore, (newData) => { |
| 227 | - const index = chartEditStore.fetchTargetIndex(props.chartConfig.id) | ||
| 228 | - if (index === -1) return | ||
| 229 | - chartEditStore.componentList[index].option.dataset = newData | 228 | + const target = chartEditStore.getComponentList?.reduce((prev: Array<CreateComponentType | CreateComponentGroupType>, acc) => { |
| 229 | + acc?.isGroup ? (prev = [...(acc?.groupList as CreateComponentGroupType[])]) : prev?.push(acc) | ||
| 230 | + return prev | ||
| 231 | + }, []) | ||
| 232 | + target?.forEach((targetItem)=>{ | ||
| 233 | + if(targetItem.id === props.chartConfig.id){ | ||
| 234 | + targetItem.option.dataset = newData | ||
| 235 | + } | ||
| 236 | + }) | ||
| 230 | updateVChart(newData) | 237 | updateVChart(newData) |
| 231 | }) | 238 | }) |
| 232 | 239 |
| @@ -34,6 +34,7 @@ import isObject from 'lodash/isObject' | @@ -34,6 +34,7 @@ import isObject from 'lodash/isObject' | ||
| 34 | import cloneDeep from 'lodash/cloneDeep' | 34 | import cloneDeep from 'lodash/cloneDeep' |
| 35 | import { useAssembleDataHooks } from '@/hooks/external/useAssembleData.hook' | 35 | import { useAssembleDataHooks } from '@/hooks/external/useAssembleData.hook' |
| 36 | import { SocketReceiveMessageType } from '@/store/external/modules/socketStore.d' | 36 | import { SocketReceiveMessageType } from '@/store/external/modules/socketStore.d' |
| 37 | +import {CreateComponentGroupType, CreateComponentType} from '@/packages/index.d' | ||
| 37 | 38 | ||
| 38 | const props = defineProps({ | 39 | const props = defineProps({ |
| 39 | themeSetting: { | 40 | themeSetting: { |
| @@ -254,9 +255,15 @@ const updateVChart =async (newData:SocketReceiveMessageType) => { | @@ -254,9 +255,15 @@ const updateVChart =async (newData:SocketReceiveMessageType) => { | ||
| 254 | } | 255 | } |
| 255 | 256 | ||
| 256 | const { vChartRef } = useChartDataFetch(props.chartConfig, useChartEditStore, newData => { | 257 | const { vChartRef } = useChartDataFetch(props.chartConfig, useChartEditStore, newData => { |
| 257 | - const index = chartEditStore.fetchTargetIndex(props.chartConfig.id) | ||
| 258 | - if (index === -1) return | ||
| 259 | - chartEditStore.componentList[index].option.dataset = newData | 258 | + const target = chartEditStore.getComponentList?.reduce((prev: Array<CreateComponentType | CreateComponentGroupType>, acc) => { |
| 259 | + acc?.isGroup ? (prev = [...(acc?.groupList as CreateComponentGroupType[])]) : prev?.push(acc) | ||
| 260 | + return prev | ||
| 261 | + }, []) | ||
| 262 | + target?.forEach((targetItem)=>{ | ||
| 263 | + if(targetItem.id === props.chartConfig.id){ | ||
| 264 | + targetItem.option.dataset = newData | ||
| 265 | + } | ||
| 266 | + }) | ||
| 260 | updateVChart(newData) | 267 | updateVChart(newData) |
| 261 | }) | 268 | }) |
| 262 | 269 |