system_AGV.js
3.38 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
/**
* 初始化agv 点位路线图
* @param {*} 容器id
* @param {*} 数据源
*/
// String.prototype.initMarksLine
var initMarksLine = function (containerEle, data) {
const container = $(containerEle)
const html = [];
for (let i = 0; i < data.length; i++) {
const id = !data[i].id ? "" : `id=a_${data[i].id}`;
if (!data[i].bgcolor) {
data[i].flag === 2 ? data[i].bgcolor = '#98afdb' : data[i].bgcolor = '#006fdf'
}
if (!data[i].fontColor) {
data[i].fontColor = '#fff'
}
if (!data[i].fontWeight) {
data[i].fontWeight = 500
}
data[i].flag === 1 ? data[i].show = 'none' : data[i].show = 'block'
var tempDivInfo = `<div ${id} style='position:absolute;width: 1.1vw;height: 1.1vw;
top:${data[i].top};left:${data[i].left};background-color:${data[i].bgcolor};
color:${data[i].fontColor};
font-weight:${data[i].fontWeight};
font-size:0.7vw ;text-align:center;'>
<span style='position:absolute;width:3vw;margin-left:-1.5vw;z-index:9;text-align: center;'>
${data[i].lender || ""}
</span>
${!data[i].id || data[i].lender ? `<div></div>` : `<div style="background-color: #cf5267;
width: 0.5vw;height: 0.5vw; position: absolute;
top: 0.3vw;
left: 0.3vw;
border-radius: 50%;"></div> `}
</div>`;
html.push(tempDivInfo)
}
container.append(html.join(" "))
}
//tips模板 此处后续根据实际业务修改
var findMarkInfo = function (markInfos, sysinfo) {
function task (i, info) {
setTimeout(function () {
var $nowMark = $(`#${info.id}`);
$nowMark.html(`
<div class="bubble" style=''>
<p class="color: yellow;
font-size: 0.6vw;
text-align: left;
margin-left: 0.5vw;
z-index: 999;">
任务号: ${info.taskNumber == null ? '无任务' : info.taskNumber}<br>
小车编码: ${info.carCode}<br>
速度：${info.speed}<br>
状态：${info.status}<br>
电量：${info.battery}%<br>
错误：${info.error ?
(info.error.length > 10 ?
info.error.substring(0, 10) + '.....' :
(info.error.length > 5 ?
info.error.substring(0, Math.ceil(info.error.length / 2)) + '<br>' + info.error.substring(Math.ceil(info.error.length / 2)) :
info.error))
: '无'}<br>
</p>
</div>
`);
const currentIds = markInfos.map(info => info.id);
if (sysinfo.length > 0) {
sysinfo.forEach(i => {
// 如果当前页面上没有该 id 的元素,则删除它
if (!currentIds.includes(i.id)) {
var $oldMark = $(`#${i.id}`);
$oldMark.remove();
}
});
}
}, 10000 * i);
}
for (let i = 0; i < markInfos.length; i++) {
task(i, markInfos[i]);
}
/* 起始地标：${ info.startLandmark } <br>
终点地标：${info.endLandmark} */
// 记录当前页面上已有的元素 id
}