dcim-topology2d 2.0.2 → 2.0.5

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,
@@ -9,7 +10,6 @@ import {
     setMapDataOptions
 } 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;
@@ -19,7 +19,7 @@ export function echarts(ctx, node) {
     // 绘制一个底图，类似于占位符。
     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 +32,7 @@ export function echarts(ctx, node) {
     if (!node.elementId) {
         node.elementId = s8()
     }
-    let echartsData = echartsDataPool[node.id];
+    let echartsData = commonStore[node.TID].echartsDataPool[node.id];
     if (!node.elementLoaded && !(echartsData && echartsData.div)) {
         if(!echartsData) {
             echartsData = {
@@ -51,7 +51,7 @@ export function echarts(ctx, node) {
         setTimeout(function () {
             echartsData.chart.resize()
         });
-        echartsDataPool[node.id] = echartsData;
+        commonStore[node.TID].echartsDataPool[node.id] = echartsData;
     }
     if (!node.elementRendered) {
         const appearance = node.appearance;
@@ -60,7 +60,7 @@ export function echarts(ctx, node) {
             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 (!isLocked || !commonStore[node.TID].echartsOptionsPool[node.id]) {
                 // 【未锁定（编辑）状态, options未初始化的状态】
                 if (!appearance.type) appearance.type = echartsTypeMap[`type_${option.displayMode}`]; // 兼容旧数据配置
                 // 公共配置 Top排行榜跳过公共属性配置
@@ -77,7 +77,7 @@ export function echarts(ctx, node) {
                 if (appearance.type === 'TOP') setMapTopOptions(option, node);
                 //option.title = appearance.title;
                 option.backgroundColor = appearance.backgroundColor;
-                echartsOptionsPool[node.id] = {
+                commonStore[node.TID].echartsOptionsPool[node.id] = {
                     option: JSON.parse(JSON.stringify(option)),
                     data: {
                         appearance,

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++) {

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} from "../../../core";
 
 export function getXYAxisLabelVal(index, intervalNum, value) {
     if (index === 0 || index % intervalNum === 0) {
@@ -108,9 +111,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 +141,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;
     }
 }
 
@@ -221,14 +203,14 @@ 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;
     // 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 syncEchartsData = commonStore[node.TID].echartsRealDataPool[node.id]; // 统计图实时数据
     const staticTypeData = staticForType ? syncEchartsData && syncEchartsData[`${staticForType}_Data`] : syncEchartsData; // 统计类型数据
     // 实时数据加载
     if(staticTypeData) {
@@ -244,11 +226,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 +280,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

@@ -74,6 +74,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,12 @@ import {
     getRect,
     setInitNodeDataValidat,
     setDefaultNodeValidat,
-    initSwitchTabData,
+    setConnectionTagForConf,
     setInitConfData,
+    getParams,
 } 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 +167,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) {
+                renderForAssetPoperties(asset, node.children);
+            }
+        });
+    };
 
     Common.prototype.conversionData = function (obj) {
         this.clear();
@@ -185,7 +255,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 +273,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,7 +470,7 @@ 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;
         // 如果存在按钮组节点数据
@@ -686,16 +756,19 @@ 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);
             }
-        })
+        });
         //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) {

package/core/src/core.js

@@ -28,7 +28,7 @@ import {
     setAreaIdData,
     setVarValueData,
     setThreeCategoryIdData,
-    initSwitchTabData
+    setConnectionTagForConf
 } from './utils';
 import {setSelectElementPosition} from './element';
 import {elementType} from '../../static';
@@ -999,8 +999,10 @@ var Topology = (function (_super) {
         if (this.store.data.scale !== 1) {
             node.scale(this.store.data.scale);
         }
+        node.visibleSwitch = true;
+        node.order = this.store.data.pens.length;
         this.store.data.pens.push(node);
-        initSwitchTabData(node);
+        setConnectionTagForConf(node);
         if (focus) {
             this.render();
             this.animate(true);
@@ -1105,7 +1107,7 @@ var Topology = (function (_super) {
                 }
             }
         }
-        // In active pen.
+        // In active pen. 
         if (!this.store.data.locked) {
             for (var _i = 0, _a = this.activeLayer.pens; _i < _a.length; _i++) {
                 var item = _a[_i];
@@ -1130,13 +1132,15 @@ var Topology = (function (_super) {
         this.divLayer.canvas.style.cursor = 'default';
         var len = this.store.data.pens.length;
         for (var i = len - 1; i > -1; --i) {
-            if (this.store.data.pens[i].type === PenType.Node &&
-                    this.inNode(pt, this.store.data.pens[i])) {
-                return;
-            } else if (this.store.data.pens[i].type === PenType.Line &&
-                    this.inLine(pt, this.store.data.pens[i])) {
-                // 需要优先判断十分在节点锚点上
-                // return;
+            if(this.store.data.pens[i].visible || this.store.data.pens[i].visibleSwitch){
+                if (this.store.data.pens[i].type === PenType.Node &&
+                        this.inNode(pt, this.store.data.pens[i])) {
+                    return;
+                } else if (this.store.data.pens[i].type === PenType.Line &&
+                        this.inLine(pt, this.store.data.pens[i])) {
+                    // 需要优先判断十分在节点锚点上
+                    // return;
+                }
             }
         }
     };
@@ -1706,9 +1710,10 @@ var Topology = (function (_super) {
                 }
                 pen.controlPoints = controlPoints;
             }
+            pen.order = this.store.data.pens.length;
             this.store.data.pens.push(pen);
             this.activeLayer.add(pen);
-            initSwitchTabData(pen);
+            setConnectionTagForConf(pen);
         }
         this.render();
         this.animate(true);
@@ -1924,6 +1929,8 @@ var Topology = (function (_super) {
             paddingTop: 0,
             paddingBottom: 0,
             strokeStyle: 'transparent',
+            visible: true,
+            visibleSwitch: true,
             children: [],
         });
         if (temp) {
@@ -1934,9 +1941,13 @@ var Topology = (function (_super) {
             item.stand = stand;
             item.parentId = node.id;
             item.animatePlay = false;
+            item.visible = true;
+            item.visibleSwitch = true;
             item.calcRectInParent(node);
+            this.deleteSelectTabOptionNode(item);
             node.children.push(item);
         }
+        node.order = this.store.data.pens.length;
         this.store.data.pens.push(node);
         this.activeLayer.setPens([node]);
         this.dispatch('node', node);
@@ -1950,23 +1961,53 @@ var Topology = (function (_super) {
             return;
         }
         const nodeChildren = JSON.parse(JSON.stringify(node));
+        var i = this.findIndex(nodeChildren);
+        if (i > -1 && nodeChildren.name === 'combine') {
+            this.store.data.pens.splice(i, 1);
+        } else {
+            nodeChildren.children = null;
+        }
         for (var _i = 0, _a = nodeChildren.children; _i < _a.length; _i++) {
             var item = new Node(_a[_i]);
             item.parentId = undefined;
             item.rectInParent = undefined;
             item.locked = Lock.None;
+            item.order = this.store.data.pens.length;
+            this.addSelectTabOptionNode(item);
             this.store.data.pens.push(item);
         }
-        var i = this.findIndex(nodeChildren);
-        if (i > -1 && nodeChildren.name === 'combine') {
-            this.store.data.pens.splice(i, 1);
-        } else {
-            nodeChildren.children = null;
-        }
+        this.deleteSelectTabOptionNode(nodeChildren);
         this.cache();
         this.activeLayer.clear();
         this.hoverLayer.clear();
     };
+    Topology.prototype.deleteSelectTabOptionNode = function (node) {
+        const tagNode = node.tags.find((t) => {return t.includes('selectOption')});
+        if(tagNode){
+            // 删除下拉节点关联的这个元件
+            const tagArr = tagNode.split('-');
+            const parentId = tagArr[1] && tagArr[1].trim();
+            if(parentId && this.store.selectTabDataPool[parentId].has(node.id)) this.store.selectTabDataPool[parentId].delete(node.id);
+        }
+    },
+    Topology.prototype.addSelectTabOptionNode = function (node) {
+        const tagNode = node.tags.find((t) => {return t.includes('selectOption')});
+        if(tagNode){
+            // 添加下拉节点关联的这个元件
+            const tagArr = tagNode.split('-');
+            const parentId = tagArr[1] && tagArr[1].trim();
+            if(!parentId) return;
+            const params = {
+                TID: node.TID,
+                id: node.id,
+                name: node.name,
+                order: node.order,
+                visible: node.visible,
+                tag: tagNode
+            }
+            this.store.selectTabDataPool[parentId].set(node.id, params);
+        }
+    },
     Topology.prototype.find = function (idOrTag, pens) {
         var _this = this;
         if (!pens) {

package/core/src/divLayer.js

@@ -97,7 +97,7 @@ var DivLayer = /** @class */ (function (_super) {
         if (item.elementId) {
             const elementNode = this.elements[item.id];
             if(elementNode) {
-                this.canvas.parentElement.removeChild(elementNode);
+                elementNode.parentNode.removeChild(elementNode);
                 this.elements[item.id] = null;
             }
         }

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

@@ -3,9 +3,9 @@ import { Node } from '../models';
 export declare function createSelectElement(node: Node): HTMLDivElement;
 export declare function createSelectDropdown(node: Node): HTMLDivElement;
 export declare function createSelectOptions(data: [], node: Node): string;
-export declare function getSelectedData(e: Event, data: any): void;
+export declare function getSelectedData(e: Event, data: any, editData: any): void;
 export declare function setSelectInteractiveState(selected: any, node: Node): void;
 export declare function resetSelectInteractiveState(node: Node): void;
-export declare function setSelectDropdownInteractiveState(node: Node, staticType: any, type: any): void;
+export declare function setSelectDropdownInteractiveState(node: any, staticType: any, type: any): void;
 export declare function setSelectElementPosition(node: Node, type: string): void;
 export declare function setSelectElementTheme(node: Node): void;