dcim-topology2d 2.0.8 → 3.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/activity-diagram/src/final/final.d.ts +1 -1
- package/activity-diagram/src/final/final.rect.d.ts +1 -1
- package/activity-diagram/src/final/final.rect.js +1 -1
- package/activity-diagram/src/fork/fork.anchor.d.ts +1 -1
- package/activity-diagram/src/fork/fork.anchor.js +1 -1
- package/activity-diagram/src/fork/fork.d.ts +1 -1
- package/activity-diagram/src/fork/fork.rect.d.ts +1 -1
- package/activity-diagram/src/fork/fork.rect.js +1 -1
- package/activity-diagram/src/register.js +1 -1
- package/activity-diagram/src/swimlaneH/swimlaneH.d.ts +1 -1
- package/activity-diagram/src/swimlaneH/swimlaneH.rect.d.ts +1 -1
- package/activity-diagram/src/swimlaneH/swimlaneH.rect.js +1 -1
- package/activity-diagram/src/swimlaneV/swimlaneV.d.ts +1 -1
- package/activity-diagram/src/swimlaneV/swimlaneV.rect.d.ts +1 -1
- package/activity-diagram/src/swimlaneV/swimlaneV.rect.js +1 -1
- package/chart-diagram/index.d.ts +1 -3
- package/chart-diagram/index.js +1 -2
- package/chart-diagram/src/echarts/index.d.ts +2 -1
- package/chart-diagram/src/echarts/index.js +104 -109
- package/chart-diagram/src/register.js +8 -9
- package/class-diagram/src/class/class.d.ts +1 -1
- package/class-diagram/src/class/class.rect.d.ts +1 -1
- package/class-diagram/src/class/class.rect.js +1 -1
- package/class-diagram/src/register.js +1 -1
- package/core/index.d.ts +0 -2
- package/core/index.js +0 -2
- package/core/src/activeLayer.d.ts +10 -2
- package/core/src/activeLayer.js +47 -42
- package/core/src/animateLayer.d.ts +7 -3
- package/core/src/animateLayer.js +12 -10
- package/core/src/calling.d.ts +4 -1
- package/core/src/calling.js +41 -43
- package/core/src/canvas.d.ts +6 -1
- package/core/src/canvas.js +21 -22
- package/core/src/common.d.ts +7 -6
- package/core/src/common.js +673 -332
- package/core/src/core.d.ts +4 -3
- package/core/src/core.js +367 -466
- package/core/src/divLayer.d.ts +36 -2
- package/core/src/divLayer.js +305 -33
- package/core/src/healps/changeData.d.ts +2 -1
- package/core/src/healps/changeData.js +66 -32
- package/core/src/hoverLayer.d.ts +9 -2
- package/core/src/hoverLayer.js +34 -31
- package/core/src/middles/default.d.ts +3 -1
- package/core/src/middles/default.js +51 -53
- package/core/src/middles/index.js +2 -3
- package/core/src/middles/nodes/arbitrarygraph.js +9 -11
- package/core/src/middles/nodes/pentagon.rect.js +1 -1
- package/core/src/middles/nodes/rectangle.rect.js +1 -1
- package/core/src/models/data.d.ts +26 -0
- package/core/src/models/data.js +77 -0
- package/core/src/models/data.js.map +1 -0
- package/core/src/models/index.d.ts +1 -0
- package/core/src/models/index.js +1 -0
- package/core/src/models/node.d.ts +0 -10
- package/core/src/models/node.js +36 -69
- package/core/src/models/pen.js +59 -19
- package/core/src/models/rect.js +2 -2
- package/core/src/mqtt.d.ts +14 -0
- package/core/src/mqtt.js +82 -0
- package/core/src/mqtt.js.map +1 -0
- package/core/src/offscreen.d.ts +4 -1
- package/core/src/offscreen.js +8 -10
- package/core/src/options.d.ts +1 -3
- package/core/src/options.js +0 -2
- package/core/src/poll.js +39 -0
- package/core/src/preview.d.ts +13 -1
- package/core/src/preview.js +43 -111
- package/core/src/renderLayer.d.ts +9 -11
- package/core/src/renderLayer.js +61 -60
- package/core/src/socket.d.ts +10 -0
- package/core/src/socket.js +51 -0
- package/core/src/socket.js.map +1 -0
- package/core/src/utils/canvas.js +1 -1
- package/core/src/utils/construction.d.ts +3 -12
- package/core/src/utils/construction.js +1 -8
- package/core/src/utils/conversion.d.ts +0 -11
- package/core/src/utils/conversion.js +0 -168
- package/core/src/utils/dom.d.ts +8 -0
- package/core/src/utils/dom.js +67 -0
- package/core/src/utils/dom.js.map +1 -0
- package/core/src/utils/index.d.ts +1 -2
- package/core/src/utils/index.js +1 -2
- package/core/src/utils/math.d.ts +0 -1
- package/core/src/utils/math.js +0 -3
- package/core/src/utils/onmousevent.d.ts +0 -3
- package/core/src/utils/onmousevent.js +10 -42
- package/flow-diagram/src/comment/comment.anchor.d.ts +1 -1
- package/flow-diagram/src/comment/comment.anchor.js +1 -1
- package/flow-diagram/src/comment/comment.d.ts +1 -1
- package/flow-diagram/src/data/data.anchor.d.ts +1 -1
- package/flow-diagram/src/data/data.anchor.js +1 -1
- package/flow-diagram/src/data/data.d.ts +1 -1
- package/flow-diagram/src/data/data.rect.d.ts +1 -1
- package/flow-diagram/src/data/data.rect.js +1 -1
- package/flow-diagram/src/db/db.d.ts +1 -1
- package/flow-diagram/src/db/db.rect.d.ts +1 -1
- package/flow-diagram/src/db/db.rect.js +1 -1
- package/flow-diagram/src/display/display.anchor.d.ts +1 -1
- package/flow-diagram/src/display/display.anchor.js +1 -1
- package/flow-diagram/src/display/display.d.ts +1 -1
- package/flow-diagram/src/display/display.rect.d.ts +1 -1
- package/flow-diagram/src/display/display.rect.js +1 -1
- package/flow-diagram/src/document/document.anchor.d.ts +1 -1
- package/flow-diagram/src/document/document.anchor.js +1 -1
- package/flow-diagram/src/document/document.d.ts +1 -1
- package/flow-diagram/src/document/document.rect.d.ts +1 -1
- package/flow-diagram/src/document/document.rect.js +1 -1
- package/flow-diagram/src/externStorage/externStorage.anchor.d.ts +1 -1
- package/flow-diagram/src/externStorage/externStorage.anchor.js +1 -1
- package/flow-diagram/src/externStorage/externStorage.d.ts +1 -1
- package/flow-diagram/src/externStorage/externStorage.rect.d.ts +1 -1
- package/flow-diagram/src/externStorage/externStorage.rect.js +1 -1
- package/flow-diagram/src/internalStorage/internalStorage.d.ts +1 -1
- package/flow-diagram/src/internalStorage/internalStorage.rect.d.ts +1 -1
- package/flow-diagram/src/internalStorage/internalStorage.rect.js +1 -1
- package/flow-diagram/src/manually/manually.anchor.d.ts +1 -1
- package/flow-diagram/src/manually/manually.anchor.js +1 -1
- package/flow-diagram/src/manually/manually.d.ts +1 -1
- package/flow-diagram/src/manually/manually.rect.d.ts +1 -1
- package/flow-diagram/src/manually/manually.rect.js +1 -1
- package/flow-diagram/src/parallel/parallel.anchor.d.ts +1 -1
- package/flow-diagram/src/parallel/parallel.anchor.js +1 -1
- package/flow-diagram/src/parallel/parallel.d.ts +1 -1
- package/flow-diagram/src/queue/queue.d.ts +1 -1
- package/flow-diagram/src/queue/queue.rect.d.ts +1 -1
- package/flow-diagram/src/queue/queue.rect.js +1 -1
- package/flow-diagram/src/register.js +1 -1
- package/flow-diagram/src/subprocess/subprocess.d.ts +1 -1
- package/flow-diagram/src/subprocess/subprocess.rect.d.ts +1 -1
- package/flow-diagram/src/subprocess/subprocess.rect.js +1 -1
- package/layout/src/align.d.ts +1 -1
- package/layout/src/align.js +1 -1
- package/layout/src/layout.d.ts +1 -1
- package/layout/src/layout.js +1 -1
- package/myShape-diagram/{index.js → myShape.js} +1 -4
- package/package.json +1 -1
- package/sequence-diagram/src/focus/focus.anchor.d.ts +1 -1
- package/sequence-diagram/src/focus/focus.anchor.js +1 -1
- package/sequence-diagram/src/focus/focus.d.ts +1 -1
- package/sequence-diagram/src/focus/focus.rect.d.ts +1 -1
- package/sequence-diagram/src/focus/focus.rect.js +1 -1
- package/sequence-diagram/src/lifeline/lifeline.anchor.d.ts +1 -1
- package/sequence-diagram/src/lifeline/lifeline.anchor.js +1 -1
- package/sequence-diagram/src/lifeline/lifeline.d.ts +1 -1
- package/sequence-diagram/src/lifeline/lifeline.rect.d.ts +1 -1
- package/sequence-diagram/src/lifeline/lifeline.rect.js +1 -1
- package/sequence-diagram/src/register.js +1 -1
- package/chart-diagram/src/utils/changeOptions.d.ts +0 -7
- package/chart-diagram/src/utils/changeOptions.js +0 -261
- package/chart-diagram/src/utils/conversion.d.ts +0 -19
- package/chart-diagram/src/utils/conversion.js +0 -432
- package/chart-diagram/src/utils/drawGraphic.d.ts +0 -3
- package/chart-diagram/src/utils/drawGraphic.js +0 -97
- package/chart-diagram/src/utils/formatter.d.ts +0 -1
- package/chart-diagram/src/utils/formatter.js +0 -170
- package/chart-diagram/src/utils/index.d.ts +0 -4
- package/chart-diagram/src/utils/index.js +0 -4
- package/chart-diagram/src/utils/render.d.ts +0 -8
- package/chart-diagram/src/utils/render.js +0 -228
- package/core/src/element/common.d.ts +0 -5
- package/core/src/element/common.js +0 -54
- package/core/src/element/iframe.d.ts +0 -3
- package/core/src/element/iframe.js +0 -12
- package/core/src/element/index.d.ts +0 -4
- package/core/src/element/index.js +0 -4
- package/core/src/element/select.d.ts +0 -11
- package/core/src/element/select.js +0 -263
- package/core/src/element/tab.d.ts +0 -1
- package/core/src/element/tab.js +0 -23
- package/core/src/middles/arrows/index.d.ts +0 -4
- package/core/src/middles/arrows/index.js +0 -5
- package/core/src/middles/lines/index.d.ts +0 -4
- package/core/src/middles/lines/index.js +0 -5
- package/core/src/middles/nodes/formoverflow.js +0 -61
- package/core/src/middles/nodes/formselect.d.ts +0 -2
- package/core/src/middles/nodes/formselect.js +0 -95
- package/core/src/middles/nodes/iframe.d.ts +0 -2
- package/core/src/middles/nodes/iframe.js +0 -29
- package/core/src/middles/nodes/index.d.ts +0 -48
- package/core/src/middles/nodes/index.js +0 -49
- package/core/src/store/common.d.ts +0 -9
- package/core/src/store/common.js +0 -5
- package/core/src/store/data.d.ts +0 -189
- package/core/src/store/data.js +0 -180
- package/core/src/store/index.d.ts +0 -2
- package/core/src/store/index.js +0 -2
- package/core/src/utils/assignment.d.ts +0 -6
- package/core/src/utils/assignment.js +0 -173
- package/core/src/utils/params.d.ts +0 -2
- package/core/src/utils/params.js +0 -60
- package/static/echartsDefaultData.js +0 -178
- package/static/element.js +0 -14
- package/static/form.js +0 -11
- package/static/index.js +0 -3
- package/store/actions.js +0 -1
- package/store/clear.js +0 -10
- package/store/index.js +0 -2
- package/style/common.css +0 -18
- package/style/editor.css +0 -13
- package/style/index.css +0 -4
- package/style/select.css +0 -143
- /package/myShape-diagram/{index.ts → myShape.ts} +0 -0
@@ -1,263 +0,0 @@
|
|
1
|
-
import {Store} from 'le5le-store';
|
2
|
-
import {commonStore} from "../store";
|
3
|
-
import { setMapDataOptions } from '../../../chart-diagram';
|
4
|
-
import {previewType, selectStaticType} from '../utils';
|
5
|
-
import {setElementSwitchTabState} from './tab';
|
6
|
-
let nodeId = '';
|
7
|
-
let downId = '';
|
8
|
-
// 创建下拉头
|
9
|
-
export function createSelectElement(node) {
|
10
|
-
const selectEle = document.createElement('div');
|
11
|
-
const order = node.formData.selected && node.formData.selected.order || 0;
|
12
|
-
const inputValue = commonStore[node.TID].selectDataPool[node.id].data[order] && commonStore[node.TID].selectDataPool[node.id].data[order].name;
|
13
|
-
let attrName = 'topology-select-icon-arrow';
|
14
|
-
if(node.selectDropdown) attrName += ' reverse';
|
15
|
-
const children = `<i class="${attrName}"
|
16
|
-
style="border-width: ${node.font.fontSize/2}px;border-bottom-width: 0;">
|
17
|
-
</i><input type="text" placeholder="请选择" readonly
|
18
|
-
value="${inputValue}"
|
19
|
-
class="topology-select-input"
|
20
|
-
style="font-size: ${node.font.fontSize}px;color: ${node.font.color ? node.font.color : '#fff'}"/>`;
|
21
|
-
const themeType = node.formData.theme ? ` theme${node.formData.theme}` : '';
|
22
|
-
selectEle.setAttribute('id', node.id);
|
23
|
-
selectEle.setAttribute('class', `topology-select${themeType}`);
|
24
|
-
selectEle.innerHTML = children;
|
25
|
-
return selectEle;
|
26
|
-
}
|
27
|
-
// 创建下拉options容器
|
28
|
-
export function createSelectDropdown(node) {
|
29
|
-
const selectDropdownEle = document.createElement('div');
|
30
|
-
let liElements = '';
|
31
|
-
if(node.selectDropdown) {
|
32
|
-
liElements = createSelectOptions(commonStore[node.TID].selectDataPool[node.id].data, node);
|
33
|
-
selectDropdownEle.style.display = 'block';
|
34
|
-
setSelectDropdownPosition(node, selectDropdownEle);
|
35
|
-
}
|
36
|
-
const children = `<i class="popper__arrow"></i><ul class="topology-select-dropdown-list">${liElements}</ul>`;
|
37
|
-
const themeType = node.formData.theme ? ` theme${node.formData.theme}` : '';
|
38
|
-
selectDropdownEle.style.width = `${node.rect.width}px`;
|
39
|
-
selectDropdownEle.setAttribute('class', `topology-select-dropdown${themeType} documentDefine`);
|
40
|
-
selectDropdownEle.innerHTML = children;
|
41
|
-
return selectDropdownEle;
|
42
|
-
}
|
43
|
-
// 创建下拉options列表
|
44
|
-
export function createSelectOptions(data, node) {
|
45
|
-
const selectNode = commonStore[node.TID].selectDataPool[node.id];
|
46
|
-
const selectDropdownUl = selectNode.dom.selectDropdownUl;
|
47
|
-
if(selectDropdownUl) selectDropdownUl.innerHTML = '';
|
48
|
-
let leElement = '';
|
49
|
-
const order = selectNode.node.selected ? selectNode.node.selected.order : 0;
|
50
|
-
for (let i = 0, length = data.length; i < length; i++) {
|
51
|
-
let selected = i === order ? ' selected' : '';
|
52
|
-
leElement += `<li
|
53
|
-
class="topology-select-dropdown-item${selected}"
|
54
|
-
type="option" data-order="${i}"
|
55
|
-
style="height: ${node.rect.height}px;line-height: ${node.rect.height}px;font-size: ${node.font.fontSize}px;">
|
56
|
-
<span>${data[i].name}</span>
|
57
|
-
</li>`;
|
58
|
-
}
|
59
|
-
if(selectDropdownUl) {
|
60
|
-
selectDropdownUl.innerHTML = leElement;
|
61
|
-
}else {
|
62
|
-
return leElement;
|
63
|
-
}
|
64
|
-
}
|
65
|
-
// 配置下拉头的交互状态:展开时三角图标向上,否则向下
|
66
|
-
export function setSelectInteractiveState(selected, node) {
|
67
|
-
const selectNode = commonStore[node.TID].selectDataPool[node.id];
|
68
|
-
selectNode.dom.selectIconArrow.style.display = selected ? 'none' : 'block';
|
69
|
-
//selectNode.dom['selectRemove'].style.display = selected ? 'block' : 'none';
|
70
|
-
}
|
71
|
-
// 重置下拉状态
|
72
|
-
export function resetSelectInteractiveState(node) {
|
73
|
-
if(!node || !node.TID) return;
|
74
|
-
const currentStore = commonStore[node.TID];
|
75
|
-
if(!Object.keys(currentStore.selectDataPool).length) return;
|
76
|
-
for (let data of Object.values(currentStore.selectDataPool)) {
|
77
|
-
if(node && node.id !== data.node.id) {
|
78
|
-
if(data.dom.selectIconArrow) data.dom.selectIconArrow.setAttribute('class', 'topology-select-icon-arrow');
|
79
|
-
data.slideState = false;
|
80
|
-
}
|
81
|
-
}
|
82
|
-
document.querySelector('.topology-select-dropdown').style.display = 'none';
|
83
|
-
currentStore.elementInteractivePoor.node = null;
|
84
|
-
}
|
85
|
-
|
86
|
-
/**
|
87
|
-
* 配置下拉options容器的交互状态,展开和收起
|
88
|
-
* @param node 下拉元件节点数据
|
89
|
-
* @param staticType 下拉功能类型:1: 数据统计;2:数据展示;3:显示隐藏
|
90
|
-
* @param type 功能作用区域类型:Dcim,Topology,Logo
|
91
|
-
*/
|
92
|
-
export function setSelectDropdownInteractiveState(node, staticType, type) {
|
93
|
-
const currentStore = commonStore[node.TID];
|
94
|
-
const selectNode = currentStore.selectDataPool[node.id];
|
95
|
-
if(!selectNode.staticType) selectNode.staticType = staticType;
|
96
|
-
if(!selectNode) return;
|
97
|
-
if(downId !== node.id && type === previewType.Dcim) {
|
98
|
-
// 点击的不是同一个下拉则重置交互样式,清空数据
|
99
|
-
resetSelectInteractiveState(node);
|
100
|
-
currentStore.elementInteractivePoor.options = null;
|
101
|
-
}
|
102
|
-
downId = node.id;
|
103
|
-
currentStore.elementInteractivePoor.node = node;
|
104
|
-
selectElementStore(node.id, node.TID);
|
105
|
-
setSelectElementPosition(node);
|
106
|
-
const { selectIconArrow, selectDropdown } = selectNode.dom;
|
107
|
-
selectNode.slideState = !selectNode.slideState || node.selectDropdown; // 下拉展开状态
|
108
|
-
let attrName = 'topology-select-icon-arrow';
|
109
|
-
if(selectNode.slideState) {
|
110
|
-
selectDropdown.style.display = 'block';
|
111
|
-
attrName += ' reverse';
|
112
|
-
}else {
|
113
|
-
selectDropdown.style.display = 'none';
|
114
|
-
attrName.replace(' reverse', '');
|
115
|
-
}
|
116
|
-
// 图标旋转
|
117
|
-
selectIconArrow.setAttribute('class', attrName);
|
118
|
-
// 添加列表数据
|
119
|
-
if(!currentStore.elementInteractivePoor.options) createSelectOptions(selectNode.data, node);
|
120
|
-
}
|
121
|
-
// 配置下拉偏移位置
|
122
|
-
export function setSelectElementPosition(node, type) {
|
123
|
-
// 不同元件切换
|
124
|
-
selectElementStore(node.id, node.TID);
|
125
|
-
const selectNode = commonStore[node.TID].selectDataPool[node.id];
|
126
|
-
if(type === 'down') {
|
127
|
-
if(nodeId === node.id) return;
|
128
|
-
commonStore[node.TID].elementInteractivePoor.options = null;
|
129
|
-
createSelectOptions(selectNode.data, node);
|
130
|
-
}
|
131
|
-
nodeId = node.id;
|
132
|
-
setSelectDropdownPosition(node, selectNode.dom.selectDropdown);
|
133
|
-
}
|
134
|
-
function setSelectDropdownPosition(node, selectDropdown) {
|
135
|
-
const selectEle = commonStore[node.TID].selectDataPool[node.id].dom.selectEle;
|
136
|
-
let left = selectEle.getBoundingClientRect().left; // 获取下拉元素距离窗体左侧位置
|
137
|
-
let top = selectEle.getBoundingClientRect().top + node.rect.height;
|
138
|
-
if(window.location.pathname.includes('workspace')) {
|
139
|
-
// topol编辑器
|
140
|
-
left = node.rect.x;
|
141
|
-
top = node.rect.y + node.rect.height;
|
142
|
-
}
|
143
|
-
selectDropdown.style.left = `${left}px`;
|
144
|
-
selectDropdown.style.top = `${top}px`;
|
145
|
-
selectDropdown.style.width = `${node.rect.width}px`;
|
146
|
-
const themeType = node.formData.theme ? ` theme${node.formData.theme}` : '';
|
147
|
-
selectDropdown.setAttribute('class', `topology-select-dropdown${themeType} documentDefine`);
|
148
|
-
}
|
149
|
-
|
150
|
-
/**
|
151
|
-
* 获取下拉选中的数据
|
152
|
-
* @param e 节点选中事件
|
153
|
-
* @param data 下拉元件节点数据
|
154
|
-
* @param editData 编辑显下拉的数据
|
155
|
-
*/
|
156
|
-
export function getSelectedData(e, data, editData) {
|
157
|
-
const currentStore = commonStore[data.TID];
|
158
|
-
const selectNode = currentStore.selectDataPool[data.id];
|
159
|
-
if(!currentStore.elementInteractivePoor.options && data.selectDropdown) currentStore.elementInteractivePoor.options = selectNode.dom.selectDropdownUl.querySelectorAll('.topology-select-dropdown-item');
|
160
|
-
let order = 0;
|
161
|
-
let staticType = selectNode.staticType;
|
162
|
-
if(!editData) {
|
163
|
-
const parentNode = e.target.parentNode;
|
164
|
-
const type = parentNode.getAttribute('type');
|
165
|
-
if(type !== 'option') return;
|
166
|
-
selectNode.slideState = false;
|
167
|
-
selectNode.dom.selectDropdown.style.display = 'none';
|
168
|
-
// 图标旋转
|
169
|
-
selectNode.dom.selectIconArrow.setAttribute('class', 'topology-select-icon-arrow');
|
170
|
-
// 选中节点操作
|
171
|
-
order = parentNode.getAttribute('data-order');
|
172
|
-
}else {
|
173
|
-
order = editData.order;
|
174
|
-
staticType = editData.staticType;
|
175
|
-
}
|
176
|
-
if(data.selectDropdown) {
|
177
|
-
for(let i = 0, leng = currentStore.elementInteractivePoor.options.length; i < leng; i++) {
|
178
|
-
let name = 'topology-select-dropdown-item';
|
179
|
-
if(i == order) {
|
180
|
-
name += ' selected';
|
181
|
-
}else {
|
182
|
-
name.replace(' selected', '');
|
183
|
-
}
|
184
|
-
currentStore.elementInteractivePoor.options[i].setAttribute('class', name);
|
185
|
-
}
|
186
|
-
}
|
187
|
-
selectNode.optionOrder = order;
|
188
|
-
const node = selectNode.data[order];
|
189
|
-
selectNode.dom.selectEle.querySelector('.topology-select-input').value = node.name;
|
190
|
-
selectNode.node.selected = {
|
191
|
-
order: parseInt(order),
|
192
|
-
id: node.id
|
193
|
-
};
|
194
|
-
if(staticType === selectStaticType.static) {
|
195
|
-
// 数据统计
|
196
|
-
const optionNode = data.formData.bindBlockId && currentStore.echartsOptionsPool[data.formData.bindBlockId];
|
197
|
-
if(!optionNode) return;
|
198
|
-
// 切换数据
|
199
|
-
currentStore.echartsRealDataPool[optionNode.data.id] = currentStore.echartsRealDataPool[node.id];
|
200
|
-
const isInitTable = initTabSwitchPage(data.formData.bindBlockTag, optionNode.data, currentStore);
|
201
|
-
setMapDataOptions(optionNode.option, optionNode.data);
|
202
|
-
if(isInitTable) Store.set(`${data.TID}-LT:render`, true);
|
203
|
-
}
|
204
|
-
if(staticType === selectStaticType.dataShow) {
|
205
|
-
// 数据展示
|
206
|
-
}
|
207
|
-
if(staticType === selectStaticType.visible) {
|
208
|
-
// 显示隐藏
|
209
|
-
const optionsVisibleData = currentStore.selectTabDataPool[data.id];
|
210
|
-
if(!optionsVisibleData || !optionsVisibleData.size) return;
|
211
|
-
for(const [key, value] of optionsVisibleData){
|
212
|
-
const eque = node.id === value.tag;
|
213
|
-
currentStore.data.pens[value.order].visible = eque;
|
214
|
-
currentStore.data.pens[value.order].visibleSwitch = eque;
|
215
|
-
value.visible = eque;
|
216
|
-
setElementSwitchTabState(value);
|
217
|
-
}
|
218
|
-
Store.set(`${data.TID}-LT:render`, true);
|
219
|
-
}
|
220
|
-
}
|
221
|
-
// 初始化Tab页签选中状态
|
222
|
-
function initTabSwitchPage(bindBlockTag, data, currentStore) {
|
223
|
-
if(!bindBlockTag) return false;
|
224
|
-
// 初始化分类选中状态
|
225
|
-
const tabData = currentStore.switchTabDataPool[`${bindBlockTag}Data`]; // 获取Tab组数据
|
226
|
-
if(!tabData) return false;
|
227
|
-
const tabKeys = Object.keys(tabData);
|
228
|
-
const pens = currentStore.data.pens;
|
229
|
-
if(!tabKeys.length || !pens[tabData[tabKeys[0]].order].activeImgeIndex) return false; //Tab默认选中第一个页签就退出程序,不执行初始化状态
|
230
|
-
let tabInit = false;
|
231
|
-
for (let tabNode of Object.values(tabData)) {
|
232
|
-
const penNode = pens[tabNode.order];
|
233
|
-
if(!tabInit) {
|
234
|
-
data.params.tabVisitOrder = 0;
|
235
|
-
data.tabData = {
|
236
|
-
type: '',
|
237
|
-
data: tabNode.tabData
|
238
|
-
};
|
239
|
-
}
|
240
|
-
if(penNode) {
|
241
|
-
penNode.activeImgeIndex = tabInit;
|
242
|
-
tabInit = true;
|
243
|
-
}
|
244
|
-
}
|
245
|
-
return true;
|
246
|
-
}
|
247
|
-
// 配置下拉展示的主题风格
|
248
|
-
export function setSelectElementTheme(node) {
|
249
|
-
const themeType = node.formData.theme ? ` theme${node.formData.theme}` : '';
|
250
|
-
const { selectEle, selectDropdown } = commonStore[node.TID].selectDataPool[node.id].dom;
|
251
|
-
selectEle.setAttribute('class', `topology-select${themeType}`);
|
252
|
-
selectDropdown.setAttribute('class', `topology-select-dropdown${themeType} documentDefine`);
|
253
|
-
}
|
254
|
-
// 存储下拉Dom节点
|
255
|
-
function selectElementStore(id, TID) {
|
256
|
-
const selectNode = commonStore[TID].selectDataPool[id];
|
257
|
-
if(!selectNode.dom.selectIconArrow) selectNode.dom.selectIconArrow = selectNode.dom.selectEle.querySelector('.topology-select-icon-arrow');
|
258
|
-
if(!selectNode.dom.selectDropdown) {
|
259
|
-
selectNode.dom.selectDropdown = document.querySelector('.topology-select-dropdown');
|
260
|
-
selectNode.dom.selectDropdownUl = document.querySelector('.topology-select-dropdown-list');
|
261
|
-
selectNode.dom.selectDropdownLi = document.querySelectorAll('.topology-select-dropdown-item');
|
262
|
-
}
|
263
|
-
}
|
@@ -1 +0,0 @@
|
|
1
|
-
export declare function setElementSwitchTabState(node: any): void;
|
package/core/src/element/tab.js
DELETED
@@ -1,23 +0,0 @@
|
|
1
|
-
import {jsonLength} from '../utils';
|
2
|
-
import {commonStore} from "../store";
|
3
|
-
// 设置tab切换显示隐藏时的 Dom元件状态
|
4
|
-
export function setElementSwitchTabState(node) {
|
5
|
-
if(node.children && node.children.length) {
|
6
|
-
node.children.map((ch) => {
|
7
|
-
ch.visible = node.visible;
|
8
|
-
setElementSwitchTabState(ch);
|
9
|
-
})
|
10
|
-
}
|
11
|
-
if(!(node.name === 'echarts' || node.name === 'select')) return;
|
12
|
-
if(typeof commonStore[node.TID].elementInteractivePoor.elementDataLength !== 'number') {
|
13
|
-
commonStore[node.TID].elementInteractivePoor.elementDataLength = jsonLength(commonStore[node.TID].echartsDataPool) || jsonLength(commonStore[node.TID].selectDataPool);
|
14
|
-
}
|
15
|
-
if(!commonStore[node.TID].elementInteractivePoor.elementDataLength) return;
|
16
|
-
const ele = commonStore[node.TID].echartsDataPool[node.id] && commonStore[node.TID].echartsDataPool[node.id].div ||
|
17
|
-
commonStore[node.TID].selectDataPool[node.id] && commonStore[node.TID].selectDataPool[node.id].dom.selectEle;
|
18
|
-
if(ele) {
|
19
|
-
ele.style.display = !node.visible ? 'none': 'block';
|
20
|
-
}else {
|
21
|
-
commonStore[node.TID].data.dataResize = 1;
|
22
|
-
}
|
23
|
-
}
|
@@ -1,61 +0,0 @@
|
|
1
|
-
// import {} from './rectangle';
|
2
|
-
import {rectangle, createDiv, s8, Topology} from '../../../../core';
|
3
|
-
import {commonStore} from "../../store";
|
4
|
-
|
5
|
-
export async function formOverflow(ctx, node) {
|
6
|
-
// 绘制一个底图,类似于占位符。
|
7
|
-
rectangle(ctx, node)
|
8
|
-
console.log('绘制滚动组件--')
|
9
|
-
// 添加当前节点到div层
|
10
|
-
if (!node.elementId) {
|
11
|
-
node.elementId = s8()
|
12
|
-
}
|
13
|
-
let formoverData = commonStore[node.TID].formoverDataPool[node.id];
|
14
|
-
let id = node.formData.detailPageId
|
15
|
-
const color = node.formData.scrollbarColor? node.formData.scrollbarColor: 'auto'
|
16
|
-
const colorBg = node.formData.scrollbarColorBg? node.formData.scrollbarColorBg: 'auto'
|
17
|
-
const scrollbarColor = color + ' ' + colorBg
|
18
|
-
|
19
|
-
if (!node.elementLoaded && !formoverData) {
|
20
|
-
console.log('是否存在--formoverData--0-',formoverData)
|
21
|
-
if(!formoverData) {
|
22
|
-
formoverData = {
|
23
|
-
div: createDiv(node)
|
24
|
-
};
|
25
|
-
}else {
|
26
|
-
formoverData.div = createDiv(node);
|
27
|
-
}
|
28
|
-
formoverData.div.setAttribute('class', 'topoOverflow');
|
29
|
-
formoverData.div.style.setProperty('scrollbar-color', scrollbarColor);
|
30
|
-
formoverData.div.style.setProperty('scrollbar-width', 'thin');
|
31
|
-
|
32
|
-
node.elementLoaded = true
|
33
|
-
document.body.appendChild(formoverData.div)
|
34
|
-
// 添加当前节点到div层
|
35
|
-
node.addToDiv()
|
36
|
-
commonStore[node.TID].formoverDataPool[node.id] = formoverData;
|
37
|
-
|
38
|
-
|
39
|
-
console.log('请求子页面接口-----id =',id)
|
40
|
-
let canvas = new Topology(node.id, {
|
41
|
-
rotateCursor: '/img/rotate.cur',
|
42
|
-
})
|
43
|
-
canvas.formOverflowOpen(node.formData.detailPageData)
|
44
|
-
commonStore[node.TID].formoverCanvasDataPool[node.id] = canvas
|
45
|
-
}else if(formoverData && id){
|
46
|
-
console.log('是否存在--formoverData--1-',formoverData)
|
47
|
-
formoverData.div.style.setProperty('scrollbar-color', scrollbarColor);
|
48
|
-
formOverflowChange(node)
|
49
|
-
}
|
50
|
-
}
|
51
|
-
|
52
|
-
// 更新滚动组件中子页面
|
53
|
-
export function formOverflowChange(node) {
|
54
|
-
//绘制画布
|
55
|
-
console.log('更新滚动组件中子页面-',node)
|
56
|
-
let canvas = commonStore[node.TID].formoverCanvasDataPool[node.id]
|
57
|
-
let data = node.formData.detailPageData
|
58
|
-
console.log('改变滚动组件中子页面-',data)
|
59
|
-
canvas.formOverflowOpen(data)
|
60
|
-
}
|
61
|
-
|
@@ -1,95 +0,0 @@
|
|
1
|
-
import {rectangle} from './rectangle';
|
2
|
-
import {
|
3
|
-
createSelectElement,
|
4
|
-
createSelectDropdown} from '../../element';
|
5
|
-
import {
|
6
|
-
setEventListener,
|
7
|
-
s8} from '../../utils';
|
8
|
-
import {selectDefaultData} from '../../../../static';
|
9
|
-
import {commonStore} from "../../store";
|
10
|
-
|
11
|
-
export function formSelect(ctx, node) {
|
12
|
-
// 绘制一个底图,类似于占位符。
|
13
|
-
rectangle(ctx, node);
|
14
|
-
if (!commonStore[node.TID].selectDataPool[node.id]) {
|
15
|
-
const currentStore = commonStore[node.TID];
|
16
|
-
node.elementId = s8();
|
17
|
-
node.dash = 4;
|
18
|
-
currentStore.selectDataPool[node.id] = {
|
19
|
-
slideState: node.selectDropdown,
|
20
|
-
node: {
|
21
|
-
id: node.id,
|
22
|
-
color: node.font.color,
|
23
|
-
fontSize: node.font.fontSize,
|
24
|
-
selected: node.formData.selected || null
|
25
|
-
},
|
26
|
-
dom: {}
|
27
|
-
};
|
28
|
-
let bindBlockId = '';
|
29
|
-
if(node.formData.bindBlockId) {
|
30
|
-
// 去空格重新赋值
|
31
|
-
bindBlockId = node.formData.bindBlockId.trim();
|
32
|
-
node.formData.bindBlockId = bindBlockId;
|
33
|
-
}
|
34
|
-
if(node.formData.bindBlockTag) {
|
35
|
-
// 去空格重新赋值
|
36
|
-
node.formData.bindBlockTag = node.formData.bindBlockTag.trim();
|
37
|
-
}
|
38
|
-
let selectRealData = bindBlockId && currentStore.selectRealDataPool[bindBlockId];
|
39
|
-
if(bindBlockId && selectRealData) {
|
40
|
-
// select与echarts互相关联
|
41
|
-
currentStore.selectDataPool[node.id].data = selectRealData;
|
42
|
-
const echartsData = currentStore.echartsDataPool[bindBlockId];
|
43
|
-
echartsData ? echartsData.bindId = node.id : currentStore.echartsDataPool[bindBlockId] = {
|
44
|
-
bindId: node.id
|
45
|
-
};
|
46
|
-
// select与Tab关联
|
47
|
-
const bindBlockTagData = currentStore.switchTabDataPool[`${node.formData.bindBlockTag}Data`];
|
48
|
-
if(bindBlockTagData) currentStore.echartsDataPool[bindBlockId].tabCorrelationType = 'select';
|
49
|
-
}else {
|
50
|
-
if(node.formData.ids) {
|
51
|
-
const optionIds = node.formData.ids.split(',');
|
52
|
-
const optionNames = node.formData.names.split(',');
|
53
|
-
const optionsData = [];
|
54
|
-
for (let i = 0; i < optionIds.length; i++) {
|
55
|
-
optionsData.push({
|
56
|
-
id: optionIds[i],
|
57
|
-
name: optionNames[i]
|
58
|
-
});
|
59
|
-
}
|
60
|
-
currentStore.selectDataPool[node.id].data = optionsData;
|
61
|
-
}else {
|
62
|
-
currentStore.selectDataPool[node.id].data = JSON.parse(JSON.stringify(selectDefaultData));
|
63
|
-
}
|
64
|
-
}
|
65
|
-
const select = createSelectElement(node);
|
66
|
-
currentStore.selectDataPool[node.id].dom.selectEle = select;
|
67
|
-
document.body.appendChild(select);
|
68
|
-
let selectDropdownEle = document.querySelector('.topology-select-dropdown');
|
69
|
-
if(!selectDropdownEle) {
|
70
|
-
selectDropdownEle = createSelectDropdown(node);
|
71
|
-
const parentEle = window.location.pathname.includes('workspace') ? document.getElementById('topology-canvas') : document.body;
|
72
|
-
parentEle.appendChild(selectDropdownEle);
|
73
|
-
// 鼠标按下
|
74
|
-
selectDropdownEle.addEventListener('mousedown', (e) => {
|
75
|
-
setEventListener(e, node.TID);
|
76
|
-
});
|
77
|
-
}
|
78
|
-
// 添加当前节点到div层
|
79
|
-
node.addToDiv();
|
80
|
-
}else {
|
81
|
-
const selectNode = commonStore[node.TID].selectDataPool[node.id];
|
82
|
-
if(selectNode.node.color === node.font.color && selectNode.node.fontSize === node.font.fontSize) return;
|
83
|
-
const selectDom = selectNode.dom;
|
84
|
-
if(!selectDom.selectInput) selectDom.selectInput = selectDom.selectEle.querySelector('.topology-select-input');
|
85
|
-
selectDom.selectInput.style.color = node.font.color;
|
86
|
-
selectDom.selectInput.style.fontSize = `${node.font.fontSize}px`;
|
87
|
-
if(node.selectDropdown) {
|
88
|
-
const liEle = selectDom.selectDropdownUl.querySelectorAll('.topology-select-dropdown-item');
|
89
|
-
liEle.forEach(function(element) {
|
90
|
-
element.style.color = node.font.color;
|
91
|
-
element.style.fontSize = `${node.font.fontSize}px`;
|
92
|
-
});
|
93
|
-
}
|
94
|
-
}
|
95
|
-
}
|
@@ -1,29 +0,0 @@
|
|
1
|
-
import {rectangle} from './rectangle';
|
2
|
-
import {s8} from "../../utils";
|
3
|
-
import {createIframeElement} from "../../element";
|
4
|
-
import {commonStore} from "../../store";
|
5
|
-
|
6
|
-
export function iframePrimeval(ctx, node) {
|
7
|
-
//console.log('iframePrimeval############', node)
|
8
|
-
// 绘制一个底图,类似于占位符。
|
9
|
-
rectangle(ctx, node);
|
10
|
-
if (!commonStore[node.TID].iframeDataPool[node.id]) {
|
11
|
-
node.elementId = s8();
|
12
|
-
commonStore[node.TID].iframeDataPool[node.id] = {
|
13
|
-
node: {
|
14
|
-
id: node.id,
|
15
|
-
src: node.iframe
|
16
|
-
}
|
17
|
-
};
|
18
|
-
const iframe = createIframeElement(node);
|
19
|
-
commonStore[node.TID].iframeDataPool[node.id].iframe = iframe;
|
20
|
-
const parentEle = window.location.pathname.includes('workspace') ? document.getElementById('topology-canvas') : document.body;
|
21
|
-
parentEle.appendChild(iframe);
|
22
|
-
// 添加当前节点到div层
|
23
|
-
node.addToDiv();
|
24
|
-
}else {
|
25
|
-
const iframeNode = commonStore[node.TID].iframeDataPool[node.id];
|
26
|
-
if(iframeNode.node.src === node.iframe) return;
|
27
|
-
iframeNode.iframe.src = node.iframe;
|
28
|
-
}
|
29
|
-
}
|
@@ -1,48 +0,0 @@
|
|
1
|
-
export * from './arbitrarygraph';
|
2
|
-
export * from './arbitrarygraph.anchor';
|
3
|
-
export * from './arrow';
|
4
|
-
export * from './arrow.rect';
|
5
|
-
export * from './arrow.anchor';
|
6
|
-
export * from './circle';
|
7
|
-
export * from './circle.rect';
|
8
|
-
export * from './circle.anchor';
|
9
|
-
export * from './cloud';
|
10
|
-
export * from './cloud.rect';
|
11
|
-
export * from './cloud.anchor';
|
12
|
-
export * from './cube';
|
13
|
-
export * from './cube.rect';
|
14
|
-
export * from './cube.anchor';
|
15
|
-
export * from './cube.model';
|
16
|
-
export * from './diamond';
|
17
|
-
export * from './diamond.rect';
|
18
|
-
export * from './file';
|
19
|
-
export * from './formtable';
|
20
|
-
export * from './formselect';
|
21
|
-
export * from './hexagon';
|
22
|
-
export * from './hexagon.anchor';
|
23
|
-
export * from './hexagon.rect';
|
24
|
-
export * from './image.rect';
|
25
|
-
export * from './image.anchor';
|
26
|
-
export * from './iframe';
|
27
|
-
export * from './line';
|
28
|
-
export * from './line.anchor';
|
29
|
-
export * from './line.rect';
|
30
|
-
export * from './message';
|
31
|
-
export * from './message.anchor';
|
32
|
-
export * from './message.rect';
|
33
|
-
export * from './pentagon';
|
34
|
-
export * from './pentagon.anchor';
|
35
|
-
export * from './pentagon.rect';
|
36
|
-
export * from './pentagram';
|
37
|
-
export * from './pentagram.anchor';
|
38
|
-
export * from './pentagram.rect';
|
39
|
-
export * from './people';
|
40
|
-
export * from './people.rect';
|
41
|
-
export * from './rectangle';
|
42
|
-
export * from './rectangle.rect';
|
43
|
-
export * from './tablePagination';
|
44
|
-
export * from './text';
|
45
|
-
export * from './triangle';
|
46
|
-
export * from './triangle.anchor';
|
47
|
-
export * from './triangle.rect';
|
48
|
-
export * from './formoverflow';
|
@@ -1,49 +0,0 @@
|
|
1
|
-
export * from './arbitrarygraph';
|
2
|
-
export * from './arbitrarygraph.anchor';
|
3
|
-
export * from './arrow';
|
4
|
-
export * from './arrow.rect';
|
5
|
-
export * from './arrow.anchor';
|
6
|
-
export * from './circle';
|
7
|
-
export * from './circle.rect';
|
8
|
-
export * from './circle.anchor';
|
9
|
-
export * from './cloud';
|
10
|
-
export * from './cloud.rect';
|
11
|
-
export * from './cloud.anchor';
|
12
|
-
export * from './cube';
|
13
|
-
export * from './cube.rect';
|
14
|
-
export * from './cube.anchor';
|
15
|
-
export * from './cube.model';
|
16
|
-
export * from './diamond';
|
17
|
-
export * from './diamond.rect';
|
18
|
-
export * from './file';
|
19
|
-
export * from './formtable';
|
20
|
-
export * from './formselect';
|
21
|
-
export * from './hexagon';
|
22
|
-
export * from './hexagon.anchor';
|
23
|
-
export * from './hexagon.rect';
|
24
|
-
export * from './image.rect';
|
25
|
-
export * from './image.anchor';
|
26
|
-
export * from './iframe';
|
27
|
-
export * from './line';
|
28
|
-
export * from './line.anchor';
|
29
|
-
export * from './line.rect';
|
30
|
-
export * from './message';
|
31
|
-
export * from './message.anchor';
|
32
|
-
export * from './message.rect';
|
33
|
-
export * from './pentagon';
|
34
|
-
export * from './pentagon.anchor';
|
35
|
-
export * from './pentagon.rect';
|
36
|
-
export * from './pentagram';
|
37
|
-
export * from './pentagram.anchor';
|
38
|
-
export * from './pentagram.rect';
|
39
|
-
export * from './people';
|
40
|
-
export * from './people.rect';
|
41
|
-
export * from './rectangle';
|
42
|
-
export * from './rectangle.rect';
|
43
|
-
export * from './tablePagination';
|
44
|
-
export * from './text';
|
45
|
-
export * from './triangle';
|
46
|
-
export * from './triangle.anchor';
|
47
|
-
export * from './triangle.rect';
|
48
|
-
export * from './formoverflow';
|
49
|
-
//# sourceMappingURL=index.js.map
|
@@ -1,9 +0,0 @@
|
|
1
|
-
import { Pen } from '../models';
|
2
|
-
// @ts-ignore
|
3
|
-
export const commonStore: {
|
4
|
-
canvasDraws: {
|
5
|
-
[key: string]: (ctx: CanvasRenderingContext2D, pen: Pen) => void;
|
6
|
-
};
|
7
|
-
anchors: { [key: string]: (pen: Pen) => void };
|
8
|
-
htmlElements: { [key: string]: HTMLDivElement }; // html元素
|
9
|
-
};
|