dcim-topology2d 2.0.8 → 2.1.0

package/core/src/element/tab.js

@@ -5,19 +5,21 @@ export function setElementSwitchTabState(node) {
     if(node.children && node.children.length) {
         node.children.map((ch) => {
             ch.visible = node.visible;
+            ch.visibleSwitch = node.visible;
             setElementSwitchTabState(ch);
         })
     }
     if(!(node.name === 'echarts' || node.name === 'select')) return;
-    if(typeof commonStore[node.TID].elementInteractivePoor.elementDataLength !== 'number') {
-        commonStore[node.TID].elementInteractivePoor.elementDataLength = jsonLength(commonStore[node.TID].echartsDataPool) || jsonLength(commonStore[node.TID].selectDataPool);
+    const currentStore = commonStore[node.TID];
+    if(typeof currentStore.elementInteractivePoor.elementDataLength !== 'number') {
+        currentStore.elementInteractivePoor.elementDataLength = jsonLength(currentStore.echartsDataPool) || jsonLength(currentStore.selectDataPool);
     }
-    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(!currentStore.elementInteractivePoor.elementDataLength) return;
+    const ele = currentStore.echartsDataPool[node.id] && currentStore.echartsDataPool[node.id].div ||
+            currentStore.selectDataPool[node.id] && currentStore.selectDataPool[node.id].dom.selectEle;
     if(ele) {
         ele.style.display = !node.visible ? 'none': 'block';
     }else {
-        commonStore[node.TID].data.dataResize = 1;
+        currentStore.data.dataResize = 1;
     }
 }

package/core/src/element/time.d.ts

@@ -0,0 +1,3 @@
+import { Node } from '../models';
+
+export declare function createTimeElement(node: Node): HTMLTimeElement;

package/core/src/element/time.js

@@ -0,0 +1,44 @@
+// 创建时间组件
+export function createTimeElement(node) {
+  const timeBox = document.createElement('div');
+  // timeBox.scrolling = 'no';
+  timeBox.width = node.rect.width;
+  timeBox.height = node.rect.height;
+  let children = 
+  `<div class="timeWrapper" style="display: flex;flex-direction: initial; justify-content: center; font-size: ${node.font.fontSize}px;width:100%;height:100%; line-height:${timeBox.height}px; color:${node.font.color}; font-family:${node.font.fontFamily}">`+
+    `<div class="timeList" style="position: relative;display: flex; flex-direction: column;flex:4;height: 100%;overflow: hidden;text-align: center;">
+        <div class="timeBox" style="position: relative;width: 100%;height: 100%;overflow: hidden;">
+          <div class="timeTextUp h" style="position: relative;clip-path: polygon(0 0,100% 0,100% 49%,0 49%); background-color: rgba(255,255,255,0.1);border-radius: 20px;height: 100%;">${node.h}</div>
+          <div class="timeTextDown h" style="position: absolute;clip-path: polygon(0 51%,100% 51%,100% 100%,0 100%);left: 0;top: 0;width: 100%;height: 100%; background-color: rgba(255,255,255,0.1);border-radius: 20px;">${node.h}</div>
+        </div>
+      </div>`+ 
+    `<div class="split" style="flex:1; position: relative;line-height:${timeBox.height}px">:</div>`+
+    `<div class="timeList" style="position: relative;display: flex; flex-direction: column;flex:4;height: 100%;overflow: hidden;text-align: center;">
+        <div class="timeBox" style="position: relative;width: 100%;height: 100%;overflow: hidden;">
+          <div class="timeTextUp m" style="position: relative;clip-path: polygon(0 0,100% 0,100% 49%,0 49%); background-color: rgba(255,255,255,0.1);border-radius: 20px; height: 100%;">${node.m}</div>
+          <div class="timeTextDown m" style="position: absolute;clip-path: polygon(0 51%,100% 51%,100% 100%,0 100%);left: 0;top: 0;width: 100%;height: 100%; background-color: rgba(255,255,255,0.1);border-radius: 20px;">${node.m}</div>
+        </div>
+      </div>`+ 
+    `<div class="split" style="flex:1; position: relative;line-height:${timeBox.height}px">:</div>`+
+    `<div class="timeList" style="position: relative;display: flex; flex-direction: column;flex:4;height: 100%;overflow: hidden;text-align: center;">
+        <div class="timeBox" style="position: relative;width: 100%;height: 100%;overflow: hidden;">
+          <div class="timeTextUp s" style="position: relative;clip-path: polygon(0 0,100% 0,100% 49%,0 49%); background-color: rgba(255,255,255,0.1);border-radius: 20px; height: 100%;">${node.s}</div>
+          <div class="timeTextDown s" style="position: absolute;clip-path: polygon(0 51%,100% 51%,100% 100%,0 100%);left: 0;top: 0;width: 100%;height: 100%; background-color: rgba(255,255,255,0.1);border-radius: 20px;">${node.s}</div>
+        </div>
+      </div>`+ 
+  `</div>`
+  timeBox.setAttribute('id', node.id);
+  timeBox.setAttribute('class', 'topology2dConfTime');
+  timeBox.innerHTML = children;
+  return timeBox;
+}
+export function updateTimeStyle(node, time) {
+  time.querySelector('.timeWrapper').style.lineHeight = node.rect.height+'px';
+  time.querySelector('.timeWrapper').style.fontSize = node.font.fontSize+'px';
+  time.querySelector('.timeWrapper').style.fontFamily = node.font.fontFamily;
+  time.querySelector('.timeWrapper').style.color = node.font.color;
+  time.querySelectorAll('.split').forEach(element => {
+    element.style.lineHeight = node.rect.height+'px';
+  });
+
+}

package/core/src/middles/default.js

@@ -5,7 +5,7 @@ import {
   twowayArrow, twowayArrowIconRect, twowayArrowTextRect,
   rectangle, rectangleIconRect, rectangleTextRect,
   diamond, diamondIconRect, diamondTextRect,
-  text, file, formtable, tablePagination, iframePrimeval,formSelect,
+  text, file, formtable, tablePagination, iframePrimeval,formSelect, fromDatePicker,
   line as nodeLine, lineAnchors, lineIconRect, lineTextRect,
   circle, circleIconRect, circleTextRect, circleAnchors,
   triangle, triangleIconRect, triangleTextRect, triangleAnchors,
@@ -17,7 +17,7 @@ import {
   imageIconRect, imageTextRect,
   cube, cubeAnchors, cubeIconRect, cubeTextRect,
   people, peopleIconRect, peopleTextRect,
-  arbitraryGraph, arbitraryGraphAnchors,
+  arbitraryGraph, arbitraryGraphAnchors,time
 } from './nodes';
 import {
   line,
@@ -62,6 +62,8 @@ export var drawArrowFns = {};
 function init() {
     console.log('Init middles.');
     // ********Default nodes.*******
+    // datePicker
+    drawNodeFns.datePicker = fromDatePicker;
     // select
     drawNodeFns.select = formSelect;
     // iframe
@@ -199,6 +201,10 @@ function init() {
     drawArrowFns.lineUp = lineUp;
     drawArrowFns.lineDown = lineDown;
     // ********end********
+    // 当前时间
+    drawNodeFns.time = time;
+    iconRectFns.time = rectangleIconRect;
+    textRectFns.time = rectangleTextRect;
 }
 init();
 // registerNode: Register a custom node.

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

@@ -0,0 +1,2 @@
+import { Node } from '../../models';
+export declare function fromDatePicker(ctx: CanvasRenderingContext2D, node: Node): void;

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

@@ -0,0 +1,66 @@
+import {Store} from 'le5le-store';
+import {rectangle} from './rectangle';
+import { createDatePickerElement, loadJS, setDataPickerElementStyle } from '../../element';
+import { s8 } from '../../utils';
+import {commonStore} from "../../store";
+
+export async function fromDatePicker(ctx, node) {
+    // 绘制一个底图，类似于占位符。 
+    rectangle(ctx, node);
+
+    if (!window.datePickerRegister) {
+        //未注册datePicker插件
+        const datePickerRegisterData = await loadJS(`${window.location.origin}/libary/laydate/laydate.js`).catch((e) => {
+            console.error('datePicker插件加载失败>>>', e);
+        });
+        if(!datePickerRegisterData) return;
+    }
+
+    const currentStore = commonStore[node.TID];
+
+    if (!currentStore.pickerDataPool[node.id]) {
+        // 未创建该元件
+        node.elementId = s8();
+        const datePicker = createDatePickerElement(node);
+        currentStore.pickerDataPool[node.id] = {
+            dom: {
+                container: datePicker
+            }
+        }
+        document.body.appendChild(datePicker);
+        // 添加当前节点到div层
+        node.addToDiv();
+        setDataPickerElementStyle(node);
+        if(window.location.pathname.includes('workspace') && currentStore.options.type === 'topology') return;
+        const pickerOptions = Object.keys(node.pickerOptions).reduce((a,k) => (node.pickerOptions[k] && (a[k]=node.pickerOptions[k]), a), {}); // 过滤空数据
+        if((pickerOptions.min || pickerOptions.max) && (pickerOptions.type !== 'year' || pickerOptions.type !== 'month')){
+            // 字符转换
+            if(pickerOptions.min && isValidInteger(pickerOptions.min)) pickerOptions.min = Number(pickerOptions.min);
+            if(pickerOptions.max && isValidInteger(pickerOptions.max)) pickerOptions.max = Number(pickerOptions.max);
+        }
+        pickerOptions.elem = `#picker${node.id}`;
+        pickerOptions.done = function (val, date) {
+            node.formData.selected = val
+            date.value = val;
+            Store.set(`${node.TID}-EVENT:change`, {node, date});
+        }
+        setTimeout(() => {
+
+            laydate.render(pickerOptions);
+
+        }, 100)
+    }else {
+        if(node.formData.resetStyle) {
+            setDataPickerElementStyle(node);
+            node.formData.resetStyle = false;
+        }
+        // if(!node.formData.render) return;
+        // node.formData.render = false;
+        // const pickerOptions = Object.keys(node.pickerOptions).reduce((a,k) => (node.pickerOptions[k] && (a[k]=node.pickerOptions[k]), a), {}); // 过滤空数据
+        // Object.assign(node.formData.datePicker.config, pickerOptions);
+        //resetDatePicker(node);
+    }
+}
+function isValidInteger(str) {
+    return /^-?\d+$/.test(str) && str !== '-' && !str.startsWith('+');
+}

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

@@ -38,7 +38,14 @@ export function formSelect(ctx, node) {
         let selectRealData = bindBlockId && currentStore.selectRealDataPool[bindBlockId];
         if(bindBlockId && selectRealData) {
             // select与echarts互相关联
+            if(node.formData.ids) {
+                const optionIds = node.formData.ids.split(',');
+                for (let i = 0; i < optionIds.length; i++) {
+                    if(selectRealData[i]) selectRealData[i].optionId = optionIds[i];
+                }
+            }
             currentStore.selectDataPool[node.id].data = selectRealData;
+            currentStore.selectDataPool[node.id].node.selected.id = selectRealData[0].id;
             const echartsData = currentStore.echartsDataPool[bindBlockId];
             echartsData ? echartsData.bindId = node.id : currentStore.echartsDataPool[bindBlockId] = {
                 bindId: node.id

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

@@ -45,4 +45,6 @@ export * from './text';
 export * from './triangle';
 export * from './triangle.anchor';
 export * from './triangle.rect';
-export * from './formoverflow';
+export * from './formoverflow';
+export * from './time';
+export * from './formDatePicker';

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

@@ -46,4 +46,7 @@ export * from './triangle';
 export * from './triangle.anchor';
 export * from './triangle.rect';
 export * from './formoverflow';
+export * from './time';
+export * from './formDatePicker';
+
 //# sourceMappingURL=index.js.map

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

@@ -0,0 +1,2 @@
+import { Node } from '../../models';
+export declare function time(ctx: CanvasRenderingContext2D, node: Node): void;

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

@@ -0,0 +1,98 @@
+export function time(ctx, node) {
+    var wr = node.borderRadius;
+    var hr = node.borderRadius;
+    if (node.borderRadius < 1) {
+        wr = node.rect.width * node.borderRadius;
+        hr = node.rect.height * node.borderRadius;
+    }
+    var r = wr < hr ? wr : hr;
+    if (node.rect.width < 2 * r) {
+        r = node.rect.width / 2;
+    }
+    if (node.rect.height < 2 * r) {
+        r = node.rect.height / 2;
+    }
+
+    // 背景
+    let x = node.rect.x;
+    let y = node.rect.y;
+    let width = node.rect.width * 0.29;
+    let height = node.rect.height;
+    let gap = node.rect.width * 0.065;
+    let {h, m, s} = node.time;
+
+    //绘制时
+    drawText(ctx, r, x, y, width, height, h, node, gap)
+
+    //绘制分
+    drawText(ctx, r, x+width+gap, y, width, height, m, node, gap)
+
+    //绘制秒
+    drawText(ctx, r, x+(width*2 + gap*2), y, width, height, s, node)
+
+    //恢复填充色
+    ctx.fillStyle = "#ffffff";
+
+
+}
+
+function drawText(ctx, r, x, y, width, height, hText, node, gap) {
+
+    //文字
+    let textfillStyle = node.font.color || "#ffffff";
+    let textBackground = node.font.background || '#ffffff1a';
+    ctx.font = '' + node.font.fontSize +"px " + node.font.fontFamily;
+    ctx.textBaseline = 'middle';
+    ctx.textAlign = 'center';
+
+    const centerX = width / 2;
+    const centerY = height / 2;
+    //绘制上半部分
+    ctx.save();
+    ctx.beginPath();
+    ctx.fillStyle = textBackground;
+    ctx.beginPath();
+    ctx.moveTo(x + r, y);
+    ctx.lineTo(x + width -r, y);
+    ctx.quadraticCurveTo(x + width, y, x+width, y+r);
+    ctx.lineTo(x+width, y + height/2 - 1);
+    ctx.lineTo(x, y + height/2 - 1);
+    ctx.lineTo(x, y+r);
+    ctx.quadraticCurveTo(x, y, x+r, y);
+    ctx.fill();
+    ctx.clip();
+
+    ctx.fillStyle = textfillStyle;
+    ctx.fillText(hText, x+centerX, y+centerY);
+    ctx.restore();
+    //绘制下半部分
+    ctx.save();
+    ctx.beginPath();
+    ctx.fillStyle = textBackground;
+    ctx.moveTo(x, y+height/2+1);
+    ctx.lineTo(x+width, y+height/2+1);
+    ctx.lineTo(x+width, y+height-r);
+    ctx.quadraticCurveTo(x+width, y+height, x+width-r, y+height);
+    ctx.lineTo(x+r, y+height);
+    ctx.quadraticCurveTo(x, y+height, x, y+height-r);
+    ctx.lineTo(x, y+height/2+2);
+    ctx.fill();
+    ctx.clip();
+    
+    ctx.fillStyle = textfillStyle;
+    ctx.fillText(hText, x+centerX, y+centerY);
+    ctx.restore();
+
+    //绘制冒号
+    if(!gap) return
+
+    ctx.fillStyle = textfillStyle;
+    ctx.textBaseline = 'middle';
+    ctx.textAlign = 'center';
+    let metricss = ctx.measureText(":");
+    const fontHeights = metricss.actualBoundingBoxAscent + metricss.actualBoundingBoxDescent;
+    const centerYY = y + (height / 2) + (metricss.actualBoundingBoxAscent - fontHeights / 2);
+    ctx.fillText(":", x+width+(gap/2), centerYY);
+    ctx.restore();
+
+}

package/core/src/models/node.js

@@ -57,6 +57,7 @@ var Node = /** @class */ (function (_super) {
         };
         _this.floorImageIndex = json.floorImageIndex || false;
         _this.formData = json.formData || null;
+        _this.pickerOptions = json.pickerOptions || null;
         _this.formStyle = json.formStyle || null;
         _this.formEvents = json.formEvents || [];
         _this.paginationData = json.paginationData || null;
@@ -144,6 +145,7 @@ var Node = /** @class */ (function (_super) {
         _this.video = json.video;
         _this.play = json.play;
         _this.nextPlay = json.nextPlay;
+        _this.time = json.time;
         if (json.elementLoaded !== undefined) {
             _this.elementId = null;
             _this.elementLoaded = false;
@@ -172,6 +174,16 @@ var Node = /** @class */ (function (_super) {
             _this.children = null;
         }
 
+        if(json.name === 'time') {
+            _this.animateFn = function() {
+                    let date = new Date();
+                    var hour = date.getHours() < 10 ?  "0" + date.getHours() : date.getHours();
+                    var minute = date.getMinutes() < 10 ?  "0" + date.getMinutes() : date.getMinutes();
+                    var second = date.getSeconds() < 10 ?  "0" + date.getSeconds() : date.getSeconds();
+                    _this.time = {h: hour, m:minute, s:second}
+            }
+        }
+
         return _this;
     }
     Node.cloneState = function (json) {

package/core/src/preview.d.ts

@@ -4,6 +4,7 @@ import { Point } from './models';
 import {Common} from './common';
 export declare class Preview extends Common{
     constructor(parent: string | HTMLElement, options?: Options);
+    private eventChangeSubcribe;
     private scheduledAnimationFrame;
     private onMouseMove;
     private onmousedown;

package/core/src/preview.js

@@ -35,6 +35,14 @@ var Preview = (function (_super) {
         var _this = _super.call(this, parent, options) || this;
         _this.offscreen.getRoutineLayer(['AnimateLayer']);
         _this.scheduledAnimationFrame = false;
+        _this.innerHeight = window.innerHeight || document.documentElement.clientHeight; // 初始化网页高度
+        _this.devicePixelInnerHeight = _this.innerHeight; // 初始化网页缩放高度
+        _this.devicePixelRatio = window.devicePixelRatio; // 初始化窗口分辨率
+        // 选中值发生变化时触发，目前用于日期切换
+        _this.eventChangeSubcribe = Store.subscribe(this.generateStoreKey('EVENT:change'), function (data) {
+            const {node, date} = data;
+            _this.dispatch('change', node, date); // eventOut外部事件
+        });
         _this.onMouseMove = function (e) {
             _this.store.data.dataResize = 0;
             // https://caniuse.com/#feat=mdn-api_mouseevent_buttons
@@ -181,14 +189,29 @@ var Preview = (function (_super) {
             return false;
         };
         window.onresize = function () {
-            const isFullScreen = document.fullscreenElement || document.webkitFullscreenElement || document.mozFullscreenElement;
-            if(!isFullScreen && _this.isFullScreen){
-                _this.moveIn.hoverNode.text = '全屏';
+            let isFullScreen = document.fullscreenElement || document.webkitFullscreenElement || document.mozFullscreenElement;
+            if((!isFullScreen && _this.isFullScreen) || window.keyControlFullScreen){
+                // F11或ESC退出全屏
+                if(!window.keyControlFullScreen) _this.moveIn.hoverNode.text = '全屏';
                 _this.fitViewPreview(_this.isFullScreen);
                 _this.isFullScreen = false;
+                window.keyControlFullScreen = false;
             }else {
-                // pageZoomOnly 表示topology页面只全局缩放，不对局部缩放进行调整，不执行render重绘。通常用于无任何操作事件的topology驾驶舱
-                if(_this.store.options.type === 'topology' || _this.store.options.type === 'pageZoomOnly') return;
+                const documentElementHeight = window.innerHeight || document.documentElement.clientHeight; // 每次窗口有变化就重新获取一次网页高度
+                if(window.devicePixelRatio !== _this.devicePixelRatio) {
+                    _this.devicePixelInnerHeight = documentElementHeight;
+                    _this.devicePixelRatio = window.devicePixelRatio;
+                }
+                if(_this.devicePixelInnerHeight < documentElementHeight && !isFullScreen) {
+                    // 按F11 全屏
+                    setTimeout(() => {
+                        _this.fitViewPreview(false);
+                        _this.isFullScreen = true;
+                    }, 200);
+                    window.keyControlFullScreen = true;
+                }
+                // topology编辑器或全屏下跳出程序
+                if(_this.store.options.type === 'topology' || window.keyControlFullScreen) return;
                 const screenWidth = window.screen.width < 1920 ? 1920 : window.screen.width;
                 const zoom = window.innerWidth < screenWidth ? document.documentElement.clientWidth / screenWidth : 1;
                 _this.isResize = true;
@@ -303,6 +326,7 @@ var Preview = (function (_super) {
     };
     Preview.prototype.destroy = function () {
         this.destroyStatic();
+        if(this.eventChangeSubcribe) this.eventChangeSubcribe.unsubscribe();
         this.onMouseMove = null;
         this.onmousedown = null;
         this.onmouseup = null;

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

@@ -38,6 +38,7 @@ export interface paramsData {
     assetIds?: [],
     areaIds?: [],
     varVaule?: [],
+    branchValue?: [],
     echartData?: [],
     echartAssemblyData?: [],
     routingkey?: string,
@@ -56,6 +57,7 @@ export interface visualization2DStore {
         data: visualization2DData;
     }[];
     elementInteractivePoor: {}; // element 交互过渡数据
+    pickerDataPool: {}; // datePicker 交互数据池
     echartsDataPool: {}; // echarts Dom节点数据
     echartsOptionsPool: {}; // echarts options节点数据
     echartsRealDataPool: {}; // echarts 实时数据
@@ -102,6 +104,7 @@ export const createStore = () => {
             assetIds: [],
             areaIds: [],
             varVaule: [],
+            branchValue: [],
             echartData: [],
             echartAssemblyData: [],
             routingkey: '',
@@ -110,6 +113,7 @@ export const createStore = () => {
         pens: {},
         options: { ...DefalutOptions },
         elementInteractivePoor: {}, // element 交互过渡数据
+        pickerDataPool: {}, // datePicker 交互数据池
         echartsDataPool: {}, // echarts Dom节点数据
         echartsOptionsPool: {}, // echarts options节点数据
         echartsRealDataPool: {}, // echarts 实时数据
@@ -174,6 +178,7 @@ export const clearStore = (store: visualization2DStore, del: string) => {
         assetIds: [],
         areaIds: [],
         varVaule: [],
+        branchValue: [],
         echartData: [],
         echartAssemblyData: [],
         routingkey: '',

package/core/src/store/data.js

@@ -44,6 +44,7 @@ export var createStore = function () {
             assetIds: [],
             areaIds: [],
             varVaule: [],
+            branchValue: [],
             echartData: [],
             echartAssemblyData: [],
             routingkey: '',
@@ -52,9 +53,10 @@ export var createStore = function () {
         pens: {},
         options: { ...DefalutOptions },
         elementInteractivePoor: {}, // element 交互过渡数据
+        pickerDataPool: {}, // datePicker 交互数据池
         echartsDataPool: {}, // echarts Dom节点数据
         echartsOptionsPool: {}, // echarts options节点数据
-        echartsRealDataPool: {}, // echarts 实时数据
+        echartsRealDataPool: {}, // echarts 实时数据 datePicker
         switchTabDataPool: {}, // tabs
         tableDataPool: {}, // form table
         selectDataPool: {}, // form select
@@ -68,7 +70,8 @@ export var createStore = function () {
         dpiRatio: 1,
         lastScale: 1,
         monitorAlarm: false,// 全局报警标记，代表正在访问的这个topology文件中是否有告警发生
-        parentElem: null
+        parentElem: null,
+        timeDataPool: {}, // time
     };
 };
 export var useStore = function (id) {
@@ -87,6 +90,7 @@ export function clearElementDataPool(data) {
             if(node.chart) {
                 node.chart.off('mouseover');
                 node.chart.off('mouseout');
+                node.chart.off('globalout');
                 node.chart.dispose();
             }
             if(node.div && node.div.parentNode) node.div.parentNode.removeChild(node.div);
@@ -149,6 +153,7 @@ export var clearStore = function (store, del) {
         assetIds: [],
         areaIds: [],
         varVaule: [],
+        branchValue: [],
         echartData: [],
         echartAssemblyData: [],
         routingkey: '',
@@ -160,6 +165,7 @@ export var clearStore = function (store, del) {
     store.lastScale = 1;
     store.monitorAlarm = false;
     store.elementInteractivePoor = {};
+    store.pickerDataPool = {};
     store.echartsOptionsPool = {};
     store.echartsRealDataPool = {};
     store.switchTabDataPool = {};
@@ -172,6 +178,7 @@ export var clearStore = function (store, del) {
         iframeDataPool: store.iframeDataPool,
         formoverDataPool: store.formoverDataPool,
         formoverCanvasDataPool: store.formoverCanvasDataPool,
+        timeDataPool: store.timeDataPool
     });
     if(del) {
         delete commonStore[store.id];

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

@@ -3,4 +3,5 @@ import {Node} from '../models';
 export declare function setInitNodeDataValidat(node: any, TID: string, type: string, order: number): void;
 export declare function initDefaultValidat(node: any, retData: any): void;
 export declare function setDefaultNodeValidat(node: any, retData: any): any;
-export declare function setConnectionTagForConf(node: Node): void;
+export declare function setConnectionTagForConf(node: Node): void;
+export declare function setConnectionTabsData(node: Node): void;

package/core/src/utils/assignment.js

@@ -47,14 +47,15 @@ export function initDefaultValidat(node, retData) {
     if (node.name === 'line') {
         node.defaultStrokeStyle = node.strokeStyle;
     }
+    const dataDictionary = retData && {...retData.varData, ...retData.branchNameData} || {};
     // 变量类型数据展示，不需要实时更新
-    if(Array.isArray(node.data) && retData && retData.varData) {
+    if(Array.isArray(node.data) && Object.keys(dataDictionary).length) {
         let typeName = '';
         let imgs = '';
-        const varData = retData.varData;
+        const assetId = retData.asset && retData.asset.assetId;
         node.data.map((vd) => {
-            if(vd.key.includes('varValue') && varData[vd.value]){
-                const varNode = varData[vd.value];
+            const varNode = dataDictionary[vd.value] || dataDictionary[`${assetId}_${vd.value}`];
+            if((vd.key.includes('varValue') || vd.key.includes('branchVal')) && varNode){
                 const showType = varNode.showType ? parseInt(varNode.showType) : 1;
                 if(showType === 1 && varNode.value) typeName += typeName ? `,${varNode.value}` : varNode.value;
                 if(showType === 2 && varNode.value) console.log('显示图标>>>');
@@ -142,15 +143,10 @@ export function setConnectionTagForConf(node) {
         if(t === 'statisticType' || t.includes('switchTabType')) setType = 'tab';
         if(t.includes('selectOption')) setType = 'selectShow';
     });
-    const isTabs = node.events && node.events.find((ev) => ev.action === 8);
-    if(!setType && isTabs) console.log('>>>未能找到绑定的标签数据，请检查绑定的Tabs标签是否包含switchTabType前缀>>>');
+    if(!setType) console.log('>>>未能找到绑定的标签数据，请检查绑定的Tabs标签是否包含switchTabType前缀>>>');
     if(setType === 'tab'){
         // tab切换
-        const tagData = node.tags[0];
-        let topologyChangeData = commonStore[node.TID].switchTabDataPool;
-        let keyName = node.bindStaticId ? `${tagData}Data` : `${tagData}AreaData`;
-        if (!topologyChangeData[keyName]) topologyChangeData[keyName] = {};
-        topologyChangeData[keyName][node.id] = node;
+        setConnectionTabsData(node);
     }
     if(setType === 'selectShow'){
         // 下拉显示隐藏
@@ -170,4 +166,20 @@ export function setConnectionTagForConf(node) {
             commonStore[node.TID].selectTabDataPool[parentId].set(node.id, params);
         }
     }
+}
+
+/**
+ * 初始化配置tabs数据
+ * @param node
+ */
+export function setConnectionTabsData(node) {
+    const switchTabType = node.tags.find((t) => {
+        return t.includes('switchTabType');
+    }); // 获取按钮组类型
+    if(!switchTabType) return;
+    const isTabs = node.events && node.events.find((ev) => ev.action === 8);
+    let topologyChangeData = commonStore[node.TID].switchTabDataPool;
+    let keyName = node.bindStaticId && isTabs ? `${switchTabType}Data` : `${switchTabType}AreaData`;
+    if (!topologyChangeData[keyName]) topologyChangeData[keyName] = {};
+    topologyChangeData[keyName][node.id] = node;
 }

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

@@ -1,4 +1,5 @@
 import {Node} from "../models";
+export declare function getTabConnectSHConf(node: Node): Node;
 export declare function tabStaticOperation(type: string, node: Node, areaData: any, params: object): void;
 export declare function tabHideShowOperation(node: any, areaData: any, visible: boolean): void;
 export declare function getEchartsRealData(node: {}, data: []): void;
@@ -8,4 +9,5 @@ export declare function setKpiAddrData(data: any): [];
 export declare function setAssetIdData(data: any): [];
 export declare function setAreaIdData(data: any): [];
 export declare function setVarValueData(data: any): [];
+export declare function setBranchAddressData(data: any): [];
 export declare function setThreeCategoryIdData(pen: Node, data: any): [];