dcim-topology2d 2.2.3 → 2.2.5

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

@@ -97,7 +97,8 @@ export function echarts(ctx, node) {
                         appearance,
                         id: node.id,
                         params: node.data.params,
-                        tabData
+                        tabData,
+                        targetChange: false // tab 或 select 下拉切换状态
                     }
                 };
                 if (!isLocked) echartsData.chart.clear();

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

@@ -55,7 +55,15 @@ export function initBindCorrelationSetting(node) {
 
 // 自动滑动展示数据
 export function setMapAutoMoveOptions(option, chartNode, node, callback) {
-    option.dataZoom = echartsDataRoom;
+    const dataRoom = JSON.parse(JSON.stringify(echartsDataRoom));
+    if(option.yAxis[0].type === 'category'){
+        // 排行榜缩放条件修改
+        dataRoom.forEach((room) => {
+            room.yAxisIndex = [0];
+            delete room['xAxisIndex'];
+        });
+    }
+    option.dataZoom = dataRoom;
     const dataZoomNode = option.dataZoom[0];
     const {start, end, time} = node.appearance.zoomParams;
     const zoomStart = Number(start);
@@ -271,7 +279,7 @@ export function setMapRingOptions(option, node) {
             normal: {
                 show: true,
                 position: 'outside',
-                color: appearance.label.color || '',
+                color: appearance.label.color || 'inherit',
                 fontSize: appearance.label.fontSize || '12'
             }
         };
@@ -465,7 +473,7 @@ export function setMapDataOptions(option, node) {
         }
     }else {
         // 日，周，月，年，实时类型，不与分组统计一起使用
-        staticTypeData = staticForType ? syncEchartsData && syncEchartsData[`${staticForType}_Data`] : syncEchartsData;
+        staticTypeData = syncEchartsData && syncEchartsData[`${staticForType}_Data`] || syncEchartsData;
     }
     let dataDictionary = {};
     // 实时数据加载
@@ -596,6 +604,7 @@ export function setMapDataOptions(option, node) {
         let type = appearance.type.includes('pie') ? 'pie' : 'ring';
         set3DPieMouseHover(mapChart, type, option, appearance.seriesStyleData);
     }
+    if(node.targetChange) mapChart.clear();
     mapChart.setOption(optionNode);
     mapChart.resize();
 }

package/core/src/activeLayer.d.ts

@@ -6,6 +6,7 @@ export declare class ActiveLayer extends Layer {
     sizeCPs: Point[];
     rect: Rect;
     pens: Pen[];
+    // @ts-ignore
     rotate: number;
     initialSizeCPs: Point[];
     nodeRects: Rect[];
@@ -21,6 +22,7 @@ export declare class ActiveLayer extends Layer {
     constructor(TID: String);
     calcControlPoints(): void;
     locked(): boolean;
+    getCenterPoints(): object;
     getPoints(): Point[];
     clear(): void;
     saveNodeRects(): void;

package/core/src/activeLayer.js

@@ -110,6 +110,19 @@ var ActiveLayer = /** @class */ (function (_super) {
         }
         return true;
     };
+    ActiveLayer.prototype.getCenterPoints = function (points) {
+        if(!points) points = this.initialSizeCPs;
+        const xs = points.map(p => p.x);
+        const ys = points.map(p => p.y);
+        const minX = Math.min(...xs);
+        const maxX = Math.max(...xs);
+        const minY = Math.min(...ys);
+        const maxY = Math.max(...ys);
+        return {
+            x: (minX + maxX) / 2,
+            y: (minY + maxY) / 2
+        };
+    };
     ActiveLayer.prototype.getPoints = function () {
         var points = [];
         for (var _i = 0, _a = this.pens; _i < _a.length; _i++) {

package/core/src/common.d.ts

@@ -71,6 +71,7 @@ export declare class Common {
     hoverLine: Line;
     activeNode: Node;
     lineControlPoint: Point;
+    sizeCPs: boolean;
   };
   isFullScreen: Boolean;
   ratioCord: Object;
@@ -89,7 +90,6 @@ export declare class Common {
   showInput(item: Pen): void;
   getRect(pens?: Pen[]): Rect;
   animate(autoplay?: boolean): void;
-  updateProps(cache?: boolean, pens?: Pen[]): void;
   translate(x: number, y: number, process?: boolean): void;
   centerView(padding?: Padding): boolean;
   hasView(): boolean;

package/core/src/common.js

@@ -14,7 +14,8 @@ import {
     setInitConfData,
     getParams,
     tabHideShowOperation,
-    tabStaticOperation, pageZoom
+    tabStaticOperation,
+    pageZoom
 } from './utils';
 import { useStore, clearStore, commonStore } from './store'
 import * as mqtt from './mqtt.min';
@@ -42,7 +43,27 @@ var Common = /** @class */ (function () {
         this.lastRender = 0;
         this.pageResizeTim = null;
         this.isResize = false;
+        this.isMonitorRealData = false; // 是否监听实时数据，用于是否返回mqtt输出的实时数据
         this.id = s8();
+        this.openCount = 0;
+        this.lastTranlated = { x: 0, y: 0 };
+        this.moveIn = {
+            type: 'None',
+            order: 0,
+            transit: -1,
+            activeAnchorIndex: 0,
+            hoverAnchorIndex: 0,
+            hoverNode: null,
+            hoverLine: null,
+            activeNode: null,
+            lineControlPoint: null,
+            eventNode: null,
+            leaveFile: false,
+            sizeCPs: false, // 多选的情况，是否在选中区域内
+        };
+        this.tip = '';
+        this.rendering = false;
+        this.isFullScreen = false;
         this.store = useStore(this.id);
         if (typeof parent === 'string') {
             this.store.parentElem = document.getElementById(parent);
@@ -70,6 +91,11 @@ var Common = /** @class */ (function () {
         this.divLayer.canvas.onblur = function () {
             _this.mouseDown = null;
         };
+        this.divLayer.canvas.onmouseleave = function () {
+            const run = _this.hoverChangeDeacidizing();
+            run && _this.render();
+            _this.moveIn.leaveFile = true;
+        };
         this.subcribe = Store.subscribe(this.generateStoreKey('LT:render'), function () {
             _this.render();
         });
@@ -120,22 +146,6 @@ var Common = /** @class */ (function () {
                 _this.moveIn.hoverLine.dblclick();
             }
         };
-        this.openCount = 0;
-        this.lastTranlated = { x: 0, y: 0 };
-        this.moveIn = {
-            type: 'None',
-            order: 0,
-            activeAnchorIndex: 0,
-            hoverAnchorIndex: 0,
-            hoverNode: null,
-            hoverLine: null,
-            activeNode: null,
-            lineControlPoint: null,
-            eventNode: null
-        };
-        this.tip = '';
-        this.rendering = false;
-        this.isFullScreen = false;
         this.inputObj = null;
         this.input = document.createElement('textarea');
         this.input.style.position = 'absolute';
@@ -203,6 +213,51 @@ var Common = /** @class */ (function () {
         }
         return params;
     };
+    // 鼠标悬浮在元件之上，改变其背景色
+    Common.prototype.hoverChangeBgColor = function (node) {
+        //if(!node.defaultFillStyle) node.defaultFillStyle = node.fillStyle;
+        node.fillStyle = node.hoverFillStyle;
+        if(node.children && node.children.length){
+            node.children.forEach((item) => {
+                this.hoverChangeBgColor(item);
+            });
+        }
+    };
+    // 鼠标离开元件，还原其背景色
+    Common.prototype.leaveResetBgColor = function (node) {
+        node.fillStyle = node.defaultFillStyle;
+        if(node.children && node.children.length){
+            node.children.forEach((item) => {
+                this.leaveResetBgColor(item);
+            });
+        }
+    };
+    Common.prototype.hoverChangeDeacidizing = function () {
+        if(this.moveIn && this.moveIn.transit !== -1){
+            // 鼠标hover到空白区域，还原背景色
+            const currentNode = this.store.data.pens[this.moveIn.transit];
+            this.leaveResetBgColor(currentNode);
+            this.moveIn.transit = -1;
+            return true;
+        }
+        return false;
+    };
+    // 鼠标hover功能流程处理
+    Common.prototype.hoverChangeFollowOperation =  function (hoverNode, lastHoverNode) {
+        if(hoverNode === lastHoverNode) return;
+        const currentNode = this.store.data.pens[hoverNode.order];
+        if(currentNode.hoverFillStyle) {
+            this.hoverChangeBgColor(currentNode);
+            if(lastHoverNode) {
+                const lastNode = this.store.data.pens[lastHoverNode.order];
+                this.leaveResetBgColor(lastNode);
+            }
+            this.moveIn.transit = hoverNode.order;
+        }else {
+            this.hoverChangeDeacidizing();
+        }
+        this.render();
+    };
     // 根据图表id数据获取测点数据
     Common.prototype.getTagIdsForEchartsIds = function (data) {
         this.store.mqttParams.echartAssemblyData = data;
@@ -270,7 +325,7 @@ var Common = /** @class */ (function () {
         }
         this.store.data.pens = [];
         this.openCount = 0
-        const type = this.store.options.type;
+        const setType = this.store.options.type;
         // for old data.
         // if (data.nodes) {
         //     for (var _i = 0, _a = data.nodes; _i < _a.length; _i++) {
@@ -289,21 +344,22 @@ var Common = /** @class */ (function () {
         // }
         this.conversionTabsPageData();
         // end.
-        if (data.pens) {
-            for (var _d = 0, _e = data.pens; _d < _e.length; _d++) {
-                const item = _e[_d];
-                if (!item.from) {
-                    setInitNodeDataValidat(item, this.id, type, _d, this.tabsContentOptions);
-                    const node = new Node(item);
-                    this.store.data.pens.push(node);
-                    //this.store.pens[item.id] = node;
-                    setConnectionTagForConf(node);
-                } else {
-                    const linNode = new Line(item);
-                    this.store.data.pens.push(linNode);
-                    //this.store.pens[item.id] = linNode;
-                }
+        if(!(data.pens && data.pens.length)) return;
+
+        for (var _d = 0, _e = data.pens; _d < _e.length; _d++) {
+            const item = _e[_d];
+            if(item.from) {
+                // 连线类数据渲染
+                const linNode = new Line(item);
+                this.store.data.pens.push(linNode);
+                //this.store.pens[item.id] = linNode;
+                return;
             }
+            setInitNodeDataValidat(item, this.id, setType, _d, this.tabsContentOptions);
+            const node = new Node(item);
+            this.store.data.pens.push(node);
+            //this.store.pens[item.id] = node;
+            setConnectionTagForConf(node);
         }
     };
     //
@@ -515,30 +571,35 @@ var Common = /** @class */ (function () {
         const switchTabData = node.tags.find((t) => {
             return t.includes('switchTabType');
         }); // 获取按钮组类型
-        if (!switchTabData) return;
-        const topologyChangeData = commonStore[node.TID].switchTabDataPool; // 获取所有按钮组和按类型统计图组数据
+        const currentStore = commonStore[node.TID];
+        const topologyChangeData = currentStore.switchTabDataPool; // 获取所有按钮组和按类型统计图组数据
+        if (!switchTabData || topologyChangeData.switchId === node.id) return; // 不是tabs切换 或 连续点击相同页签时退出程序
+        topologyChangeData.switchId = node.id;
         const changeNode = topologyChangeData[`${switchTabData}Data`]; // 分别获取按钮组数据
         if (!changeNode || !changeNode[node.id]) return;
+        if(node.formData && node.formData.dateId) currentStore.pickerDataPool[node.formData.dateId].update = true; // 切换初始化日期数据
         // 如果存在按钮组节点数据
         const tabAreaData = topologyChangeData[`${switchTabData}AreaData`];
+        // tabs切换状态更新，显示隐藏更新
         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;
-            const isActive = switchNode.id !== node.id;
-            if (!isActive) {
-                visitParams.order = tabIndex;
-                visitParams.data = switchNode.tabData;
+            if (penNode) {
+                const isActive = switchNode.id !== node.id;
+                isActive && tabIndex++;
+                penNode.activeImgeIndex = isActive;
+                staticType === 'SH' && tabHideShowOperation(switchNode, tabAreaData, isActive); // 对显示隐藏的功能进行交互处理
             }
-            penNode.activeImgeIndex = isActive;
-            tabIndex++;
-            if (staticType === 'SH') tabHideShowOperation(switchNode, tabAreaData, isActive); // 对显示隐藏的功能进行交互处理
         }
+
+        const curentEchart = tabAreaData && tabAreaData[node.bindStaticId]; // 获取当前点中的节点绑定的统计图表数据
+        if(!curentEchart || !curentEchart.data.params) return this.render();
         // 对绑定的图表进行数据处理
-        tabStaticOperation(staticType, node, tabAreaData, visitParams);
+        const visitParams = {
+            order: node.formData && node.formData.groupId ? parseInt(node.formData.groupId) - 1 : tabIndex,
+            data: node.tabData
+        };
+        tabStaticOperation(staticType, node, curentEchart.order, visitParams);
         this.store.data.dataResize = 1;
         this.render();
     };
@@ -814,6 +875,7 @@ var Common = /** @class */ (function () {
         this.animate(true);
         // 九所的 服务器状态监测功能中用到
         if (this.store.options.storeSubscribe) Store.set(this.generateStoreKey('M:monitor'), this.store.monitorAlarm);
+        if(this.isMonitorRealData && retData) Store.set(this.generateStoreKey('D:monitor'), JSON.stringify(retData));
         return data
     };
     Common.prototype.hidePenByTag = function (pens, val) {
@@ -885,7 +947,7 @@ var Common = /** @class */ (function () {
                 const item = _e[_d];
                 if (!item.from) {
                     // 初次绘制画布时this.id替换item.TID
-                    setInitNodeDataValidat(item, this.id, type, _d, item.PTID);
+                    setInitNodeDataValidat(item, this.id, type, _d);
                     const node = new Node(item);
                     this.store.data.pens.push(node);
                 } else {

package/core/src/core.d.ts

@@ -35,7 +35,7 @@ export declare class Topology extends Common{
     addNode(node: Node | any, focus?: boolean): any;
     addLine(line: any, focus?: boolean): any;
     open(data?: any): void;
-    updateProps(cache?: boolean, pens?: Pen[]): void;
+    updateProps(isTrans?: [boolean,string], cache?: boolean, pens?: Pen[]): void;
     overflow(): Rect;
     private onMouseMove;
     private onmousedown;