dcim-topology2d 2.0.5 → 2.0.7

package/core/src/common.js

@@ -13,6 +13,9 @@ import {
     setConnectionTagForConf,
     setInitConfData,
     getParams,
+    tabHideShowOperation,
+    tabStaticOperation,
+    echartsStaticType
 } from './utils';
 import {useStore, clearStore, commonStore} from './store'
 import * as mqtt from './mqtt.min';
@@ -37,6 +40,8 @@ var Common = /** @class */ (function () {
         this.mouseDown = null;
         this.renderTimer = 0;
         this.lastRender = 0;
+        this.pageResizeTim = null;
+        this.isResize = false;
         this.id = s8();
         this.store = useStore(this.id);
         if (typeof parent === 'string') {
@@ -233,7 +238,7 @@ var Common = /** @class */ (function () {
                 })
             }
             if (node.children && node.children.length) {
-                renderForAssetPoperties(asset, node.children);
+                this.renderForAssetPoperties(asset, node.children);
             }
         });
     };
@@ -245,6 +250,16 @@ var Common = /** @class */ (function () {
         }
         let data = JSON.parse(JSON.stringify(obj));
         Object.assign(this.store.data, data);
+        // pageZoomOnly 表示topology页面只全局缩放，不对局部缩放进行调整
+        if(this.store.options.type !== 'topology' && this.store.options.type !== 'pageZoomOnly') {
+            const screenWidth = window.screen.width < 1920 ? 1920 : window.screen.width;
+            const zoom = window.innerWidth < screenWidth ? document.documentElement.clientWidth / screenWidth : 1;
+            this.store.data.pageZoom = zoom;
+            this.store.parentElem.style.transform = `scale(${1/zoom})`;
+            this.store.parentElem.style.transformOrigin = '0 0';
+            this.store.parentElem.parentElement.style.overflow = 'hidden';
+            Store.set('PAGE:zoom', zoom);
+        };
         this.store.data.pens = [];
         this.openCount = 0
         const type = this.store.options.type;
@@ -475,29 +490,24 @@ var Common = /** @class */ (function () {
         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();
     };
@@ -763,6 +773,9 @@ var Common = /** @class */ (function () {
             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();
@@ -826,6 +839,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();

package/core/src/core.js

@@ -2340,6 +2340,31 @@ var Topology = (function (_super) {
 
         return true
     };
+    Topology.prototype.formOverflowOpen = function (data) {
+        this.formOverflowConversionData(data);
+        this.overflowView();
+        this.render(true);
+    }
+    Topology.prototype.overflowView = function (data) {
+        try {
+            var rect = this.getRect();
+            let _a = this.canvas;
+            if(!_a.width) return;
+            let width = _a.width, height = _a.height;
+            let rectWidth = rect.width? (rect.ex + 4) : rect.width
+            let rectHeight= rect.height? (rect.ey + 4) : rect.height
+            if (width < rectWidth) {
+                width = rectWidth;
+            }
+            if (height < rectHeight) {
+                height = rectHeight;
+            }
+            this.resize({width: width, height: height});
+            return rect;
+        }catch (e){
+            console.log('-error--------overflowView---',e)
+        }
+    }
     return Topology;
 }(Common));
 

package/core/src/divLayer.js

@@ -76,7 +76,7 @@ var DivLayer = /** @class */ (function (_super) {
         return _this;
     }
     DivLayer.prototype.addElement = function (node){
-        if(['iframe', 'echarts'].includes(node.name)) {
+        if(['iframe', 'echarts', 'formOverflow'].includes(node.name)) {
             this.canvas.parentNode.appendChild(this.elements[node.id]);
         }else {
             this.canvas.appendChild(this.elements[node.id]);

package/core/src/element/common.js

@@ -1,12 +1,14 @@
 import {Lock} from '../models';
+import {commonStore} from '../store';
 export function setStyleForElementIdDiv(node, elem, data) {
     if (!elem) return;
+    const store = commonStore[node.TID].data;
     elem.style.position = 'absolute';
     elem.style.outline = 'none';
     elem.style.left = node.rect.x + 'px';
     elem.style.top = node.rect.y + 'px';
-    elem.style.width = node.rect.width + 'px';
-    elem.style.height = node.rect.height + 'px';
+    elem.style.width = node.rect.width / store.pageZoom + 'px';
+    elem.style.height = node.rect.height / store.pageZoom + 'px';
     if (node.rotate || node.offsetRotate) {
         elem.style.transform = "rotate(" + (node.rotate + node.offsetRotate) + "deg)";
     }

package/core/src/element/select.js

@@ -70,6 +70,7 @@ export function setSelectInteractiveState(selected, node) {
 }
 // 重置下拉状态
 export function resetSelectInteractiveState(node) {
+    if(!node || !node.TID) return;
     const currentStore = commonStore[node.TID];
     if(!Object.keys(currentStore.selectDataPool).length) return;
     for (let data of Object.values(currentStore.selectDataPool)) {
@@ -196,7 +197,9 @@ export function getSelectedData(e, data, editData) {
         if(!optionNode) return;
         // 切换数据
         currentStore.echartsRealDataPool[optionNode.data.id] = currentStore.echartsRealDataPool[node.id];
+        const isInitTable = initTabSwitchPage(data.formData.bindBlockTag, optionNode.data, currentStore);
         setMapDataOptions(optionNode.option, optionNode.data);
+        if(isInitTable) Store.set(`${data.TID}-LT:render`, true);
     }
     if(staticType === selectStaticType.dataShow) {
         // 数据展示
@@ -215,6 +218,32 @@ export function getSelectedData(e, data, editData) {
         Store.set(`${data.TID}-LT:render`, true);
     }
 }
+// 初始化Tab页签选中状态
+function initTabSwitchPage(bindBlockTag, data, currentStore) {
+    if(!bindBlockTag) return false;
+    // 初始化分类选中状态
+    const tabData = currentStore.switchTabDataPool[`${bindBlockTag}Data`]; // 获取Tab组数据
+    if(!tabData) return false;
+    const tabKeys = Object.keys(tabData);
+    const pens = currentStore.data.pens;
+    if(!tabKeys.length || !pens[tabData[tabKeys[0]].order].activeImgeIndex) return false; //Tab默认选中第一个页签就退出程序，不执行初始化状态
+    let tabInit = false;
+    for (let tabNode of Object.values(tabData)) {
+        const penNode = pens[tabNode.order];
+        if(!tabInit) {
+            data.params.tabVisitOrder = 0;
+            data.tabData = {
+                type: '',
+                data: tabNode.tabData
+            };
+        }
+        if(penNode) {
+            penNode.activeImgeIndex = tabInit;
+            tabInit = true;
+        }
+    }
+    return true;
+}
 // 配置下拉展示的主题风格
 export function setSelectElementTheme(node) {
     const themeType = node.formData.theme ? ` theme${node.formData.theme}` : '';

package/core/src/element/tab.js

@@ -9,7 +9,11 @@ export function setElementSwitchTabState(node) {
     if(!commonStore[node.TID].elementInteractivePoor.elementDataLength) return;
     const ele = commonStore[node.TID].echartsDataPool[node.id] && commonStore[node.TID].echartsDataPool[node.id].div ||
             commonStore[node.TID].selectDataPool[node.id] && commonStore[node.TID].selectDataPool[node.id].dom.selectEle;
-    if(ele) ele.style.display = !node.visible ? 'none': 'block';
+    if(ele) {
+        ele.style.display = !node.visible ? 'none': 'block';
+    }else {
+        commonStore[node.TID].data.dataResize = 1;
+    }
     if(node.children && node.children.length) {
         node.children.map((ch) => {
             ch.visible = node.visible;

package/core/src/healps/changeData.js

@@ -110,7 +110,7 @@ export function setConfItemNode(pen, syn_synata) {
             const {echartDataValue} = syn_synata;
             const seriesData = echartDataValue;
             const realData = pen.data.params && seriesData && Object.keys(seriesData).length && seriesData[pen.data.params.id];
-            if (Array.isArray(realData)) {
+            if (Array.isArray(realData) && pen.data.params && pen.data.params.displayMode !== 7) {
                 getEchartsRealData(pen, realData);
             } else {
                 commonStore[pen.TID].echartsRealDataPool[pen.id] = realData;

package/core/src/middles/nodes/formoverflow.js

@@ -0,0 +1,61 @@
+// import {} from './rectangle';
+import {rectangle, createDiv, s8, Topology} from  '../../../../core';
+import {commonStore} from "../../store";
+
+export async function formOverflow(ctx, node) {
+    // 绘制一个底图，类似于占位符。
+    rectangle(ctx, node)
+    console.log('绘制滚动组件--')
+    // 添加当前节点到div层
+    if (!node.elementId) {
+        node.elementId = s8()
+    }
+    let formoverData = commonStore[node.TID].formoverDataPool[node.id];
+    let id = node.formData.detailPageId
+    const color = node.formData.scrollbarColor? node.formData.scrollbarColor: 'auto'
+    const colorBg =  node.formData.scrollbarColorBg? node.formData.scrollbarColorBg: 'auto'
+    const scrollbarColor = color + ' ' + colorBg
+
+    if (!node.elementLoaded && !formoverData) {
+        console.log('是否存在--formoverData--0-',formoverData)
+        if(!formoverData) {
+            formoverData = {
+                div: createDiv(node)
+            };
+        }else {
+            formoverData.div = createDiv(node);
+        }
+        formoverData.div.setAttribute('class', 'topoOverflow');
+        formoverData.div.style.setProperty('scrollbar-color', scrollbarColor);
+        formoverData.div.style.setProperty('scrollbar-width', 'thin');
+
+        node.elementLoaded = true
+        document.body.appendChild(formoverData.div)
+        // 添加当前节点到div层
+        node.addToDiv()
+        commonStore[node.TID].formoverDataPool[node.id] = formoverData;
+
+
+        console.log('请求子页面接口-----id =',id)
+        let canvas = new Topology(node.id, {
+            rotateCursor: '/img/rotate.cur',
+        })
+        canvas.formOverflowOpen(node.formData.detailPageData)
+        commonStore[node.TID].formoverCanvasDataPool[node.id]  = canvas
+    }else if(formoverData && id){
+        console.log('是否存在--formoverData--1-',formoverData)
+        formoverData.div.style.setProperty('scrollbar-color', scrollbarColor);
+        formOverflowChange(node)
+    }
+}
+
+// 更新滚动组件中子页面
+export function formOverflowChange(node) {
+        //绘制画布
+        console.log('更新滚动组件中子页面-',node)
+        let canvas = commonStore[node.TID].formoverCanvasDataPool[node.id] 
+        let data =  node.formData.detailPageData
+        console.log('改变滚动组件中子页面-',data)
+        canvas.formOverflowOpen(data)
+}
+

package/core/src/middles/nodes/formselect.js

@@ -25,19 +25,27 @@ export function formSelect(ctx, node) {
             },
             dom: {}
         };
-        const bindBlockId = node.formData && node.formData.bindBlockId;
+        let bindBlockId = '';
+        if(node.formData.bindBlockId) {
+            // 去空格重新赋值
+            bindBlockId = node.formData.bindBlockId.trim();
+            node.formData.bindBlockId = bindBlockId;
+        }
+        if(node.formData.bindBlockTag) {
+            // 去空格重新赋值
+            node.formData.bindBlockTag = node.formData.bindBlockTag.trim();
+        }
         let selectRealData = bindBlockId && currentStore.selectRealDataPool[bindBlockId];
         if(bindBlockId && selectRealData) {
             // select与echarts互相关联
             currentStore.selectDataPool[node.id].data = selectRealData;
             const echartsData = currentStore.echartsDataPool[bindBlockId];
-            if(echartsData){
-                echartsData.bindId = node.id;
-            }else {
-                currentStore.echartsDataPool[bindBlockId] = {
-                    bindId: node.id
-                }
-            }
+            echartsData ? echartsData.bindId = node.id : currentStore.echartsDataPool[bindBlockId] = {
+                bindId: node.id
+            };
+            // select与Tab关联
+            const bindBlockTagData = currentStore.switchTabDataPool[`${node.formData.bindBlockTag}Data`];
+            if(bindBlockTagData) currentStore.echartsDataPool[bindBlockId].tabCorrelationType = 'select';
         }else {
             if(node.formData.ids) {
                 const optionIds = node.formData.ids.split(',');

package/core/src/middles/nodes/index.d.ts

@@ -44,4 +44,5 @@ export * from './tablePagination';
 export * from './text';
 export * from './triangle';
 export * from './triangle.anchor';
-export * from './triangle.rect';
+export * from './triangle.rect';
+export * from './formoverflow';

package/core/src/middles/nodes/index.js

@@ -45,4 +45,5 @@ export * from './text';
 export * from './triangle';
 export * from './triangle.anchor';
 export * from './triangle.rect';
+export * from './formoverflow';
 //# sourceMappingURL=index.js.map

package/core/src/models/node.js

@@ -48,6 +48,13 @@ var Node = /** @class */ (function (_super) {
         _this.iconSize = +json.iconSize;
         _this.iconColor = json.iconColor;
         _this.image = json.image;
+        _this.tabData = json.tabData || {
+            state: false,
+            name: '℃',
+            min: 0,
+            max: 60,
+            interval: 20
+        };
         _this.floorImageIndex = json.floorImageIndex || false;
         _this.formData = json.formData || null;
         _this.formStyle = json.formStyle || null;

package/core/src/options.d.ts

@@ -45,7 +45,7 @@ export interface Options {
     alwaysAnchor?: boolean;
     disableEmptyLine?: boolean;
     disableRepeatLine?: boolean;
-    disableScale?: boolean;
+    disableScale?: boolean; // 禁止缩放
     disableMoveOutParent?: boolean;
     disableDockLine?: boolean;
     playIcon?: string;

package/core/src/preview.js

@@ -1,3 +1,5 @@
+import {Store} from "le5le-store";
+
 var __extends = (this && this.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
@@ -184,6 +186,27 @@ var Preview = (function (_super) {
                 _this.moveIn.hoverNode.text = '全屏';
                 _this.fitViewPreview(_this.isFullScreen);
                 _this.isFullScreen = false;
+            }else {
+                // pageZoomOnly 表示topology页面只全局缩放，不对局部缩放进行调整，不执行render重绘。通常用于无任何操作事件的topology驾驶舱
+                if(_this.store.options.type === 'topology' || _this.store.options.type === 'pageZoomOnly') return;
+                const screenWidth = window.screen.width < 1920 ? 1920 : window.screen.width;
+                const zoom = window.innerWidth < screenWidth ? document.documentElement.clientWidth / screenWidth : 1;
+                _this.isResize = true;
+                clearTimeout(_this.pageResizeTim);
+                _this.pageResizeTim = setTimeout(() => {
+                    if(_this.isResize){
+                        const pageZoom = 1/zoom;
+                        _this.store.data.pageZoom = zoom;
+                        _this.store.parentElem.style.transform = `scale(${pageZoom})`;
+                        _this.store.parentElem.style.transformOrigin = '0 0';
+                        _this.store.parentElem.parentElement.style.overflow = 'hidden';
+                        _this.store.data.dataResize = 1;
+                        _this.isResize = false;
+                        Store.set('PAGE:zoom', zoom);
+                        _this.fitView();
+                        _this.render();
+                    }
+                }, 1000);
             }
         };
         return _this;
@@ -227,6 +250,8 @@ var Preview = (function (_super) {
         for (var _i = 0, _a = this.store.data.pens; _i < _a.length; _i++) {
             var item = _a[_i];
             item.scale(scale, center, w, h);
+            // 驾驶舱底部区域元件，用于控制底部区域Dom宽高等元素自由变换，后期会删除
+            if(item.tags && item.tags[0] && item.tags[0].includes('contromRoomBottom')) this.store.pens['contromRoomBottom'] = item;
         }
     };
     Preview.prototype.scaleTo = function (scale) {
@@ -245,6 +270,8 @@ var Preview = (function (_super) {
             width = this.store.options.width;
             height = this.store.options.height;
         }
+        width *= this.store.data.pageZoom;
+        height *= this.store.data.pageZoom;
         this.canvasResize({
             width: width,
             height: height,
@@ -261,7 +288,7 @@ var Preview = (function (_super) {
             rect.height = bkImageRect && bkImageRect.height ? bkImageRect.height : height;
         }
         // 6. 计算缩放比
-        var w = (width - padding[1] - padding[3]) / rect.width;
+        var w = (width - padding[1] - padding[3]) / rect.width ;
         var h = (height - padding[0] - padding[2]) / rect.height;
         var ratio = w;
         if (w > h) {

package/core/src/store/data.d.ts

@@ -11,6 +11,7 @@ export interface visualization2DData {
     fromArrowType: string;
     toArrowType: string;
     scale: number;
+    pageZoom: number,
     locked: Lock;
     bkImage: string;
     bkColor: string;
@@ -63,6 +64,8 @@ export interface visualization2DStore {
     selectRealDataPool: {}; // form select
     selectTabDataPool: {}; // form select
     iframeDataPool: {}; // iframe
+    formoverDataPool: {}; // 滚动组件 Dom节点数据
+    formoverCanvasDataPool: {}; // 滚动组件 画布节点数据
     emitter: Emitter;
     dpiRatio?: number;
     lastScale?: number; //记录上次模版的scale
@@ -79,6 +82,7 @@ export const createStore = () => {
             fromArrowType: '',
             toArrowType: 'triangleSolid',
             scale: 1,
+            pageZoom: 1,
             locked: Lock.None,
             bkImageRect: null,
             mqttOptions: {
@@ -113,6 +117,8 @@ export const createStore = () => {
         selectRealDataPool: {}, // form select
         selectTabDataPool: {}, // form select
         iframeDataPool: {}, // iframe
+        formoverDataPool: {}, // 滚动组件 Dom节点数据
+        formoverCanvasDataPool: {}, // 滚动组件 画布节点数据
         emitter: mitt(),
         cacheDatas: [],
         dpiRatio: 1,
@@ -147,6 +153,7 @@ export const clearStore = (store: visualization2DStore, del: string) => {
         fromArrowType: '',
         toArrowType: 'triangleSolid',
         scale: 1,
+        pageZoom: 1,
         locked: Lock.None,
         bkImageRect: null,
         mqttOptions: {

package/core/src/store/data.js

@@ -27,6 +27,7 @@ export var createStore = function () {
             locked: Lock.None,
             dataResize: 1, // 数据是否加载，1是，0否
             bkImageRect: null,
+            pageZoom: 1,
             mqttOptions: {
                 clientId: s8()
             },
@@ -59,6 +60,8 @@ export var createStore = function () {
         selectRealDataPool: {}, // form select
         selectTabDataPool: {}, // form select
         iframeDataPool: {}, // iframe
+        formoverDataPool: {}, // 滚动组件 Dom节点数据
+        formoverCanvasDataPool: {}, // 滚动组件 画布节点数据
         emitter: mitt(),
         cacheDatas: [],
         dpiRatio: 1,
@@ -76,7 +79,7 @@ export var useStore = function (id) {
     return commonStore[id];
 };
 export function clearElementDataPool(data) {
-    const { echartsDataPool, selectDataPool, iframeDataPool} = data;
+    const { echartsDataPool, selectDataPool, iframeDataPool, formoverDataPool, formoverCanvasDataPool} = data;
     for (let [key, node] of Object.entries(echartsDataPool)) {
         if(node) {
             clearInterval(node.timeTicket);
@@ -107,6 +110,16 @@ export function clearElementDataPool(data) {
         node.iframe.parentNode.removeChild(node.iframe);
         delete data.iframeDataPool[key];
     }
+    for (let key of Object.keys(formoverDataPool)) {
+        delete formoverDataPool[key];
+    }
+    for (let key of Object.keys(formoverCanvasDataPool)) {
+        const elementNode = document.getElementById(key);
+        if(elementNode) {
+            elementNode.parentNode.removeChild(elementNode);   
+        }
+        delete formoverCanvasDataPool[key];
+    }
 }
 export var clearStore = function (store, del) {
     store.lastScale = store.data.scale;
@@ -116,6 +129,7 @@ export var clearStore = function (store, del) {
         fromArrowType: '',
         toArrowType: 'triangleSolid',
         scale: 1,
+        pageZoom: 1,
         locked: Lock.None,
         dataResize: 1, // 数据是否加载，1是，0否
         bkImageRect: null,
@@ -154,6 +168,8 @@ export var clearStore = function (store, del) {
         echartsDataPool: store.echartsDataPool,
         selectDataPool: store.selectDataPool,
         iframeDataPool: store.iframeDataPool,
+        formoverDataPool: store.formoverDataPool,
+        formoverCanvasDataPool: store.formoverCanvasDataPool,
     });
     if(del) {
         delete commonStore[store.id];

package/core/src/utils/assignment.js

@@ -105,7 +105,7 @@ export function setDefaultNodeValidat(node, retData) {
              * 全局报警标记，代表正在访问的这个topology文件中是否有告警发生
              * 需要注意：自定义函数中要通过 return {monitorAlarm: boolean}的格式将元件告警状态返回
              */
-            if(funcData && funcData.monitorAlarm) commonStore[node.TID].monitorAlarm = true;
+            if(funcData && funcData.monitorAlarm && commonStore[node.TID]) commonStore[node.TID].monitorAlarm = true;
         }catch (e) {
             console.log(`自定义函数出错>>>`,);
             console.log(`目标元件：${node.id}>>>`,);
@@ -114,7 +114,7 @@ export function setDefaultNodeValidat(node, retData) {
     } else {
         // console.log('默认函数')
         const newData = setConfItemNode(node, retData);
-        if(newData && newData.monitorAlarm) commonStore[node.TID].monitorAlarm = true;
+        if(newData && newData.monitorAlarm && commonStore[node.TID]) commonStore[node.TID].monitorAlarm = true;
     }
     if (node.animateFrames && node.animateFrames.length) {
         for (var _a = 0, _af = node.animateFrames; _a < _af.length; _a++) {

package/core/src/utils/construction.d.ts

@@ -1,4 +1,6 @@
 // @ts-ignore
+export declare const echartsStaticType: Array<string> = [];
+// @ts-ignore
 export declare const winEventActionFns: Array<string> = [];
 export interface MoveDataType {
     None?: string | number;

package/core/src/utils/construction.js

@@ -1,3 +1,4 @@
+export const echartsStaticType = ['DAY', 'WEEK', 'MONTH', 'YEAR', 'REALTIME'];
 export const winEventActionFns = ['Link', 'DoAnimate', 'DoFn', 'DoWindowFn', 'openImg'];
 export const moveDataType = {
     None: 0,

package/core/src/utils/conversion.d.ts

@@ -1,5 +1,6 @@
 import {Node} from "../models";
-
+export declare function tabStaticOperation(type: string, node: Node, areaData: any, params: object): void;
+export declare function tabHideShowOperation(node: any, areaData: any): void;
 export declare function getEchartsRealData(node: {}, data: []): void;
 export declare function setInitConfData(id: string, data: object): void;
 export declare function setTagIdData(data: any): [];

package/core/src/utils/conversion.js

@@ -1,4 +1,56 @@
 import {commonStore} from '../store';
+import {setElementSwitchTabState} from '../element';
+import {echartsStaticType} from '../utils';
+
+/**
+ * Tab 数据统计
+ * @param type 统计类型
+ * @param node 元件数据
+ * @param areaData tab展示区域数据
+ * @param params Tab 切换选中参数
+ */
+export function tabStaticOperation(type, node, areaData, params) {
+    if(!node.bindStaticId || !(echartsStaticType.includes(type) || type === 'OTHER')) return;
+    const curentEchart = areaData && areaData[node.bindStaticId]; // 获取当前点中的节点绑定的统计图表数据
+    if(!curentEchart || !curentEchart.data.params) return console.log('未能找到匹配的echarts图表>>>');
+    const currentStore = commonStore[node.TID];
+    const echartNode = currentStore.data.pens[curentEchart.order]; // 获取tab 绑定的图表元件数据
+    if(type === 'OTHER') {
+        const tabCorrelationType = currentStore.echartsDataPool[node.bindStaticId].tabCorrelationType; // 获取select与tab关联的标识
+        const optionNode = currentStore.echartsOptionsPool[node.bindStaticId];
+        if(tabCorrelationType === 'select') {
+            // tab类型为包含在select下的切换则执行下面的逻辑
+            echartNode.data.params['tabVisitOrder'] = params.order;
+        }else {
+            // 非 年、月、日、周、实时类型的切换
+            const groupData = currentStore.selectRealDataPool[node.bindStaticId];
+            if (optionNode) currentStore.echartsRealDataPool[optionNode.data.id] = currentStore.echartsRealDataPool[groupData[params.order].id];
+        }
+        if(optionNode) optionNode.data.tabData = {
+            type,
+            data: params.data
+        };
+    }
+    echartNode.data.params['staticForType'] = type
+    echartNode.elementRendered = false;
+}
+/**
+ * Tab 显示/隐藏切换
+ * @param node tab页签数据
+ * @param areaData // tab展示区域数据
+ */
+export function tabHideShowOperation(node, areaData) {
+    const confIds = node.bindStaticId && node.bindStaticId.split(',') || [];
+    const pens = commonStore[node.TID].data.pens;
+    for (let i = 0; i < confIds.length; i++) {
+        const confid = confIds[i];
+        const areaNode = areaData[confid];
+        if(!(areaNode && pens[areaNode.order])) return;
+        const tagNode = pens[areaNode.order];
+        tagNode.visible = !(node.id !== node.id);
+        setElementSwitchTabState(tagNode);
+    }
+}
 /**
  * 获取echarts和select实时数据
  * @param node 节点