dcim-topology2d 2.0.8 → 3.0.2

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

@@ -1,189 +0,0 @@
-// @ts-ignore
-import { default as mitt, Emitter } from 'mitt';
-import { Pen, Lock } from '../models';
-import {Options, DefalutOptions} from '../options';
-import {s8} from '../utils';
-import { commonStore } from './common'
-// 2D可视化的data数据
-export interface visualization2DData {
-    pens: Pen[];
-    lineName: string;
-    fromArrowType: string;
-    toArrowType: string;
-    scale: number;
-    pageZoom: number,
-    locked: Lock;
-    bkImage: string;
-    bkColor: string;
-    grid?: boolean;
-    websocket?: string;
-    mqttUrl?: string;
-    mqttOptions?: {
-        clientId?: string;
-        username?: string;
-        password?: string;
-    };
-    mqttTopics?: string;
-    manualCps?: boolean;
-    dataConstruct?: any;
-    bindDataTooltipVisible?: boolean;
-    data?: any;
-    bkImageRect?: any;
-}
-export interface paramsData {
-    doorIds?: [],
-    tagIds?: [],
-    kpiAddrs?: [],
-    tagEcharts?: [],
-    assetIds?: [],
-    areaIds?: [],
-    varVaule?: [],
-    echartData?: [],
-    echartAssemblyData?: [],
-    routingkey?: string,
-    pathRewrite?: string
-}
-// 2D可视化使用到的数据仓库
-export interface visualization2DStore {
-    id: string;
-    data: visualization2DData;
-    mqttData?: null; // mqtt实时数据
-    initConfNode: {}; // 初始化元件节点数据
-    mqttParams: paramsData; // mqtt参数
-    pens: { [key: string]: Pen };
-    options: Options;
-    cacheDatas?: {
-        data: visualization2DData;
-    }[];
-    elementInteractivePoor: {}; // element 交互过渡数据
-    echartsDataPool: {}; // echarts Dom节点数据
-    echartsOptionsPool: {}; // echarts options节点数据
-    echartsRealDataPool: {}; // echarts 实时数据
-    switchTabDataPool: {}; // tabs
-    tableDataPool: {}; // form table
-    selectDataPool: {}; // form select
-    selectRealDataPool: {}; // form select
-    selectTabDataPool: {}; // form select
-    iframeDataPool: {}; // iframe
-    formoverDataPool: {}; // 滚动组件 Dom节点数据
-    formoverCanvasDataPool: {}; // 滚动组件 画布节点数据
-    emitter: Emitter;
-    dpiRatio?: number;
-    lastScale?: number; //记录上次模版的scale
-    monitorAlarm?:boolean; // 全局报警标记，代表正在访问的这个topology文件中是否有告警发生
-    parentElem: HTMLElement
-}
-// @ts-ignore
-export const createStore = () => {
-    return {
-        id: '',
-        data: {
-            pens: [],
-            lineName: 'curve',
-            fromArrowType: '',
-            toArrowType: 'triangleSolid',
-            scale: 1,
-            pageZoom: 1,
-            locked: Lock.None,
-            bkImageRect: null,
-            mqttOptions: {
-                clientId: s8()
-            },
-            dataConstruct: {},
-            bindDataTooltipVisible: true
-        },
-        mqttData: null,
-        initConfNode: {},
-        mqttParams: {
-            doorIds: [],
-            tagIds: [],
-            kpiAddrs: [],
-            tagEcharts: [],
-            assetIds: [],
-            areaIds: [],
-            varVaule: [],
-            echartData: [],
-            echartAssemblyData: [],
-            routingkey: '',
-            pathRewrite: ''
-        },
-        pens: {},
-        options: { ...DefalutOptions },
-        elementInteractivePoor: {}, // element 交互过渡数据
-        echartsDataPool: {}, // echarts Dom节点数据
-        echartsOptionsPool: {}, // echarts options节点数据
-        echartsRealDataPool: {}, // echarts 实时数据
-        switchTabDataPool: {}, // tabs
-        tableDataPool: {}, // form table
-        selectDataPool: {}, // form select
-        selectRealDataPool: {}, // form select
-        selectTabDataPool: {}, // form select
-        iframeDataPool: {}, // iframe
-        formoverDataPool: {}, // 滚动组件 Dom节点数据
-        formoverCanvasDataPool: {}, // 滚动组件 画布节点数据
-        emitter: mitt(),
-        cacheDatas: [],
-        dpiRatio: 1,
-        lastScale: 1,
-        monitorAlarm: false,
-        parentElem: null
-    } as visualization2DStore;
-};
-// @ts-ignore
-export const useStore = (id = 'default'): visualization2DStore => {
-    if (!commonStore[id]) {
-        // @ts-ignore
-        commonStore[id] = createStore();
-        commonStore[id].id = id;
-    }
-    return commonStore[id];
-};
-export declare function clearElementDataPool(data: {}): void;
-// @ts-ignore
-export const clearStore = (store: visualization2DStore, del: string) => {
-    store.data = {
-        bkColor: '',
-        bkImage: '',
-        data: undefined,
-        grid: false,
-        manualCps: false,
-        mqttTopics: '',
-        mqttUrl: '',
-        websocket: '',
-        pens: [],
-        lineName: 'curve',
-        fromArrowType: '',
-        toArrowType: 'triangleSolid',
-        scale: 1,
-        pageZoom: 1,
-        locked: Lock.None,
-        bkImageRect: null,
-        mqttOptions: {
-            clientId: s8()
-        },
-        dataConstruct: {},
-        bindDataTooltipVisible: true
-    };
-    store.mqttData = null;
-    store.initConfNode = {};
-    store.mqttParams = {
-        doorIds: [],
-        tagIds: [],
-        kpiAddrs: [],
-        tagEcharts: [],
-        assetIds: [],
-        areaIds: [],
-        varVaule: [],
-        echartData: [],
-        echartAssemblyData: [],
-        routingkey: '',
-        pathRewrite: ''
-    };
-    store.lastScale = store.data.scale;
-    store.pens = {};
-    store.options = {};
-    store.cacheDatas = [];
-    store.dpiRatio = 1;
-    store.lastScale = 1;
-    store.monitorAlarm = false;
-};

package/core/src/store/data.js

@@ -1,180 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import { default as mitt } from 'mitt';
-import { Lock } from '../models';
-import {DefalutOptions} from '../options';
-import {s8} from '../utils';
-import {commonStore} from './common';
-import {removeAllElement} from '../../../store';
-export var createStore = function () {
-    return {
-        id: '',
-        data: {
-            pens: [],
-            lineName: 'curve',
-            fromArrowType: '',
-            toArrowType: 'triangleSolid',
-            scale: 1,
-            locked: Lock.None,
-            dataResize: 1, // 数据是否加载，1是，0否
-            bkImageRect: null,
-            pageZoom: 1,
-            mqttOptions: {
-                clientId: s8()
-            },
-            dataConstruct: {},
-            bindDataTooltipVisible: true
-        },
-        mqttData: null,
-        initConfNode: {},
-        mqttParams: {
-            doorIds: [],
-            tagIds: [],
-            kpiAddrs: [],
-            tagEcharts: [],
-            assetIds: [],
-            areaIds: [],
-            varVaule: [],
-            echartData: [],
-            echartAssemblyData: [],
-            routingkey: '',
-            pathRewrite: ''
-        },
-        pens: {},
-        options: { ...DefalutOptions },
-        elementInteractivePoor: {}, // element 交互过渡数据
-        echartsDataPool: {}, // echarts Dom节点数据
-        echartsOptionsPool: {}, // echarts options节点数据
-        echartsRealDataPool: {}, // echarts 实时数据
-        switchTabDataPool: {}, // tabs
-        tableDataPool: {}, // form table
-        selectDataPool: {}, // form select
-        selectRealDataPool: {}, // form select
-        selectTabDataPool: {}, // form select
-        iframeDataPool: {}, // iframe
-        formoverDataPool: {}, // 滚动组件 Dom节点数据
-        formoverCanvasDataPool: {}, // 滚动组件 画布节点数据
-        emitter: mitt(),
-        cacheDatas: [],
-        dpiRatio: 1,
-        lastScale: 1,
-        monitorAlarm: false,// 全局报警标记，代表正在访问的这个topology文件中是否有告警发生
-        parentElem: null
-    };
-};
-export var useStore = function (id) {
-    if (id === void 0) { id = 'default'; }
-    if (!commonStore[id]) {
-        commonStore[id] = createStore();
-        commonStore[id].id = id;
-    }
-    return commonStore[id];
-};
-export function clearElementDataPool(data) {
-    const { echartsDataPool, selectDataPool, iframeDataPool, formoverDataPool, formoverCanvasDataPool} = data;
-    for (let [key, node] of Object.entries(echartsDataPool)) {
-        if(node) {
-            clearInterval(node.timeTicket);
-            if(node.chart) {
-                node.chart.off('mouseover');
-                node.chart.off('mouseout');
-                node.chart.dispose();
-            }
-            if(node.div && node.div.parentNode) node.div.parentNode.removeChild(node.div);
-        }
-        delete data.echartsDataPool[key];
-    }
-    if(Object.keys(selectDataPool).length) {
-        let dropdownEle = null,
-                dropdownListEle = null;
-        for (let [key, node] of Object.entries(selectDataPool)) {
-            if(!dropdownEle) {
-                dropdownEle = node.dom.selectDropdown;
-                dropdownListEle = node.dom.selectDropdownUl;
-            }
-            if(node.dom.selectEle && node.dom.selectEle.parentNode) node.dom.selectEle.parentNode.removeChild(node.dom.selectEle);
-            delete data.selectDataPool[key];
-        }
-        if(dropdownEle) dropdownEle.style.display = 'none';
-        if(dropdownListEle) dropdownListEle.innerHTML = '';
-    }
-    for (let [key, node] of Object.entries(iframeDataPool)) {
-        node.iframe.parentNode.removeChild(node.iframe);
-        delete data.iframeDataPool[key];
-    }
-    for (let key of Object.keys(formoverDataPool)) {
-        delete formoverDataPool[key];
-    }
-    for (let key of Object.keys(formoverCanvasDataPool)) {
-        const elementNode = document.getElementById(key);
-        if(elementNode) {
-            elementNode.parentNode.removeChild(elementNode);   
-        }
-        delete formoverCanvasDataPool[key];
-    }
-}
-export var clearStore = function (store, del) {
-    store.lastScale = store.data.scale;
-    store.data = {
-        pens: [],
-        lineName: 'curve',
-        fromArrowType: '',
-        toArrowType: 'triangleSolid',
-        scale: 1,
-        pageZoom: 1,
-        locked: Lock.None,
-        dataResize: 1, // 数据是否加载，1是，0否
-        bkImageRect: null,
-        mqttOptions: {
-            clientId: s8()
-        },
-        dataConstruct: {},
-        bindDataTooltipVisible: true
-    };
-    store.initConfNode = {};
-    store.mqttParams = {
-        doorIds: [],
-        tagIds: [],
-        kpiAddrs: [],
-        tagEcharts: [],
-        assetIds: [],
-        areaIds: [],
-        varVaule: [],
-        echartData: [],
-        echartAssemblyData: [],
-        routingkey: '',
-        pathRewrite: ''
-    };
-    store.pens = {}; // 先保留，后期优化提取变量用
-    store.cacheDatas = [];
-    store.dpiRatio = 1;
-    store.lastScale = 1;
-    store.monitorAlarm = false;
-    store.elementInteractivePoor = {};
-    store.echartsOptionsPool = {};
-    store.echartsRealDataPool = {};
-    store.switchTabDataPool = {};
-    store.tableDataPool = {};
-    store.selectRealDataPool = {};
-    store.selectTabDataPool = {};
-    clearElementDataPool({
-        echartsDataPool: store.echartsDataPool,
-        selectDataPool: store.selectDataPool,
-        iframeDataPool: store.iframeDataPool,
-        formoverDataPool: store.formoverDataPool,
-        formoverCanvasDataPool: store.formoverCanvasDataPool,
-    });
-    if(del) {
-        delete commonStore[store.id];
-        removeAllElement();
-    }
-};

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

@@ -1,2 +0,0 @@
-export * from './data'
-export * from './common'

package/core/src/store/index.js

@@ -1,2 +0,0 @@
-export * from './data'
-export * from './common'

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

@@ -1,6 +0,0 @@
-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;

package/core/src/utils/assignment.js

@@ -1,173 +0,0 @@
-// 变量赋值操作
-import {commonStore} from '../store';
-import { setConfItemNode } from '../healps';
-import { EventAction } from '../models';
-
-/**
- * 在节点注册前初始化node数据
- * @param node 节点数据
- * @param TID 数据键
- * @param type topology类型
- * @param order 节点序列
- */
-export function setInitNodeDataValidat(node, TID, type, order) {
-
-    const syncData = commonStore[TID].mqttData;
-
-    node.TID = TID;
-
-    if(typeof node.visibleSwitch !== 'boolean') {
-        // 兼容旧版显示隐藏属性值设置
-        node.visibleSwitch = type === 'topology';
-    }else {
-        node.visibleSwitch = type === 'topology' && node.visibleSwitch;
-    }
-
-    if(typeof order === "number") node.order = order;
-    if(type !== 'topology') node.selectDropdown = false;
-
-    initDefaultValidat(node, syncData);
-
-    setDefaultNodeValidat(node, syncData);
-
-    if (node.children && node.children.length) {
-
-        node.children.map((_item) => {
-
-            setInitNodeDataValidat(_item, TID, type);
-
-        })
-
-    }
-}
-// 初始化默认节点值
-export function initDefaultValidat(node, retData) {
-    node.defaultFillStyle = node.fillStyle;
-    node.defaultFontColor = node.font.color;
-    if (node.name === 'line') {
-        node.defaultStrokeStyle = node.strokeStyle;
-    }
-    // 变量类型数据展示，不需要实时更新
-    if(Array.isArray(node.data) && retData && retData.varData) {
-        let typeName = '';
-        let imgs = '';
-        const varData = retData.varData;
-        node.data.map((vd) => {
-            if(vd.key.includes('varValue') && varData[vd.value]){
-                const varNode = varData[vd.value];
-                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('显示图标>>>');
-                if(showType === 3 && varNode.value) imgs = `/dcim-api${varNode.value}`; //imgs += imgs ? `,${varData.value}` : varData.value;
-            }
-        });
-        if(typeName) node.text = typeName;
-        if(imgs) {
-            node.text = '';
-            node.image = imgs;
-            node.paddingBottom = 0;
-            node.paddingBottomNum = 0;
-            node.paddingLeft = 0;
-            node.paddingLeftNum = 0;
-            node.paddingRight = 0;
-            node.paddingRightNum = 0;
-            node.paddingTop = 0;
-            node.paddingTopNum = 0;
-        }
-    }
-}
-// 初始化mqtt实时值
-export function setDefaultNodeValidat(node, retData) {
-    //const item = JSON.parse(JSON.stringify(node));
-    if (!retData) return;
-    //const node = detailData.length > 0 ? detailData : syncData
-    const functionData = node.events.filter((ev) => {
-        return ev.action === EventAction.Function
-    });
-    const dataValue = functionData[0]
-    if (functionData.length && dataValue.value && retData) {
-        if(node.data && node.data.length) node.data.map((d) => {
-            const {kpiData, tagData} = retData;
-            const key = d.key;
-            const value = d.value;
-            const _syncItem = key === 'tagId' ? tagData[value] : kpiData[value];
-            if ((key === 'tagId' || key === 'kpiAddr') && _syncItem) {
-                const isControl = parseInt(_syncItem.isControlDis); // 是否可控，0可控，1不可控
-                if (!isControl) {
-                    d.tagVal = value
-                    d.controlParams = _syncItem
-                    // delete _syncItem[value]
-                    // Object.assign(d, _syncItem)
-                }
-            }
-        })
-        // console.log('定制函数=====')
-        try {
-            const func = new Function('pen', 'params', dataValue.value);
-            const funcData = func(node, JSON.stringify(retData));
-            /**
-             * 此方式在九所的 服务器状态监测功能中用到
-             * 全局报警标记，代表正在访问的这个topology文件中是否有告警发生
-             * 需要注意：自定义函数中要通过 return {monitorAlarm: boolean}的格式将元件告警状态返回
-             */
-            if(funcData && funcData.monitorAlarm && commonStore[node.TID]) commonStore[node.TID].monitorAlarm = true;
-        }catch (e) {
-            console.log(`自定义函数出错>>>`,);
-            console.log(`目标元件：${node.id}>>>`,);
-            console.log(`目标元件方位：X->${node.rect.x}，Y->${node.rect.y}>>>`,);
-        }
-    } else {
-        // console.log('默认函数')
-        const newData = setConfItemNode(node, retData);
-        if(newData && newData.monitorAlarm && commonStore[node.TID]) commonStore[node.TID].monitorAlarm = true;
-    }
-    if (node.animateFrames && node.animateFrames.length) {
-        for (var _a = 0, _af = node.animateFrames; _a < _af.length; _a++) {
-            var ani = _af[_a];
-            ani.state.strokeStyle = node.strokeStyle;
-            ani.state.fillStyle = node.fillStyle;
-        }
-    }
-    //return node;
-}
-
-/**
- * 配置与元件关联的tag数据
- * @param node 元件节点数据
- */
-export function setConnectionTagForConf(node) {
-    if(!node.tags || node.tags && !node.tags.length) return;
-    let setType = '';
-    node.tags.map((t) => {
-        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 === '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;
-    }
-    if(setType === 'selectShow'){
-        // 下拉显示隐藏
-        const tagData = node.tags[0].split('-');
-        const parentId = tagData[1] && tagData[1].trim();
-        if(!parentId) return console.log('>>>请检查select节点ID是否设置正确【selectOption+其他任意字符-下拉元件ID】>>>');
-        if(parentId) {
-            const params = {
-                TID: node.TID,
-                id: node.id,
-                name: node.name,
-                order: node.order,
-                visible: node.visible,
-                tag: node.tags[0].trim()
-            }
-            if(!commonStore[node.TID].selectTabDataPool[parentId]) commonStore[node.TID].selectTabDataPool[parentId] = new Map();
-            commonStore[node.TID].selectTabDataPool[parentId].set(node.id, params);
-        }
-    }
-}

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

@@ -1,2 +0,0 @@
-export declare function getParams(id: string, data: []): void;
-export declare function filterParams(node: any): void;

package/core/src/utils/params.js

@@ -1,60 +0,0 @@
-import {commonStore} from '../store';
-// 获取绑定数据的参数
-export function getParams(id, data) {
-    data.map((item) => {
-        filterParams(id, item);
-        if (item.children && item.children.length) {
-            getParams(id, item.children);
-        }
-        if (item.formData && item.formData.detailPageData && item.formData.detailPageData.pens && item.formData.detailPageData.pens.length) {
-            getParams(id, item.formData.detailPageData.pens);
-        }
-    });
-}
-// 过滤出参数
-export function filterParams(id, node) {
-    let tagIds = [];
-    let kpiAddrs = [];
-    let assetIds = [];
-    let areaIds = [];
-    let tagEcharts = [];
-    let echartData = [];
-    let varVaule = [];
-    let doorIds = [];
-    let isMqttEventType = false;
-    node.events.map((ev) => {
-        if(ev.value && ev.value === 'entranceGuard') doorIds.push(ev.params); // 门禁参数
-        if(ev.type === 3) isMqttEventType = true;
-    });
-    if(doorIds.length) commonStore[id].mqttParams.doorIds = [...commonStore[id].mqttParams.doorIds, ...doorIds];
-    if(!isMqttEventType) return;
-    if (node.data && Array.isArray(node.data) && node.data.length) {
-        node.data.map((item) => {
-            if (item.key === 'tagId') {
-                tagIds.push(item.value);
-            }
-            if (item.key === 'kpiAddr') {
-                kpiAddrs.push(item.value);
-            }
-            if (item.key === 'assetId') {
-                assetIds.push(item.value);
-            }
-            if (item.key === 'areaId') {
-                areaIds.push(item.value);
-            }
-            if (item.key.includes('varValue')) {
-                varVaule.push(item.value);
-            }
-        })
-    }
-    if (node.data && Object.prototype.toString.call(node.data) === '[object Object]' && node.data.params && node.data.params.id) {
-        echartData.push(node.data.params.id);
-    }
-    commonStore[id].mqttParams.tagIds = [...commonStore[id].mqttParams.tagIds, ...tagIds];
-    commonStore[id].mqttParams.kpiAddrs = [...commonStore[id].mqttParams.kpiAddrs, ...kpiAddrs];
-    commonStore[id].mqttParams.assetIds = [...commonStore[id].mqttParams.assetIds, ...assetIds];
-    commonStore[id].mqttParams.areaIds = [...commonStore[id].mqttParams.areaIds, ...areaIds];
-    commonStore[id].mqttParams.varVaule = [...commonStore[id].mqttParams.varVaule, ...varVaule];
-    commonStore[id].mqttParams.tagEcharts = [...commonStore[id].mqttParams.tagEcharts, ...tagEcharts];
-    commonStore[id].mqttParams.echartData = [...commonStore[id].mqttParams.echartData, ...echartData];
-}