dcim-topology2d 2.2.3 → 3.0.2

package/core/src/element/select.js

@@ -1,273 +0,0 @@
-import {Store} from 'le5le-store';
-import {commonStore} from "../store";
-import { setMapDataOptions } from '../../../chart-diagram';
-import {previewType, selectStaticType} from '../utils';
-import {setElementSwitchTabState} from './tab';
-let nodeId = '';
-let downId = '';
-// 创建下拉头
-export function createSelectElement(node) {
-    const selectEle = document.createElement('div');
-    const order = node.formData.selected && node.formData.selected.order || 0;
-    const inputValue = commonStore[node.TID].selectDataPool[node.id].data[order] && commonStore[node.TID].selectDataPool[node.id].data[order].name;
-    let attrName = 'topology-select-icon-arrow';
-    if(node.selectDropdown) attrName += ' reverse';
-    const children = `<i class="${attrName}" 
-                         style="border-width: ${node.font.fontSize/2}px;border-bottom-width: 0;">
-                      </i><input type="text" placeholder="请选择" readonly 
-                      value="${inputValue}" 
-                      class="topology-select-input" 
-                      style="font-size: ${node.font.fontSize}px;color: ${node.font.color ? node.font.color : '#fff'}"/>`;
-    const themeType = node.formData.theme ? ` theme${node.formData.theme}` : '';
-    selectEle.setAttribute('id', node.id);
-    selectEle.setAttribute('class', `topology-select${themeType}`);
-    selectEle.innerHTML = children;
-    return selectEle;
-}
-// 创建下拉options容器
-export function createSelectDropdown(node) {
-    const selectDropdownEle = document.createElement('div');
-    let liElements = '';
-    if(node.selectDropdown) {
-        liElements = createSelectOptions(commonStore[node.TID].selectDataPool[node.id].data, node);
-        selectDropdownEle.style.display = 'block';
-        setSelectDropdownPosition(node, selectDropdownEle);
-    }
-    const children = `<i class="popper__arrow"></i><ul class="topology-select-dropdown-list">${liElements}</ul>`;
-    const themeType = node.formData.theme ? ` theme${node.formData.theme}` : '';
-    selectDropdownEle.style.width = `${node.rect.width}px`;
-    selectDropdownEle.setAttribute('class', `topology-select-dropdown${themeType} documentDefine`);
-    selectDropdownEle.innerHTML = children;
-    return selectDropdownEle;
-}
-// 创建下拉options列表
-export function createSelectOptions(data, node) {
-    const selectNode = commonStore[node.TID].selectDataPool[node.id];
-    const selectDropdownUl = selectNode.dom.selectDropdownUl;
-    if(selectDropdownUl) selectDropdownUl.innerHTML = '';
-    let leElement = '';
-    const order = selectNode.node.selected ? selectNode.node.selected.order : 0;
-    for (let i = 0, length = data.length; i < length; i++) {
-        let selected = i === order ? ' selected' : '';
-        leElement += `<li 
-                        class="topology-select-dropdown-item${selected}" 
-                        type="option" data-order="${i}" 
-                        style="height: ${node.rect.height}px;line-height: ${node.rect.height}px;font-size: ${node.font.fontSize}px;">
-                        <span>${data[i].name}</span>
-                      </li>`;
-    }
-    if(selectDropdownUl) {
-        selectDropdownUl.innerHTML = leElement;
-    }else {
-        return leElement;
-    }
-}
-// 配置下拉头的交互状态：展开时三角图标向上，否则向下
-export function setSelectInteractiveState(selected, node) {
-    const selectNode = commonStore[node.TID].selectDataPool[node.id];
-    selectNode.dom.selectIconArrow.style.display = selected ? 'none' : 'block';
-    //selectNode.dom['selectRemove'].style.display = selected ? 'block' : 'none';
-}
-// 重置下拉状态
-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)) {
-        if(node && node.id !== data.node.id) {
-            if(data.dom.selectIconArrow) data.dom.selectIconArrow.setAttribute('class', 'topology-select-icon-arrow');
-            data.slideState = false;
-        }
-    }
-    document.querySelector('.topology-select-dropdown').style.display = 'none';
-    currentStore.elementInteractivePoor.node = null;
-}
-
-/**
- * 配置下拉options容器的交互状态，展开和收起
- * @param node 下拉元件节点数据
- * @param type 功能作用区域类型：Dcim，Topology，Logo
- */
-export function setSelectDropdownInteractiveState(node, type) {
-    const currentStore = commonStore[node.TID];
-    const selectNode = currentStore.selectDataPool[node.id];
-    if(!selectNode) return;
-    if(downId !== node.id && type === previewType.Dcim) {
-        // 点击的不是同一个下拉则重置交互样式，清空数据
-        resetSelectInteractiveState(node);
-        currentStore.elementInteractivePoor.options = null;
-    }
-    downId = node.id;
-    currentStore.elementInteractivePoor.node = node;
-    selectElementStore(node.id, node.TID);
-    setSelectElementPosition(node);
-    const { selectIconArrow, selectDropdown } = selectNode.dom;
-    selectNode.slideState = !selectNode.slideState || node.selectDropdown; // 下拉展开状态
-    let attrName = 'topology-select-icon-arrow';
-    if(selectNode.slideState) {
-        selectDropdown.style.display = 'block';
-        attrName += ' reverse';
-    }else {
-        selectDropdown.style.display = 'none';
-        attrName.replace(' reverse', '');
-    }
-    // 图标旋转
-    selectIconArrow.setAttribute('class', attrName);
-    // 添加列表数据
-    if(!currentStore.elementInteractivePoor.options) createSelectOptions(selectNode.data, node);
-}
-// 配置下拉偏移位置
-export function setSelectElementPosition(node, type) {
-    // 不同元件切换
-    selectElementStore(node.id, node.TID);
-    const selectNode = commonStore[node.TID].selectDataPool[node.id];
-    if(type === 'down') {
-        if(nodeId === node.id) return;
-        commonStore[node.TID].elementInteractivePoor.options = null;
-        createSelectOptions(selectNode.data, node);
-    }
-    nodeId = node.id;
-    setSelectDropdownPosition(node, selectNode.dom.selectDropdown);
-}
-function setSelectDropdownPosition(node, selectDropdown) {
-    const selectEle = commonStore[node.TID].selectDataPool[node.id].dom.selectEle;
-    let left = selectEle.getBoundingClientRect().left; // 获取下拉元素距离窗体左侧位置
-    let top = selectEle.getBoundingClientRect().top + node.rect.height;
-    if(window.location.pathname.includes('workspace')) {
-        // topol编辑器
-        left = node.rect.x;
-        top = node.rect.y + node.rect.height;
-    }
-    selectDropdown.style.left = `${left}px`;
-    selectDropdown.style.top = `${top}px`;
-    selectDropdown.style.width = `${node.rect.width}px`;
-    const themeType = node.formData.theme ? ` theme${node.formData.theme}` : '';
-    selectDropdown.setAttribute('class', `topology-select-dropdown${themeType} documentDefine`);
-}
-
-/**
- * 获取下拉选中的数据
- * @param e 节点选中事件
- * @param data 下拉元件节点数据
- * @param editData 编辑显下拉的数据
- */
-export function getSelectedData(e, data, editData) {
-    const currentStore = commonStore[data.TID];
-    const selectNode = currentStore.selectDataPool[data.id];
-    if(!currentStore.elementInteractivePoor.options && data.selectDropdown) currentStore.elementInteractivePoor.options = selectNode.dom.selectDropdownUl.querySelectorAll('.topology-select-dropdown-item');
-    let order = 0;
-    let staticType = selectNode.staticType;
-    if(!editData) {
-        const parentNode = e.target.parentNode;
-        const type = parentNode.getAttribute('type');
-        if(type !== 'option') return;
-        selectNode.slideState = false;
-        selectNode.dom.selectDropdown.style.display = 'none';
-        // 图标旋转
-        selectNode.dom.selectIconArrow.setAttribute('class', 'topology-select-icon-arrow');
-        // 选中节点操作
-        order = parentNode.getAttribute('data-order');
-    }else {
-        order = editData.order;
-        staticType = editData.staticType;
-    }
-    if(data.selectDropdown) {
-        for(let i = 0, leng = currentStore.elementInteractivePoor.options.length; i < leng; i++) {
-            let name = 'topology-select-dropdown-item';
-            if(i == order) {
-                name += ' selected';
-            }else {
-                name.replace(' selected', '');
-            }
-            currentStore.elementInteractivePoor.options[i].setAttribute('class', name);
-        }
-    }
-    selectNode.optionOrder = order;
-    const node = selectNode.data[order];
-    selectNode.dom.selectEle.querySelector('.topology-select-input').value = node.name;
-    selectNode.node.selected = {
-        order: parseInt(order),
-        id: node.id
-    };
-    if(staticType === selectStaticType.static) {
-        // 数据统计
-        const optionNode = data.formData.bindBlockId && currentStore.echartsOptionsPool[data.formData.bindBlockId];
-        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) {
-        // 数据展示
-    }
-    if(staticType === selectStaticType.visible) {
-        // 显示隐藏
-        const optionNode = data.formData.bindBlockId && currentStore.echartsOptionsPool[data.formData.bindBlockId];
-        if(optionNode) {
-            // 有绑定图表则切换图表数据
-            const selecteRealData = currentStore.selectRealDataPool[optionNode.data.id];
-
-            selectNode.node.selected.id = selecteRealData && selecteRealData[order] && selecteRealData[order].id;
-
-            currentStore.echartsRealDataPool[optionNode.data.id] = currentStore.echartsRealDataPool[node.id];
-
-            setMapDataOptions(optionNode.option, optionNode.data);
-        }
-        const optionsVisibleData = currentStore.selectTabDataPool[data.id];
-        if(!optionsVisibleData || !optionsVisibleData.size) return;
-        for(const [key, value] of optionsVisibleData){
-            const optionId = node.optionId || node.id;
-            const eque = optionId === value.tag;
-            currentStore.data.pens[value.order].visible = eque;
-            currentStore.data.pens[value.order].visibleSwitch = eque;
-            value.visible = eque;
-            setElementSwitchTabState(currentStore.data.pens[value.order]);
-        }
-        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}` : '';
-    const { selectEle, selectDropdown } = commonStore[node.TID].selectDataPool[node.id].dom;
-    selectEle.setAttribute('class', `topology-select${themeType}`);
-    selectDropdown.setAttribute('class', `topology-select-dropdown${themeType} documentDefine`);
-}
-// 存储下拉Dom节点
-function selectElementStore(id, TID) {
-    const selectNode = commonStore[TID].selectDataPool[id];
-    if(!selectNode.dom.selectIconArrow) selectNode.dom.selectIconArrow = selectNode.dom.selectEle.querySelector('.topology-select-icon-arrow');
-    if(!selectNode.dom.selectDropdown) {
-        selectNode.dom.selectDropdown = document.querySelector('.topology-select-dropdown');
-        selectNode.dom.selectDropdownUl = document.querySelector('.topology-select-dropdown-list');
-        selectNode.dom.selectDropdownLi = document.querySelectorAll('.topology-select-dropdown-item');
-    }
-}

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

@@ -1 +0,0 @@
-export declare function setElementSwitchTabState(node: any): void;

package/core/src/element/tab.js

@@ -1,20 +0,0 @@
-import {commonStore} from "../store";
-// 设置tab切换显示隐藏时的 Dom元件状态
-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.attribute !== 'dom') return;
-    const currentStore = commonStore[node.TID];
-    if(!currentStore.elementInteractivePoor.dom) return;
-    const ele = currentStore.elementInteractivePoor.dom[node.id];
-    if(ele) {
-        ele.style.display = !node.visible ? 'none': 'block';
-    }else {
-        currentStore.data.dataResize = 1;
-    }
-}

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

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

package/core/src/element/time.js

@@ -1,44 +0,0 @@
-// 创建时间组件
-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/arrows/index.d.ts

@@ -1,4 +0,0 @@
-export * from './circle';
-export * from './diamond';
-export * from './line';
-export * from './triangle';

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

@@ -1,5 +0,0 @@
-export * from './circle';
-export * from './diamond';
-export * from './line';
-export * from './triangle';
-//# sourceMappingURL=index.js.map

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

@@ -1,4 +0,0 @@
-export * from './curve';
-export * from './line';
-export * from './mind';
-export * from './polyline';

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

@@ -1,5 +0,0 @@
-export * from './curve';
-export * from './line';
-export * from './mind';
-export * from './polyline';
-//# sourceMappingURL=index.js.map

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

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

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

@@ -1,108 +0,0 @@
-import {Store} from "le5le-store";
-import {rectangle} from './rectangle';
-import { createDatePickerElement, loadJS, setDataPickerElementStyle } from '../../element';
-import { s8, datePickerValueFormatting } from '../../utils';
-import {commonStore} from "../../store";
-import {datePickerType} from "../../../../store";
-
-export async function fromDatePicker(ctx, node) {
-    // 绘制一个底图，类似于占位符。
-    rectangle(ctx, node);
-
-    if (!window.datePickerRegister) {
-        //未注册datePicker插件
-        window.datePickerRegister = true;
-        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();
-
-        if(currentStore.mqttParams.dataConfig.picker){
-            // 日期元件关联绑定的元件数据
-            const pickerConfig = currentStore.mqttParams.dataConfig.picker;
-            for (let [key, config] of pickerConfig.entries()){
-                if(config.dateId === node.id) {
-                    node.formData.realIds = node.formData.realIds ? `${node.formData.realIds},${key}` : key;
-                    node.formData.selected = config.dateStr;
-                }
-            }
-        }
-
-        const format = node.pickerOptions.format;
-        const valueType = node.formData.valueType;
-        const dateType = node.pickerOptions.type;
-        node.pickerOptions.value = node.formData.selected || datePickerValueFormatting({
-            formatType: format,
-            valueType
-        }).dateStr;
-        const datePicker = createDatePickerElement(node);
-        currentStore.pickerDataPool[node.id] = {
-            format,
-            valueType,
-            dateType,
-            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);
-        }
-        let layDatePicker = null;
-        pickerOptions.elem = `#picker${node.id}`;
-        pickerOptions.done = function (val, date) {
-            const { year, month, hours, minutes, seconds } = date;
-            const map = {
-                yyyy: year,
-                MM: String(month).padStart(2, '0'),
-                dd: String(date.date).padStart(2, '0'),
-                HH: String(hours).padStart(2, '0'),
-                mm: String(minutes).padStart(2, '0'),
-                ss: String(seconds).padStart(2, '0')
-            };
-            node.formData.selected = val;
-            date.valueStr = val;
-            date.value = datePickerType[layDatePicker.config.type].replace(/yyyy|MM|dd|HH|mm|ss/g, match => map[match]);
-            Store.set(`${node.TID}-EVENT:change`, {node, date});
-        }
-        setTimeout(() => {
-
-            layDatePicker = laydate.render(pickerOptions);
-
-        }, 100)
-    }else {
-        if(node.formData.resetStyle) {
-            // 重置样式
-            setDataPickerElementStyle(node);
-            node.formData.resetStyle = false;
-        }
-        if(node.formData.render) {
-            // 重置数据
-            node.formData.render = false;
-            const params = {
-                format: node.pickerOptions.format,
-                valueType: node.formData.valueType,
-                dateType: node.pickerOptions.type
-            };
-            Object.assign(currentStore.pickerDataPool[node.id], params);
-        }
-    }
-}
-function isValidInteger(str) {
-    return /^-?\d+$/.test(str) && str !== '-' && !str.startsWith('+');
-}

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

@@ -1,62 +0,0 @@
-import {rectangle, createDiv, s8, Preview} from  '../../../../core';
-import {commonStore} from "../../store";
-
-export async function formOverflow(ctx, node) {
-    // 绘制一个底图，类似于占位符。
-    rectangle(ctx, node)
-    // 添加当前节点到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) {
-        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()
-        node.createOverflow()
-        commonStore[node.TID].formoverDataPool[node.id] = formoverData;
-
-        // 兼容topology项目中渲染
-        if (window.location.pathname.includes('workspace') || window.location.pathname.includes('Preview')) {
-            let canvas = new Preview(node.id, {
-                rotateCursor: '/img/rotate.cur',
-            })
-            canvas.formOverflowOpen(node.formData.detailPageData)
-            commonStore[node.TID].formoverCanvasDataPool[node.id]  = canvas
-        }
-        setTimeout(() => {
-            // 可优化，图片元件加载不出图片的方案
-            formOverflowChange(node); 
-        }, 200);
-    }else if(formoverData && id){
-        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
-        canvas.formOverflowOpen(data)
-}
-

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

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

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

@@ -1,111 +0,0 @@
-import {rectangle} from './rectangle';
-import {
-    createSelectElement,
-    createSelectDropdown} from '../../element';
-import {
-    setEventListener,
-    s8} from '../../utils';
-import {selectDefaultData} from '../../../../static';
-import {commonStore} from "../../store";
-
-export function formSelect(ctx, node) {
-    // 绘制一个底图，类似于占位符。
-    rectangle(ctx, node);
-    if (!commonStore[node.TID].selectDataPool[node.id]) {
-        const currentStore = commonStore[node.TID];
-        node.elementId = s8();
-        node.dash = 4;
-        // 下拉切换类型
-        const selectedType = node.events && node.events.find((item) => {
-            return !!item.dcimStaticForType
-        });
-        currentStore.selectDataPool[node.id] = {
-            slideState: node.selectDropdown,
-            staticType: selectedType.dcimStaticForType,
-            node: {
-                id: node.id,
-                color: node.font.color,
-                fontSize: node.font.fontSize,
-                selected: node.formData.selected || null
-            },
-            dom: {}
-        };
-        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(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];
-                }
-            }
-            const selectData = currentStore.selectDataPool[node.id];
-            selectData.data = selectRealData;
-            selectData.node.selected ? selectData.node.selected.id = selectRealData[0].id : selectData.node.selected = { id: selectRealData[0].id };
-            const echartsData = currentStore.echartsDataPool[bindBlockId];
-            echartsData ? echartsData.bindId = node.id : currentStore.echartsDataPool[bindBlockId] = {
-                bindId: node.id
-            };
-            // select与Tab关联，主要用于下拉切换时当前画面绑定了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(',');
-                const optionNames = node.formData.names.split(',');
-                const optionsData = [];
-                for (let i = 0; i < optionIds.length; i++) {
-                    optionsData.push({
-                        id: optionIds[i],
-                        name: optionNames[i]
-                    });
-                }
-                currentStore.selectDataPool[node.id].data = optionsData;
-            }else {
-                currentStore.selectDataPool[node.id].data = JSON.parse(JSON.stringify(selectDefaultData));
-            }
-        }
-        const select = createSelectElement(node);
-        currentStore.selectDataPool[node.id].dom.selectEle = select;
-        document.body.appendChild(select);
-        let selectDropdownEle = document.querySelector('.topology-select-dropdown');
-        if(!selectDropdownEle) {
-            selectDropdownEle = createSelectDropdown(node);
-            const parentEle = window.location.pathname.includes('workspace') ? document.getElementById('topology-canvas') : document.body;
-            parentEle.appendChild(selectDropdownEle);
-            // 鼠标按下
-            selectDropdownEle.addEventListener('mousedown', (e) => {
-                setEventListener(e, node.TID);
-            });
-        }
-        // 添加当前节点到div层
-        node.addToDiv();
-    }else {
-        const selectNode = commonStore[node.TID].selectDataPool[node.id];
-        if(selectNode.node.color === node.font.color && selectNode.node.fontSize === node.font.fontSize) return;
-        const selectDom = selectNode.dom;
-        if(!selectDom.selectInput) selectDom.selectInput = selectDom.selectEle.querySelector('.topology-select-input');
-        selectDom.selectInput.style.color = node.font.color;
-        selectDom.selectInput.style.fontSize = `${node.font.fontSize}px`;
-        if(node.selectDropdown) {
-            const liEle = selectDom.selectDropdownUl.querySelectorAll('.topology-select-dropdown-item');
-            liEle.forEach(function(element) {
-                element.style.color = node.font.color;
-                element.style.fontSize = `${node.font.fontSize}px`;
-            });
-        }
-    }
-}

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

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