|
1
2
3
4
5
6
|
layui.config({
base: "/js/"
}).use(['layer', 'jquery'], function () {
var layer = layui.layer,
$ = layui.jquery
|
|
7
|
//堆垛机监控属性
|
|
8
9
10
11
|
var width = 60;
var height = 20;
var STKheight = 40;
var X = 60;
|
|
12
|
var Y = 30;
|
|
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
|
var Y2 = Y + (height + STKheight);
var list = [];
//立库和堆垛机俯视图
function GetSTK(stk) {
STK = stk;
$.ajax({
async: false,
url: "/monitor/STKMonitor/GetRow",
type: "post",
data: { Roadway: stk },
dataType: "json",
success: function (data) {
list = [];
arr = data.data;
arr.forEach(function (e) {
|
|
29
|
$('#canvas' + stk).drawRect({
|
|
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
|
layer: true,
name: "L" + e.Roadway + "" + e.Row + "1",
strokeStyle: '#000',
strokeWidth: 1,
x: X + (width * (e.Row - 1)), y: Y,
width: width,
height: height,
})
.drawText({
layer: true,
name: "T" + e.Roadway + "" + e.Row + "1",
fillStyle: '#9cf',
strokeStyle: '#25a',
strokeWidth: 2,
x: X + (width * (e.Row - 1)), y: Y,
fontSize: 20,
fontFamily: 'Verdana, sans-serif',
text: e.Row
});
|
|
49
|
$('#canvas' + stk).drawRect({
|
|
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
|
layer: true,
name: "L" + e.Roadway + "" + e.Row + "2",
strokeStyle: '#000',
strokeWidth: 1,
x: X + (width * (e.Row - 1)), y: Y2,
width: width,
height: height,
})
.drawText({
layer: true,
name: "T" + e.Roadway + "" + e.Row + "2",
fillStyle: '#9cf',
strokeStyle: '#25a',
strokeWidth: 2,
x: X + (width * (e.Row - 1)), y: Y2,
fontSize: 20,
fontFamily: 'Verdana, sans-serif',
text: e.Row
});
list.push("L" + e.Roadway + "" + e.Row + "1");
list.push("L" + e.Roadway + "" + e.Row + "2");
list.push("T" + e.Roadway + "" + e.Row + "1");
list.push("T" + e.Roadway + "" + e.Row + "2");
});
//堆垛机
|
|
75
|
$('#canvas' + stk).addLayer({
|
|
76
77
78
79
80
81
82
83
84
85
86
87
|
type: 'image',
name: 'STK' + stk,
source: "/images/STK.gif",
x: X + (width * (1 - 1)) - (width * 0.7), y: Y + height - (height * 0.4),
width: width + (width * 0.5),
height: STKheight * 0.8,
fromCenter: false
})
}
});
setInterval(function () {
|
|
88
|
var STKstate = 2;
|
|
89
|
if (STKstate == 2) {
|
|
90
91
|
$('#stk1')[0].innerText = '异常';
$('#stk1').css('color', 'red');
|
|
92
93
94
95
|
}
}, 3000);
}
|
|
96
|
//堆垛机移动
|
|
97
98
|
function STKMove(stk) {
for (var i = 2; i < 7; i++) {
|
|
99
|
$('#canvas' + stk).animateLayer('STK' + stk, {
|
|
100
101
102
103
104
105
|
x: X + (width * (i - 1)) - (width * 0.7), y: Y + height - (height * 0.4),
}, 1000);
}
}
$(document).on("click", "#move", function () {
|
|
106
107
108
|
for (var i = 1; i < 4; i++) {
STKMove(i);
}
|
|
109
110
|
});
|
|
111
|
//初始加载
|
|
112
|
$(document).ready(function () {
|
|
113
114
115
|
for (var i = 1; i < 4; i++) {
GetSTK(i);
}
|
|
116
117
118
119
|
});
});
|