From 5dff1aa08ffd0af1e79db17769ba08f848aa551c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=AE=9D=E8=8E=89?= <1084050926@qq.com> Date: Wed, 28 Aug 2024 16:56:59 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E8=AE=BE=E5=A4=87=E4=B8=80=E5=BC=A0?= =?UTF-8?q?=E5=9B=BE=E4=BC=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .env | 2 +- .../commonDataComponents/useAssetsClassRes.ts | 10 ++++-- .../useCategoryBrandCountTableRes.ts | 3 -- .../useCompanyTempTopRes.ts | 13 +++++-- src/hooks/useChartCommonData.hook.ts | 25 ++++++++++++-- .../Charts/Bars/BarCommon/index.vue | 8 +++-- .../components/Charts/Maps/MapBase/index.vue | 1 - .../AlarmDiagram/RealTimeEvent/index.vue | 4 ++- .../ClassifiedStatistic/index.vue | 23 +++++++++---- .../CustomComponents/Overview/index.vue | 34 ++++++++++++++----- src/packages/index.d.ts | 3 +- src/packages/public/publicConfig.ts | 3 +- .../chartEditStore/chartEditStore.d.ts | 2 ++ src/utils/utils.ts | 4 +++ 14 files changed, 103 insertions(+), 32 deletions(-) diff --git a/.env b/.env index 3c9b558a..05d997d8 100644 --- a/.env +++ b/.env @@ -5,7 +5,7 @@ VITE_DEV_PORT = '8080' # VITE_DEV_PATH = 'http://192.168.0.34:11887' VITE_DEV_PATH = 'http://192.168.0.34:8025/' # VITE_DEV_PATH = 'http://192.168.0.120:3001' -VITE_DEV_TOKEN = "1c476210-ddea-4f3f-bd82-832fd5df020d" +VITE_DEV_TOKEN = "2e51947c-5d8d-42f2-99e8-8d841cff7a00" # production path # VITE_PRO_PATH = 'http://192.168.0.235:8177' diff --git a/src/hooks/commonDataComponents/useAssetsClassRes.ts b/src/hooks/commonDataComponents/useAssetsClassRes.ts index b28f3e88..fd2c920d 100644 --- a/src/hooks/commonDataComponents/useAssetsClassRes.ts +++ b/src/hooks/commonDataComponents/useAssetsClassRes.ts @@ -19,31 +19,35 @@ const globalQueryParamsStore = useGlobalQueryParamsStore() } // 处理数据 if(dataSource==='IT'){ - const res = await publicInterface('/dcim/asset','get_asset_overview_page_info_new', query) res!.data = { // dimensions: res?.data.brand_count.map((item: {})=>Object.keys(item).join('')), dimensions: ['品牌','data'], - source:res?.data.brand_count.slice(0,8).map((item: {})=>{ + source:res?.data?.brand_count.slice(0,7).map((item: {})=>{ return { '品牌':Object.keys(item)[0], data:Object.values(item)[0], } }) } + console.log(res,'调用了吗') + return res }else{ const res = await publicInterface('/dcim/dems/device','get_dev_brand_count', query) + res!.data = { // dimensions: res?.data.brand_count.map((item: {})=>Object.keys(item).join('')), dimensions: ['品牌','data'], - source:res?.data.slice(0,8).map((item: any)=>{ + source:res?.data.slice(0,7).map((item: any)=>{ return { '品牌':item.name, data:item.count, } }) } + console.log(res,'调用了吗1') + return res } } diff --git a/src/hooks/commonDataComponents/useCategoryBrandCountTableRes.ts b/src/hooks/commonDataComponents/useCategoryBrandCountTableRes.ts index 1cfa8b16..2c649eff 100644 --- a/src/hooks/commonDataComponents/useCategoryBrandCountTableRes.ts +++ b/src/hooks/commonDataComponents/useCategoryBrandCountTableRes.ts @@ -14,14 +14,11 @@ export const handleCategoryBrandCountTable =async (targetComponent: CreateCompon errmsg: '' } const globalQueryParamsStore = useGlobalQueryParamsStore() - - console.log(currentSource,'currentSource'); const queryParams = { ...globalQueryParamsStore.getGlobalQueryParams } const res = await publicInterface(currentSource==='IT'?'/dcim/asset':'/dcim/dems/device',currentSource==='IT'?'get_category_brand_count': 'get_dev_category_brand_count', queryParams) const top = ['TOP1','TOP2','TOP3'] - res!.data = { dimensions: ['分类名',...top], source:res?.data.map((item: any)=>{ diff --git a/src/hooks/commonDataComponents/useCompanyTempTopRes.ts b/src/hooks/commonDataComponents/useCompanyTempTopRes.ts index cdaa4ffe..3bbac332 100644 --- a/src/hooks/commonDataComponents/useCompanyTempTopRes.ts +++ b/src/hooks/commonDataComponents/useCompanyTempTopRes.ts @@ -14,9 +14,10 @@ export const handleCompanyTempTop =async (targetComponent: CreateComponentType) data: { ...dataJson }, errmsg: '' } - const res = await publicInterface('/dcim/dems/device_point', 'temp_list_dashboard', {signal_ids:[signal_ids],space_complete_id}) + const res:any = await publicInterface('/dcim/dems/device_point', 'temp_list_dashboard', {signal_ids:[signal_ids],space_complete_id}) + console.log(res,'res_handleCompanyTempTop'); + if (res && res.data) { - console.log(res,'res_handleCompanyTempTop'); res.data = { // dimensions: res?.data.brand_count.map((item: {})=>Object.keys(item).join('')), dimensions: ['名称','温度值'], @@ -28,5 +29,13 @@ export const handleCompanyTempTop =async (targetComponent: CreateComponentType) }) } return res + }else{ + // 后端没有给errcode,前端重置 + res.errcode = '00000' + res.data = { + dimensions:[], + source:[] + } + return res } } diff --git a/src/hooks/useChartCommonData.hook.ts b/src/hooks/useChartCommonData.hook.ts index 2c4aa95f..4adde83a 100644 --- a/src/hooks/useChartCommonData.hook.ts +++ b/src/hooks/useChartCommonData.hook.ts @@ -1,6 +1,6 @@ import type VChart from 'vue-echarts' import { setOption } from "@/packages/public"; -import { ref, toRefs, watch } from "vue"; +import { ref, toRefs, watch,getCurrentInstance } from "vue"; import { CreateComponentType, ChartFrameEnum } from '@/packages/index.d' import { useChartEditStore } from "@/store/modules/chartEditStore/chartEditStore"; import { CurrentSourceEnum, resultType } from '@/store/modules/chartEditStore/chartEditStore.d' @@ -24,6 +24,8 @@ import { handleManulInput } from './commonDataComponents/useManualInputRes' import { handleManulInputSingle } from './commonDataComponents/useManualInputSingleRes' import { ResultErrcode } from '@/enums/httpEnum' import { logDark } from 'naive-ui'; +import { fetchChartComponent } from '@/packages'; + // 获取类型 type ChartEditStoreType = typeof useChartEditStore @@ -61,18 +63,34 @@ export const useChartCommonData = ( // let series = [] // if(dataset.dimensions.length - 1) { // for(let i = 0; i < dataset.dimensions.length - 1; i++) { - // series.push(cloneDeep(seriesItem)) + // series.push(cloneDeep(seriesItem)) // } // } // else { // series = [seriesItem] // } + // 获取当前组件实例 + + + if (vChartRef.value) { + // 缓存组件的实例后续更新用得上 + const instanceMap = new Map() + // 存储构造函数引用,如果直接使用vChartRef.value的话会报错，因为json序列化无法对构造函数进行处理，先将它放到map中等使用的时候再获取 + instanceMap.set('$ref', vChartRef.value); + targetComponent.$ref = instanceMap Object.assign(targetComponent.option, { // series, dataset, }) setOption(vChartRef.value, { dataset }) + }else{ + Object.assign(targetComponent.option, { + // series, + dataset, + }) + const instance = targetComponent?.$ref?.get('$ref') + setOption(instance, { dataset }) } } else if(SingleDataArr.some(_ => _ === currentSource)) { // 单个值的处理 @@ -135,9 +153,12 @@ export const useChartCommonData = ( break; case CurrentSourceEnum.ASSETSCLASS: res = await handleAssetsClass(targetComponent) + break; case CurrentSourceEnum.COMPANYTEMPTOP: res = await handleCompanyTempTop(targetComponent) + console.log(res,'res',targetComponent,'触发了吗') + break; case CurrentSourceEnum.ALARMTREND: res = await handleAlarmTrend(targetComponent) diff --git a/src/packages/components/Charts/Bars/BarCommon/index.vue b/src/packages/components/Charts/Bars/BarCommon/index.vue index 49755e89..e76bce97 100644 --- a/src/packages/components/Charts/Bars/BarCommon/index.vue +++ b/src/packages/components/Charts/Bars/BarCommon/index.vue @@ -65,15 +65,17 @@ switch (props.chartConfig.commonData.currentSource) { globalQueryParamsStore.setGlobalQueryParams({ space_complete_id : e.data.complete_id }) - console.log(chartEditStore.getComponentList,'chartEditStore') + console.log(chartEditStore.getComponentList,'chartEditStore_getComponentList') // 没有统一更新数据的方法，只能尝试改变它的更新时间，促使watch触发请求方法 chartEditStore.getComponentList.forEach(component=>{ - component.request.requestInterval = 15 + // component.request.requestInterval = 10 + // component.request.requestInterval = 15 + component.request.immediate = true + useChartCommonData(component, useChartEditStore) }) -console.log(globalQueryParamsStore.getGlobalQueryParams,'chartConfig2') break; diff --git a/src/packages/components/Charts/Maps/MapBase/index.vue b/src/packages/components/Charts/Maps/MapBase/index.vue index 16261b28..c3ac63a6 100644 --- a/src/packages/components/Charts/Maps/MapBase/index.vue +++ b/src/packages/components/Charts/Maps/MapBase/index.vue @@ -162,7 +162,6 @@ const updateMapFn = (data: any) => { } } }) - console.log(props.chartConfig.option.series[0].data,'props.chartConfig.option.series[0].data') } //动态获取json注册地图 diff --git a/src/packages/components/CustomComponents/AlarmDiagram/RealTimeEvent/index.vue b/src/packages/components/CustomComponents/AlarmDiagram/RealTimeEvent/index.vue index 444fefb7..9f8a7755 100644 --- a/src/packages/components/CustomComponents/AlarmDiagram/RealTimeEvent/index.vue +++ b/src/packages/components/CustomComponents/AlarmDiagram/RealTimeEvent/index.vue @@ -150,11 +150,13 @@ watch(() => checkAll.value, (v) => { }) const getNumber = () => { + console.log(props.chartConfig.customData?.dems_device_point_signal_ids,'props.chartConfig.customData?.dems_device_point_signal_ids') const q = { space_complete_id: props.chartConfig.customData?.space_complete_id, confirm_statuss: alarmConfirmStatus.value, handle_statuss: alarmHandleStatuss.value, - recovery_statuss: alarmRecoveryStatus.value + recovery_statuss: alarmRecoveryStatus.value, + dems_device_point_signal_ids: props.chartConfig.customData?.dems_device_point_signal_ids.split(','), } publicInterface('/dcim/dems/devie_active_alarm', 'count_by_level_new', q).then(res => { if (res && JSON.stringify(res.data) !== '{}') { diff --git a/src/packages/components/CustomComponents/CustomComponents/ClassifiedStatistic/index.vue b/src/packages/components/CustomComponents/CustomComponents/ClassifiedStatistic/index.vue index 064f5d47..1d0e0e87 100644 --- a/src/packages/components/CustomComponents/CustomComponents/ClassifiedStatistic/index.vue +++ b/src/packages/components/CustomComponents/CustomComponents/ClassifiedStatistic/index.vue @@ -5,7 +5,7 @@
- +
{{Object.values(item)[0]}} @@ -59,7 +59,9 @@ const queryParams = { } const getData = () => { if(props.chartConfig?.customData?.currentSource==='IT'){ - publicInterface('/dcim/asset', 'get_asset_overview_page_info_new', queryParams).then(res => { + publicInterface('/dcim/asset', 'get_asset_overview_page_info_new', { + ...globalQueryParamsStore.getGlobalQueryParams +}).then(res => { if (res && res.data) { type_count.value = res.data.type_count // for (const key in computeNodeData) { @@ -68,7 +70,9 @@ const getData = () => { } }) }else{ - publicInterface('/dcim/dems/device', 'get_dev_category_count', queryParams).then(res => { + publicInterface('/dcim/dems/device', 'get_dev_category_count', { + ...globalQueryParamsStore.getGlobalQueryParams +}).then(res => { if (res && res.data) { type_count.value = res.data.map((item:any)=>{ return { @@ -104,7 +108,14 @@ watch(()=>props.chartConfig?.customData?.currentSource,()=>{ console.log(props.chartConfig?.customData?.currentSource,'chartConfig'); getData() // 根据currentSource去获取对应 参数 - +}) +watch(()=>props.chartConfig?.request?.immediate,(v)=>{ + +if(!v)return +getData() +props.chartConfig.request.immediate = false +// 根据currentSource去获取对应 参数 + }) onMounted(() => { nextTick(() => { @@ -167,14 +178,14 @@ onUnmounted(() => { transform: translate(-50%,-50%); white-space: pre-wrap; text-align: center; - font-size: 17px; + font-size: 20px; } } } .count{ - font-size: 17px; + font-size: 20px; padding: 0 5px; font-family: LESLIE; font-size: 20px; diff --git a/src/packages/components/CustomComponents/CustomComponents/Overview/index.vue b/src/packages/components/CustomComponents/CustomComponents/Overview/index.vue index 1ef26ad8..9c671d40 100644 --- a/src/packages/components/CustomComponents/CustomComponents/Overview/index.vue +++ b/src/packages/components/CustomComponents/CustomComponents/Overview/index.vue @@ -3,7 +3,8 @@
- + +
{{item.value}} @@ -55,14 +56,16 @@ const queryParams = { } const getData = () => { if(props.chartConfig?.customData?.currentSource==='IT'){ - publicInterface('/dcim/asset', 'get_asset_overview_page_info_new', queryParams).then(res => { + publicInterface('/dcim/asset', 'get_asset_overview_page_info_new', { + ...globalQueryParamsStore.getGlobalQueryParams +}).then(res => { if (res && res.data) { - let commonBrands = res.data.type_count.reduce((prev:any, curr:any) => { + let commonBrands = res.data.type_count?.reduce((prev:any, curr:any) => { const prevValue:any = Object.values(prev)[0]; const currValue:any = Object.values(curr)[0]; return currValue > prevValue ? curr : prev; -}); +},{}); let obj = [ { label:'设备总数', @@ -81,11 +84,13 @@ const getData = () => { } }) }else{ - publicInterface('/dcim/dems/device', 'get_dev_category_count', queryParams).then(res => { + publicInterface('/dcim/dems/device', 'get_dev_category_count', { + ...globalQueryParamsStore.getGlobalQueryParams +}).then(res => { if (res && res.data) { - const commonBrands:any = res.data.reduce((prev:any, curr:any) => { + const commonBrands:any = res?.data?.reduce((prev:any, curr:any) => { return curr.count > prev.count ? curr : prev; -}); +},{}); let obj = [ { label:'设备总数', @@ -107,7 +112,9 @@ const getData = () => { } let timer:unknown +console.log([props.chartConfig.request.requestInterval, props.chartConfig.request.requestIntervalUnit].join('&&'),'[props.chartConfig.request.requestInterval, props.chartConfig.request.requestIntervalUnit]_overview') watch(() => [props.chartConfig.request.requestInterval, props.chartConfig.request.requestIntervalUnit].join('&&'), v => { + console.log(v,'overview_v') if(!isPreview()) return console.log(props,'props') @@ -120,15 +127,25 @@ watch(() => [props.chartConfig.request.requestInterval, props.chartConfig.reques getData() }, number) } +},{ + deep:true, }) watch(()=>props.chartConfig?.customData?.currentSource,()=>{ -console.log(props.chartConfig?.customData?.currentSource,'chartConfig'); getData() // 根据currentSource去获取对应 参数 }) +watch(()=>props.chartConfig?.request?.immediate,(v)=>{ + +if(!v)return +getData() +props.chartConfig.request.immediate = false +// 根据currentSource去获取对应 参数 + +}) + onMounted(() => { nextTick(() => { @@ -177,6 +194,7 @@ onUnmounted(() => { transform: translate(-50%,-50%); white-space: pre-wrap; text-align: center; + font-size: 20px; } diff --git a/src/packages/index.d.ts b/src/packages/index.d.ts index 95911e23..d5a3845f 100644 --- a/src/packages/index.d.ts +++ b/src/packages/index.d.ts @@ -166,7 +166,8 @@ export interface PublicConfigType { [InteractEvents.INTERACT_COMPONENT_ID]: string | undefined [InteractEvents.INTERACT_FN]: { [name: string]: string } }[] - } + }, + $ref } export interface CreateComponentType extends PublicConfigType, requestConfig { diff --git a/src/packages/public/publicConfig.ts b/src/packages/public/publicConfig.ts index 7a39ecfd..734652b4 100644 --- a/src/packages/public/publicConfig.ts +++ b/src/packages/public/publicConfig.ts @@ -24,11 +24,12 @@ import cloneDeep from 'lodash/cloneDeep' // 请求基础属性 export const requestConfig: RequestConfigType = { + immediate:false, requestDataType: RequestDataTypeEnum.STATIC, requestHttpType: RequestHttpEnum.GET, requestUrl: '', requestInterval: 15, - requestIntervalUnit: RequestHttpIntervalEnum.SECOND, + requestIntervalUnit: RequestHttpIntervalEnum.HOUR, requestContentType: RequestContentTypeEnum.DEFAULT, requestParamsBodyType: RequestBodyEnum.NONE, requestSQLContent: { diff --git a/src/store/modules/chartEditStore/chartEditStore.d.ts b/src/store/modules/chartEditStore/chartEditStore.d.ts index 6231de04..db05044f 100644 --- a/src/store/modules/chartEditStore/chartEditStore.d.ts +++ b/src/store/modules/chartEditStore/chartEditStore.d.ts @@ -214,6 +214,8 @@ export interface RequestGlobalConfigType extends RequestPublicConfigType { // 单个图表请求配置 export interface RequestConfigType extends RequestPublicConfigType { + // 是否立即执行 + immediate?:boolean // 所选全局数据池的对应 id requestDataPondId?: string // 组件定制轮询时间 diff --git a/src/utils/utils.ts b/src/utils/utils.ts index ad5443ba..bffc7630 100644 --- a/src/utils/utils.ts +++ b/src/utils/utils.ts @@ -275,11 +275,15 @@ export const setKeyboardDressShow = (keyCode?: number) => { * @param data */ export const JSONStringify = (data: T) => { + console.log(data,'data') return JSON.stringify( data, (key, val) => { // 处理函数丢失问题 if (typeof val === 'function') { + console.log(key,'key') + console.log(val,'val') + return `${val}` } // 处理 undefined 丢失问题