Sidebar-Basic-Components.js
3.74 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
(function () {
// Adds Atlassian shapes
Sidebar.prototype.addBasicComponentsPalette = function () {
var sb = this;
var gn = 'mxgraph.component';
var dt = 'component ';
var lineTags = 'line lines connector connectors connection connections arrow arrows '
this.setCurrentSearchEntryLibrary('general', 'component');
var currentDate = getCurrentDate();
var fns = [
this.createVertexTemplateEntry('text;strokeColor=none;fillColor=none;html=1;fontSize=24;fontStyle=1;verticalAlign=middle;align=center;', 100, 40, 'Title', 'Title', null, null, 'text heading title'),
this.createVertexTemplateEntry('text;strokeColor=none;fillColor=none;html=1;fontSize=24;fontStyle=1;verticalAlign=middle;align=center;', 100, 40, '变量', '变量', null, null, '变量'),
this.createEdgeTemplateEntry('shape=filledEdge;rounded=1;fixDash=1;endArrow=none;strokeWidth=10;fillColor=#BAFDFF;edgeStyle=orthogonalEdgeStyle;flowAnimation=1;strokeColor=#6666FF;endFill=1;metaEdit=0;backgroundOutline=0;', 60, 40, '', '线条'),
this.addEntry('timestamp date time text label', mxUtils.bind(this, function () {
var cell = new mxCell('%date{yyyy-mm-dd ddd HH:MM:ss}%', new mxGeometry(0, 0, 160, 20), 'text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;overflow=hidden;');
cell.vertex = true;
this.graph.setAttributeForCell(cell, 'placeholders', '1');
this.graph.setAttributeForCell(cell, 'date', "成都云腾五洲科技有限公司");
return this.createVertexTemplateFromCells([cell], cell.geometry.width, cell.geometry.height, 'Timestamps');
})),
this.addEntry('动态时间', mxUtils.bind(this, function () {
var cell = new mxCell('<div>%currentDate%</div><div style="font-size:30px">%date{HH:MM:ss}%</div>', new mxGeometry(0, 0, 180, 60), 'text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;overflow=hidden;');
cell.vertex = true;
this.graph.setAttributeForCell(cell, 'placeholders', '1');
this.graph.setAttributeForCell(cell, 'currentDate', currentDate);
return this.createVertexTemplateFromCells([cell], cell.geometry.width, cell.geometry.height, 'Variable');
})),
this.addEntry('real time', mxUtils.bind(this, function () {
const template = `<div class="thingKit-component__real-time"><div class="real-time__date">%currentDate%</div> <div style="font-size:30px" class="real-time__now">%date{HH:MM:ss}%</div></div>`
const cell = new mxCell(template, new mxGeometry(0, 0, 180, 60), 'text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;overflow=hidden;');
cell.vertex = true;
this.graph.setAttributeForCell(cell, 'placeholders', '1');
this.graph.setAttributeForCell(cell, 'currentDate', currentDate);
return this.createVertexTemplateFromCells([cell], cell.geometry.width, cell.geometry.height, 'realTime');
})),
];
this.addPaletteFunctions('component', '基础元件', false, fns);
this.setCurrentSearchEntryLibrary();
};
//封装日期函数
function getCurrentDate() {
var date = new Date(); //创建日期对象
var year = date.getFullYear();
var month = date.getMonth() + 1;
var dates = date.getDate();
arr = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六',]
var day = date.getDay();
return year + '年' + month + '月' + dates + '日 ' + arr[day];
}
})();