dcim-topology2d 2.0.2 → 2.0.6

package/chart-diagram/index.d.ts

@@ -2,4 +2,4 @@
 export * from './src/utils';
 export * from './src/echarts';
 export * from './src/register';
-export * from '../myShape-diagram/myShape';
+export * from '../myShape-diagram/index.js';

package/chart-diagram/index.js

@@ -1,5 +1,5 @@
 export * from './src/utils';
 export * from './src/echarts';
 export * from './src/register';
-export * from '../myShape-diagram/myShape.js';
+export * from '../myShape-diagram/index.js';
 //# sourceMappingURL=index.js.map

package/chart-diagram/src/echarts/index.js

@@ -1,4 +1,5 @@
 import {s8, createDiv, rectangle, commonStore} from '../../../core';
+import {plugsPool} from '../../../store';
 import {
     setMapLineBarOptions,
     setMapGaugeOptions,
@@ -6,20 +7,21 @@ import {
     setMap3dBarOptions,
     setMapTopOptions,
     setMapGlobalOptions,
-    setMapDataOptions
+    setMapDataOptions,
+    initBindTabSetting
 } from '../utils';
 import {echartsTypeMap} from '../../../static';
-import {echartsDataPool, echartsOptionsPool} from '../../../store';
 
 export function echarts(ctx, node) {
-    if (!(commonStore[node.TID] && commonStore[node.TID].data.dataResize)) return;
+    const currentStore = commonStore[node.TID];
+    if (!(currentStore && currentStore.data.dataResize)) return;
     //console.log('echarts绘制-----node', node);
     // if(currentElement) currentElement.style.display = !node.visible ? 'none': 'block';
     // if(!node.visible) return;
     // 绘制一个底图，类似于占位符。
     rectangle(ctx, node)
     // tslint:disable-next-line:no-shadowed-variable
-    var echarts = echartsDataPool.echarts || window.echarts
+    var echarts = plugsPool.echarts || window.echarts
     if (!node.data || !echarts) {
         return
     }
@@ -32,7 +34,7 @@ export function echarts(ctx, node) {
     if (!node.elementId) {
         node.elementId = s8()
     }
-    let echartsData = echartsDataPool[node.id];
+    let echartsData = currentStore.echartsDataPool[node.id];
     if (!node.elementLoaded && !(echartsData && echartsData.div)) {
         if(!echartsData) {
             echartsData = {
@@ -51,7 +53,7 @@ export function echarts(ctx, node) {
         setTimeout(function () {
             echartsData.chart.resize()
         });
-        echartsDataPool[node.id] = echartsData;
+        currentStore.echartsDataPool[node.id] = echartsData;
     }
     if (!node.elementRendered) {
         const appearance = node.appearance;
@@ -59,8 +61,10 @@ export function echarts(ctx, node) {
         setTimeout(function () {
             let option = node.data.echarts.option;
             if(!(echartsData && echartsData.chart)) return;
-            const isLocked = commonStore[node.TID] && commonStore[node.TID].data.locked;
-            if (!isLocked || !echartsOptionsPool[node.id]) {
+            if(node.data.params) node.data.params.tabCorrelationType = echartsData.tabCorrelationType || ''; // 统计图与Tab关联
+            const isLocked = currentStore.data.locked;
+            if (!isLocked || !currentStore.echartsOptionsPool[node.id]) {
+                const tabData = initBindTabSetting(node); // 初始化Tabs数据配置
                 // 【未锁定（编辑）状态, options未初始化的状态】
                 if (!appearance.type) appearance.type = echartsTypeMap[`type_${option.displayMode}`]; // 兼容旧数据配置
                 // 公共配置 Top排行榜跳过公共属性配置
@@ -77,18 +81,20 @@ export function echarts(ctx, node) {
                 if (appearance.type === 'TOP') setMapTopOptions(option, node);
                 //option.title = appearance.title;
                 option.backgroundColor = appearance.backgroundColor;
-                echartsOptionsPool[node.id] = {
+                currentStore.echartsOptionsPool[node.id] = {
                     option: JSON.parse(JSON.stringify(option)),
                     data: {
+                        TID: node.TID,
                         appearance,
                         id: node.id,
-                        params: node.data.params
+                        params: node.data.params,
+                        tabData
                     }
                 };
                 if (!isLocked) echartsData.chart.clear();
             }
             // echarts 数据渲染更新
-            setMapDataOptions(option, node);
+            setMapDataOptions(option, currentStore.echartsOptionsPool[node.id].data);
 
             node.elementRendered = true;
         })

package/chart-diagram/src/register.js

@@ -1,9 +1,9 @@
 import { registerNode } from '../../core';
 import { echarts } from './echarts';
-import { echartsDataPool } from '../../store';
+import { plugsPool } from '../../store';
 // import './echarts/echarts.min.js';
 export function register(_echarts) {
-    echartsDataPool.echarts = _echarts;
+    plugsPool.echarts = _echarts;
     // if (process.browser && !echartsDataPool.echarts && !window.echarts) {
     //     //loadJS('https://cdn.bootcdn.net/ajax/libs/echarts/4.8.0/echarts.min.js', null, true);
     //     loadJS(`${location.origin}/libary/echarts.min.js`, null, true);

package/chart-diagram/src/utils/changeOptions.d.ts

@@ -1,3 +1,6 @@
+export declare function setRingChartText<T>(textData: T): void;
+export declare function setRingPreSeriesOptions<T>(option: T, appearance: T): void;
+export declare function setRingProSeriesOptions<T>(option: T, appearance: T): void;
 export declare function setChartLegendData<T>(legend: T, appearance: T): void;
 export declare function setChartXAxisData<T>(xAxis: [], appearance: T): void;
 export declare function setChartYAxisData<T>(yAxis: [], appearance: T): void;

package/chart-diagram/src/utils/changeOptions.js

@@ -7,6 +7,62 @@ import {
     echartsColorData
 } from '../../../static';
 
+// 配置环形图中间区域文字样式
+export function setRingChartText(textData) {
+    const {
+        vFontSize, vFontWeight, vColor,
+        vTop, unitTop, unitFontSize, unitFontWeight,
+        unitColor} = textData;
+    if(!unitTop) textData.unitTop = 0;  
+    return {
+        v: {
+            fontSize: vFontSize,
+            fontWeight: vFontWeight,
+            color: vColor,
+            padding: [vTop, 0, 0, 0]
+        },
+        unit: {
+            fontSize: unitFontSize,
+            fontWeight: unitFontWeight,
+            color: unitColor,
+            padding: [unitTop, 0, 0, 0]
+        }
+    };
+}
+// 配置环形‘设备告警统计图’节点展示
+export function setRingPreSeriesOptions(option, appearance) {
+    const rich = setRingChartText(appearance.text);
+    Object.assign(option.title.textStyle.rich, rich);
+    option.title.y = `${appearance.text.y}%`;
+    option.series[0].radius[1] = `${appearance.inner.borderWidth}%`;
+    option.series[0].data[0].itemStyle.color = appearance.inner.borderColor;
+    option.series[0].data[1].itemStyle.color = appearance.inner.borderBgColor;
+    option.series[1].radius[1] = `${appearance.outer.borderWidth}%`;
+    option.series[1].data[0].itemStyle.color = appearance.outer.borderColor;
+}
+// 配置环形‘内存、硬盘、CPU指标占比统计’节点展示
+export function setRingProSeriesOptions(option, appearance) {
+    const seriesFirstChildNode = option.series[0];
+    const rich = setRingChartText(appearance.text);
+    Object.assign(seriesFirstChildNode.data[0].label.normal.rich, rich);
+    seriesFirstChildNode.data[0].label.normal.formatter = function(params){
+        return `{v|${params.value}}{unit|%}`;
+    }
+    seriesFirstChildNode.data[0].value = appearance.proportion;
+    seriesFirstChildNode.radius = appearance.outer.radius;
+    seriesFirstChildNode.data[0].itemStyle = {
+        normal: {
+            color: appearance.outer.borderColor,
+            shadowColor: appearance.outer.borderColor,
+            shadowBlur: 0
+        }
+    };
+    seriesFirstChildNode.data[1].value = 100 - appearance.proportion;
+    seriesFirstChildNode.data[1].itemStyle.normal.color = appearance.outer.borderBgColor;
+    const seriesLastChildNode = option.series[1];
+    seriesLastChildNode.radius = appearance.inner.radius;
+    seriesLastChildNode.itemStyle.normal.color.colorStops[0].color = appearance.inner.borderColor;
+}
 // 图表X轴数据
 export function setChartXAxisData(xAxis, appearance) {
     for (let i = 0; i < xAxis.length; i++) {
@@ -26,7 +82,11 @@ export function setChartXAxisData(xAxis, appearance) {
     //return xAxis;
 }
 
-// 图表Y轴数据
+/**
+ * 图表Y轴数据
+ * @param yAxis Y轴配置数据
+ * @param appearance 图表自定义配置
+ */
 export function setChartYAxisData(yAxis, appearance) {
     if (typeof appearance.ySplitLineShow !== 'boolean') {
         appearance.ySplitLineShow = yAxis[0].splitLine.show;

package/chart-diagram/src/utils/conversion.d.ts

@@ -6,6 +6,7 @@ interface echartsOptions {
     tooltip: null
 }
 export declare function getXYAxisLabelVal(index: number, intervalNum: number, value: any): string;
+export declare function initBindTabSetting(node: any): string;
 export declare function setMapLineBarOptions(option: echartsOptions, node: any): void;
 export declare function setMapGaugeOptions(option: echartsOptions, node: any): void;
 export declare function setMapRingOptions(option: echartsOptions, node: any): void;

package/chart-diagram/src/utils/conversion.js

@@ -1,20 +1,23 @@
 import {echartsDataRoom, echartsColorData} from '../../../static';
-import {echartsOptionsPool, echartsDataPool, echartsRealDataPool} from '../../../store';
 import {
     setSeriesRenderGroup,
     drawGraphicShape,
     setChartLegendData,
     setChartXAxisData,
     setChartYAxisData,
-    setLineSeriesStyleData
+    setLineSeriesStyleData,
+    setRingPreSeriesOptions,
+    setRingProSeriesOptions
 } from '../utils';
 import {
     gaugeNormalAuto,
     lineBarDataAuto,
     pieRingAssetTotalAuto,
+    pieRingProportionAuto,
     pieRingNormalAuto,
     topRankingListAuto
 } from './render';
+import {commonStore, echartsStaticType} from "../../../core";
 
 export function getXYAxisLabelVal(index, intervalNum, value) {
     if (index === 0 || index % intervalNum === 0) {
@@ -24,6 +27,26 @@ export function getXYAxisLabelVal(index, intervalNum, value) {
     }
 }
 
+/**
+ * 初始化图表与tabs关联的配置数据
+ * @param node 元件节点
+ */
+export function initBindTabSetting(node) {
+    const tabStaticKey = node.tags && node.tags.find((tag) => {return tag.includes('switchTabType')});
+    const switchTabData = tabStaticKey && commonStore[node.TID].switchTabDataPool[`${tabStaticKey}Data`];
+    if(switchTabData) {
+        const tabNode = Object.values(switchTabData)[0];
+        const tabEventNode = tabNode.events.find((ev) => {return ev.action === 8});
+        const tabStaticType = tabEventNode && tabEventNode.dcimStaticForType || '';
+        node.data.params.staticForType = tabStaticType;
+        return {
+            type: tabStaticType,
+            data: tabNode.tabData
+        };
+    }
+    return null;
+}
+
 // 自动滑动展示数据
 export function setMapAutoMoveOptions(option, chartNode, node, callback) {
     option.dataZoom = echartsDataRoom;
@@ -108,9 +131,17 @@ export function setMapGaugeOptions(option, node) {
 // 自动配置环形图和饼图的节点数据
 export function setMapRingOptions(option, node) {
     //const chartOption = JSON.parse(JSON.stringify(option));
-    const seriesNode = option.series[0];
     const appearance = node.appearance;
-    if(!appearance.inner) {
+    if(appearance.type === 'ringPre'){
+        
+        setRingPreSeriesOptions(option, appearance);
+        
+    }else if(appearance.type === 'ringPro'){
+        
+        setRingProSeriesOptions(option, appearance);
+        
+    }else {
+        const seriesNode = option.series[0];
         if ((!appearance.label || typeof appearance.label.showValue !== 'boolean')) {
             appearance.label = {
                 showValue: appearance.type === 'ring',
@@ -130,35 +161,6 @@ export function setMapRingOptions(option, node) {
                 return `${data.name}`;
             }
         }
-    }else {
-        // chartOption.title.text = '{v|'+appearance.alarmCount+'}{unit|/'+appearance.total+'台}';
-        const {
-            vFontSize, vFontWeight, vColor,
-            vTop, unitFontSize, unitFontWeight,
-            unitColor} = appearance.text;
-        const rich = {
-            v: {
-                fontSize: vFontSize,
-                fontWeight: vFontWeight,
-                color: vColor,
-                padding: [vTop, 0, 0, 0]
-            },
-            unit: {
-                fontSize: unitFontSize,
-                fontWeight: unitFontWeight,
-                color: unitColor
-            }
-        };
-        Object.assign(option.title.textStyle.rich, rich);
-        option.title.y = `${appearance.text.y}%`;
-        option.series[0].radius[1] = `${appearance.inner.borderWidth}%`;
-        // const value1 = ((100 / appearance.total) * appearance.alarmCount).toFixed(6);
-        // chartOption.series[0].data[0].value = value1;
-        option.series[0].data[0].itemStyle.color = appearance.inner.borderColor;
-        // chartOption.series[0].data[1].value = 100 - value1;
-        option.series[0].data[1].itemStyle.color = appearance.inner.borderBgColor;
-        option.series[1].radius[1] = `${appearance.outer.borderWidth}%`;
-        option.series[1].data[0].itemStyle.color = appearance.outer.borderColor;
     }
 }
 
@@ -199,7 +201,11 @@ export function setMapTopOptions(option, node) {
     Object.assign(option.grid, appearance.grid);
 }
 
-// 公共配置
+/**
+ * 公共配置
+ * @param option 图表配置数据
+ * @param node 元件数据
+ */
 export function setMapGlobalOptions(option, node) {
     // const chartOption = JSON.parse(JSON.stringify(option));
     const appearance = node.appearance;
@@ -221,20 +227,33 @@ export function setMapGlobalOptions(option, node) {
 
 // 实时改变图表data值
 export function setMapDataOptions(option, node) {
-    const optionNode = echartsOptionsPool[node.id].option;
+    const optionNode = commonStore[node.TID].echartsOptionsPool[node.id].option;
     const appearance = node.appearance;
-    const params = node.data ? node.data.params : node.params;
+    const params = node.params;
     // 3d 柱状图
     if (appearance.type === '3dBar') renderMap3dBarSeriesItem(optionNode.series[0], appearance);
     const displayMode = parseInt(option.displayMode); // 图表类型
-    const staticForType = params && params.staticForType || ''; //统计类型：日，周，月，年，实时
-    const syncEchartsData = echartsRealDataPool[node.id]; // 统计图实时数据
-    const staticTypeData = staticForType ? syncEchartsData && syncEchartsData[`${staticForType}_Data`] : syncEchartsData; // 统计类型数据
+    const staticForType = params && params.staticForType || ''; //统计类型：日，周，月，年，实时，其他
+    const syncEchartsData = commonStore[node.TID].echartsRealDataPool[node.id]; // 统计图实时数据
+    let staticTypeData = null; // 统计类型数据
+    if(staticForType === 'OTHER'){
+        // 其他类型，类型中的数据通常统计的都是历史数据，日、周、月、年、实时中的某一类，通常搭配分组统计使用。
+        // 类型中绑定一个测点为一个类型，绑定多个测点为多个类型。比如：有电功率和功率因数为两个分类，图表分组中分类数据绑定时就要同时绑定有电功率和功率因数两个测点，否则无法实现切换
+        for (let i = 0 ; i < echartsStaticType.length; i++) {
+            const chartData = syncEchartsData && syncEchartsData[`${echartsStaticType[i]}_Data`];
+            if(chartData) staticTypeData = chartData;
+        }
+    }else {
+        // 日，周，月，年，实时类型，不与分组统计一起使用
+        staticTypeData = staticForType ? syncEchartsData && syncEchartsData[`${staticForType}_Data`] : syncEchartsData;
+    }
     // 实时数据加载
     if(staticTypeData) {
 
         if (displayMode === 1 || displayMode === 2) { // 折线图，柱状图
 
+            if(node.tabData && node.tabData.data.state && optionNode.yAxis[0].max) Object.assign(optionNode.yAxis[0], node.tabData.data); //若Tabs切换配置了数据，则修改Y轴原有配置
+
             lineBarDataAuto(optionNode, params, staticTypeData);
 
         }
@@ -244,11 +263,14 @@ export function setMapDataOptions(option, node) {
 
         }
         if (displayMode === 5 || displayMode === 3) { // 饼图/环形图
-            const pieData = staticTypeData || staticTypeData.data || [];
+            const pieData = staticTypeData && staticTypeData.data || staticTypeData || [];
             if(appearance.type === 'ringPre') {
                 // 按照资产总台数统计设备告警数量
                 pieRingAssetTotalAuto(optionNode, pieData, appearance.total, appearance.alarmCount);
 
+            }else if(appearance.type === 'ringPro'){
+                // 按照百分比统计设备配置情况
+                pieRingProportionAuto(optionNode, pieData, appearance.proportion);
             }else {
 
                 pieRingNormalAuto(optionNode, pieData);
@@ -295,7 +317,7 @@ export function setMapDataOptions(option, node) {
         }
     }
 
-    const currentChartNode = echartsDataPool[node.id];
+    const currentChartNode = commonStore[node.TID].echartsDataPool[node.id];
     const mapChart = currentChartNode.chart;
     clearInterval(currentChartNode.timeTicket);
     currentChartNode.timeTicket = null;

package/chart-diagram/src/utils/render.d.ts

@@ -1,5 +1,6 @@
 export declare function lineBarDataAuto(option: any, params: {}, data: {}): void;
 export declare function topRankingListAuto(option: any, data: {}): void;
 export declare function pieRingAssetTotalAuto(option: any, data: {}, total: number, count: number): void;
+export declare function pieRingProportionAuto(option: any, data: {}, proportion: number): void;
 export declare function pieRingNormalAuto(option: any, data: {}): void;
 export declare function gaugeNormalAuto(option: any, data: {}): void;

package/chart-diagram/src/utils/render.js

@@ -10,6 +10,13 @@ export function lineBarDataAuto(option, params, data) {
     const seriesNodes = option.series;
     if(data && data.XData) option.xAxis[0].data = data.XData;
     if(!(data && data.seriesData && data.seriesData.length)) return;
+    if(params.tabCorrelationType) {
+        // 如果操作类型是select下拉分组下的tab切换，执行下面的逻辑
+        const realSeriesNode = data.seriesData[params.tabVisitOrder || 0];
+        seriesNodes[0].data = realSeriesNode.data;
+        if(realSeriesNode.name) seriesNodes[0].name = realSeriesNode.name;
+        return;
+    }
     if(seriesNodes.length > 1 || params && params.curveNum > 1){
         // 双曲线|柱状
         const legendData = [];
@@ -74,6 +81,23 @@ export function pieRingAssetTotalAuto(option, data, total, count) {
     option.series[0].data[1].value = 100 - value1;
 }
 
+/**
+ * 
+ * @param option 图表配置数据
+ * @param data 实时图表数据
+ * @param proportion 默认百分数
+ */
+export function pieRingProportionAuto(option, data, proportion) {
+    if(data && data.length) {
+        proportion = Number(data[0].value) * 100;
+    }
+    if(!option.series[0].data[0].label.normal.formatter) option.series[0].data[0].label.normal.formatter = function(params){
+        return params.value ? `{v|${params.value}}{unit|%}` : `{v|${params.value}}`;
+    }
+    option.series[0].data[0].value = proportion;
+    option.series[0].data[1].value = 100 - proportion;
+}
+
 /**
  * 饼图环形图默认展示 实时数据
  * @param option 图表配置数据

package/core/src/common.js

@@ -10,12 +10,15 @@ import {
     getRect,
     setInitNodeDataValidat,
     setDefaultNodeValidat,
-    initSwitchTabData,
+    setConnectionTagForConf,
     setInitConfData,
+    getParams,
+    tabHideShowOperation,
+    tabStaticOperation,
+    echartsStaticType
 } from './utils';
-import { useStore, clearStore } from './store'
+import {useStore, clearStore, commonStore} from './store'
 import * as mqtt from './mqtt.min';
-import { switchTabDataPool } from "../../store";
 import {setElementSwitchTabState} from './element';
 var MoveInType;
 (function (MoveInType) {
@@ -167,6 +170,76 @@ var Common = /** @class */ (function () {
         this.createMarkdownTip();
         window.topology = this;
     }
+    Common.prototype.categoryDataParams = function (data){
+        getParams(this.id, data);
+    };
+    Common.prototype.getParams = function (assetId){
+        const params = {
+            doorIds: this.store.mqttParams.doorIds,
+            tagIds: this.store.mqttParams.tagIds.join(","),
+            assetIds: this.store.mqttParams.assetIds.join(","),
+            areaIds: this.store.mqttParams.areaIds.join(","),
+            routingkey: this.store.mqttParams.routingkey,
+            echart: this.store.mqttParams.tagEcharts.join(","),
+            echartData: this.store.mqttParams.echartData
+        }
+        if (this.store.mqttParams.echartAssemblyData.length) params.echartAssemblyData = [...this.store.mqttParams.echartAssemblyData];
+        if(assetId) {
+            params.varValueIds = this.store.mqttParams.varVaule.join(",");
+        }else {
+            if(this.store.mqttParams.assetIds.length && this.store.mqttParams.varVaule.length) {
+                const assetId = this.store.mqttParams.assetIds[this.store.mqttParams.assetIds.length -1];
+                for(let va = 0; va < this.store.mqttParams.varVaule.length; va++) {
+                    this.store.mqttParams.varVaule[va] = `${assetId}_${this.store.mqttParams.varVaule[va]}`;
+                }
+                params.varValueIds = this.store.mqttParams.varVaule.join(",");
+            }else {
+                params.varVaule = this.store.mqttParams.varVaule.join(",");
+            }
+        }
+        return params;
+    };
+    // 根据图表id数据获取测点数据
+    Common.prototype.getTagIdsForEchartsIds = function (data){
+        this.store.mqttParams.echartAssemblyData = data;
+    };
+    // 根据指标地址数据获取测点数据
+    Common.prototype.getTagIdsForKpiAddrs = function (data){
+        let tagIds = [];
+        data.map((item) => {
+            tagIds.push(item.tagId);
+        });
+        this.store.mqttParams.tagIds = tagIds;
+    };
+    // 获取绑定值类型参数
+    Common.prototype.getVarValueIdsForVarData = function (data){
+        const ids = [];
+        data.map((item) => {
+            if(item.varVal) ids.push(item.assetVarIds);
+        })
+        this.store.mqttParams.varVaule = ids;
+    };
+    // 固定资产详情数据赋值
+    Common.prototype.renderForAssetPoperties = function (asset, data){
+        if(!Object.keys(asset).length) return;
+        data.map((node) => {
+            if (node.data && Array.isArray(node.data) && node.data.length) {
+                node.data.map((item) => {
+                    if (item.key === 'assetKey' && asset[item.value]) {
+                        if (['imgUrl', 'principleImg'].includes(item.value)) {
+                            node.text = '';
+                            node.image = `${this.store.mqttParams.pathRewrite}${asset[item.value]}`;
+                        } else {
+                            node.text = asset[item.value];
+                        }
+                    }
+                })
+            }
+            if (node.children && node.children.length) {
+                this.renderForAssetPoperties(asset, node.children);
+            }
+        });
+    };
 
     Common.prototype.conversionData = function (obj) {
         this.clear();
@@ -185,7 +258,7 @@ var Common = /** @class */ (function () {
                 const item = new Node(_a[_i]);
                 this.store.data.pens.push(item);
                 ///this.store.pens[item.id] = item;
-                initSwitchTabData(item);
+                setConnectionTagForConf(item);
             }
             for (var _b = 0, _c = data.lines; _b < _c.length; _b++) {
                 _c[_b].TID = this.id;
@@ -203,7 +276,7 @@ var Common = /** @class */ (function () {
                     const node = new Node(item);
                     this.store.data.pens.push(node);
                     //this.store.pens[item.id] = node;
-                    initSwitchTabData(node);
+                    setConnectionTagForConf(node);
                 } else {
                     const linNode = new Line(item);
                     this.store.data.pens.push(linNode);
@@ -400,34 +473,29 @@ var Common = /** @class */ (function () {
             return t.includes('switchTabType');
         }); // 获取按钮组类型
         if(!switchTabData) return;
-        const topologyChangeData = switchTabDataPool; // 获取所有按钮组和按类型统计图组数据
+        const topologyChangeData = commonStore[node.TID].switchTabDataPool; // 获取所有按钮组和按类型统计图组数据
         const changeNode = topologyChangeData[`${switchTabData}Data`]; // 分别获取按钮组数据
         if(!changeNode[node.id]) return;
         // 如果存在按钮组节点数据
         const tabAreaData = topologyChangeData[`${switchTabData}AreaData`];
+        let tabIndex = 0;
+        const visitParams = {
+            order: 0
+        };
         for (let switchNode of Object.values(changeNode)) {
             const penNode = this.store.data.pens[switchNode.order];
             if(!penNode) return;
-            penNode.activeImgeIndex = switchNode.id !== node.id;
-            if(staticType === 'SH'){
-                // 对显示隐藏的功能进行交互处理
-                const areaNode = tabAreaData[switchNode.bindStaticId];
-                if(areaNode && this.store.data.pens[areaNode.order]) {
-                    const tagNode = this.store.data.pens[areaNode.order];
-                    tagNode.visible = !(switchNode.id !== node.id);
-                    setElementSwitchTabState(tagNode);
-                }
+            const isActive = switchNode.id !== node.id;
+            if(!isActive) {
+                visitParams.order = tabIndex;
+                visitParams.data = switchNode.tabData;
             }
+            penNode.activeImgeIndex = isActive;
+            tabIndex++;
+            if(staticType === 'SH') tabHideShowOperation(switchNode, tabAreaData); // 对显示隐藏的功能进行交互处理
         }
         // 对绑定的图表进行数据处理
-        if (node.bindStaticId && ['DAY', 'WEEK', 'MONTH', 'YEAR'].includes(staticType)) {
-            const findCurentEchart = tabAreaData[node.bindStaticId]; // 获取当前点中的节点绑定的统计图表数据
-            if (findCurentEchart && findCurentEchart.data.params) {
-                const cn = this.store.data.pens[findCurentEchart.order];
-                cn.data.params['staticForType'] = staticType; // 统计类型赋值
-                cn.elementRendered = false;
-            }
-        }
+        tabStaticOperation(staticType, node, tabAreaData, visitParams);
         this.store.data.dataResize = 1;
         this.render();
     };
@@ -686,16 +754,22 @@ var Common = /** @class */ (function () {
     };
     Common.prototype.mqttDataDrawing = function (data, retData) {
         // console.log('收到消息', syncData)
+        this.store.monitorAlarm = false;
         data.map((item) => {
-            if(this.store.options.type === 'topology') setInitConfData(item);
+            if(this.store.options.type === 'topology') setInitConfData(this.id, item);
             setDefaultNodeValidat(item, retData);
             if (item.children && item.children.length) {
                 this.mqttDataDrawing(item.children, retData);
             }
-        })
+            if (item.formData && item.formData.detailPageData && item.formData.detailPageData.pens && item.formData.detailPageData.pens.length) {
+                this.mqttDataDrawing(item.formData.detailPageData.pens, retData);
+            }
+        });
         //console.log('执行完毕-----', this.store.data.pens)
         this.render();
         this.animate(true);
+        // 九所的 服务器状态监测功能中用到
+        if(this.store.options.storeSubscribe) Store.set(this.generateStoreKey('M:monitor'), this.store.monitorAlarm);
         return data
     };
     Common.prototype.hidePenByTag = function (pens, val) {
@@ -753,6 +827,28 @@ var Common = /** @class */ (function () {
             }
         }
     };
+    Common.prototype.formOverflowConversionData = function (obj) {
+        if (!obj) {
+            obj = {pens: []};
+        }
+        let data = JSON.parse(JSON.stringify(obj));
+        Object.assign(this.store.data, data);
+        this.store.data.pens = [];
+        this.openCount = 0
+        const type = this.store.options.type;
+        if (data.pens) {
+            for (var _d = 0, _e = data.pens; _d < _e.length; _d++) {
+                const item = _e[_d];
+                if (!item.from) {
+                    const node = new Node(item);
+                    this.store.data.pens.push(node);
+                } else {
+                    const linNode = new Line(item);
+                    this.store.data.pens.push(linNode);
+                }
+            }
+        }
+    };
     Common.prototype.destroyStatic = function () {
         this.clear('destroy');
         //this.closeSocket();