Sidebar-LightComponent.js
3.14 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
(function () {
// Adds Atlassian shapes
// light 灯
Sidebar.prototype.addThingsKitLightPalette = function () {
const gn = 'mxgraph.light';
const dt = 'light';
const label = mxResources.get('lamp')
const width = 66;
const height = 74;
const prefix = `image;image=${window?.PROJECT_ENV.base}/webapp/images/thingskit/libs/`
const defaultStyle = ';imageAspect=0;'
this.setCurrentSearchEntryLibrary(dt);
const { COMPONENT_KEY, CATEGORY } = window.CellAttributeKeyEnum
function createUserObject(attribute) {
attribute = Object.assign({ [COMPONENT_KEY]: '', [CATEGORY]: '' }, attribute || {})
var xmlElement = mxUtils.createXmlDocument().createElement('UserObject');
Object.keys(attribute).forEach(key => {
xmlElement.setAttribute(key, attribute[key]);
})
return xmlElement
}
// 自定义属性
const cellAttribute = {
[COMPONENT_KEY]: 'Image',
[CATEGORY]: 'DEFAULT'
}
const graphPathLib = [
{ name: '1.png', path: 'light/1.png' },
{ name: '10.png', path: 'light/10.png' },
{ name: '11.png', path: 'light/11.png' },
{ name: '12.png', path: 'light/12.png' },
{ name: '13.png', path: 'light/13.png' },
{ name: '14.png', path: 'light/14.png' },
{ name: '15.png', path: 'light/15.png' },
{ name: '16.png', path: 'light/16.png' },
{ name: '17.png', path: 'light/17.png' },
{ name: '18.png', path: 'light/18.png' },
{ name: '19.png', path: 'light/19.png' },
{ name: '2.png', path: 'light/2.png' },
{ name: '20.png', path: 'light/20.png' },
{ name: '21.png', path: 'light/21.png' },
{ name: '22.png', path: 'light/22.png' },
{ name: '23.png', path: 'light/23.png' },
{ name: '24.png', path: 'light/24.png' },
{ name: '25.png', path: 'light/25.png' },
{ name: '26.png', path: 'light/26.png' },
{ name: '27.png', path: 'light/27.png' },
{ name: '28.png', path: 'light/28.png' },
{ name: '29.png', path: 'light/29.png' },
{ name: '3.png', path: 'light/3.png' },
{ name: '30.png', path: 'light/30.png' },
{ name: '31.png', path: 'light/31.png' },
{ name: '32.png', path: 'light/32.png' },
{ name: '33.png', path: 'light/33.png' },
{ name: '34.png', path: 'light/34.png' },
{ name: '35.png', path: 'light/35.png' },
{ name: '36.png', path: 'light/36.png' },
{ name: '37.png', path: 'light/37.png' },
{ name: '4.png', path: 'light/4.png' },
{ name: '5.png', path: 'light/5.png' },
{ name: '6.png', path: 'light/6.png' },
{ name: '7.png', path: 'light/7.png' },
{ name: '8.png', path: 'light/8.png' },
{ name: '9.png', path: 'light/9.png' },
]
const fns = graphPathLib.map((item, index) => {
return this.addEntry(this.getTagsForStencil(gn, item.name, dt).join(' '), mxUtils.bind(this, function () {
const cell = new mxCell(createUserObject(cellAttribute), new mxGeometry(0, 0, width, height), `${prefix}${item.path}${defaultStyle}`);
cell.setVertex(true)
return this.createVertexTemplateFromCells([cell], cell.geometry.width, cell.geometry.height, `${label}${index + 1}`);
}));
})
this.setGalleryLib(dt, label, graphPathLib)
this.addPaletteFunctions(dt, label, false, fns);
this.setCurrentSearchEntryLibrary();
};
})();